:root {
  color-scheme: dark;

  --color-bg: #0a0a0f;
  --color-bg-deep: #07070b;
  --color-surface: #121218;
  --color-surface-raised: #16161d;
  --color-surface-soft: #1a1a22;
  --color-surface-hover: #1e1e28;
  --color-text: #ffffff;
  --color-text-soft: #e4e4e7;
  --color-muted: #a1a1aa;
  --color-muted-dark: #71717a;
  --color-purple: #a855f7;
  --color-purple-deep: #7c3aed;
  --color-purple-light: #c084fc;
  --color-green: #4ade80;
  --color-red: #fb7185;
  --color-border: rgba(255, 255, 255, 0.09);
  --color-border-strong: rgba(255, 255, 255, 0.14);
  --color-purple-soft: rgba(168, 85, 247, 0.14);
  --color-purple-border: rgba(168, 85, 247, 0.34);

  --gradient-accent: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);
  --gradient-accent-hover: linear-gradient(135deg, #b267f8 0%, #8b4bf0 100%);
  --gradient-panel: linear-gradient(145deg, rgba(22, 22, 29, 0.96), rgba(15, 15, 21, 0.98));

  --font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-pill: 9999px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 112px;

  --shadow-panel: 0 24px 80px rgba(0, 0, 0, 0.32);
  --shadow-purple: 0 14px 36px rgba(124, 58, 237, 0.25);

  --container: 1320px;
  --transition: 180ms ease;
}