/* ===== tokens/colors.css ===== */
:root{
  /* --- core --- */
  --kv-damson:#2E1D36;            /* anchor: dark grounds, headings, primary buttons */
  --kv-chalk:#EFECE6;             /* default page ground */
  --kv-ink:#1C1620;               /* body copy */
  --kv-clay:#9C4527;              /* negative judgement, links, on light grounds */
  --kv-fern:#3D6B4E;              /* positive judgement, on light grounds */
  --kv-gold:#FAC11C;              /* MARK AND WORDMARK ONLY. 1.40:1 on chalk. */

  /* --- functional --- */
  --kv-heather:#665C6A;           /* secondary text, 5.39:1 on chalk */
  --kv-plum:#5A3560;              /* mid dark ground, watch verdict, 8.43:1 */
  --kv-apricot:#E39A7A;           /* dark grounds only */
  --kv-sprout:#8FC4A2;            /* dark grounds only */
  --kv-surface:#FFFFFF;
  --kv-surface-alt:#E4DFE6;
  --kv-hairline:#DAD3DC;
  --kv-rule:#B3A9B8;

  /* --- semantic --- */
  --kv-ground:var(--kv-chalk);
  --kv-heading:var(--kv-damson);
  --kv-text:var(--kv-ink);
  --kv-text-muted:var(--kv-heather);
  --kv-link:var(--kv-clay);

  /* --- judgement --- */
  --kv-ok:#3D6B4E;      --kv-ok-dark:#8FC4A2;
  --kv-watch:#5A3560;   --kv-watch-dark:#B294BA;
  --kv-stop:#9C4527;    --kv-stop-dark:#E39A7A;

  /* --- feed rotation --- */
  --kv-g-chalk:#EFECE6;
  --kv-g-lilac-mist:#DFD3E6;
  --kv-g-apricot-wash:#F1D8C5;
  --kv-g-heather-wash:#D0C5D6;
  --kv-g-apricot:#E39A7A;
  --kv-g-clay:#9C4527;
  --kv-g-fern:#3D6B4E;
  --kv-g-plum:#5A3560;
  --kv-g-damson:#2E1D36;
  --kv-g-ink:#1C1620;

  /* --- chart --- */
  --kv-c1:#2E1D36; --kv-c2:#9C4527; --kv-c3:#3D6B4E;
  --kv-c4:#7A4A82; --kv-c5:#665C6A;
}

/* Dark mode: three states. Bare :root is light, the media query follows the
   system, and [data-theme] forces either one. */
@media (prefers-color-scheme:dark){
  :root{
    --kv-ground:#171119;
    --kv-surface:#221A26;
    --kv-surface-alt:#2C2231;
    --kv-text:#EFECE6;
    --kv-heading:#EFECE6;
    --kv-text-muted:#A093A6;
    --kv-link:#E08A63;
    --kv-clay:#E08A63;
    --kv-fern:#8FC4A2;
    --kv-plum:#B294BA;
    --kv-hairline:#382C3E;
    --kv-rule:#4E3E56;
    --kv-ok:#8FC4A2; --kv-watch:#B294BA; --kv-stop:#E39A7A;
  }
}
:root[data-theme="light"]{
  --kv-ground:var(--kv-chalk);
  --kv-surface:#FFFFFF;
  --kv-surface-alt:#E4DFE6;
  --kv-text:var(--kv-ink);
  --kv-heading:var(--kv-damson);
  --kv-text-muted:#665C6A;
  --kv-link:#9C4527;
  --kv-clay:#9C4527;
  --kv-fern:#3D6B4E;
  --kv-plum:#5A3560;
  --kv-hairline:#DAD3DC;
  --kv-rule:#B3A9B8;
  --kv-ok:#3D6B4E; --kv-watch:#5A3560; --kv-stop:#9C4527;
}
:root[data-theme="dark"]{
  --kv-ground:#171119;
  --kv-surface:#221A26;
  --kv-surface-alt:#2C2231;
  --kv-text:#EFECE6;
  --kv-heading:#EFECE6;
  --kv-text-muted:#A093A6;
  --kv-link:#E08A63;
  --kv-clay:#E08A63;
  --kv-fern:#8FC4A2;
  --kv-plum:#B294BA;
  --kv-hairline:#382C3E;
  --kv-rule:#4E3E56;
  --kv-ok:#8FC4A2; --kv-watch:#B294BA; --kv-stop:#E39A7A;
}


/* ===== tokens/typography.css ===== */
:root{
  /* Serif carries judgement. Sans carries the machinery. */
  --kv-serif:"Spectral",Georgia,"Times New Roman",serif; /* @kind font */
  --kv-sans:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; /* @kind font */
  /* Dense tables: the semi-condensed cut, in place of the variable wdth axis. */
  --kv-sans-condensed:"Archivo Condensed","Archivo",Arial,sans-serif; /* @kind font */

  /* sizes / leading, from tokens.json typography.* */
  --kv-fs-h1:48px;      --kv-lh-h1:52px;
  --kv-fs-h2:32px;      --kv-lh-h2:38px;
  --kv-fs-h3:22px;      --kv-lh-h3:30px;
  --kv-fs-lede:21px;    --kv-lh-lede:32px;
  --kv-fs-body:18px;    --kv-lh-body:30px;
  --kv-fs-verdict:24px; --kv-lh-verdict:34px;
  --kv-fs-quote:24px;   --kv-lh-quote:34px;
  --kv-fs-nav:15px;     --kv-lh-nav:24px;
  --kv-fs-button:14px;  --kv-lh-button:20px;
  --kv-fs-label:12px;   --kv-lh-label:16px;
  --kv-fs-table:15px;   --kv-lh-table:22px;
  --kv-fs-caption:13px; --kv-lh-caption:20px;

  --kv-ls-h1:-.015em; --kv-ls-h2:-.01em; --kv-ls-label:.12em;

  --kv-weight-light:300; --kv-weight-regular:400; --kv-weight-medium:500;
  --kv-weight-semibold:600; --kv-weight-bold:700;
}


/* ===== tokens/spacing.css ===== */
:root{
  /* 4px base, 8px rhythm */
  --kv-space-1:4px;   --kv-space-2:8px;   --kv-space-3:12px;
  --kv-space-4:16px;  --kv-space-5:24px;  --kv-space-6:32px;
  --kv-space-7:48px;  --kv-space-8:64px;  --kv-space-9:96px;
  --kv-space-10:128px;

  /* layout */
  --kv-w-read:680px;
  --kv-w-std:1120px;
  --kv-w-wide:1320px;
  --kv-radius:2px;                 /* 2px or zero. Nothing else. */
  --kv-bp-sm:360px; --kv-bp-md:768px; --kv-bp-lg:1280px;

  /* grain: SVG fractal noise, 160px tile. Never a pattern. */
  --kv-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E"); /* @kind other */
}


/* ===== v2.2 additions, already merged below ===== */
/* v2.2 additions. Append the first block to tokens/colors.css, the second to
   tokens/spacing.css. No new colour is introduced: the band tokens alias the
   three judgement tokens, which already carry dark pairs, so a band follows the
   theme without a second definition. */

/* --> tokens/colors.css */
:root{
  /* --- factor bands. Aliases only, so bands and verdicts can diverge later
         without a find and replace. --- */
  --kv-band-strong:var(--kv-ok);
  --kv-band-adequate:var(--kv-watch);
  --kv-band-weak:var(--kv-stop);
  --kv-band-untested:var(--kv-text-muted);   /* no glyph, no border, no judgement */
}

/* --> tokens/spacing.css */
:root{
  --kv-track-h:4px;          /* the scrub track, the only 4px rule in the system */
  --kv-glyph-stroke:1.5px;   /* the two audio glyphs, and nothing else */
  --kv-glyph-sm:16px;
  --kv-glyph-md:20px;
  --kv-thumb-ratio:16 / 10;  /* one crop ratio for all four card types */
}