/* ==========================================================================
   THEME — "Frosted glass cathedral at midnight", adapted for God of Algos.
   Monochrome frost palette, gold accent for money / buy actions / brand,
   teal / ember (from the theme's swatch set) for profit / loss data only.
   Fonts are loaded in index.html <head>.
   ========================================================================== */
:root {
  /* canvas + glass surfaces */
  --bg: #05060f;
  --bg-2: #070914;
  --steel: #2f343e;
  --glass: rgba(186, 214, 247, 0.03);
  --glass-2: rgba(186, 214, 247, 0.06);
  --glass-3: rgba(186, 214, 247, 0.12);
  --deep-glass: rgba(5, 6, 15, 0.97);

  /* hairlines — the system's only border language */
  --edge: rgba(186, 215, 247, 0.12);
  --edge-soft: rgba(186, 215, 247, 0.06);
  --edge-strong: rgba(186, 215, 247, 0.24);
  --grid-line: rgba(186, 215, 247, 0.06);

  /* text progression: heading → body → muted → helper → faint */
  --text-hi: #d8ecf8;
  --text: #d1e4fa;
  --text-2: #c7d3ea;
  --text-3: #9da7ba;
  --text-4: #687186;
  --white: #ffffff;

  /* light */
  --sky: linear-gradient(180deg, #d8ecf8 0%, #98c0ef 100%);
  --blueprint: #b6d9fc;
  --beam: conic-gradient(from 0deg at 50% -5%, transparent 45%, rgba(124, 145, 182, 0.3) 49%, rgba(124, 145, 182, 0.5) 50%, rgba(124, 145, 182, 0.3) 51%, transparent 55%);

  /* gold — money, premium, buy actions, the brand (applied in gold.css) */
  --gold: #f2c75c;
  --gold-hi: #ffe7a3;
  --gold-lo: #b0802a;
  --gold-grad: linear-gradient(100deg, #b0802a 0%, #f2c75c 26%, #fff1c4 50%, #f2c75c 74%, #b0802a 100%);
  --gold-text: linear-gradient(180deg, #fff1c4 0%, #f2c75c 55%, #c8922f 100%);
  --gold-soft: rgba(242, 199, 92, 0.12);
  --gold-edge: rgba(242, 199, 92, 0.38);
  --gold-glow: rgba(242, 199, 92, 0.5);
  --ia: var(--gold);  /* icon accent: the one gold detail inside each icon */
  --beam-gold: conic-gradient(from 0deg at 50% -5%, transparent 45%, rgba(242, 199, 92, 0.18) 49%, rgba(242, 199, 92, 0.34) 50%, rgba(242, 199, 92, 0.18) 51%, transparent 55%);

  /* data semantics (from the theme's swatch set) */
  --up: #4fd6b8;
  --up-bg: rgba(38, 150, 132, 0.16);
  --down: #f08466;
  --down-bg: rgba(228, 109, 76, 0.14);
  --sw-teal: #269684;
  --sw-blue: #027dea;
  --sw-ember: #e46d4c;

  /* charts (read by canvas code) — equity is money, so it's drawn in gold */
  --chart-a: #b0802a;
  --chart-b: #ffe7a3;
  --chart-fill: 242, 199, 92;
  --chart-glow: rgba(242, 199, 92, 0.55);

  /* type */
  --font-display: "General Sans", "Geist", system-ui, sans-serif;
  --font-body: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-dot: "Doto", "Geist Mono", ui-monospace, monospace;
  --font-mono: "Geist Mono", ui-monospace, monospace;

  /* shape */
  --r-card: 16px;
  --r-badge: 6px;
  --r-pill: 999px;
  --r-window: 20px;

  /* elevation: inset frost + cool halo, never plain drop shadows */
  --sh-hair: inset 0 0 0 1px var(--edge);
  --sh-card: inset 0 1px 1px rgba(199, 211, 234, 0.12), inset 0 24px 48px rgba(199, 211, 234, 0.05), inset 0 0 0 1px rgba(186, 214, 247, 0.06), 0 24px 32px rgba(6, 6, 14, 0.7);
  --sh-modal: inset 0 1px 1px rgba(216, 236, 248, 0.2), inset 0 24px 48px rgba(168, 216, 245, 0.06), inset 0 0 0 1px rgba(199, 211, 234, 0.08), 0 16px 32px rgba(0, 0, 0, 0.3), 0 40px 80px -20px rgba(63, 73, 89, 0.45);
  --sh-halo: 0 0 6px rgba(186, 207, 247, 0.32), 0 0 12px rgba(238, 186, 247, 0.24);
  --sh-gold: inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 -1px 0 rgba(110, 76, 18, 0.45), 0 0 0 1px rgba(242, 199, 92, 0.55), 0 10px 28px -10px rgba(242, 199, 92, 0.6);

  /* layout */
  --container: 1200px;
  --gutter: clamp(20px, 4vw, 40px);
  --section-y: clamp(88px, 10vw, 120px);

  /* motion */
  --ease-out: ease-out;
  --ease-in-out: ease-in-out;

  /* layering scale */
  --z-bg: -2;
  --z-below: -1;
  --z-raised: 1;
  --z-float: 2;
  --z-nav: 50;
  --z-ticker: 55;
  --z-dock: 60;
  --z-progress: 100;
}