/* ==========================================================================
   Design tokens — dark "console" palette + light "blueprint" overrides.
   Every other stylesheet reads from these custom properties; change a brand
   colour or type ramp here and it propagates everywhere.
   ========================================================================== */

:root{
  --bg:#04070b; --panel:#081019; --ink:#e9f3f2;
  --muted:rgba(233,243,242,.62); --faint:rgba(233,243,242,.50);
  --line:rgba(233,243,242,.12); --accent:#3fe0c5; --amber:#ffb054;
  /* The blueprint grid in atmosphere.css draws with this rather than --line:
     ambient texture and structural borders are different jobs, and the light
     theme needs to raise one without dragging up the other. */
  --grid-line:rgba(233,243,242,.12);
  --duo-rgb:4,7,11; --media-bg:#0a1420; --elev:#0a1119; --hover:#0c1622; --backdrop:2,5,8;
  /* Semantic failure state, and the only colour on this site that is not
     brand. --accent means "ours" and --amber means "pay attention"; neither
     can carry "this is broken" without teaching the reader the wrong thing
     about both. Used by the SYS.01 incident panel. */
  --alert:#ff6f61;
  /* Ink used ON the accent fill. Dark theme's accent is bright, so it takes dark
     ink; the light theme's accent is a deep green and needs light ink — dark on
     dark measured 3.35:1 on the primary button. */
  --on-accent:#04110c;
  /* Field borders are the only thing identifying an input, so they answer to
     WCAG 1.4.11 (3:1) rather than to --line, which is decorative and stays
     deliberately faint. 0.37 / 0.46 are the measured minimums for 3:1. */
  --field-line:rgba(233,243,242,.37);
  --blend-ink:#e9f3f2; /* fixed light tone for mix-blend-difference layers */
  --display:"Syne", "Arial Black", sans-serif;
  --headline:"IBM Plex Sans", "Syne", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, monospace;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --stacktop:13vh; --stackstep:26px;

  /* ---- type scale ----------------------------------------------------
     Every mono/UI size in the stylesheets resolves to one of these five
     steps. Floors were raised so the smallest label clears 11px and body
     copy sits at 15px — IBM Plex Mono has a tall x-height, so 15px mono
     reads about the size of 16px sans. */
  --fs-2xs:11px;    /* micro labels: SYS readouts, key/value keys, captions */
  --fs-xs:11.5px;   /* eyebrow tags, meta rows, stat labels */
  --fs-sm:12px;     /* nav, buttons, section notes */
  --fs-md:13.5px;   /* dense secondary copy, footer links */
  --fs-base:15px;   /* body copy */
}
/* ===== light "blueprint" theme =====
   Built as a ladder, not a wash. The paper sits at 0.787 relative luminance
   (it was 0.850, which left only 15% of the range above it, so panels had
   nowhere to go and the page read as one flat field). Panels now climb toward
   white and image wells drop below the paper, which opens the separation from
   1.09:1 to 1.19-1.27:1. The structural hairline goes from 1.40:1 to 1.94:1 -
   the single biggest gain, since these lines carry most of the page's
   structure. Accent and amber are deepened to hold their contrast on the
   deeper paper. */
[data-theme="light"]{
  --bg:#e3e7dd; --panel:#f8faf4; --ink:#0b1512;
  --muted:rgba(11,21,18,.74); --faint:rgba(11,21,18,.62);
  --line:rgba(11,21,18,.30); --grid-line:rgba(11,21,18,.15);
  --accent:#00654f; --amber:#7d4a00;
  --duo-rgb:227,231,221; --media-bg:#c9cfc4; --elev:#ffffff; --hover:#d5dace; --backdrop:22,26,20;
  --on-accent:#f8faf4; --field-line:rgba(11,21,18,.50);
  --alert:#9e2116;          /* deeper, to hold ~6:1 on the light panel */
}
[data-theme="light"] .grain{ opacity:.035; }
[data-theme="light"] .gridlay{ opacity:.62; }