/**
 * Kre8Ωr — Global Design Tokens
 * Import this as the FIRST stylesheet on every page.
 * Pages may override :root variables in their own <style> blocks.
 *
 * SINE RESISTENTIA — Create without limits. Distribute without resistance.
 */

:root {
  /* ── FONTS ── */
  --font-head: 'Bebas Neue', sans-serif;
  --font-body: 'DM Sans', sans-serif;

  /* ── BRAND ── */
  --teal: #3ecfb2;
  --teal-dim: #2aa893;
  --teal-hover: #4ddfc4;
  --teal-glow: #1c3234;        /* teal dark — B>G so reads teal, not hunter green */
  --teal-glow-strong: #223e44; /* teal medium — B>G */
  --teal-border: #254e52;      /* teal border — B>G so reads teal not hunter green */

  /* ── SURFACES ── */
  --bg: #0f0f0f;               /* true neutral black — R=G=B, zero cast */
  --bg-card: #181818;          /* true neutral dark — zero green cast */
  --bg-card-2: #1e1e1e;
  --surface: #181818;
  --surface-2: #1e1e1e;
  --surface-3: #272727;

  /* ── BORDERS ── */
  --border: #2c2c2c;           /* true neutral grey — no green tint */
  --border-bright: #3c3c3c;

  /* ── TEXT ── */
  --text: #e8ebe6;
  --text-mid: #8a9487;
  --text-dim: #8a9487;
  --text-dimmer: #4e5349;
  --text-faint: #3a3e38;

  /* ── STATUS COLORS ── */
  --green: #5cba8a;
  --green-glow: #1c2e24;       /* solid equiv of rgba(92,186,138,0.10) */
  --green-border: #2c4838;     /* solid equiv of rgba(92,186,138,0.30) */
  --amber: #f0b942;
  --amber-glow: #2e2618;       /* solid equiv of rgba(240,185,66,0.10) */
  --amber-border: #4a3c18;     /* solid equiv of rgba(240,185,66,0.30) */
  --red: #e05c5c;
  --red-glow: #2e1e1e;         /* solid equiv of rgba(224,92,92,0.10) */
  --red-border: #4a2e2e;       /* solid equiv of rgba(224,92,92,0.30) */
  --blue: #5b9cf6;
  --blue-glow: #1c2840;        /* solid equiv of rgba(91,156,246,0.10) */
  --purple: #a78bfa;
  --purple-glow: #282040;      /* solid equiv of rgba(167,139,250,0.10) */
  --purple-border: #3e3060;    /* solid equiv of rgba(167,139,250,0.30) */

  /* ── LAYOUT ── */
  --nav-height: 54px;
  --page-padding: 24px;
  --card-radius: 10px;
  --radius: 10px;
  --radius-sm: 6px;
}