/* Design-tokens (03-design-system.md). Light = default; dark via data-theme of systeem. */
:root {
  --bg:#f6f7f9; --surface:#ffffff; --surface-2:#eef0f3; --border:#e3e6ea;
  --text:#1b1e24; --muted:#5c646f; --faint:#99a1ac;
  --accent:#6c7cf0; --accent-weak:#eceefe; --on-accent:#ffffff;
  --vitals:#2fa46f; --drive:#e0863c; --wealth:#c99a3a; --compass:#2f9aa4;
  --success:#2fa46f; --warning:#d99a3a; --danger:#de5a5a;
  --c1:#6c7cf0; --c2:#2fa46f; --c3:#e0863c; --c4:#c99a3a; --c5:#2f9aa4; --c6:#de5a5a; --c7:#9b7cf0; --c8:#7fb069;
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-pill:999px;
  --shadow:0 1px 2px rgba(16,20,28,.06),0 6px 16px rgba(16,20,28,.05);
  --ring:0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent);
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-7:32px; --sp-8:40px; --sp-9:48px; --sp-10:64px;
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-num:ui-monospace,"SF Mono","JetBrains Mono",Menlo,monospace;
  --fs-tiny:.6875rem; --fs-sm:.8125rem; --fs-base:.9375rem; --fs-md:1.0625rem; --fs-lg:1.25rem; --fs-xl:1.5rem; --fs-stat:1.75rem; --fs-hero:2.25rem;
  --lh:1.5; --dur-fast:120ms; --dur:200ms; --dur-slow:320ms; --ease:cubic-bezier(.2,.8,.2,1);
  --content-max:880px; --sidebar:240px; --tabbar-h:60px; --safe-b:env(safe-area-inset-bottom,0px);
}
:root[data-theme="dark"]{
  --bg:#0f1115; --surface:#171a21; --surface-2:#1e222b; --border:#2a2f3a;
  --text:#e7e9ee; --muted:#9aa1ad; --faint:#6b7280;
  --accent:#7c8bff; --accent-weak:#1c2140; --on-accent:#0f1115;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.28);
  --vitals:#3fbd85; --drive:#f0975a; --wealth:#e0b455; --compass:#45b7c1;
  --success:#3fbd85; --warning:#e0b455; --danger:#ef7676;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0f1115; --surface:#171a21; --surface-2:#1e222b; --border:#2a2f3a;
    --text:#e7e9ee; --muted:#9aa1ad; --faint:#6b7280;
    --accent:#7c8bff; --accent-weak:#1c2140; --on-accent:#0f1115;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.28);
    --vitals:#3fbd85; --drive:#f0975a; --wealth:#e0b455; --compass:#45b7c1;
    --success:#3fbd85; --warning:#e0b455; --danger:#ef7676;
  }
}