:root {
  --color-bg: #020816;
  --color-bg-deep: #07111f;
  --color-panel: rgba(8, 23, 39, 0.82);
  --color-panel-strong: rgba(10, 27, 46, 0.94);
  --color-border: rgba(108, 174, 255, 0.35);
  --color-border-strong: rgba(108, 174, 255, 0.85);
  --color-text: #eaf5ff;
  --color-muted: #83a0ba;
  --color-accent: #4de8d8;
  --color-accent-strong: #83f7d0;
  --color-secondary: #9adf67;
  --color-shadow: rgba(0, 0, 0, 0.48);

  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;

  --radius-sm: 0.65rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;

  --font-sans: "Segoe UI", Roboto, "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-size-sm: 0.95rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 2.2rem;
  --font-size-hero: clamp(2.4rem, 5vw, 4.3rem);

  --transition-fast: 180ms ease;
  --transition-medium: 280ms ease;
  --transition-slow: 520ms ease;
  --shadow-glow: 0 0 0 1px rgba(77, 232, 216, 0.16), 0 0 24px rgba(77, 232, 216, 0.12);
}