/* ===== ScrimVault Design Tokens — single source of truth =====
   Link this FIRST on every HTML entry point. All other stylesheets should
   reference these custom properties. No other file should re-declare :root
   color/font tokens.

   Palette philosophy:
     - Black-first surfaces (ink #050505 → surface #121418)
     - Ivory text (bone #f2efe8) for contrast against dark
     - Blood #e63946 = CTA, destructive, brand mark, loss
     - Cyan #00e5ff = active state, data highlight, links
     - Green/amber = results (win / mvp)

   Typography philosophy:
     - Barlow Condensed 700/900 = display (h1, stat numbers, section titles, buttons)
     - Inter 400-700 = UI body (paragraphs, labels, inputs, nav)
     - JetBrains Mono 400/500 = mono (tenant ids, timestamps, codes)
*/
:root {
  /* Surfaces */
  --ink: #050505;
  --surface: #121418;
  --surface-hi: #1a1d23;
  --surface-line: rgba(242, 239, 232, 0.08);
  --surface-line-strong: rgba(242, 239, 232, 0.18);

  /* Text */
  --bone: #f2efe8;
  --bone-mute: rgba(242, 239, 232, 0.66);
  --bone-faint: rgba(242, 239, 232, 0.40);

  /* Accents */
  --blood: #e63946;
  --cyan: #00e5ff;
  --green: #22c55e;
  --amber: #f59e0b;
  --study: #f97316;   /* orange used in study-context UI */

  /* Team sides */
  --blue-team: #3b82f6;
  --red-team: #e63946;

  /* Typography */
  --font-display: 'Barlow Condensed', 'Inter', sans-serif;
  --font-ui: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  /* Motion & shape */
  --radius-sm: 3px;
  --radius: 6px;
  --radius-lg: 8px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 150ms;
  --dur: 200ms;

  /* Back-compat aliases (kept temporarily so files not yet migrated keep working) */
  --bg-deep: var(--ink);
  --bg-main: var(--surface);
  --accent: var(--cyan);
  --accent-glow: rgba(0, 229, 255, 0.18);
  --border: var(--surface-line);
  --border-strong: var(--surface-line-strong);
  --text-primary: var(--bone);
  --text-secondary: var(--bone-mute);
  --text-muted: var(--bone-faint);
  --font-heading: var(--font-display);
  --font-body: var(--font-ui);
  --red-dim: rgba(230, 57, 70, 0.12);
  --surface-hover: var(--surface-hi);
}
