:root {
  --background: 210 24% 98%;
  --foreground: 215 28% 15%;
  --primary: 214 72% 28%;
  --primary-foreground: 0 0% 100%;
  --secondary: 154 42% 32%;
  --secondary-foreground: 0 0% 100%;
  --muted: 214 22% 94%;
  --muted-foreground: 215 13% 43%;
  --destructive: 0 56% 44%;
  --destructive-foreground: 0 0% 100%;
  --border: 214 20% 86%;
  --card: 0 0% 100%;
  --shadow-sm: 0 4px 14px hsl(215 28% 16% / 0.06);
  --shadow-md: 0 10px 26px hsl(215 28% 16% / 0.09);
  --shadow-lg: 0 18px 48px hsl(215 28% 16% / 0.12);
  --transition-fast: 160ms ease;
  --transition-smooth: 240ms cubic-bezier(.2,.8,.2,1);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
}
.dark {
  --background: 220 22% 9%;
  --foreground: 210 30% 94%;
  --primary: 212 56% 48%;
  --primary-foreground: 0 0% 100%;
  --secondary: 154 36% 42%;
  --secondary-foreground: 0 0% 100%;
  --muted: 220 18% 15%;
  --muted-foreground: 214 15% 70%;
  --destructive: 0 52% 50%;
  --destructive-foreground: 0 0% 100%;
  --border: 220 16% 22%;
  --card: 220 19% 12%;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter, Roboto, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: hsl(var(--background)); color: hsl(var(--foreground)); letter-spacing: -0.01em; }
button, a, input, select, textarea { transition: var(--transition-smooth); }
button, input, select, textarea { font: inherit; }
.car-art { background: linear-gradient(135deg, hsl(var(--muted)), hsl(var(--card)) 48%, hsl(var(--primary) / .12)); }
.glass { background: hsl(var(--card) / .88); backdrop-filter: blur(14px); border: 1px solid hsl(var(--border)); }
.fade-slide { animation: fadeSlide .5s ease both; }
@keyframes fadeSlide { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.pulse-soft { animation: pulseSoft 3s ease-in-out infinite; }
@keyframes pulseSoft { 0%,100% { transform: scale(1); opacity: .92; } 50% { transform: scale(1.025); opacity: 1; } }
.focus-ring:focus { outline: 3px solid hsl(var(--primary) / .22); outline-offset: 2px; }
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-thumb { background: hsl(var(--primary) / .22); border-radius: 999px; }
