/* Design tokens. Ledger look: ink on ruled paper. Light is the default; dark follows the
   system unless the user picks a theme (data-theme on <html>). */
:root {
  /* type */
  --font-ui: "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Noto Sans", Arial, sans-serif;
  --font-title: Cambria, "Noto Serif", Georgia, "Times New Roman", serif;
  --fs-12: 0.75rem; --fs-13: 0.8125rem; --fs-14: 0.875rem; --fs-16: 1rem; --fs-20: 1.25rem; --fs-26: 1.625rem;
  --lh: 1.45;
  /* space (4pt) */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s8: 32px; --s10: 40px;
  /* shape */
  --r-sm: 4px; --r-md: 8px; --r-pill: 999px;
  /* motion */
  --t-fast: 150ms; --t-med: 200ms; --ease: cubic-bezier(.2, .7, .3, 1);

  /* colour: light */
  --paper: #f3f5f9;          /* page */
  --sheet: #ffffff;          /* cards, tables */
  --sheet-2: #f7f8fb;        /* table header, wells */
  --ink: #171c2e;            /* text */
  --ink-2: #4a5268;          /* secondary text (7.6:1 on sheet) */
  --line: #d5dae5;           /* hairlines */
  --rule: #9aa3ba;           /* the ledger's double rule */
  --brand: #22306b;          /* ledger ink indigo */
  --brand-ink: #ffffff;
  --brand-soft: #e7eaf7;
  --rail: #171f47;           /* navigation rail */
  --rail-ink: #e9ecfa;
  --rail-ink-2: #a9b1d6;
  --focus: #3b62e3;
  --ok: #17663f; --ok-soft: #e2f3e9;
  --bad: #b3211d; --bad-soft: #fbe9e7;
  --warn: #7a4d00; --warn-soft: #fcf1d6;
  --info: #22306b; --info-soft: #e7eaf7;
  --shadow-1: 0 1px 2px rgba(23, 28, 46, .06), 0 1px 1px rgba(23, 28, 46, .04);
  --shadow-2: 0 12px 32px rgba(23, 28, 46, .18), 0 2px 6px rgba(23, 28, 46, .08);
  /* chart series */
  --c1: #22306b; --c2: #b06a00; --c3: #17663f; --c4: #7c3a8c; --c5: #0d6f80; --c6: #8a5a44;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --paper: #0f1322; --sheet: #171c30; --sheet-2: #1d2440;
  --ink: #e8ebf5; --ink-2: #aab2ca; --line: #2c3454; --rule: #56608a;
  --brand: #9fb0ff; --brand-ink: #0f1322; --brand-soft: #232c52;
  --rail: #0b0e1b; --rail-ink: #e8ebf5; --rail-ink-2: #8e97b8;
  --focus: #9fb0ff;
  --ok: #6fd6a0; --ok-soft: #14301f;
  --bad: #ff8f88; --bad-soft: #3a1917;
  --warn: #f0c060; --warn-soft: #33270c;
  --info: #9fb0ff; --info-soft: #232c52;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-2: 0 16px 40px rgba(0, 0, 0, .6);
  --c1: #9fb0ff; --c2: #f0b040; --c3: #6fd6a0; --c4: #d39be0; --c5: #6fd0e0; --c6: #d6a58c;
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #0f1322; --sheet: #171c30; --sheet-2: #1d2440;
    --ink: #e8ebf5; --ink-2: #aab2ca; --line: #2c3454; --rule: #56608a;
    --brand: #9fb0ff; --brand-ink: #0f1322; --brand-soft: #232c52;
    --rail: #0b0e1b; --rail-ink: #e8ebf5; --rail-ink-2: #8e97b8;
    --focus: #9fb0ff;
    --ok: #6fd6a0; --ok-soft: #14301f;
    --bad: #ff8f88; --bad-soft: #3a1917;
    --warn: #f0c060; --warn-soft: #33270c;
    --info: #9fb0ff; --info-soft: #232c52;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow-2: 0 16px 40px rgba(0, 0, 0, .6);
    --c1: #9fb0ff; --c2: #f0b040; --c3: #6fd6a0; --c4: #d39be0; --c5: #6fd0e0; --c6: #d6a58c;
    color-scheme: dark;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t-med: 0ms; }
  *, *::before, *::after { animation-duration: 0ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}
