:root {
  color-scheme: light;
  --color-page: #f6f5f0;
  --color-surface: #ffffff;
  --color-subtle: #eeede8;
  --color-inverse: #171b1a;
  --color-inverse-raised: #232827;
  --color-text: #202624;
  --color-secondary: #59625e;
  --color-inverse-text: #f7f8f5;
  --color-inverse-secondary: #bec5c0;
  --color-border: #d4d8d2;
  --color-border-strong: #9da59f;
  --color-control-border: #7f8982;
  --color-inverse-border: #444c47;
  --color-brand: #21e889;
  --color-brand-hover: #55efa6;
  --color-brand-pressed: #17c875;
  --color-focus: #156d49;
  --color-evidence: #285da6;
  --color-evidence-soft: #edf3fc;
  --color-warning: #8b4d0a;
  --color-warning-soft: #fff2dc;
  --color-success: #21623b;
  --color-success-soft: #e8f3eb;
  --color-error: #a52c29;
  --color-error-soft: #fff0ee;
  --color-paper: #fffefa;
  --color-paper-rule: #a9aaa3;
  --color-print: #292c29;
  --font-sans: 'Geist', Arial, sans-serif;
  --font-mono: 'Geist Mono', 'Courier New', monospace;
  --space-1: 4px; --space-2: 8px; --space-3: 12px;
  --space-4: 16px; --space-6: 24px; --space-8: 32px;
  --space-12: 48px; --space-16: 64px; --space-24: 96px;
  --radius-small: 4px; --radius-control: 6px; --radius-panel: 10px;
  --shadow-panel: 0 8px 28px rgb(18 27 22 / 8%);
  --shadow-paper: 0 12px 30px rgb(0 0 0 / 20%);
  --duration-fast: 120ms; --duration-standard: 200ms; --duration-emphasis: 360ms;
  --ease-standard: cubic-bezier(.2,.7,.2,1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; color: var(--color-text); background: var(--color-page); font: 16px/1.6 var(--font-sans); -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,p { margin: 0; }
h1,h2,h3,h4 { line-height: 1.15; }
button,input,select { font: inherit; }
button,a,input,select,summary { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
img { display: block; max-width: 100%; }
svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
[hidden] { display: none !important; }
::selection { background: var(--color-brand); color: var(--color-inverse); }
:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 4px; }
.inverse :focus-visible { outline-color: var(--color-brand); }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 12px 24px; border: 1px solid transparent; border-radius: var(--radius-control); font-size: 16px; line-height: 24px; font-weight: 600; white-space: nowrap; transition: background var(--duration-fast), border-color var(--duration-fast), color var(--duration-fast); }
.button-green { color: var(--color-inverse); background: var(--color-brand); }
.button-green:hover { background: var(--color-brand-hover); }
.button-green:active { background: var(--color-brand-pressed); }
.button-dark { color: var(--color-inverse-text); background: var(--color-inverse); }
.button-dark:hover { background: var(--color-inverse-raised); }
.button-dark:active { background: var(--color-text); }
.button-outline { background: transparent; border-color: var(--color-border-strong); color: var(--color-text); }
.button-outline:hover { background: var(--color-subtle); border-color: var(--color-text); }
.button-outline:active { background: var(--color-border); }
.inverse .button-outline { color: var(--color-inverse-text); border-color: var(--color-inverse-border); }
.inverse .button-outline:hover { background: var(--color-inverse-raised); border-color: var(--color-inverse-secondary); }
.button-small { min-height: 44px; padding: 9px 16px; font-size: 14px; line-height: 24px; }
.button:disabled,.button[aria-disabled=true] { color: var(--color-secondary); background: var(--color-subtle); border-color: var(--color-border); }
.button[aria-busy=true] { min-width: 160px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; font-weight: 500; min-height: 44px; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: var(--color-border-strong); }
.text-link:hover { text-decoration-color: currentColor; }
.text-link svg { width: 16px; height: 16px; }
input,select { color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-control-border); border-radius: var(--radius-control); min-height: 50px; padding: 12px; font-size: 16px; line-height: 24px; max-width: 100%; }
input:hover,select:hover { border-color: var(--color-text); }
input:focus,select:focus { border-color: var(--color-focus); }
input::placeholder { color: var(--color-secondary); opacity: 1; }
input[aria-invalid=true] { border-color: var(--color-error); background: var(--color-error-soft); }
.field-error { color: var(--color-error); font-size: 14px; margin-top: 8px; }
.badge { display: inline-flex; gap: 6px; align-items: center; padding: 4px 8px; border-radius: var(--radius-small); font-size: 12px; font-weight: 500; line-height: 20px; background: var(--color-subtle); color: var(--color-secondary); }
.badge-warning { background: var(--color-warning-soft); color: var(--color-warning); }
.badge-success { background: var(--color-success-soft); color: var(--color-success); }
.badge-evidence { background: var(--color-evidence-soft); color: var(--color-evidence); }
.badge svg { width: 14px; height: 14px; }
.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.muted { color: var(--color-secondary); }
.skip-link { position: fixed; left: -9999px; top: 12px; z-index: 99; padding: 12px 16px; color: var(--color-inverse); background: var(--color-brand); border-radius: var(--radius-control); }
.skip-link:focus { left: 12px; }
.svg-library { width: 0; height: 0; position: absolute; overflow: hidden; }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *,*::before,*::after { animation: none !important; transition: none !important; } }
