/* ============================================================
   TFL Brand Tokens — single source of truth for site-wide
   design constants.
   ------------------------------------------------------------
   Load this BEFORE any stylesheet or inline <style> that consumes
   the tokens. Propagated to the public pages by
   scripts/apply-arena-chrome.mjs (same mechanism as the chrome);
   the weapon-page template links it directly.

   Consumers alias their local vars to these, e.g.
     --bg: var(--tfl-bg-0, #0A0C14);
   The fallback is defensive (page still renders if this file is
   ever unlinked) and MUST equal the token value at alias time —
   value changes happen HERE, never in a fallback.

   /css/* is cached 1yr immutable (vercel.json): every edit to this
   file requires bumping ?v=tokens-N on ALL referencing pages AND in
   scripts/apply-arena-chrome.mjs + scripts/automation/gen-weapon-pages.mjs.

   NOT yet consuming this sheet (still self-hosted literals):
   v2/css/arena.css (homepage hero/slot — phase 4), patch-notes,
   ragequit, squad, wt-progress, stats dashboard (phase 3 retints).
   ============================================================ */
:root {
  /* ---- Stage (arena red/black — the brand's poster surface) ---- */
  --tfl-stage: #08080a;
  --tfl-red: #e4032e;        /* THE brand red (Embark marketing red) */
  --tfl-red-hot: #ff2b3d;
  --tfl-red-deep: #8f0f1f;
  --tfl-white: #f4f4f5;
  --tfl-chrome-muted: #9a9aa3;

  /* ---- Intel canvas (data/reference pages) ---- */
  --tfl-bg-0: #0A0C14;
  --tfl-bg-1: #0D0F1A;
  --tfl-bg-2: #141826;
  --tfl-bg-3: #1A1F30;
  --tfl-line: rgba(255, 255, 255, 0.07);
  --tfl-line-2: rgba(255, 255, 255, 0.12);
  --tfl-surface: rgba(255, 255, 255, 0.028);
  --tfl-surface-2: rgba(255, 255, 255, 0.05);
  --tfl-text-0: #F5F7FB;
  --tfl-text-1: #D6DAE6;
  --tfl-text-2: #8C92A8;

  /* ---- Intel accents ---- */
  --tfl-indigo: #818CF8;
  --tfl-indigo-deep: #6366F1;
  --tfl-cyan: #22D3EE;
  --tfl-violet: #A78BFA;

  /* ---- Signal colors (tiers, deltas, difficulty) ----
     --tfl-danger is the data-red; it is DELIBERATELY distinct from
     the brand red --tfl-red so tier-D rows never read as brand. */
  --tfl-green: #22c55e;
  --tfl-blue: #3b82f6;
  --tfl-yellow: #eab308;
  --tfl-orange: #f97316;
  --tfl-danger: #ef4444;
  --tfl-gray: #71717a;
  --tfl-tier-s: var(--tfl-green);
  --tfl-tier-a: var(--tfl-blue);
  --tfl-tier-b: var(--tfl-yellow);
  --tfl-tier-c: var(--tfl-orange);
  --tfl-tier-d: var(--tfl-danger);
  --tfl-tier-f: var(--tfl-gray);

  /* ---- Class colors (canonical values from the arena) ----
     NOTE: intel surfaces currently tint Heavy #FB923C — a known
     divergence, unify only as a deliberate (visible) change. */
  --tfl-class-light: #37d8f0;
  --tfl-class-medium: #ffb800;
  --tfl-class-heavy: #ff3b5b;

  /* ---- Type ---- */
  --tfl-font-display: "Barlow Condensed", "Inter", sans-serif;
  --tfl-font-body: "Inter", system-ui, -apple-system, sans-serif;
  --tfl-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;

  /* ---- Motion ---- */
  --tfl-ease: cubic-bezier(0.16, 1, 0.3, 1);
}