/* The Stock Forge — core design tokens (shared foundation).
   Loaded via <link href="/shared/tokens.css?v=__ASSETVER__"> before each surface stylesheet.
   Dashboard + marketing semantic layers live in styles.css / site.css :root. */

:root {
  /* Brand palette */
  --bg: #0a0d12;
  --panel: #141922;
  --panel-2: #1b2230;
  --border: #283344;
  --text: #eef3fb;
  --muted: #9fb0c9;
  --accent: #ff7a18;
  --accent-2: #ff3d2e;
  --ember: #ffb347;
  --steel: #5b8cff;
  --on-accent: #0a0d12;
  --good: #2fbf71;
  --warn: #f5a623;
  --bad: #ef4565;

  /* Gaps / extended tints (value-preserving promotions) */
  --danger: #e5484d;
  --text-soft: #d7e0ee;
  --code-bg: #0d1118;
  --border-hover: #36465c;
  --ops-info: #58a6ff;
  --ops-info-2: #79b8ff;
  --good-bright: #7ee3ad;
  --warn-bright: #ffce85;
  --bad-bright: #ff9ea2;
  --selective: #9bb6ff;
  --admin: #b3a4ff;
  --telegram: #38c3d6;
  --danger-strong-end: #c81d4e;
  --idx-sp500: #9db8ff;
  --idx-ndx: #c2b4ff;
  --analyst-strong-buy: #16a34a;
  --analyst-buy: #4ade80;
  --analyst-hold: #6b7280;
  --analyst-sell: #f59e0b;
  --analyst-strong-sell: #dc2626;

  /* Cycle Watch gauge arc (seven equal phase bands) */
  --cycle-seg-recovery-from: #22c55e;
  --cycle-seg-recovery-to: #2fbf71;
  --cycle-seg-early-expansion-from: #2dd4a8;
  --cycle-seg-early-expansion-to: #0ea5e9;
  --cycle-seg-mid-expansion-from: #38bdf8;
  --cycle-seg-mid-expansion-to: #34d399;
  --cycle-seg-late-expansion-from: #a3e635;
  --cycle-seg-late-expansion-to: #fbbf24;
  --cycle-seg-peak-watch-from: #fbbf24;
  --cycle-seg-peak-watch-to: #f97316;
  --cycle-seg-recession-warning-from: #fb923c;
  --cycle-seg-recession-warning-to: #ef4565;
  --cycle-seg-recession-from: #ef4565;
  --cycle-seg-recession-to: #dc2626;

  /* Radius scale */
  --radius-2xs: 4px;
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-2xl: 16px;
  --radius-pill: 999px;

  /* Spacing scale */
  --space-2xs: 4px;
  --space-xs: 6px;
  --space-sm: 8px;
  --space-md: 10px;
  --space-lg: 12px;
  --space-lg-plus: 14px;
  --space-xl: 16px;
  --space-2xl: 18px;
  --space-2xl-plus: 20px;
  --space-3xl: 22px;
  --space-4xl: 24px;
  --space-5xl: 28px;

  /* Page background gradients (surface CSS references these — values live here). */
  --bg-gradient-accent: rgba(255, 122, 24, .14);
  --bg-gradient-mid: #131a26;
  --bg-gradient-blue: rgba(91, 140, 255, .08);
  --nav-backdrop: rgba(10, 13, 18, .8);
  --band-alt-top: rgba(20, 25, 34, .6);
  --band-alt-end: rgba(10, 13, 18, 0);
  --band-border: rgba(40, 51, 68, .5);
  --gauge-card-bg: rgba(15, 19, 27, .92);

  /* Elevation */
  --shadow-card: 0 6px 18px rgba(0, 0, 0, .25);
  --shadow: 0 10px 30px rgba(0, 0, 0, .45);
  --shadow-lg: 0 18px 50px rgba(0, 0, 0, .45);

  /* Motion */
  --dur-fast: .05s;
  --dur: .15s;
  --dur-slow: .25s;

  /* Breakpoint / touch / safe-area (reference-only; @media uses literal px) */
  --bp-mobile: 768px;
  --bp-narrow: 480px;
  --touch-min: 44px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}

/* Light theme — user-selectable in Account → Appearance (default remains dark). */
html[data-theme="light"] {
  --bg: #f3f5f9;
  --panel: #ffffff;
  --panel-2: #eef2f7;
  --border: #c9d4e3;
  --text: #111820;
  --muted: #566274;
  --accent: #e85d04;
  --accent-2: #d62828;
  --ember: #f77f00;
  --steel: #2563eb;
  --on-accent: #ffffff;
  --good: #15803d;
  --warn: #b45309;
  --bad: #be123c;

  --danger: #dc2626;
  --text-soft: #334155;
  --code-bg: #eef2f7;
  --border-hover: #94a3b8;
  --ops-info: #2563eb;
  --ops-info-2: #3b82f6;
  --good-bright: #16a34a;
  --warn-bright: #d97706;
  --bad-bright: #e11d48;
  --selective: #4f46e5;
  --admin: #7c3aed;
  --telegram: #0891b2;
  --danger-strong-end: #9f1239;
  --idx-sp500: #4338ca;
  --idx-ndx: #6d28d9;
  --analyst-strong-buy: #15803d;
  --analyst-buy: #22c55e;
  --analyst-hold: #64748b;
  --analyst-sell: #d97706;
  --analyst-strong-sell: #dc2626;

  --cycle-seg-recovery-from: #16a34a;
  --cycle-seg-recovery-to: #15803d;
  --cycle-seg-early-expansion-from: #14b8a6;
  --cycle-seg-early-expansion-to: #0284c7;
  --cycle-seg-mid-expansion-from: #0ea5e9;
  --cycle-seg-mid-expansion-to: #10b981;
  --cycle-seg-late-expansion-from: #84cc16;
  --cycle-seg-late-expansion-to: #f59e0b;
  --cycle-seg-peak-watch-from: #f59e0b;
  --cycle-seg-peak-watch-to: #ea580c;
  --cycle-seg-recession-warning-from: #fb923c;
  --cycle-seg-recession-warning-to: #be123c;
  --cycle-seg-recession-from: #be123c;
  --cycle-seg-recession-to: #9f1239;

  --bg-gradient-accent: rgba(232, 93, 4, .10);
  --bg-gradient-mid: #e8edf5;
  --bg-gradient-blue: rgba(37, 99, 235, .06);
  --nav-backdrop: rgba(243, 245, 249, .88);
  --band-alt-top: rgba(238, 242, 247, .95);
  --band-alt-end: rgba(243, 245, 249, 0);
  --band-border: rgba(201, 212, 227, .65);
  --gauge-card-bg: rgba(255, 255, 255, .94);

  --shadow-card: 0 6px 18px rgba(15, 23, 42, .08);
  --shadow: 0 10px 30px rgba(15, 23, 42, .12);
  --shadow-lg: 0 18px 50px rgba(15, 23, 42, .14);
}