/* tokens.css — Direction 02 · Crypto / Fintech (CoinDesk / Decrypt)
 * Из const a02 = { ... } в a02-crypto.jsx
 */

:root {
  /* ── Палитра (dark theme) ──────────────────────────────────────────── */
  --color-bg:        #06080F;
  --color-surf:      #0E1320;
  --color-surf-2:    #161D2E;
  --color-ink:       #E5EBF5;
  --color-ink-2:     #9AA4BD;
  --color-ink-3:     #5B6480;
  --color-rule:      #1E2638;

  --color-neon:      #00E0A4;
  --color-neon-2:    #FFD23F;
  --color-red:       #FF3F6E;
  --color-blue:      #3D7CFF;
  --color-purple:    #A87FFF;

  /* Алиасы */
  --color-text:        var(--color-ink);
  --color-text-muted:  var(--color-ink-3);
  --color-border:      var(--color-rule);
  --color-good:        var(--color-neon);
  --color-bad:         var(--color-red);

  /* RGB-варианты для rgb()/rgba() с opacity */
  --neon-rgb:   0, 224, 164;
  --red-rgb:    255, 63, 110;
  --neon2-rgb:  255, 210, 63;
  --purple-rgb: 168, 127, 255;
  --blue-rgb:   61, 124, 255;

  /* ── Шрифты ────────────────────────────────────────────────────────── */
  --font-body:    'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-display: 'Geist', 'Inter', system-ui, sans-serif;
  --font-mono:    'IBM Plex Mono', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* ── Размеры ───────────────────────────────────────────────────────── */
  --fs-h1:     clamp(1.875rem, 1rem + 4.4vw, 4rem);
  --fs-h2:     clamp(1.375rem, 1rem + 1.8vw, 2.25rem);
  --fs-h3:     clamp(1.125rem, 1rem + 0.6vw, 1.5rem);
  --fs-lede:   clamp(1rem, 0.95rem + 0.5vw, 1.1875rem);
  --fs-body:   1.0625rem;
  --fs-small:  0.8125rem;
  --fs-mono:   0.75rem;
  --fs-mini:   0.625rem;
  --fs-micro:  0.5625rem;

  /* ── Отступы ───────────────────────────────────────────────────────── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 2rem;
  --space-8: 3rem;
  --space-9: 4rem;

  /* ── Радиусы ───────────────────────────────────────────────────────── */
  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 8px;
  --radius-xl: 14px;
  --radius-pill: 999px;

  /* ── Тени и glow ───────────────────────────────────────────────────── */
  --shadow-cta: 0 -8px 24px rgba(0, 224, 164, 0.15);
  --glow-neon:  0 0 8px rgba(0, 224, 164, 0.6);
  --glow-score: 0 0 40px rgba(0, 224, 164, 0.4);

  /* ── Layout ────────────────────────────────────────────────────────── */
  --container-max:   1280px;
  --container-px:    var(--space-4);
  --container-px-lg: 3.5rem;
  --aside-width:     280px;

  /* ── Transitions ───────────────────────────────────────────────────── */
  --transition-fast: 120ms ease;
  --transition-base: 220ms ease;
}

/* Score-bar component */
.score-bar { --score-bar-track: var(--color-bg); --score-bar-height: 6px; }