/* ════════════════════════════════════════════════════════════
   tokens.css — "Lost Signal Garden" design tokens
   ════════════════════════════════════════════════════════════ */

/* ── self-hosted fonts (downloaded from Google Fonts, served locally) ── */
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-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;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-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;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500-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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-700-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-700-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-700-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-700-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-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;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/press-start-2p-400-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/press-start-2p-400-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/press-start-2p-400-greek.woff2') format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/press-start-2p-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;
}
/* latin */
@font-face {
  font-family: 'Press Start 2P';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/press-start-2p-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;
}

:root {
  /* ════ Family A · deep shadow base (60%: bg, night, shadow masses) ════ */
  --void-black:     #020612;
  --midnight-navy:  #071520;
  --deep-petrol:    #0E222B;
  --charcoal-teal:  #1A242D;
  --blue-slate:     #293841;

  /* ════ Family B · foliage greens (20%: vines, moss, 2nd surfaces) ════ */
  --forest-teal:    #54756B;
  --moss-green:     #58806E;
  --dusty-sage:     #6D726C;   /* decorative only — fails contrast as text */
  --faded-euc:      #848B73;   /* foliage/decorative (DESIGN.md Family B) — not for text */
  --mist-blue:      #8EAAB8;   /* secondary-text workhorse (≥4.5:1 on every surface) */
  --plant-shadow:   #203134;

  /* ════ Family C · warm architecture (12%: clay, plaster, warm light) ════ */
  --dusty-brick:    #8D6150;
  --warm-clay:      #AA8066;
  --terracotta:     #C89A76;
  --peach-plaster:  #DCA981;   /* dusty per the Decay Rule (was a saturated #FF9E8C) */
  --sunset-cream:   #E4BC93;

  /* ════ Family D · dusk accents (6%: THE emotional colors) ════ */
  --coral-cloud:    #FC7E6A;
  --muted-salmon:   #DD8170;
  --rose-red:       #D74F54;
  --mauve-shadow:   #5C333B;
  --dusty-plum:     #3F3035;

  /* ════ Family E · CRT / signal neon (2%: rare electricity) ════ */
  --signal-cyan:    #16D9B0;
  --crt-green:      #1ADB3C;
  --signal-yellow:  #96CB2C;
  --broadcast-mag:  #BE1289;
  --warning-red:    #B4251D;

  /* ════ Semantic aliases — the API components consume ════ */
  --bg:             var(--midnight-navy);
  --bg-deep:        var(--void-black);
  --surface:        var(--charcoal-teal);
  --surface-raised: var(--blue-slate);
  --surface-sunk:   var(--deep-petrol);
  --surface-foliage: rgba(84, 117, 107, 0.12);

  --ink:            #C9D4DC;
  --ink-strong:     #E8F0F6;
  --muted:          var(--mist-blue);
  --muted-deep:     #9AA89E;   /* desaturated sage, ≥4.5:1 on every surface (label floor) */
  --label-2:        var(--muted-deep);
  --line:           var(--blue-slate);
  --line-soft:      var(--deep-petrol);

  --accent:         var(--coral-cloud);
  --accent-2:       var(--peach-plaster);
  --signal:         var(--signal-cyan);
  --signal-alt:     var(--signal-cyan);
  --danger:         var(--rose-red);
  --success:        var(--moss-green);

  /* ════ Legacy Campfire names → Lost Signal Garden (drop-in, zero breakage) ════ */
  --campfire-gold:  var(--coral-cloud);
  --ember-red:      var(--rose-red);
  --forest-deep:    var(--moss-green);
  --sky-clear:      var(--signal-cyan);
  --parchment:      var(--midnight-navy);
  --warm-ink:       #C9D4DC;
  --hearthstone:    var(--faded-euc);
  --cobblestone:    var(--blue-slate);
  --candlelight:    var(--charcoal-teal);

  /* ════ Typography — two faces only ════ */
  /* Press Start 2P → H1 / H2 only.  JetBrains Mono → everything else. */
  --font-display: 'Press Start 2P', monospace;          /* H1 / H2 */
  --font-pixel:   'JetBrains Mono', Menlo, monospace;   /* sub-heads (h3/h4), labels, UI */
  --font-body:    'JetBrains Mono', Menlo, monospace;   /* prose / running body */
  --font-mono:    'JetBrains Mono', Menlo, monospace;   /* code, stats, meta */
  --font-footer:  'JetBrains Mono', Menlo, monospace;   /* terminal / UI labels */

  /* fluid type scale — h1/h2 sized for Press Start 2P (≈2× wider than prose) */
  --fs-display: clamp(28px, 6vw, 52px);
  --fs-h1:      clamp(18px, 3vw, 28px);
  --fs-h2:      clamp(13px, 2vw, 17px);
  --fs-h3:      14px;
  --fs-body:    16px;
  --fs-small:   13px;
  --fs-label:   11px;   /* label floor — nothing textual renders below this */

  /* ════ Spacing (4px rhythm) ════ */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-6: 24px; --sp-8: 32px; --sp-12: 48px; --sp-16: 64px;

  /* ════ Radius — pixel with painterly softness ════ */
  --r-0: 0px;
  --r-1: 4px;
  --r-2: 8px;
  --r-3: 12px;
  --r-pill: 999px;

  /* ════ Easing ════ */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-crt:    cubic-bezier(0.2, 0.9, 0.1, 1);
  --ease-tune:   cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 0.15s; --dur-base: 0.28s; --dur-slow: 0.5s;
  --dur-slower: 0.8s; --dur-ambient: 2.4s;

  /* ════ Elevation = glow, not drop shadow (dark UI) ════ */
  --glow-coral: 0 0 0 1px rgba(252, 126, 106, 0.45),
                0 0 18px rgba(252, 126, 106, 0.22),
                0 0 2px rgba(252, 126, 106, 0.60);

  --glow-signal: 0 0 0 1px rgba(22, 217, 176, 0.55),
                 0 0 22px rgba(22, 217, 176, 0.30),
                 inset 0 0 12px rgba(22, 217, 176, 0.10);

  --raise-peach: inset 0 1px 0 rgba(228, 188, 147, 0.06),
                 0 8px 28px rgba(2, 6, 18, 0.55);

  --glow-danger: 0 0 0 1px rgba(215, 79, 84, 0.55), 0 0 16px rgba(215, 79, 84, 0.25);

  /* legacy shadow names */
  --torchlight-glow: var(--glow-coral);
  --ground-shadow:   0 2px 0 rgba(2, 6, 18, 0.55);
}
