:root {
  /* Color Palette */
  --bg-carbon: #05070b;
  --bg-steel: #111827;
  --bg-panel: rgba(17, 24, 39, 0.72);
  --bg-glass: rgba(17, 24, 39, 0.45);
  --accent-emerald: #00ff9d;
  --accent-emerald-dim: rgba(0, 255, 157, 0.12);
  --accent-emerald-glow: rgba(0, 255, 157, 0.35);
  --highlight-blue: #1daeff;
  --highlight-blue-dim: rgba(29, 174, 255, 0.12);
  --highlight-blue-glow: rgba(29, 174, 255, 0.35);
  --danger: #ff4d5a;
  --danger-dim: rgba(255, 77, 90, 0.15);
  --text-white: #ffffff;
  --text-silver: #a8b2c1;
  --text-muted: #6b7585;
  --border-subtle: rgba(168, 178, 193, 0.12);
  --border-glow: rgba(0, 255, 157, 0.28);

  /* Typography */
  --font-heading: "IBM Plex Sans", system-ui, sans-serif;
  --font-body: "Manrope", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Spacing */
  --section-pad: clamp(4.5rem, 10vw, 8rem);
  --container: min(1180px, calc(100% - 3rem));
  --nav-h: 4.25rem;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --duration: 0.45s;

  /* Effects */
  --glass-blur: 16px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration: 0.01ms;
  }
}