/* Amendment pitch deck — Living Document design tokens.
   ------------------------------------------------------------------
   The deck's shared token layer, loaded by every page BEFORE its own
   <style> block:

       <link rel="stylesheet" href="tokens.css">

   This file holds ONLY @font-face rules and custom properties. It
   deliberately declares no element or class rules: the mocks carry
   generic selectors (.card, .tag, .btn, .note, .seg …) and a shared
   stylesheet that styled elements would reach inside the phone frames,
   which are Apple's surfaces, not ours. Each page opts in by aliasing
   its own variables to these — see any page's :root.

   Faces are SELF-HOSTED (fonts/, latin + latin-ext woff2 subsets) rather
   than pulled from Google. Same-origin means the deck renders offline,
   `npm run verify` doesn't fail on a network hiccup (it treats any failed
   request as a page failure), and no third party sees who we show it to.

   Readex Pro and Newsreader are variable. Set an axis stop explicitly —
   see --serif-display / --serif-text and the HEXP ladder below; the opsz
   axis defaults high, and a Scotch roman at the display end has hairlines
   far too fine for 12px chrome.
   ------------------------------------------------------------------ */

@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-normal-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-normal-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-mono-normal-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-mono-normal-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-italic-200_800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-italic-200_800-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-normal-200_800-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/newsreader-normal-200_800-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Readex Pro';font-style:normal;font-weight:160 700;font-display:swap;src:url(fonts/readex-pro-normal-160_700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Readex Pro';font-style:normal;font-weight:160 700;font-display:swap;src:url(fonts/readex-pro-normal-160_700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{
  /* ---------- INK — Midnight Indigo. The institutional primary. ----------
     Active nav, selected state, default button, the user's own trail. */
  --primary-light:#334155;          /* slate-700 */
  --primary:#1e293b;                /* slate-800 */
  --primary-dark:#0f172a;           /* slate-900 */
  --primary-plate:linear-gradient(135deg,#334155,#1e293b);
  --primary-plate-hover:linear-gradient(135deg,#475569,#334155);

  /* ---------- ACTION — Momentum green ----------
     One accent for intent AND assent: CTAs, co-signs, counts, thresholds.
     The label is INK, not white. Do not move the lightness without
     re-measuring both labels — between ~L.55 and L.60 neither clears 4.5:1. */
  --action:oklch(.66 .148 160);
  --action-hover:oklch(.72 .150 161);
  --action-active:oklch(.60 .145 160);
  --action-label:rgb(0 0 0 / 87%);
  --action-wash:oklch(.66 .148 160 / .10);   /* green as a report, not a plate */
  --action-edge:oklch(.66 .148 160 / .30);

  /* ---------- FUNCTIONAL — Slate Blue. Attention without alarm. ----------
     Focus rings, loading, icon-button hover. Carries no brand meaning. */
  --slate-light:#94a3b8;            /* slate-400 */
  --slate:#64748b;                  /* slate-500 */
  --slate-dark:#475569;             /* slate-600 */

  /* ---------- SEMANTIC — conventional meanings only ---------- */
  --success:#047857;                /* emerald-700 — ink */
  --success-soft:#10b981;           /* emerald-500 — fills, badges */
  --warning:#b45309;                /* amber-700 */
  --warning-soft:#f59e0b;           /* amber-500 */
  --danger:#dc2626;                 /* red-600 — the only warm left */
  --danger-soft:#ef4444;            /* red-500 */

  /* ---------- NEUTRAL — the paper ---------- */
  --zinc-50:#fafafa;  --zinc-100:#f4f4f5; --zinc-200:#e4e4e7;
  --zinc-400:#a1a1aa; --zinc-500:#71717a; --zinc-700:#3f3f46;
  --zinc-800:#27272a; --zinc-900:#18181b;

  /* ---------- TEXT — opacity on black/white, Apple HIG three rungs ----------
     Safe here because nothing sets bare text inside an aurora band.
     38% is decorative only — it clears 4.5:1 nowhere and never did. */
  --ink-1:rgb(0 0 0 / 87%);
  --ink-2:rgb(0 0 0 / 55%);
  --ink-3:rgb(0 0 0 / 38%);
  --ink-1-dk:rgb(255 255 255 / 87%);
  --ink-2-dk:rgb(255 255 255 / 55%);
  --ink-3-dk:rgb(255 255 255 / 38%);

  --hairline:rgb(0 0 0 / 5%);
  --subtle:rgb(0 0 0 / 10%);
  --hairline-dk:rgb(255 255 255 / 20%);
  --subtle-dk:rgb(255 255 255 / 10%);

  /* ---------- BACKGROUND — the Blue Hour ----------
     Three stops, indigo / slate / warm parchment lowlight, over canvas. */
  --canvas:#f4f4f5;
  --canvas-dk:#18181b;
  --aurora:
    radial-gradient(ellipse 72% 55% at 15% 8%,  oklch(0.88 0.05 250 / 0.40), transparent),
    radial-gradient(ellipse 58% 46% at 85% 20%, oklch(0.90 0.04 270 / 0.32), transparent),
    radial-gradient(ellipse 60% 50% at 50% 90%, oklch(0.94 0.03  60 / 0.28), transparent);
  --aurora-dk:
    radial-gradient(ellipse 72% 55% at 15% 8%,  oklch(0.30 0.08 250 / 0.45), transparent),
    radial-gradient(ellipse 58% 46% at 85% 20%, oklch(0.25 0.06 270 / 0.35), transparent),
    radial-gradient(ellipse 60% 50% at 50% 90%, oklch(0.40 0.03  60 / 0.20), transparent);

  /* ---------- CANVASES — opaque paper, distinct from glass ---------- */
  --paper-cream:oklch(0.965 0.012 85);
  --paper-parchment:oklch(0.955 0.018 80);

  /* ---------- TYPE ---------- */
  --sans:'Readex Pro',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --serif:'Newsreader',ui-serif,Georgia,serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  /* font-variation-settings values — ALWAYS set an optical stop */
  --serif-display:"opsz" 60,"wght" 800;   /* headings, titles */
  --serif-section:"opsz" 40,"wght" 800;   /* section heads */
  --serif-text:"opsz" 16,"wght" 450;      /* body, analysis */
  --serif-quote:"opsz" 24,"wght" 400;     /* quoted voice, 18px and up */
  --hexp-2:"HEXP" 2;                      /* body copy */
  --hexp-60:"HEXP" 60;                    /* institutional chrome labels */
  --hexp-80:"HEXP" 80;                    /* display stat numerals */

  /* one sans weight scale — no parallel dark scale */
  --w-light:295; --w-normal:362; --w-medium:430;
  --w-semibold:497; --w-bold:565; --w-extrabold:632; --w-black:700;

  /* ---------- SHAPE — sharper for chrome, softer for floating ---------- */
  --r-sm:.25rem;    /* inputs, pills, chrome fragments */
  --r-md:.5rem;     /* buttons, cards, most content surfaces */
  --r-lg:.75rem;    /* modals, FAB, floating overlays */
  --r-full:9999px;

  /* ---------- ELEVATION — five tiers, shadow ink is slate-900 ---------- */
  --e-whisper:0 1px 2px 0 rgb(15 23 42 / .04),0 1px 1px -1px rgb(15 23 42 / .04);
  --e-raised:0 4px 6px -1px rgb(15 23 42 / .12),0 2px 4px -2px rgb(15 23 42 / .12);
  --e-floating:0 20px 25px -5px rgb(15 23 42 / .18),0 8px 10px -6px rgb(15 23 42 / .18);
  --e-chrome:0 8px 16px -4px rgb(15 23 42 / .12),0 3px 6px -3px rgb(15 23 42 / .12);

  /* ---------- MOTION ---------- */
  --t-fast:150ms; --t-base:200ms; --t-slow:300ms;
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-emph:cubic-bezier(.2,0,0,1);
  /* Transition ONLY these. Never transform — no lift, no scale, no
     brightness: they promote a compositing layer and wobble the glyphs. */
  --t-props:background-color,background-image,box-shadow,color,border-color,opacity;

  /* ---------- FOCUS — slate, always. The system listening. ---------- */
  --focus:#64748b;
  --focus-dk:#94a3b8;
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}
