/* ═══════════════════════════════════════════════════════════════════════════════
   geniuslevels — THE theme (rebrand-geniuslevels; the styling-architecture audit's
   centralization, executed at brand values).

   ONE SOURCE OF TRUTH: every page links this file; the shared components
   (site/ladder/timeline/briefpanel/tradestream) read these vars (their injected CSS
   keeps brand-valued fallbacks only as the no-theme degradation story); the canvas
   surfaces (chart.html LWC options, profile.html) read them through themeToken()
   (getComputedStyle) because canvas can't consume CSS vars directly.
   A rebrand or a live tune is an edit HERE and nowhere else.

   THREE FAMILIES + THE FIREWALL RULE:
     · SURFACES        — the chrome: backgrounds, hairlines, text greys.
     · BRAND ACCENTS   — exactly TWO. Teal = the brand + every interactive state
                         (hover/focus/active/links). Amber = the MARKED LEVEL / the
                         active read (LAST, ON-session chips, forming states).
     · DATA SEMANTICS  — locked to MEANING, never used as brand color: red/green are
                         PRICE DIRECTION only; MA/volume/profile/trend colors belong
                         to the chart's data language.
   The firewall: brand accents style the CHROME; data semantics style the DATA. They
   must not bleed — a rebrand changes brand accents; data semantics stay locked so
   brand color never competes with the chart.
   ═══════════════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

:root {
  color-scheme: dark;

  /* ── SURFACES ─────────────────────────────────────────────────────────────── */
  --bg: #07090D;        /* Void — the page */
  --panel: #0C0F15;     /* Panel — cards, nav */
  --panel2: #11151D;    /* Raised — hover/inputs/chips */
  --line: #1C222E;      /* Hairline — borders, grid */
  --ink: #E6EAF2;       /* Primary text */
  --muted: #8A93A6;     /* Muted text */
  --faint: #5C6578;     /* Captions/eyebrows (CC-derived from the neutral ramp) */
  --inactive-rule: #3B4454;
  --paper: #F2F3F5;     /* light-mode surface (future) */

  /* ── BRAND ACCENTS (2 only) ───────────────────────────────────────────────── */
  --accent: #2FD3C0;    /* Signal Teal — brand + interactive */
  --teal-deep: #0D8A80; /* teal on light surfaces (future) */
  --now: #F0B429;       /* Level Amber — marked level / active read ONLY */
  --amber-deep: #A87400;/* amber on light surfaces (future) */

  /* ── DATA SEMANTICS (locked to meaning — never brand) ─────────────────────── */
  --up: #3FBF7F;        /* price up  — one authoritative green */
  --down: #E5484D;      /* price down — one authoritative red */
  --ma-fast: #7C6BF5;
  --ma-slow: #4CC2F1;
  --volume: #C7A34A;    /* volume gold (also VWAP — volume-weighted); LADDER: the
                           VPOC family node+label (CD Ladder Level Language v2) */
  --volume-hi: #D8C48A; /* volume gold, price-text luminance (CD asset value) */
  --profile: #2E3A55;   /* volume-profile mass */

  /* ── LADDER LEVEL LANGUAGE v2 (CD extension palette — provenance system).
     Each extension hue means exactly ONE thing; the firewall holds. RESERVED,
     designed-not-built (do not use until their calc ships): Session Violet
     #9B8CF5 / #B3A8F8-hi (session high/low), Profile Indigo #7D93C4 (VAH/VAL). */
  --pivot: #AEB9CC;     /* Pivot Slate — pivots ONLY (P, R1–3, S1–3); presence by
                           luminance not hue (pure arithmetic, calm, first-class) */
  --pivot-hi: #C6CDDB;  /* pivot slate, price-text luminance */
  --target: #E5484D;    /* CD Target Red — the all-red bullseye ONLY. Shares the
                           red region with --down deliberately (2h density test:
                           recognition wins); the bullseye SILHOUETTE is the
                           disambiguator — direction red is never ring-shaped. */
  --trend-cyan: #22D3EE;    /* trend-spark long dot */
  --trend-magenta: #E879F9; /* trend-spark short dot */
  --trend-grey: #94A3B8;    /* trend-spark EMA spine / none */

  /* ── RGB TRIPLETS (for rgba() alpha washes/glows — swap with their token) ──── */
  --accent-rgb: 47, 211, 192;
  --now-rgb: 240, 180, 41;
  --up-rgb: 63, 191, 127;
  --down-rgb: 229, 72, 77;
  --muted-rgb: 138, 147, 166;
  --ink-rgb: 230, 234, 242;

  /* ── TYPE ─────────────────────────────────────────────────────────────────── */
  --sans: "Space Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}