/* ==========================================================================
   THOX design tokens — brand primitive layer
   --------------------------------------------------------------------------
   Source of truth: the THOX.ai design system (thox-brand). This file holds the
   brand *primitives* only. The application's *semantic* tokens live in
   style.css (:root) and reference these — so re-theming the whole product is a
   matter of changing values here, not chasing hardcoded hexes across the UI.

   Load order (index.html): thox-tokens.css  ->  style.css
   (primitives first, so the semantic layer can consume them.)

   Brand rules encoded here:
   • Dark-first, emerald-accented, terminal-inspired.
   • Emerald (#10b981 / #34d399 / #00ff88) is the ThoxVoice accent / hero.
   • Purple (#a855f7 / #c084fc) is RESERVED for MagStack (hardware clustering)
     and is intentionally NOT declared here — ThoxVoice must never render it.
   • Typography: Inter (UI) + JetBrains Mono (machine voice / code).
   • WCAG AA: #fafafa on #09090b = 19.3:1; #10b981 on #09090b = 5.8:1.
   ========================================================================== */

:root {
  /* --- Brand: emerald energy --------------------------------------------- */
  --thox-emerald: #10b981;         /* primary actions, links, accent (emerald-500) */
  --thox-emerald-light: #34d399;   /* hover / highlight (emerald-400) */
  --thox-neon: #00ff88;            /* glow, terminal accent, special emphasis */
  --thox-emerald-deep: #059669;    /* active / pressed (emerald-600) */
  --thox-emerald-subtle: #065f46;  /* muted accent / border (emerald-800) */

  /* --- Neutral dark theme (zinc) ----------------------------------------- */
  --thox-bg: #09090b;              /* page background (zinc-950) */
  --thox-surface: #18181b;         /* card / panel (zinc-900) */
  --thox-elevated: #27272a;        /* modal / dropdown (zinc-800) */
  --thox-border: #3f3f46;          /* default border (zinc-700) */
  --thox-border-subtle: #27272a;   /* subtle border (zinc-800) */
  --thox-text: #fafafa;            /* primary text (zinc-50) */
  --thox-text-secondary: #a1a1aa;  /* secondary text (zinc-400) */
  --thox-text-muted: #71717a;      /* muted / disabled (zinc-500) */

  /* --- Semantic accents (NOT purple) ------------------------------------- */
  --thox-amber: #f59e0b;           /* warnings / attention / processing */
  --thox-red: #ef4444;             /* errors / destructive */
  --thox-blue: #3b82f6;            /* info / cool counterpoint (user voice) */

  /* --- Typography --------------------------------------------------------- */
  --thox-font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --thox-font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* --- Effects: glass, glow, gradients ----------------------------------- */
  --thox-glass-bg: rgba(24, 24, 27, 0.8);
  --thox-glass-border: rgba(63, 63, 70, 0.5);
  --thox-glow: rgba(16, 185, 129, 0.15);
  --thox-glow-neon: rgba(0, 255, 136, 0.08);
  --thox-gradient-brand: linear-gradient(135deg, #10b981, #34d399);
  --thox-gradient-hero: linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(0, 255, 136, 0.05));
}