/* ═══════════════════════════════════════════════════════════════
   MISE — DESIGN TOKENS  ·  "Editorial Noir"
   Ink on paper. Colour earns its place.
═══════════════════════════════════════════════════════════════ */
/* Nunito + DM Mono are embedded (base64 woff2) in css/fonts.css — no network needed. */
:root {
  /* ── Ink & Paper (the only greys the UI is allowed) ── */
  --ink:        #0a0a0a;   /* near-black — primary text, fills   */
  --ink-2:      #2e2e2b;   /* secondary text                     */
  --ink-3:      #6b6b66;   /* tertiary / captions                */
  --ink-4:      #9a9a93;   /* disabled / hints                   */
  --line:       #e4e3dc;   /* hairlines                          */
  --line-2:     #efeee8;   /* faint fills / hover                */
  --paper:      #faf9f6;   /* page                               */
  --paper-2:    #f3f2ec;   /* recessed surfaces                  */
  --card:       #ffffff;   /* raised surfaces                    */

  /* ── Colour — ONLY for data, alerts, live pulses ── */
  --data-1:     #1b6ef3;   /* primary data / info                */
  --data-2:     #8b5cf6;   /* secondary series                   */
  --live:       #16a34a;   /* good / live / up                   */
  --warn:       #d97706;   /* attention / prep-now               */
  --crit:       #dc2626;   /* critical / sellout / down          */
  --gold:       #b08d4f;   /* premium accent (rare)              */
  --live-glow:  rgba(22,163,74,.16);
  --warn-glow:  rgba(217,119,6,.14);
  --crit-glow:  rgba(220,38,38,.14);

  /* ── Type ── Nunito throughout; hierarchy carried by weight, size, spacing.
     'display' is Nunito at its heaviest (900); UI at 400–800. ── */
  --serif: 'Nunito', ui-sans-serif, system-ui, sans-serif;   /* display role */
  --sans:  'Nunito', ui-sans-serif, system-ui, sans-serif;   /* UI/body role */
  --mono:  'DM Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* fluid display scale */
  --t-hero:   clamp(2.6rem, 1.4rem + 4.2vw, 5.2rem);
  --t-h1:     clamp(1.9rem, 1.2rem + 2.4vw, 3.1rem);
  --t-h2:     clamp(1.35rem, 1rem + 1.1vw, 1.9rem);
  --t-h3:     1.18rem;
  --t-body:   0.95rem;
  --t-sm:     0.82rem;
  --t-xs:     0.72rem;
  --t-2xs:    0.635rem;

  /* ── Space (8px system) ── */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px; --s5: 24px;
  --s6: 32px; --s7: 48px; --s8: 64px; --s9: 96px; --s10: 128px;

  /* ── Radius ── */
  --r-sm: 8px; --r-md: 14px; --r-lg: 20px; --r-xl: 28px; --r-full: 999px;

  /* ── Elevation (soft, paper-like) ── */
  --e1: 0 1px 2px rgba(10,10,10,.04), 0 1px 1px rgba(10,10,10,.03);
  --e2: 0 4px 14px rgba(10,10,10,.06), 0 2px 4px rgba(10,10,10,.04);
  --e3: 0 18px 48px rgba(10,10,10,.10), 0 6px 16px rgba(10,10,10,.06);
  --e-ink: 0 12px 30px rgba(10,10,10,.28);

  /* ── Motion — the soul of the app ── */
  --ease-out:    cubic-bezier(.16,1,.3,1);      /* decel — reveals   */
  --ease-spring: cubic-bezier(.34,1.56,.64,1);  /* overshoot — pops  */
  --ease-inout:  cubic-bezier(.65,0,.35,1);     /* page transitions  */
  --d-fast: .18s; --d-med: .34s; --d-slow: .6s; --d-page: .5s;
}

/* Dark is a first-class citizen: invert ink & paper, keep colour semantics */
:root[data-theme="dark"] {
  --ink:        #f6f5f0;
  --ink-2:      #cbcac3;
  --ink-3:      #97968f;
  --ink-4:      #6a6963;
  --line:       #2a2a27;
  --line-2:     #201f1d;
  --paper:      #0c0c0b;
  --paper-2:    #131311;
  --card:       #17171500;
  --card:       #171715;
  --data-1:     #4f97ff;
  --data-2:     #a78bfa;
  --live:       #34d17f;
  --warn:       #f0a83a;
  --crit:       #f4645f;
  --gold:       #cba967;
  --e1: 0 1px 2px rgba(0,0,0,.4);
  --e2: 0 4px 16px rgba(0,0,0,.5);
  --e3: 0 20px 50px rgba(0,0,0,.6);
  --e-ink: 0 14px 34px rgba(0,0,0,.7);
}