:root {
  --bg: #0b1220;
  --bg-surface: #0f1830;
  --bg-card: rgba(15, 24, 48, 0.6);
  --bg-card-hover: rgba(20, 32, 64, 0.7);
  --bg-input: rgba(15, 24, 48, 0.8);
  --bg-nav: rgba(11, 18, 32, 0.85);

  --accent: #5aa2ff;
  --accent-hover: #78b4ff;
  --accent-glow: rgba(90, 162, 255, 0.25);
  --purple: #7c5cff;
  --purple-glow: rgba(124, 92, 255, 0.2);
  --green: #3ddc97;
  --green-glow: rgba(61, 220, 151, 0.15);
  --warning: #ffcc66;
  --error: #ff6b6b;

  --text: #e8eefc;
  --text-secondary: #9fb0d6;
  --text-muted: #5d6f8f;

  --border: rgba(255, 255, 255, 0.06);
  --border-hover: rgba(255, 255, 255, 0.12);

  --radius-sm: 10px;
  --radius: 14px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --radius-xl: 28px;

  --shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.35);
  --shadow-xl: 0 18px 46px rgba(0, 0, 0, 0.45);

  --glass: rgba(15, 24, 48, 0.6);
  --glass-blur: blur(24px);
  --glass-border: 1px solid rgba(255, 255, 255, 0.06);

  --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);

  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SF Mono", "Cascadia Code", "Menlo", monospace;

  --container: 1140px;
  --nav-h: 64px;
}

/* ===== Light Theme ===== */
[data-theme="light"] {
  --bg: #f5f7fb;
  --bg-surface: #ffffff;
  --bg-card: rgba(255, 255, 255, 0.8);
  --bg-card-hover: rgba(245, 247, 251, 0.9);
  --bg-input: rgba(240, 243, 248, 0.9);
  --bg-nav: rgba(255, 255, 255, 0.9);

  --accent: #3b82f6;
  --accent-hover: #2563eb;
  --accent-glow: rgba(59, 130, 246, 0.12);
  --purple: #7c3aed;
  --purple-glow: rgba(124, 58, 237, 0.1);
  --green: #10b981;
  --green-glow: rgba(16, 185, 129, 0.1);
  --warning: #f59e0b;
  --error: #ef4444;

  --text: #1e293b;
  --text-secondary: #64748b;
  --text-muted: #94a3b8;

  --border: rgba(0, 0, 0, 0.08);
  --border-hover: rgba(0, 0, 0, 0.15);

  --shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.08);
  --shadow-xl: 0 18px 46px rgba(0, 0, 0, 0.1);

  --glass: rgba(255, 255, 255, 0.7);
  --glass-blur: blur(24px);
  --glass-border: 1px solid rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .hero-orb-1 {
  background: radial-gradient(circle, rgba(59,130,246,0.1), transparent 70%) !important;
}
[data-theme="light"] .hero-orb-2 {
  background: radial-gradient(circle, rgba(124,58,237,0.08), transparent 70%) !important;
}
[data-theme="light"] .hero-orb-3 {
  background: radial-gradient(circle, rgba(16,185,129,0.06), transparent 70%) !important;
}

[data-theme="light"] .hero h1 {
  background: linear-gradient(135deg, var(--text) 0%, var(--accent) 50%, var(--purple) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: #c0c8d4;
}