:root {
  --background: 230 35% 6%;
  --foreground: 210 35% 96%;
  --primary: 272 96% 67%;
  --secondary: 220 30% 18%;
  --muted: 220 16% 72%;
  --destructive: 355 86% 62%;
  --border: 230 22% 25%;
  --card: 232 31% 11%;
  --shadow-sm: 0 8px 24px hsl(250 80% 3% / 0.24);
  --shadow-md: 0 18px 46px hsl(267 90% 18% / 0.34);
  --shadow-lg: 0 28px 80px hsl(267 90% 12% / 0.46);
  --transition-fast: 150ms ease;
  --transition-smooth: 280ms cubic-bezier(.2,.8,.2,1);
  --radius-sm: 0.75rem;
  --radius-md: 1.1rem;
  --radius-lg: 1.6rem;
}

.dark {
  --background: 230 35% 6%;
  --foreground: 210 35% 96%;
  --primary: 272 96% 67%;
  --secondary: 220 30% 18%;
  --muted: 220 16% 72%;
  --destructive: 355 86% 62%;
  --border: 230 22% 25%;
  --card: 232 31% 11%;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
button, a, input { -webkit-tap-highlight-color: transparent; }
input { font-size: max(16px, 1rem); }

.spectral-bg {
  background:
    radial-gradient(circle at 20% 10%, hsl(var(--primary) / 0.28), transparent 28rem),
    radial-gradient(circle at 90% 30%, hsl(178 88% 52% / 0.12), transparent 24rem),
    radial-gradient(circle at 50% 100%, hsl(310 90% 48% / 0.14), transparent 25rem),
    linear-gradient(180deg, hsl(var(--background)), hsl(236 40% 8%));
}

.ghost-orb {
  position: relative;
  overflow: hidden;
}
.ghost-orb::after {
  content: "";
  position: absolute;
  inset: -35%;
  background: conic-gradient(from 90deg, transparent, hsl(180 100% 80% / 0.55), transparent, hsl(310 100% 80% / 0.45), transparent);
  animation: spin 5s linear infinite;
}
.ghost-orb { isolation: isolate; }
.ghost-orb > * { position: relative; z-index: 1; }

.pulse-dot { box-shadow: 0 0 0 0 hsl(var(--primary) / 0.55); animation: pulse 1.8s infinite; }
.spectral-float { animation: float 4s ease-in-out infinite; }
.red-lamp {
  background:
    radial-gradient(circle at 50% 45%, hsl(355 95% 63% / 0.72), hsl(355 75% 36% / 0.46) 45%, hsl(0 0% 0% / 0.12) 75%),
    hsl(355 80% 12%);
  box-shadow: inset 0 0 40px hsl(355 100% 55% / 0.35), 0 0 34px hsl(355 100% 55% / 0.24);
}

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 hsl(var(--primary) / 0.5); }
  70% { box-shadow: 0 0 0 10px hsl(var(--primary) / 0); }
  100% { box-shadow: 0 0 0 0 hsl(var(--primary) / 0); }
}
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}