:root{--ptt-black: #141414;--ptt-white: #ffffff;--ptt-yellow: #ffff00;--ptt-blue: #0000ff;--border: 1px solid var(--ptt-black);--color-text-default: var(--ptt-black);--color-text-muted: #3a3a3a;--color-text-inverse: var(--ptt-white);--color-text-inverse-muted: #cfcfcf;--color-link-inverse: #79b8ff;--color-surface-default: var(--ptt-white);--color-surface-subtle: #f8f8f8;--color-surface-muted: #f6f6f2;--color-surface-inverse: #000000;--color-border-default: var(--ptt-black);--color-border-inverse: var(--ptt-white);--color-border-inverse-soft: #5a5a5a;--color-focus-ring: var(--ptt-blue);--color-danger: #8d1414;--color-danger-soft: #fbe9e9;--radius-xs: 6px;--radius-sm: 10px;--radius-control: 12px;--radius-md: 14px;--radius-xl: 16px;--radius-lg: 18px;--radius-pill: 999px;--space-1: 4px;--space-2: 6px;--space-3: 8px;--space-4: 10px;--space-5: 12px;--space-6: 14px;--space-7: 16px;--space-8: 18px;--space-9: 20px;--inset-xs: 10px;--inset-sm: 12px;--inset-md: 16px;--inset-lg: 18px;--font-size-4xs: 9px;--font-size-3xs: 10px;--font-size-2xs: 11px;--font-size-xs: 12px;--font-size-sm: 13px;--font-size-md: 14px;--font-size-lg: 16px;--font-size-xl: 18px;--font-size-2xl: 20px;--font-size-3xl: 24px;--line-height-tight: 1;--line-height-ui: 1.2;--line-height-body: 1.35;--panel-padding-section: var(--space-6) 2px;--surface-padding-compact: var(--space-3) var(--space-4);--surface-padding-default: var(--space-4) var(--space-5);--surface-padding-roomy: var(--space-5) var(--inset-md);--border-width-1: 1px;--border-width-2: 2px;--shadow-soft: 4px 4px 0 rgba(0, 0, 0, .2);--shadow-strong: 6px 6px 0 rgba(0, 0, 0, .25);--transition-fast: .12s ease-out;--transition-medium: .16s ease-out;--button-height-compact: 34px;--button-height-default: 40px;--button-padding-y-compact: 6px;--button-padding-x-compact: 10px;--button-padding-y-default: 8px;--button-padding-x-default: 12px;--form-control-padding-y: 8px;--form-control-padding-x: 10px;--form-control-radius: var(--radius-md);--form-control-border-width: var(--border-width-2)}*{box-sizing:border-box}body{margin:0;font-family:ABC Favorit,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--color-text-default);background:var(--color-surface-default);font-size:16px}button,input,select,textarea{font:inherit}button{color:inherit}:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.button{--button-bg: var(--color-surface-default);--button-border: var(--color-border-default);--button-text: var(--color-text-default);--button-shadow: none;--button-hover-bg: var(--color-text-default);--button-hover-border: var(--color-text-default);--button-hover-text: var(--color-text-inverse);--button-radius: var(--radius-md);--button-height: var(--button-height-default);--button-padding-y: var(--button-padding-y-default);--button-padding-x: var(--button-padding-x-default);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);min-height:var(--button-height);padding:var(--button-padding-y) var(--button-padding-x);border:var(--border-width-2) solid var(--button-border);border-radius:var(--button-radius);background:var(--button-bg);color:var(--button-text);box-shadow:var(--button-shadow);font-size:12px;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.button:hover,.button:focus-visible{background:var(--button-hover-bg);color:var(--button-hover-text);border-color:var(--button-hover-border)}.button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.button--compact{--button-height: var(--button-height-compact);--button-padding-y: var(--button-padding-y-compact);--button-padding-x: var(--button-padding-x-compact)}.button--pill{--button-radius: var(--radius-pill)}.button--ghost{--button-bg: var(--color-surface-inverse);--button-border: var(--color-border-inverse);--button-text: var(--color-text-inverse);--button-hover-bg: var(--color-surface-default);--button-hover-border: var(--color-text-default);--button-hover-text: var(--color-text-default)}.button--secondary{--button-bg: var(--color-surface-default);--button-border: var(--color-border-default);--button-text: var(--color-text-default);--button-shadow: var(--shadow-strong);--button-hover-bg: var(--color-surface-inverse);--button-hover-border: var(--color-border-default);--button-hover-text: var(--color-text-inverse)}.button--primary{--button-bg: var(--ptt-yellow);--button-border: var(--color-border-default);--button-text: var(--color-text-default);--button-hover-bg: var(--color-surface-inverse);--button-hover-border: var(--color-border-default);--button-hover-text: var(--ptt-yellow)}.button--danger{--button-border: var(--color-danger);--button-text: var(--color-danger);--button-hover-bg: var(--color-danger);--button-hover-border: var(--color-danger);--button-hover-text: var(--color-text-inverse)}.button--icon{gap:var(--space-2)}.button.is-active,.button--secondary.is-active{background:var(--ptt-yellow);color:var(--color-text-default);border-color:var(--color-border-default)}.button--ghost.is-active{background:var(--color-surface-default);color:var(--color-text-default);border-color:var(--color-border-default)}.surface-card{--surface-card-bg: var(--color-surface-default);--surface-card-border: var(--color-border-default);--surface-card-text: var(--color-text-default);--surface-card-shadow: var(--shadow-strong);background:var(--surface-card-bg);color:var(--surface-card-text);border:var(--border-width-2) solid var(--surface-card-border);border-radius:var(--radius-md);box-shadow:var(--surface-card-shadow)}.surface-card--inverse{--surface-card-bg: var(--color-surface-inverse);--surface-card-border: var(--color-border-inverse);--surface-card-text: var(--color-text-inverse);--surface-card-shadow: var(--shadow-soft)}.surface-card--status{display:inline-flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-5);font-size:13px}.surface-card--panel{display:grid;gap:var(--space-5);padding:var(--surface-padding-roomy);border-radius:var(--radius-lg)}.surface-card--overlay{max-height:calc(100% - 2 * var(--inset-md));overflow:auto}.surface-card--interactive{transition:transform var(--transition-medium),box-shadow var(--transition-medium)}.surface-card--interactive:hover,.surface-card--interactive:focus-within{transform:translateY(-2px)}.form-field{display:grid;gap:var(--space-2);font-size:12px}.form-field--compact{gap:var(--space-1);font-size:11px}.form-control{border:var(--form-control-border-width) solid var(--color-border-default);border-radius:var(--form-control-radius);padding:var(--form-control-padding-y) var(--form-control-padding-x);background:var(--color-surface-default);color:var(--color-text-default);width:100%;min-width:0;box-sizing:border-box}.form-control--inverse{border-color:var(--color-border-inverse);background:var(--color-surface-inverse);color:var(--color-text-inverse);box-shadow:none}.form-control--compact{padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs)}.form-control--elevated{box-shadow:var(--shadow-strong)}.form-control::placeholder,.form-control--inverse::placeholder{color:inherit;opacity:.75}.ui-section-title{font-size:var(--font-size-lg);font-weight:700;line-height:var(--line-height-ui)}.panel-shell{display:grid;gap:var(--space-5);min-width:0;box-sizing:border-box}.panel-shell--surface{min-width:0}.panel-shell--content,.content-section{display:grid;gap:var(--space-5);border:none;border-bottom:var(--border-width-1) solid var(--color-border-inverse-soft);border-radius:0;padding:var(--panel-padding-section);background:transparent}.panel-shell--compact{gap:var(--space-4)}.panel-shell__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-width:0}.panel-shell__title{font-size:var(--font-size-lg);font-weight:700;line-height:var(--line-height-ui)}.panel-shell__body{display:grid;gap:var(--space-4)}.panel-shell__actions{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:center}.overlay-panel__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.overlay-panel__title{font-size:var(--font-size-xl);font-weight:700;line-height:var(--line-height-ui)}.overlay-panel__body{display:grid;gap:var(--space-4)}.overlay-panel__actions{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:center}.text-muted{color:var(--color-text-muted)}.text-muted--inverse{color:var(--color-text-inverse-muted)}.content-section__title{font-size:var(--font-size-lg);font-weight:600;line-height:var(--line-height-ui)}.content-section__title,.ui-section-title,.panel-shell__title{font-size:var(--font-size-lg);line-height:var(--line-height-ui)}.meta-line,.meta-text{line-height:var(--line-height-ui)}.meta-line--inverse,.meta-text--inverse{color:var(--color-text-inverse-muted)}.meta-line--sm,.meta-text--sm{font-size:var(--font-size-sm)}.meta-line--md,.meta-text--md{font-size:var(--font-size-md)}.meta-line--xs,.meta-text--xs{font-size:var(--font-size-xs)}.panel-list,.content-list{display:grid;gap:var(--space-3)}.panel-list__row,.content-list__row{display:grid;gap:var(--space-1);padding:var(--space-3) 0;border-bottom:var(--border-width-1) dashed var(--color-border-inverse-soft)}.panel-list__row:last-child,.content-list__row:last-child{border-bottom:none}.panel-list__row--compact,.content-list__row--compact{gap:2px;padding:var(--space-2) 0}.panel-list__label,.content-list__label{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-inverse)}.status-badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:2px var(--space-3);border:var(--border-width-1) solid currentColor;border-radius:var(--radius-pill);font-weight:600}.status-badge--inverse{color:var(--color-text-inverse-muted)}.status-badge--default{color:var(--color-text-muted)}.interactive-list{display:grid;gap:var(--space-1);padding:var(--space-1);background:var(--color-surface-default);border:var(--border-width-2) solid var(--color-border-default);border-radius:var(--radius-control);box-shadow:var(--shadow-strong)}.interactive-list__item{display:flex;justify-content:space-between;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);border:var(--border-width-2) solid transparent;border-radius:var(--radius-sm);background:var(--color-surface-subtle);color:var(--color-text-default);font-size:var(--font-size-xs);text-align:left;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.interactive-list__item:hover,.interactive-list__item:focus-visible,.interactive-list__item.is-active{border-color:var(--color-border-default);background:var(--color-surface-default)}.interactive-list__meta{font-size:var(--font-size-2xs);color:var(--color-text-muted)}
