/* Design tokens — the Unity-parity layer.
 *
 * Loaded before base.css so a token is available to every sheet. base.css owns
 * the original palette (--accent, --gold, --green, --red …) and keeps it: the
 * `--u-*` names below are the *chrome* the Unity client draws with — line
 * colour, glass fill, label/value pairing, the CTA gradient — expressed once so
 * html/css/ui.css can build the kit from them and no view re-authors a shade.
 *
 * See UI-REDESIGN.md §1.1. */

:root{
  /* ── Line + surface ─────────────────────────────
     One line colour carries the whole look: chip borders, panel edges and the
     corner brackets are all the same cyan at three strengths. */
  --u-line:#4fd8ff;
  --u-line-dim:rgba(79,216,255,.35);
  --u-line-soft:rgba(79,216,255,.14);

  --u-glass:linear-gradient(165deg,rgba(9,22,46,.94),rgba(4,11,26,.96));
  --u-glass-flat:rgba(7,17,36,.92);
  --u-well:rgba(3,9,20,.55);            /* inset surface: list rows, stat chips */
  --u-ink:rgba(2,6,14,.72);             /* backdrop behind a full-screen overlay */

  /* ── Text ───────────────────────────────────────
     A label / value pair is the atom of this UI: muted small-caps label,
     bright bold value. Body copy sits between the two. */
  --u-label:#8fb2cc;
  --u-value:#ffffff;
  --u-body:#b6d0e4;
  --u-mute:#6a8aa6;

  /* ── Action ─────────────────────────────────────
     The primary button is the only saturated fill in the kit; cost and
     requirement text is always gold, and always beside the button, never in it. */
  --u-cta-a:#31c8f0;
  --u-cta-b:#1878d8;
  --u-cta-ink:#04121f;
  --u-cost:var(--gold);

  /* Resource-distinct value colours, so a counter still says which resource it
     is when the rail is too short to carry its label (Phase 7). */
  --u-scrap:#d8884a;
  --u-metal:#aeb8c4;
  --u-silicon-ore:#9b86d8;
  --u-silicon:#cfc0ff;
  --u-meal:#8fe36a;
  /* The Command Bridge's accent: its station signage and its bay's console screens. */
  --u-bridge:#7fd4ff;
  /* Training's accent: the Training Center's signage, an attribute in training, and the rim and well around it. */
  --u-train:#ff86c2;
  --u-train-line:rgba(255,90,170,.4);
  --u-train-well:rgba(255,90,170,.1);

  /* ── State ──────────────────────────────────────
     Shared by pills (list rows) and pins (station modules) so "ready" reads the
     same green wherever it appears. */
  --u-ok:var(--green);
  --u-warn:var(--gold);
  --u-bad:var(--red);
  --u-idle:#5f86a8;

  /* ── Type ───────────────────────────────────────
     Barlow carries prose and labels, Orbitron the screen titles, Share Tech
     Mono the technical readouts (ids, timers, dense numeric tables). Headline
     values use Barlow with tabular figures so a changing number never reflows
     its chip. */
  --u-font-display:'Orbitron',sans-serif;
  --u-font-ui:'Barlow','Segoe UI',system-ui,sans-serif;
  --u-font-mono:'Share Tech Mono',monospace;

  /* ── Metrics ────────────────────────────────────*/
  --u-r:6px;                            /* panel radius */
  --u-r-sm:4px;                         /* chip / pill radius */
  --u-brk:18px;                         /* corner-bracket arm length */
  --u-brk-w:2px;                        /* corner-bracket stroke */
  --u-brk-o:7px;                        /* how far a bracket sits outside its panel */
  --u-chip-h:36px;
  --u-pin:44px;
  /* The galactic projection's hexagon. A token because the projection has to
     fit N of them in a fixed height and shrinks them when they will not go
     (views/map.js); css/ui.css steps the default down per breakpoint. */
  --u-hex-w:150px;
  --u-hex-h:132px;

  /* ── Z-stack ────────────────────────────────────
     One ladder, read inside a stacking context — `#stage` and `.sb-stage`
     isolate, so a view's layers stack against each other and never against the
     rail. Nothing may invent a z-index outside it (UI-REDESIGN.md §1.4): the
     overlapping HUD in the Unity build is what happens when something does. */
  --z-scene:0;
  --z-pins:2;
  --z-panel:4;
  --z-bay:6;
  --z-toast:8;
}