/* ═══════════════════════════════════════════════════════════════════════════
   tokens.css — THE SINGLE SOURCE OF TRUTH FOR EVERY TOKEN. Loaded FIRST.

   Stage 0 items 1 and 2 (founder 2026-09-14).

   ITEM 1 removed the duplicate declarations: the tokens had been declared twice,
   in arete.css and again in arete-system.css, and the second copy silently
   overwrote the first in 25 places across the two themes.

   ITEM 2 — HER RULING: the Midnight Glow palette becomes the canonical palette
   for the WHOLE application. It had been scoped to five rooms only
   (Today, Decide, Radar, You, the More sheet), so the constitution's colours
   applied in five rooms and the older blue applied everywhere else. That scoped
   block is deleted; its values live here, globally. Twenty-six dark tokens are
   rebased and eight material tokens are added; light gains the eight material
   tokens (light was never rebased by the old scoped block).

     ground   --s0 #0F1724 · --s1 #0B1E33 · --s2 #1A2A3F
     signal   --ice #7FD3FF · --mg-glow #1F7EDB

   TEAL IS RETIRED (founder ruling 2026-09-14). Dark had already been mapped onto
   the cold ladder; LIGHT never was, and still carried real teal in --bad #095f5f,
   --st-degraded #0a7676, --deep 9 95 95, plus --teal/--teal-ink. Those are gone.
   --teal and --teal-ink are DELETED outright in both themes: they had zero
   consumers anywhere in css/, js/ or the shell. Dead, not migrated.

   THE SEMANTIC LADDER — nominal · caution · degraded · critical.
   It is consumed as TEXT colour (.ui-chip, .td-verdict, .td-state .ui-display),
   so every rung must clear 4.5:1 on its own ground.

     dark  on #03101f   #00BFFF 9.01 · #66D9FF 11.78 · #9fd9f5 12.50 · #b8ecff 15.01
     light on #f3f6fa   #116289 6.19 · #3f6789  5.52 · #24486f  8.68 · #0b2a44 13.56

   Measured before the change, the light ladder could NOT carry four rungs: the
   degraded rung was the only thing separating caution from critical, and it did
   so by being a different HUE (teal, deltaE 27.6 / 36.2 from its neighbours)
   rather than by being further from the ground. Remove the hue and caution and
   critical sit deltaE 13.5 apart with nothing between them.

   The smallest canonical extension: degraded takes #24486f — a value light
   ALREADY declared, as its critical rung — and critical moves one rung deeper to
   #0b2a44, the same navy family. ONE new value in the whole system. No warm
   colour, no third palette, no teal by convenience. Adjacent deltaE is now
   7.4 / 13.5 / 15.2 against dark's 17.4 / 13.4 / 8.4.

   KNOWN, DOCUMENTED, NOT FIXED HERE: light nominal/caution are deltaE 7.4 apart
   and not monotone against the ground (6.19 then 5.52), where dark's ladder rises
   all the way. Closing that means moving --st-nominal, which is --ice, the light
   theme's one signal colour — a rendered-identity change well outside ground
   clearing. Recorded for the palette item, not taken now.

   THIS IS NOT AN OVERRIDE LAYER. It is first in the cascade and contains only
   custom properties on :root. Custom properties resolve where they are USED,
   not where they are declared, so every later rule still reads them normally.

   Rules for this file:
     · A token is declared HERE and nowhere else, ONCE.
     · No !important. Ever. There is nothing to override.
     · A new token needs a role, not just a colour.
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  color-scheme:dark;

  /* ── GROUND & SURFACE ── */
  --bg:#03101f;
  --bg2:#001F3F;
  --surface:3 16 31;
  --container-low:0 31 63;
  --s0:#0F1724;
  --s1:#0B1E33;
  --s2:#1A2A3F;
  --s3:#22344c;

  /* ── INK — the three rungs ── */
  --ink:238 240 243;
  --ink2:180 180 188;
  --ink3:154 168 188;
  --ink4:143 154 171;
  --svg-ink:#eef0f3;
  --svg-label:#b4b4bc;
  --svg-faint:#8fa2b8;

  /* ── BLUE — the one signal ── */
  --primary:79 196 245;
  --primary-soft:79 196 245;
  --indigo:127 178 214;
  --accent:#00BFFF;
  --accent-soft:#00BFFF;
  --accent-line:#00BFFF;
  --grad2:#66D9FF;
  --ice:#7FD3FF;
  --ice-dim:rgba(0,191,255,0.10);
  --ice-border:rgba(0,191,255,0.32);
  --steel:#66D9FF;
  --deep:159 217 245;
  --ice2:#7FD3FF;
  --ice-glow:rgba(31,126,219,.18);

  /* ── HAIRLINE & GRID ── */
  --grid:rgba(127,220,255,0.07);
  --grid2:rgba(127,220,255,0.13);
  --svg-grid:rgba(127,220,255,0.07);
  --svg-track:rgba(127,220,255,0.06);
  --svg-tick:rgba(127,220,255,0.10);
  --svg-dotstroke:#03101f;
  --hair:rgba(127,211,255,.10);
  --hair2:rgba(127,211,255,.22);
  --hair3:rgba(127,211,255,.38);
  --s-subtle:rgba(31,126,219,.05);

  /* ── STATE & PROVENANCE ── */
  --ok:#00BFFF;
  --warn:#66D9FF;
  --bad:#9fd9f5;
  --crit:#b8ecff;
  --st-nominal:#00BFFF;
  --st-caution:#66D9FF;
  --st-degraded:#9fd9f5;
  --st-critical:#b8ecff;
  --st-confirmed:#66D9FF;
  --st-unresolved:#b4b4bc;
  --pv-measured:#7FD3FF;
  --pv-self:#b4c9dc;
  --pv-derived:#9fd9f5;
  --pv-composed:#8fa2b8;
  --pv-estimated:#8fa2b8;

  /* ── FOCUS & GLOW ── */
  --focus:var(--ice2);
  --glow-1:0 0 8px rgba(31,126,219,.3);
  --glow-2:0 0 16px rgba(31,126,219,.45);
  --glow-3:0 0 34px rgba(31,126,219,.55);

  /* ── TYPE ── */
  --f-disp:"Syne",system-ui,sans-serif;
  --f-body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-em:"Cormorant Garamond",Georgia,serif;
  --f-meta:"Manrope",system-ui,sans-serif;
  /* the wordmark face, and only the wordmark. The website sets ARETE in Michroma
     at .22em (index.html:138); the app had no Michroma, so its mark was Inter.
     One consumer: .ent-wordmark. Not a text family. */
  --f-mark:"Michroma",var(--f-disp);
  --t-display:clamp(64px,8vw,120px);
  --t-title:28px;
  --t-section:18px;
  --t-body:15px;
  --t-support:13px;
  --t-meta:12px;

  /* ── SPACE & SHAPE ── */
  --card-radius:10px;
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:24px;
  --sp-6:40px;
  --sp-7:64px;
  --r-1:6px;
  --r-2:10px;
  --r-pill:999px;
  --rail-w:84px;
  --tab-h:60px;
  --hdr-h:60px;

  /* ── MOTION ── */
  --dur-1:180ms;
  --dur-2:320ms;
  --dur-3:600ms;
  --ease-inst:cubic-bezier(.2,.8,.2,1);

  /* ── MATERIAL — glass, pill, glow ── */
  --mg-glow:#1F7EDB;
  --mg-ice:#7FD3FF;
  --mg-glass-bg:linear-gradient(150deg,rgba(31,126,219,.11),rgba(31,126,219,.05) 55%,rgba(255,255,255,.012));
  --mg-glass-edge:rgba(127,211,255,.16);
  --mg-glass-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 30px 70px -40px rgba(31,126,219,.75);
  --mg-pill-edge:rgba(127,211,255,.26);
  --mg-pill-bg:rgba(127,211,255,.06);
  --mg-pill-hover:rgba(127,211,255,.12);

  /* ── MATERIAL · DEPTH — the four rungs of a body of dark glass, centre to rim.
     A role, not a room: anything built as a lit solid reads on this ramp.
     Added by item 2 to retire Radar's private disc ramp. ── */
  --mat-depth-0:#04101f;
  --mat-depth-1:#071a33;
  --mat-depth-2:#0b2544;
  --mat-depth-3:#123a63;
  --mat-cast:#000814;        /* the shadow a solid casts on the field */

  /* the top of the ink ramp: a lit mark on glass, brighter than --ice.
     The website's --ice-hi, brought in so JS never has to name it. */
  --ice-hi:#DFF4FF;
  --ice-lo:#9FE2FF;          /* one rung under --ice-hi: ripples, bevel */
}

/* LIGHT — the same roles, the ink the other way up. Only the tokens that
   actually differ are restated; everything else is inherited from :root. */
html[data-theme="light"]{
  color-scheme:light;

  /* ── GROUND & SURFACE ── */
  --bg:#f3f6fa;
  --bg2:#ffffff;
  --surface:243 246 250;
  --container-low:255 255 255;
  --s0:#f3f6fa;
  --s1:#ffffff;
  --s2:#e9eef5;
  --s3:#dde5ef;

  /* ── INK — the three rungs ── */
  --ink:15 20 28;
  --ink2:60 70 88;
  --ink3:85 96 122;
  --ink4:95 106 126;
  --svg-ink:#0f141c;
  --svg-label:#3c4658;
  --svg-faint:#5f6a7e;

  /* ── BLUE — the one signal ── */
  --primary:17 98 137;
  --primary-soft:17 98 137;
  --indigo:70 120 160;
  --accent:#116289;
  --accent-soft:#116289;
  --accent-line:#116289;
  --grad2:#3f6789;
  --ice:#116289;
  --ice-dim:rgba(17,98,137,0.08);
  --ice-border:rgba(17,98,137,0.28);
  --steel:#3f6789;
  --deep:36 72 111;
  --ice2:#0e6a94;
  --ice-glow:rgba(17,98,137,0.14);

  /* ── HAIRLINE & GRID ── */
  --grid:rgba(15,40,70,0.07);
  --grid2:rgba(15,40,70,0.12);
  --svg-grid:rgba(15,40,70,0.08);
  --svg-track:rgba(15,40,70,0.06);
  --svg-tick:rgba(15,40,70,0.12);
  --svg-dotstroke:#f3f6fa;
  --hair:rgba(15,40,70,0.10);
  --hair2:rgba(15,40,70,0.20);
  --hair3:rgba(15,40,70,0.36);

  /* ── STATE & PROVENANCE ── */
  --ok:#116289;
  --warn:#3f6789;
  --bad:#24486f;
  --crit:#0b2a44;
  --st-nominal:#116289;
  --st-caution:#3f6789;
  --st-degraded:#24486f;
  --st-critical:#0b2a44;
  --st-confirmed:#0e6a94;
  --st-unresolved:#55607a;
  --pv-measured:#0e6a94;
  --pv-self:#3c4658;
  --pv-derived:#3f6789;
  --pv-composed:#6b7280;
  --pv-estimated:#6b7280;

  /* ── MATERIAL — glass, pill, glow ── */
  --mg-glow:#1F7EDB;
  --mg-ice:#116289;
  --mg-glass-bg:linear-gradient(150deg,rgba(255,255,255,.78),rgba(255,255,255,.6));
  --mg-glass-edge:rgba(15,40,70,.14);
  --mg-glass-shadow:inset 0 1px 0 #fff,0 30px 70px -46px rgba(31,126,219,.3);
  --mg-pill-edge:rgba(15,40,70,.18);
  --mg-pill-bg:rgba(15,40,70,.04);
  --mg-pill-hover:rgba(15,40,70,.09);

  /* ── MATERIAL · DEPTH — light reads the same solid from the other side: the
     rim is the darkest rung, the centre the lightest, so the body still has a
     direction. Not a tint of the dark ramp; measured against --s0/--s2. ── */
  --mat-depth-0:#ffffff;
  --mat-depth-1:#eef3f9;
  --mat-depth-2:#dde6f1;
  --mat-depth-3:#c3d2e3;
  --mat-cast:#8a9bb0;

  --ice-hi:#0b4a69;          /* the lit mark, inverted: dark ink on light glass */
  --ice-lo:#2f7ba3;
}

/* ═══════════════════════════════════════════════════════════════════════════
   THE TWO PROTECTED SURFACES — Intercept and Record.

   Founder ruling 2026-09-14: one canonical system, AND the protected rendered
   identity of these two rooms is preserved. Promoting the canonical palette
   app-wide would have altered them, so the exact dependency was measured rather
   than assumed, and only what actually moved is pinned back:

     Record    117 of 1387 elements moved, caused by --hair and --ink3
     Intercept  15 of 138  elements moved, caused by --ink3 and --ice2

   Three tokens. They are pinned here to the values these rooms have always
   rendered, so both surfaces are byte-identical to before the migration.

   This is NOT a second palette. It is three values held on two ids, recorded so
   the exception is visible and reversible. Releasing the pin is one deletion and
   would move Record's hairline from cyan to ice-blue, Intercept's lit marks from
   #66D9FF to #7FD3FF, and both rooms' third ink rung by five RGB points — all
   small, none of them mine to decide.

   DARK ONLY. The old scoped block never rebased light — it only added the eight
   material tokens there — so light needs no pin. Pinning both themes was my first
   attempt and it pushed the DARK ink rung into LIGHT, moving 117 Record elements
   the wrong way. Measured, caught, scoped.
   ═══════════════════════════════════════════════════════════════════════════ */
html:not([data-theme="light"]) :is(#view-record, #intercept-panel){
  --hair:rgba(0,191,255,0.10);
  --ink3:149 161 179;
  --ice2:#66D9FF;
}