/* =============================================================
   tokens.css — THE ONE PLACE A TOKEN IS DECIDED (2026-09-20).
   Loaded by index-v5 / excel / numbers and by design-system.html,
   BEFORE each page's inline <style> and before v5.css.
   Until today this block was pasted into every page ("change it in
   all three"), and the copies had drifted: --ease lived on the home
   page only, so five transitions in v5.css were dead on both Lab pages.
   The palette itself is LOCKED (2026-08-27) — see the block below.
   The living reference is /design-system.html.
   ============================================================= */
:root{
  /* ==============================================================
   THE PALETTE — LOCKED 2026-08-27.
   Two greens, one orange, white, black, and one gray ramp.
   Nothing else. Every colour on this page is one of these tokens
   or a color-mix() of one, so there is no second place a colour
   can be decided. This block used to be pasted into every page;
   it lives here now and nowhere else.
   ============================================================== */
  --white:#ffffff;
  --ink:#060807;              /* black                              */
  --green:#107f41;            /* deep green — labels, text, rules   */
  --mint:#2bff88;             /* electric green — fills             */
  --orange:#ff6a13;           /* orange — fills and marks           */
  --orange-ink:#b8430f;       /* orange as text (AA on white/gray)  */
  --on-mint:#062b18;          /* what sits on --mint                */
  --on-green:#ffffff;         /* what sits on --green               */
  --on-orange:#060807;        /* what sits on --orange              */

  /* gray — ONE ramp, light to dark.
     g1-g5 are surfaces, borders and marks: never text.
     g6-g8 are text: every one clears 4.5:1 on --white and --g1. */
  --g1:#f5f5f7;               /* section ground                     */
  --g2:#ececf0;               /* raised surface, pills              */
  --g3:#e2e2e7;               /* hover, hairlines                   */
  --g4:#d2d2d7;               /* borders, dots                      */
  --g5:#b8b8bd;               /* quiet marks                        */
  --g6:#6e6e73;               /* secondary text        5.07 : 1     */
  --g7:#48484d;               /* strong secondary      8.59 : 1     */
  --g8:#1d1d1f;               /* body text            15.78 : 1     */

  /* the same ramp read against ink */
  --n1:#f5f5f7;               /* text on ink                        */
  --n2:#a1a1a6;               /* dim on ink            7.81 : 1     */
  --n3:#86868b;               /* faint on ink          6.02 : 1     */

  /* derived — tints of the locked colours, never new colours */
  --green-05:color-mix(in srgb,var(--green) 5%,var(--white));
  --green-08:color-mix(in srgb,var(--green) 8%,var(--white));
  --green-16:color-mix(in srgb,var(--green) 16%,var(--white));
  --orange-06:color-mix(in srgb,var(--orange) 6%,var(--white));
  --orange-18:color-mix(in srgb,var(--orange) 18%,var(--white));
  --orange-25:color-mix(in srgb,var(--orange) 25%,var(--white));
  --orange-60:color-mix(in srgb,var(--orange) 60%,var(--white));
  --r:28px;--r-sm:18px;
  --shadow:0 8px 24px rgba(6,8,7,0.06),0 28px 80px rgba(6,8,7,0.10);
  --font:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(0.16,1,0.3,1);
  /* ghost levels for the mark, solved per ground -- see .qmark */
  --mk1:.13;--mk2:.226;--mk3:.327;
}