:root {
  --background: 210 45% 98%;
  --foreground: 218 52% 12%;
  --primary: 24 95% 53%;
  --primary-foreground: 0 0% 100%;
  --secondary: 217 82% 17%;
  --secondary-foreground: 0 0% 100%;
  --muted: 214 22% 92%;
  --muted-foreground: 218 18% 38%;
  --destructive: 0 78% 55%;
  --destructive-foreground: 0 0% 100%;
  --border: 214 24% 84%;
  --card: 0 0% 100%;
  --accent: 38 92% 55%;
  --shadow-sm: 0 6px 16px rgba(6, 21, 40, 0.08);
  --shadow-md: 0 16px 42px rgba(6, 21, 40, 0.14);
  --shadow-lg: 0 28px 70px rgba(6, 21, 40, 0.22);
  --transition-fast: 160ms ease;
  --transition-smooth: 260ms cubic-bezier(.2,.8,.2,1);
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 28px;
}
.dark {
  --background: 218 52% 8%;
  --foreground: 210 42% 96%;
  --primary: 26 96% 56%;
  --primary-foreground: 0 0% 100%;
  --secondary: 214 44% 16%;
  --secondary-foreground: 210 42% 96%;
  --muted: 217 35% 17%;
  --muted-foreground: 214 20% 72%;
  --destructive: 0 72% 55%;
  --destructive-foreground: 0 0% 100%;
  --border: 217 28% 24%;
  --card: 218 45% 11%;
  --accent: 38 96% 60%;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, Poppins, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  min-height: 100vh;
}
button, a, input, select { -webkit-tap-highlight-color: transparent; }
input, select, textarea { font-size: max(16px, 1rem); }
.glass {
  background: color-mix(in srgb, hsl(var(--card)) 82%, transparent);
  backdrop-filter: blur(18px);
  border: 1px solid color-mix(in srgb, hsl(var(--border)) 82%, transparent);
}
.seat {
  width: 44px;
  min-height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  transition: var(--transition-smooth);
}
.safe-bottom { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
.focus-ring:focus { outline: 3px solid color-mix(in srgb, hsl(var(--primary)) 55%, transparent); outline-offset: 2px; }
.skeleton { background: linear-gradient(90deg, hsl(var(--muted)), color-mix(in srgb, hsl(var(--muted)) 55%, white), hsl(var(--muted))); background-size: 200% 100%; animation: shimmer 1.2s infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }