/* ==========================================================================
   NEON DRAFT — design tokens
   All color/spacing/type values used across the app MUST come from here.
   ========================================================================== */

:root {
  color-scheme: dark;

  /* Surfaces */
  --c-bg: #0a0a0a;
  --c-bg-deep: #060606;
  --c-panel: #101010;
  --c-panel-2: #151515;
  --c-panel-3: #1b1b1b;
  --c-overlay: rgba(4, 4, 4, 0.82);

  /* Lines */
  --c-line: #262626;
  --c-line-2: #333333;
  --c-line-strong: #454545;

  /* Gold */
  --c-gold: #d4a537;
  --c-gold-bright: #f0c25a;
  --c-gold-dim: #8a6c22;
  --c-gold-deep: #4a3a12;
  --c-gold-a10: rgba(212, 165, 55, 0.10);
  --c-gold-a20: rgba(212, 165, 55, 0.20);
  --c-gold-a35: rgba(212, 165, 55, 0.35);

  /* Text */
  --c-text: #f4f4f4;
  --c-text-2: #a8a8a8;
  --c-text-3: #6e6e6e;
  --c-text-inv: #0a0a0a;

  /* Tag colors */
  --c-prime: #d4a537;
  --c-firewall: #5a8fd1;
  --c-link: #9b6ad4;
  --c-ghost: #4fd1a8;
  --c-loud: #e0533d;

  /* Stat colors */
  --c-pwr: #e0a33d;
  --c-edge: #8fb8e6;
  --c-sync: #9b6ad4;
  --c-health: #5ec27a;
  --c-heat: #e0533d;

  /* Rarity tiers — Fortnite's ladder (names + colors) */
  --c-tier-common: #b0b0b0;
  --c-tier-uncommon: #3fd94a;
  --c-tier-rare: #3d9be9;
  --c-tier-epic: #b14fe0;
  --c-tier-legendary: #e8871e;

  /* Status */
  --c-ok: #5ec27a;
  --c-warn: #d4a537;
  --c-bad: #e0533d;

  /* Rank */
  --c-rank-s: #f0c25a;
  --c-rank-a: #d4a537;
  --c-rank-b: #a8a8a8;
  --c-rank-c: #7a7a7a;
  --c-rank-d: #4f4f4f;

  /* Glows */
  --glow-sm: 0 0 12px -4px var(--c-gold-a35);
  --glow-md: 0 0 22px -6px rgba(212, 165, 55, 0.55);
  --glow-lg: 0 0 46px -8px rgba(212, 165, 55, 0.45);

  /* Fonts */
  --font-display: "Oswald", "Arial Narrow", "Helvetica Neue Condensed", Impact, sans-serif;
  --font-body: "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;

  /* Type scale */
  --fs-display: clamp(2.75rem, 7vw, 4.75rem);
  --fs-h1: 2.25rem;
  --fs-h2: 1.4rem;
  --fs-h3: 1rem;
  --fs-label: 0.6875rem;
  --fs-body: 0.9375rem;
  --fs-small: 0.8125rem;
  --fs-stat-num: 2rem;
  --fs-stat-num-sm: 1.125rem;

  /* Spacing */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;

  /* Radii */
  --r-xs: 2px;
  --r-sm: 3px;
  --r-md: 6px;
  --r-lg: 10px;
  --r-pill: 999px;

  /* Borders */
  --bw: 1px;

  /* Motion */
  --dur-fast: 120ms;
  --dur: 180ms;
  --dur-slow: 320ms;
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
}