/* ==========================================================================
   tokens.css — Dorth Pengu design tokens (Phase 3 lock, from vault.html)
   Single source of truth for the site AND both games.

   PALETTE CUT — 2026-08-03. 16 → 8. The named palette below is the whole
   brand palette; everything else on this sheet is an alpha or blend of it.

   KEPT (8):
     abyss    #07090D  the world (INVARIANT)
     ink      #A9AEBE  text on dark
     crimson  #E11D2E  the blade, the seal, the primary action (INVARIANT)
     blood    #8C1128  dried-blood depth, rules, negative states (INVARIANT)
     saber    #FF2A2A  reserved: burns, seals, big moments (INVARIANT)
     ice      #8EC5FF  atmosphere + confirmation (INVARIANT) — doubles as SYSTEM
     blessing #6CFF7D  gain / confirmation-positive (was "ichor"; games + receipts)
     storm    #9B5DE5  power / boss / Decree VI (was "amethyst")

   SEMANTIC ROLES:
     --blessing → #6CFF7D   the only green that may appear, ever
     --storm    → #9B5DE5   the only violet; rationed like the Violet Storm
     --system   → alias of --ice; calm instrument voice, HUD, confirmations

   CUT (8): turquoise #2EC9C9, teal #25B3C9, violet #6F42C1 (storm keeps the
   brighter amethyst), magma #FF5A1F, ember #FF9C2E, jade #00A86B (blessing
   keeps the colder green), gunmetal #1F2730 + steel #3A4654 (surface steps
   below replace them), obsidian #0E1217 (folded into the surface ladder).
   ========================================================================== */

:root {
  /* ------------------------------------------------ palette (the eight) */
  --abyss: #07090D;
  --ink: #A9AEBE;
  --crimson: #E11D2E;
  --blood: #8C1128;
  --saber: #FF2A2A;
  --ice: #8EC5FF;
  --blessing: #6CFF7D;
  --storm: #9B5DE5;
  --system: var(--ice);

  /* ------------------- ink alpha ladder (raised 2026-08-03 for WCAG AA:
     every rung >=4.5:1 against the lightest dark surface #13141C) */
  --ink-70: rgba(169,174,190,0.70);
  --ink-72: rgba(169,174,190,0.72);
  --ink-74: rgba(169,174,190,0.74);
  --ink-76: rgba(169,174,190,0.76);
  --ink-78: rgba(169,174,190,0.78);
  --ink-80: rgba(169,174,190,0.80);
  --ink-83: rgba(169,174,190,0.83);
  --ink-86: rgba(169,174,190,0.86);
  --ink-89: rgba(169,174,190,0.89);
  --ink-91: rgba(169,174,190,0.91);
  --ink-93: rgba(169,174,190,0.93);
  --ink-96: rgba(169,174,190,0.96);
  --ink-98: rgba(169,174,190,0.98);

  /* ----------------- white alpha ladder (raised 2026-08-03 for WCAG AA) */
  --w-50: rgba(255,255,255,0.50);
  --w-52: rgba(255,255,255,0.52);
  --w-54: rgba(255,255,255,0.54);
  --w-58: rgba(255,255,255,0.58);
  --w-60: rgba(255,255,255,0.60);
  --w-62: rgba(255,255,255,0.62);
  --w-64: rgba(255,255,255,0.64);

  /* --------------------------------------------------------- hairlines */
  --hairline: rgba(255,255,255,0.06);
  --doc-border: rgba(255,255,255,0.07);
  --hairline-strong: rgba(255,255,255,0.09);

  /* ---------------------------------------------------- surface steps */
  --surface-hover: #0C0E13;   /* amusement hover lift */
  --surface-panel: #0D0F13;   /* terminal body */
  --surface-raised: #101216;  /* terminal titlebar, skip link */
  --scrim: rgba(7,9,13,0.96); /* sticky header */

  /* ------------------------------------- document (lit-relic) surfaces */
  --grad-doc: linear-gradient(112deg,#13141C 0%,#111219 36%,#0D0E15 70%,#0A0B11 100%);
  --grad-doc-m: linear-gradient(118deg,#13141C 0%,#101118 40%,#0C0D14 76%,#0A0B11 100%);
  --sheen-doc: radial-gradient(120% 130% at 16% -8%,rgba(255,255,255,0.07) 0%,rgba(255,255,255,0) 52%),linear-gradient(to bottom,rgba(255,255,255,0.03) 0%,rgba(255,255,255,0) 14%,rgba(0,0,0,0.20) 100%);
  --glow-floor: radial-gradient(closest-side,rgba(255,255,255,0.05),rgba(255,255,255,0) 100%);

  /* ------------------------------------------------------ scene light */
  --glow-hero-blood: radial-gradient(58% 52% at 68% 44%,rgba(140,17,40,0.30),rgba(7,9,13,0) 68%);
  --glow-hero-ice: radial-gradient(70% 60% at 22% 88%,rgba(142,197,255,0.055),rgba(7,9,13,0) 62%);
  --glow-plate-blood: radial-gradient(46% 44% at 50% 46%,rgba(140,17,40,0.26),rgba(7,9,13,0) 70%);
  --glow-hero-blood-m: radial-gradient(60% 46% at 56% 36%,rgba(140,17,40,0.32),rgba(7,9,13,0) 68%);
  --halo-portrait: radial-gradient(46% 46% at 44% 40%,rgba(225,29,46,0.34),rgba(7,9,13,0) 70%);
  --halo-plate: radial-gradient(40% 40% at 38% 42%,rgba(225,29,46,0.30),rgba(7,9,13,0) 68%);
  --fade-to-abyss: linear-gradient(to bottom,rgba(7,9,13,0),var(--abyss) 78%);
  --fade-to-abyss-up: linear-gradient(to top,rgba(7,9,13,0),var(--abyss) 78%);
  --mask-portrait: radial-gradient(ellipse 60% 60% at 50% 48%,#000 52%,rgba(0,0,0,0) 84%);
  --mask-portrait-m: radial-gradient(ellipse 58% 58% at 50% 50%,#000 46%,rgba(0,0,0,0) 80%);
  --mask-plate: radial-gradient(ellipse 58% 58% at 50% 48%,#000 50%,rgba(0,0,0,0) 82%);

  /* ------------------------------------------- blood-derived UI states */
  --refuse-bg: #5A0C1C;
  --refuse-fg: #D79AA4;
  --refuse-bg-hover: #7A1126;
  --refuse-fg-hover: #E7B2BA;
  --crimson-45: rgba(225,29,46,0.45);
  --crimson-55: rgba(225,29,46,0.55);
  --ice-85: rgba(142,197,255,0.85);
  --crimson-text: #E64352; /* crimson lightened 17% — small crimson text on dark, >=4.6:1 */
  --blood-text: #B76978;   /* blood lightened 37% — pending/negative states on documents, >=4.6:1 */

  /* ------------------------------------------------------- type: faces */
  --font-engraved: Cinzel, serif;
  --font-registrar: 'EB Garamond', serif;
  --font-body: Sora, sans-serif;
  --font-mono: 'Space Mono', monospace;

  /* ------------------------------- type roles: desktop / (-m = ≤960px) */
  /* engraved voice — weight 400, tracking 0.05em, caps */
  --fz-hero: 96px;        --lh-hero: 1.08;
  --fz-hero-m: 48px;      --lh-hero-m: 1.1;
  --fz-plate: 56px;       --lh-plate: 1.1;
  --fz-plate-m: 34px;
  --fz-amuse: 38px;
  --fz-amuse-m: 26px;
  --fz-verse: 27px;       --lh-verse: 1.35;
  --track-engraved: 0.05em;
  --wt-engraved: 400;

  /* registrar voice — EB Garamond, sentence case */
  --fz-doc-h2: 29px;      --lh-doc-h2: 1.3;
  --fz-doc-h2-m: 22px;
  --fz-doc-value: 21px;
  --fz-doc-value-m: 19px;
  --fz-doc-value-s: 18px; /* generic mobile rows */
  --lh-doc-prose: 1.5;
  --wt-registrar: 500;

  /* humane voice — Sora 300 */
  --fz-body-lg: 18px;
  --fz-plate-line: 17px;
  --fz-body: 16px;
  --fz-body-m: 15px;
  --fz-body-sm: 14px;
  --fz-body-xs: 13px;
  --lh-body: 1.6;
  --wt-body: 300;

  /* record voice — Space Mono */
  --fz-mono-10: 10px;
  --fz-mono-11: 11px;
  --fz-mono-12: 12px;
  --fz-mono-13: 13px;
  --fz-mono-14: 14px;
  --fz-mono-15: 15px;
  --fz-mono-16: 16px;
  --lh-mono: 1.6;
  --track-liturgy: 0.18em;   /* eyebrow labels */
  --track-form: 0.14em;      /* form labels */
  --track-record: 0.12em;    /* receipts, page-of */
  --track-receipt: 0.10em;
  --track-aside: 0.06em;     /* // asides // */
  --track-liturgy-m: 0.16em;

  /* ------------------------------------------------------------ motion */
  --dur-micro: 150ms;
  --ease-micro: cubic-bezier(0.16,1,0.3,1);
  --dur-hashlink: 400ms;
  --dur-drift: 30s;
  --dur-pulse-a: 4.1s;
  --dur-pulse-b: 3.7s;
  --dur-noise: 150ms;
  --ease-ambient: ease-in-out;
  --steps-noise: steps(2);

  /* ----------------------------------------------------- spacing steps */
  --sp-4: 4px;   --sp-6: 6px;   --sp-8: 8px;   --sp-12: 12px;  --sp-14: 14px;
  --sp-16: 16px; --sp-18: 18px; --sp-20: 20px;  --sp-22: 22px;
  --sp-24: 24px; --sp-26: 26px; --sp-28: 28px;  --sp-30: 30px;
  --sp-32: 32px; --sp-34: 34px; --sp-36: 36px;  --sp-38: 38px;
  --sp-40: 40px; --sp-42: 42px; --sp-44: 44px;  --sp-46: 46px;
  --sp-48: 48px; --sp-54: 54px; --sp-56: 56px;  --sp-60: 60px;
  --sp-62: 62px; --sp-68: 68px; --sp-84: 84px;  --sp-92: 92px;
  --sp-100: 100px; --sp-104: 104px; --sp-118: 118px; --sp-122: 122px;
  --sp-126: 126px; --sp-140: 140px;

  /* ------------------------------------------------------------ layout */
  --wrap-max: 1360px;
  --gutter: 60px;
  --gutter-m: 20px;
  --hero-h: 820px;
  --hero-h-m: 660px;
  --plate-h: 900px;
  --plate-h-m: 600px;
  --portrait: 600px;
  --plate-art: 760px;
  --plate-art-m: 430px;
  --doc-w-cert: 1240px;
  --doc-w-narrow: 880px;
  --doc-w-wide: 1080px;
  --hairline-w: 1px;
}