:root {
  --background: 222 47% 96%;
  --foreground: 224 38% 10%;
  --primary: 174 92% 42%;
  --primary-foreground: 222 47% 8%;
  --secondary: 257 75% 58%;
  --secondary-foreground: 0 0% 100%;
  --muted: 220 18% 88%;
  --muted-foreground: 224 15% 38%;
  --destructive: 0 84% 58%;
  --destructive-foreground: 0 0% 100%;
  --border: 220 20% 78%;
  --card: 0 0% 100%;
  --success: 145 72% 42%;
  --warning: 39 96% 54%;
  --radius-sm: 0.6rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --shadow-sm: 0 10px 30px hsl(224 38% 10% / 0.08);
  --shadow-md: 0 20px 55px hsl(224 38% 10% / 0.14);
  --shadow-lg: 0 35px 90px hsl(224 38% 10% / 0.25);
  --transition-fast: 160ms ease;
  --transition-smooth: 320ms cubic-bezier(.2,.8,.2,1);
}
.dark {
  --background: 225 49% 7%;
  --foreground: 210 40% 96%;
  --primary: 174 92% 47%;
  --primary-foreground: 222 47% 8%;
  --secondary: 262 88% 68%;
  --secondary-foreground: 0 0% 100%;
  --muted: 224 30% 15%;
  --muted-foreground: 218 18% 70%;
  --destructive: 0 84% 62%;
  --destructive-foreground: 0 0% 100%;
  --border: 224 24% 22%;
  --card: 224 40% 11%;
}
* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  min-height: 100%;
  margin: 0;
  background:
    radial-gradient(circle at 15% 10%, hsl(var(--primary) / 0.16), transparent 30rem),
    radial-gradient(circle at 85% 5%, hsl(var(--secondary) / 0.18), transparent 28rem),
    linear-gradient(135deg, hsl(var(--background)), hsl(226 48% 5%));
  color: hsl(var(--foreground));
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x: hidden;
  overscroll-behavior: none;
  -webkit-font-smoothing: antialiased;
}
button, a, input, select, textarea { transition: var(--transition-fast); }
input, select, textarea { font-size: max(16px, 1rem); }
button, a { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
video { background: #000; }
.mobile-camera-stage { min-height: min(72vh, 680px); }
.glass {
  background: linear-gradient(145deg, hsl(var(--card) / 0.78), hsl(var(--card) / 0.44));
  border: 1px solid hsl(var(--border) / 0.72);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(22px);
}
.security-grid {
  background-image:
    linear-gradient(hsl(var(--primary) / 0.08) 1px, transparent 1px),
    linear-gradient(90deg, hsl(var(--primary) / 0.08) 1px, transparent 1px);
  background-size: 36px 36px;
}
.scanline::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent, hsl(var(--primary) / 0.14), transparent);
  height: 35%;
  animation: scan 2.8s ease-in-out infinite;
  pointer-events: none;
}
@keyframes scan { 0% { transform: translateY(-120%); } 100% { transform: translateY(330%); } }
@keyframes pulseGlow { 0%,100% { box-shadow: 0 0 0 0 hsl(var(--primary) / 0.35); } 50% { box-shadow: 0 0 0 12px hsl(var(--primary) / 0); } }
.capture-pulse { animation: pulseGlow 2s infinite; }
.safe-bottom { padding-bottom: calc(5.25rem + env(safe-area-inset-bottom)); }
.top-safe { padding-top: env(safe-area-inset-top); }
.blackout {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #000;
  color: white;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 2rem;
}
@media (display-mode: standalone) {
  body { user-select: none; }
}
@media (max-width: 640px) {
  .mobile-camera-stage { min-height: calc(100svh - 15rem); border-radius: 1.25rem; }
  .safe-bottom { padding-bottom: calc(6.5rem + env(safe-area-inset-bottom)); }
}
[id*="remix" i],
[class*="remix" i],
[id*="watermark" i],
[class*="watermark" i],
[id*="genmb" i][id*="button" i],
[class*="genmb" i][class*="button" i],
[id*="genmb" i][id*="remix" i],
[class*="genmb" i][class*="remix" i],
a[aria-label*="remix" i],
a[title*="remix" i],
button[aria-label*="remix" i],
button[title*="remix" i] {
  display: none !important;
}