/* ============================================================================
   tokens.css — LxveLabs design tokens (the shared, top-of-house token source).
   Extracted verbatim from style.css 2026-07-24 so LxveLabs.com is the single
   source of the brand-dark token system (violet #A371F7, signal green #39FF14,
   near-black #0a0a0f) + the light-theme override. Loaded before style.css on
   every page. Same-origin, CSP-clean, no CDN. Custom properties only — a pure
   refactor: the rendered look is byte-identical. cybercontroller.org carries a
   near-duplicate :root; a follow-up wave points it at this same file.
   ============================================================================ */

:root {
  --font-display: 'Bricolage Grotesque', 'Segoe UI', system-ui, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;

  --max-width: 1180px;
  --gutter: 40px;

  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 14px;
  --radius-sm: 10px;
  --radius-pill: 999px;

  --ease: cubic-bezier(.22,.61,.28,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --t-fast: .18s;
  --t: .32s;
  --t-slow: .55s;

  /* The physical object (PCB) reads identically in both themes — it is a
     product, not a surface. These are fixed, not theme-swapped. */
  --pcb-a: #1c3b47;
  --pcb-b: #0d2029;
  --pcb-edge: #08161c;
  --shield-face: #cfd3d9;
  --brass-metal: #c59a54;
  --brass-metal-hi: #e7cd9c;
}

/* ---- DARK (default / front door — near-black brand) ---- */
:root,
[data-theme="dark"] {
  --bg: #0a0a0f;
  --bg-sunk: #08080c;
  --surface: #12121a;
  --surface-2: #171720;

  --stage-hi: #1c1c26;
  --stage-mid: #12121a;
  --stage-lo: #0a0a0f;
  --stage-edge: #242430;

  --ink: #e8ecf2;
  --ink-soft: #a6abb8;
  --ink-mid: #8a90a0;
  --ink-faint: #5a5f6c;

  --line: #242430;
  --line-strong: #34343f;

  --accent: #A371F7;
  --accent-2: #bb90ff;
  --accent-deep: #8a53e0;
  --accent-tint: rgba(163,113,247,.10);
  --accent-tint-2: rgba(163,113,247,.16);
  --accent-border: rgba(163,113,247,.28);
  --on-accent: #0a0a0f;
  --accent-glow: rgba(163,113,247,.22);

  /* amber "in development" chrome (was the brass secondary) */
  --brass: #f5b14c;
  --brass-2: #f5b14c;
  --brass-tint: rgba(245,177,76,.10);
  --brass-border: rgba(245,177,76,.26);

  --btn-primary-bg: #A371F7;
  --btn-primary-bg-h: #bb90ff;
  --btn-primary-fg: #0a0a0f;

  --card-shadow: 0 1px 0 rgba(0,0,0,.4);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.4), 0 8px 18px -10px rgba(0,0,0,.6);
  --shadow-md: 0 2px 8px rgba(0,0,0,.45), 0 26px 50px -20px rgba(0,0,0,.65);
  --shadow-lg: 0 10px 24px rgba(0,0,0,.5), 0 64px 110px -34px rgba(0,0,0,.75);
  --shadow-board: 0 40px 70px -24px rgba(0,0,0,.7), 0 12px 26px -12px rgba(0,0,0,.6);

  --header-bg: rgba(10,10,15,.72);
  --header-bg-solid: rgba(10,10,15,.92);

  --live: #39FF14; --live-bg: rgba(57,255,20,.08); --live-border: rgba(57,255,20,.32);
  --dev: #f5b14c; --dev-bg: rgba(245,177,76,.10); --dev-border: rgba(245,177,76,.26);
}

/* ---- LIGHT (secondary — brand-light, on the toggle) ---- */
[data-theme="light"] {
  --bg: #f7f7f8;
  --bg-sunk: #f0f0f3;
  --surface: #ffffff;
  --surface-2: #f4f4f7;

  --stage-hi: #ffffff;
  --stage-mid: #f0f0f3;
  --stage-lo: #e6e6ea;
  --stage-edge: #dcdce3;

  --ink: #14141a;
  --ink-soft: #4b4d55;
  --ink-mid: #5b5f6c;
  --ink-faint: #8b8e98;

  --line: #dcdce3;
  --line-strong: #c7c7d1;

  --accent: #7C3AED;
  --accent-2: #6d28d9;
  --accent-deep: #5b21b6;
  --accent-tint: rgba(124,58,237,.08);
  --accent-tint-2: rgba(124,58,237,.14);
  --accent-border: rgba(124,58,237,.20);
  --on-accent: #ffffff;
  --accent-glow: rgba(124,58,237,.14);

  /* amber "in development" chrome (was the brass secondary) */
  --brass: #b9770e;
  --brass-2: #b9770e;
  --brass-tint: rgba(185,119,14,.08);
  --brass-border: rgba(185,119,14,.22);

  --btn-primary-bg: #7C3AED;
  --btn-primary-bg-h: #6d28d9;
  --btn-primary-fg: #ffffff;

  --card-shadow: 0 1px 2px rgba(20,20,16,.05), 0 2px 6px rgba(20,20,16,.04);
  --shadow-sm: 0 1px 2px rgba(20,20,16,.05), 0 6px 16px -8px rgba(20,20,16,.14);
  --shadow-md: 0 2px 8px rgba(20,20,16,.06), 0 22px 44px -18px rgba(20,20,16,.20);
  --shadow-lg: 0 8px 20px rgba(20,20,16,.07), 0 50px 90px -30px rgba(20,20,16,.30);
  --shadow-board: 0 34px 60px -22px rgba(11,44,58,.42), 0 10px 22px -12px rgba(11,44,58,.30);

  --header-bg: rgba(247,247,248,.72);
  --header-bg-solid: rgba(247,247,248,.92);

  --live: #0f7a37; --live-bg: rgba(15,122,55,.08); --live-border: rgba(15,122,55,.28);
  --dev: #b9770e; --dev-bg: rgba(185,119,14,.08); --dev-border: rgba(185,119,14,.22);
}