:root {
  /* ---------- Color ---------- */
  --bg-base: #07071A;
  --bg-elev-1: #0E0B24;
  --bg-elev-2: #14102F;
  --bg-elev-3: #1B153D;

  --text-primary: #F5F5FF;
  --text-secondary: #A8A6C9;
  --text-muted: #6F6C92;

  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.18);

  --accent-magenta: #FF2EA6;
  --accent-violet: #6E3BFF;
  --accent-cyan: #00F0FF;
  --accent-lime: #B6FF3D;

  --gradient-primary: linear-gradient(135deg, #FF2EA6 0%, #6E3BFF 50%, #00F0FF 100%);
  --gradient-soft: linear-gradient(135deg, rgba(255, 46, 166, 0.18), rgba(110, 59, 255, 0.18) 50%, rgba(0, 240, 255, 0.18));

  /* ---------- Typography ---------- */
  --font-display: "Space Grotesk", "Inter", "Helvetica Neue", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: "Inter", "Helvetica Neue", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", "Menlo", "Consolas", monospace;

  /* ---------- Spacing ---------- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* ---------- Radii ---------- */
  --radius-sm: 4px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 32px;
  --radius-pill: 999px;

  /* ---------- Layout ---------- */
  --container-max: 1280px;
  --gutter: 2rem;

  /* ---------- Motion ---------- */
  --t-fast: 160ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --t-med: 320ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --t-slow: 600ms cubic-bezier(0.2, 0.8, 0.2, 1);
}