/* ==========================================================================
   Standby — Design Tokens
   Dark, high-tech "live signal" system. All palette/type/spacing lives here.
   ========================================================================== */

:root {
  /* ---- Canvas & surfaces (near-black, cool tint) ---- */
  --color-bg: oklch(13.5% 0.012 250);
  --color-bg-2: oklch(16% 0.014 250);
  --color-surface: oklch(18.5% 0.016 250);
  --color-surface-2: oklch(22% 0.018 250);
  --color-surface-3: oklch(26% 0.02 250);
  --color-hairline: oklch(100% 0 0 / 0.08);
  --color-hairline-strong: oklch(100% 0 0 / 0.16);

  /* ---- Signal palette ---- */
  --signal: oklch(84% 0.18 152);          /* electric "live/closing" green */
  --signal-bright: oklch(90% 0.2 150);
  --signal-dim: oklch(70% 0.14 152);
  --standby: oklch(83% 0.15 80);          /* warm amber "on standby" */
  --alert: oklch(72% 0.19 28);            /* objection / warning red-orange */
  --cyan: oklch(82% 0.13 210);            /* secondary accent */
  --violet: oklch(72% 0.16 290);          /* tertiary accent for depth */

  /* ---- Text ---- */
  --text: oklch(97% 0.005 250);
  --text-soft: oklch(82% 0.012 250);
  --text-muted: oklch(66% 0.014 250);
  --text-faint: oklch(52% 0.014 250);
  --text-on-signal: oklch(20% 0.03 152);

  /* ---- Gradients & glows ---- */
  --grad-signal: linear-gradient(135deg, var(--signal-bright), var(--cyan));
  --grad-text: linear-gradient(180deg, oklch(99% 0 0), oklch(80% 0.01 250));
  --grad-surface: linear-gradient(180deg, oklch(100% 0 0 / 0.06), oklch(100% 0 0 / 0.01));
  --glow-signal: 0 0 0 1px oklch(84% 0.18 152 / 0.35), 0 0 24px oklch(84% 0.18 152 / 0.25);
  --glow-soft: 0 0 60px oklch(84% 0.18 152 / 0.12);

  /* ---- Shadows (layered depth) ---- */
  --shadow-sm: 0 1px 2px oklch(0% 0 0 / 0.4);
  --shadow-md: 0 8px 24px -8px oklch(0% 0 0 / 0.6);
  --shadow-lg: 0 24px 60px -16px oklch(0% 0 0 / 0.7);
  --shadow-xl: 0 40px 120px -24px oklch(0% 0 0 / 0.8);

  /* ---- Typography ---- */
  --font-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Menlo", monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: clamp(1rem, 0.96rem + 0.2vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.05rem + 0.4vw, 1.3rem);
  --text-xl: clamp(1.4rem, 1.2rem + 0.9vw, 1.85rem);
  --text-2xl: clamp(1.9rem, 1.4rem + 2.2vw, 3rem);
  --text-3xl: clamp(2.6rem, 1.6rem + 4.4vw, 5rem);
  --text-hero: clamp(3.1rem, 1.2rem + 8.2vw, 8.5rem);

  --leading-tight: 1.04;
  --leading-snug: 1.18;
  --leading-normal: 1.6;
  --tracking-tight: -0.03em;
  --tracking-snug: -0.015em;
  --tracking-wide: 0.18em;

  /* ---- Spacing & rhythm ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-section: clamp(5rem, 3rem + 8vw, 11rem);
  --container: 1200px;
  --container-wide: 1320px;

  /* ---- Radii ---- */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-pill: 999px;

  /* ---- Motion ---- */
  --duration-fast: 160ms;
  --duration-normal: 320ms;
  --duration-slow: 600ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1);

  /* ---- Z-index ladder ---- */
  --z-bg: 0;
  --z-base: 1;
  --z-raised: 10;
  --z-nav: 100;
  --z-overlay: 1000;
}