/* ==========================================================================
   TerraBright design tokens — SINGLE SOURCE OF TRUTH.

   Carbon g100 (dark, default) / g10 (light, via [data-theme="light"]).
   Typeface: Roboto + Roboto Mono, self-hosted variable woff2.

   index.html mirrors this block inline for first paint — it inlines all of
   its CSS and must not gain a render-blocking request. The mirrored copy is
   fenced between the @generated:tokens sentinels and checked by
   scripts/sync-tokens.py --check, which fails if the two drift apart.

   Every other page links this file directly.
   ========================================================================== */

/* ---- Roboto (variable: wght 100–900). One file per subset covers every
   weight the UI uses, so `font-weight: 600` renders as a true 600 rather
   than snapping to Bold the way static Roboto faces would. ---------------- */
@font-face{
  font-family:'Roboto'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('fonts/Roboto.woff2') format('woff2-variations'),url('fonts/Roboto.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Roboto'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('fonts/Roboto-ext.woff2') format('woff2-variations'),url('fonts/Roboto-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Roboto Mono (variable: wght 100–700). Reserved for true monospace content
   — ids, hashes, code. Numerals live in Roboto, which carries real `tnum`. */
@font-face{
  font-family:'Roboto Mono'; font-style:normal; font-weight:100 700; font-display:swap;
  src:url('fonts/RobotoMono.woff2') format('woff2-variations'),url('fonts/RobotoMono.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Roboto Mono'; font-style:normal; font-weight:100 700; font-display:swap;
  src:url('fonts/RobotoMono-ext.woff2') format('woff2-variations'),url('fonts/RobotoMono-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* @generated:tokens-start */
:root{
  color-scheme: dark;

  /* ---- surfaces ---- */
  --bg:#161616; --surface:#262626; --surface-2:#393939; --surface-3:#4c4c4c;
  --field:#262626;
  /* --border is a DECORATIVE hairline (1.6:1 — deliberately below the 3:1 UI
     threshold, and exempt as a non-essential divider). Anything load-bearing
     — input underlines, focusable tile edges, control outlines — must use
     --border-strong, which clears 3:1 on both --bg and --surface. */
  --border:#393939; --border-strong:#6f6f6f;

  /* ---- text ----
     --text-muted carries nearly all micro-copy in the app, much of it at
     10–12px. Carbon Gray 50 (#8d8d8d) sat at 4.56:1 on --surface and failed
     outright at 3.48:1 on --surface-2, so it moves up to Gray 40. */
  --text:#f4f4f4; --text-secondary:#c6c6c6; --text-muted:#a8a8a8; --text-inverse:#161616;

  /* ---- accent — Carbon Blue 60 ----
     Formerly named --gold* while holding Carbon Blue, which is what made the
     palette so hard to read. --accent-tint/-border are derived from Blue 60
     to match the accent they tint (they were built from Blue 50 in dark). */
  --accent:#0f62fe; --accent-hover:#0353e9; --accent-active:#002d9c;
  --accent-tint:rgba(15,98,254,.24); --accent-border:rgba(15,98,254,.55);
  --on-accent:#ffffff; --accent-ink:#78a9ff;   /* link / accent text on dark */
  --btn-sec:#6f6f6f; --btn-sec-hover:#5e5e5e;

  /* ---- brand: the ingot mark, the wordmark's "i", and the Au commodity.
     Never an interactive colour. ---- */
  --brand-gold:#f1c21b;

  /* ---- status. --warn was #f1c21b, identical to --brand-gold in both
     themes, so a warning and the brand mark rendered in one amber. It moves
     to Carbon Orange to separate the two. ---- */
  --pos:#42be65; --pos-tint:rgba(66,190,101,.16);
  --neg:#fa4d56; --neg-hover:#ba1b23; --neg-tint:rgba(250,77,86,.16);
  --warn:#ff832b; --warn-tint:rgba(255,131,43,.16);
  --info:#4589ff; --info-tint:rgba(69,137,255,.16);
  --focus:#ffffff;

  /* ---- data visualisation ---- */
  --cat-1:#8a3ffc; --cat-2:#33b1ff; --cat-3:#007d79; --cat-4:#ff7eb6;
  --cat-5:#fa4d56; --cat-6:#6fdc8c; --cat-7:#4589ff; --cat-8:#d4bbff;
  --grade-0:#302300; --grade-1:#684e00; --grade-2:#8e6a00;
  --grade-3:#b28600; --grade-4:#d2a106; --grade-5:#fddc69;
  --plan-0:#022b30; --plan-1:#004144; --plan-2:#005d5d;
  --plan-3:#007d79; --plan-4:#009d9a; --plan-5:#3ddbd9;
  --val-neg:#4589ff; --val-mid:#6f6f6f; --val-pos:#fddc69;
  --p10:#ff832b; --p50:#f1c21b; --p90:#42be65;
  /* chart chrome — read by charts.js so plots follow the theme */
  --chart-bg:#161616; --chart-grid:#393939; --chart-zero:#6f6f6f; --chart-ink:#a8a8a8;

  /* ---- scrims (were five near-identical rgba literals) ---- */
  --scrim:rgba(22,22,22,.7); --scrim-soft:rgba(22,22,22,.35);

  /* ---- elevation ---- */
  --shadow-1:0 1px 2px rgba(0,0,0,.45);
  --shadow-2:0 2px 8px rgba(0,0,0,.5);
  --shadow-3:0 8px 24px rgba(0,0,0,.6);

  /* ---- geometry. Carbon is a square system: 0 everywhere but pills. ---- */
  --r-none:0; --r-full:999px;
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px; --s-16:64px;

  /* ---- control heights: three sizes, not the seven in use today ---- */
  --ctl-lg:48px; --ctl-md:40px; --ctl-sm:32px;

  /* ---- motion. Replaces .1s/.11s/.12s/.15s used interchangeably. ---- */
  --dur-fast:70ms; --dur-slow:240ms;

  /* ---- type ---- */
  --font:Roboto,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --mono:'Roboto Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --fs-hero:clamp(32px,4.4vw,44px);
  --fs-h1:28px; --fs-h2:20px; --fs-h3:16px;
  --fs-body:14px; --fs-sm:12px; --fs-caption:10px;
  --fs-kpi-lg:32px; --fs-kpi:24px; --fs-kpi-sm:20px;
  --lh-tight:1.15; --lh-head:1.25; --lh-ui:1.4; --lh-body:1.5;
  --tr-tight:-.005em; --tr-label:.07em; --tr-label-sm:.09em;
}

:root[data-theme="light"]{
  color-scheme: light;

  --bg:#f4f4f4; --surface:#ffffff; --surface-2:#ffffff; --surface-3:#e8e8e8;
  --field:#f4f4f4; --border:#e0e0e0; --border-strong:#8d8d8d;
  --text:#161616; --text-secondary:#525252; --text-muted:#595959; --text-inverse:#ffffff;

  --accent:#0f62fe; --accent-hover:#0353e9; --accent-active:#002d9c;
  --accent-tint:rgba(15,98,254,.12); --accent-border:rgba(15,98,254,.5);
  --on-accent:#ffffff; --accent-ink:#0f62fe;
  --btn-sec:#393939; --btn-sec-hover:#4c4c4c;

  --brand-gold:#b28600;

  --pos:#24a148; --pos-tint:rgba(36,161,72,.12);
  --neg:#da1e28; --neg-hover:#ba1b23; --neg-tint:rgba(218,30,40,.10);
  /* Orange 70: 4.99:1 on --surface, 4.53:1 on --bg. The old #b28600 was
     3.33:1 and was being used as body text. */
  --warn:#8e6a00; --warn-tint:rgba(142,106,0,.12);
  --info:#0f62fe; --info-tint:rgba(15,98,254,.10);
  --focus:#0f62fe;

  --cat-1:#8a3ffc; --cat-2:#1192e8; --cat-3:#007d79; --cat-4:#ee5396;
  --cat-5:#da1e28; --cat-6:#198038; --cat-7:#0043ce; --cat-8:#a56eff;
  --grade-0:#f5e8c0; --grade-1:#e3c04d; --grade-2:#c99a08;
  --grade-3:#a67c00; --grade-4:#785900; --grade-5:#4d3900;
  --plan-0:#d9fbfb; --plan-1:#9ef0f0; --plan-2:#3ddbd9;
  --plan-3:#009d9a; --plan-4:#007d79; --plan-5:#005d5d;
  --val-neg:#0f62fe; --val-mid:#a8a8a8; --val-pos:#b28600;
  --p10:#c04c00; --p50:#b28600; --p90:#24a148;
  --chart-bg:#ffffff; --chart-grid:#e0e0e0; --chart-zero:#8d8d8d; --chart-ink:#595959;

  --scrim:rgba(22,22,22,.55); --scrim-soft:rgba(22,22,22,.25);

  --shadow-1:0 1px 2px rgba(22,22,22,.10);
  --shadow-2:0 2px 8px rgba(22,22,22,.14);
  --shadow-3:0 8px 24px rgba(22,22,22,.18);
}
/* @generated:tokens-end */

/* Base reset. Lives here so a page that links tokens.css cannot end up
   without it — 404.html briefly did, which made every bordered control 2px
   taller than its height token and gave the body a default margin. Pages
   that inline their own copy (index.html) are unaffected. */
*{box-sizing:border-box}
html,body{margin:0}

/* Honour a reduced-motion preference everywhere, not just for scrolling. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
}
