/* ==========================================================================
   COMBINE-FC — design tokens
   All color/spacing/type values used across pitch.html MUST come from here.
   Independent of css/tokens.css (NEON DRAFT). Do not import that file.
   ========================================================================== */

:root {
  color-scheme: dark;

  /* Surfaces */
  --c-bg: #0a1410;
  --c-bg-deep: #060d09;
  --c-panel: #0f1d17;
  --c-panel-2: #14241d;
  --c-panel-3: #1a2d24;
  --c-overlay: rgba(4, 10, 7, 0.86);

  /* Turf (pitch decor — used for striped backgrounds, card grounds) */
  --c-turf: #123021;
  --c-turf-2: #0e2619;
  --c-turf-line: rgba(238, 244, 238, 0.14);
  --grad-turf: repeating-linear-gradient(100deg, var(--c-turf) 0 42px, var(--c-turf-2) 42px 84px);
  --grad-card: linear-gradient(165deg, var(--c-panel-3) 0%, var(--c-panel) 62%, var(--c-bg-deep) 100%);

  /* Lines */
  --c-line: #22382d;
  --c-line-2: #2e493b;
  --c-line-strong: #3f5f4e;

  /* Chalk (primary accent) */
  --c-chalk: #f2f7f2;
  --c-chalk-bright: #ffffff;
  --c-chalk-dim: #9aa89f;
  --c-chalk-deep: #4a574f;
  --c-chalk-a10: rgba(242, 247, 242, 0.10);
  --c-chalk-a20: rgba(242, 247, 242, 0.20);
  --c-chalk-a35: rgba(242, 247, 242, 0.35);

  /* Lime (secondary accent — floodlight / active state) */
  --c-lime: #c6f24a;
  --c-lime-bright: #e2ff85;
  --c-lime-dim: #7f9d24;
  --c-lime-deep: #3a4a12;
  --c-lime-a10: rgba(198, 242, 74, 0.10);
  --c-lime-a20: rgba(198, 242, 74, 0.20);
  --c-lime-a35: rgba(198, 242, 74, 0.35);

  /* Text */
  --c-text: #eef3ee;
  --c-text-2: #a3b2a8;
  --c-text-3: #6b7a70;
  --c-text-inv: #08120d;

  /* Position-group colors */
  --c-pos-gk: #f2c14e;
  --c-pos-def: #4a72e8;
  --c-pos-mid: #3fd18a;
  --c-pos-att: #ff5a4e;

  /* Stat colors */
  --c-pac: #ffb02e;
  --c-sho: #ff5a4e;
  --c-pas: #4ec9f0;
  --c-dri: #b57bff;
  --c-def: #4a72e8;
  --c-phy: #f472b6;
  --c-gkc: #7ef0c0;

  /* Status */
  --c-ok: #4fd18a;
  --c-warn: #ffb02e;
  --c-bad: #ff5a4e;

  /* Rating tiers */
  --c-tier-elite: #ffd76a;
  --c-tier-gold: #e0b84a;
  --c-tier-silver: #c8d0d4;
  --c-tier-bronze: #c08050;
  --c-tier-common: #6f8078;

  /* Glows / shadows */
  --glow-sm: 0 0 12px -4px var(--c-chalk-a35);
  --glow-md: 0 0 22px -6px rgba(242, 247, 242, 0.50);
  --glow-lg: 0 0 46px -8px rgba(198, 242, 74, 0.38);
  --shadow-card: 0 18px 42px -18px rgba(0, 0, 0, 0.85);
  --shadow-inset: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);

  /* Fonts */
  --font-display: "Archivo Black", "Arial Black", "Helvetica Neue", Impact, sans-serif;
  --font-kit: "Anton", "Archivo Black", "Arial Narrow", 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(3rem, 8vw, 5.5rem);
  --fs-h1: 2.5rem;
  --fs-h2: 1.5rem;
  --fs-h3: 1.0625rem;
  --fs-label: 0.6875rem;
  --fs-body: 0.9375rem;
  --fs-small: 0.8125rem;
  --fs-ovr: clamp(3.25rem, 9vw, 5rem);
  --fs-kit-num: 2.25rem;
  --fs-stat-num: 1.75rem;
  --fs-stat-num-sm: 1.0625rem;

  /* Tracking (kit typography helper) */
  --ls-tight: -0.02em;
  --ls-label: 0.16em;
  --ls-kit: 0.06em;

  /* 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: 3px;
  --r-sm: 5px;
  --r-md: 8px;
  --r-lg: 14px;
  --r-pill: 999px;

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

  /* Motion */
  --dur-fast: 110ms;
  --dur: 200ms;
  --dur-slow: 420ms;
  --dur-reveal: 700ms;
  --ease: cubic-bezier(0.22, 0.8, 0.28, 1);
  --ease-pop: cubic-bezier(0.2, 1.4, 0.4, 1);
}