:root{--abyss:#080f1a;--deep-navy:#0d1b2a;--midnight:#142535;--slate:#1b3a4b;--storm:#2a5a6e;--ice:#4a8fa8;--frost:#7ab8cc;--mist:#a8d4e2;--smoke:#8899a6;--bone:#e8dcc8;--ember:#c47a2a;--amber:#e89b3e;--gold:#f4b942;--warm-glow:#f8d070;--signal:#ff9f1c;--danger:#c45c5c;--caution:#d4915c;--success:#5c9a6e;--bg-deep:var(--abyss);--bg-surface:var(--deep-navy);--bg-elevated:var(--midnight);--accent:var(--amber);--accent-hover:var(--gold);--accent-muted:#e89b3e26;--accent-glow:#e89b3e40;--text-primary:var(--bone);--text-secondary:var(--smoke);--text-muted:var(--smoke);--text-tertiary:var(--storm);--positive:var(--amber);--positive-glow:#e89b3e40;--negative:var(--storm);--negative-glow:#2a5a6e33;--super:var(--gold);--super-glow:#f4b94240;--watched:var(--success);--star:var(--gold);--border-subtle:#2a5a6e1a;--border-medium:#2a5a6e2e;--border-strong:#2a5a6e4d;--border-signal:#e89b3e40;--border-signal-hot:#e89b3e80;--border-danger:#c45c5c4d;--gradient-turbulence:radial-gradient(ellipse at 50% 60%, #1b3a4b 0%, #0d1b2a 50%, #080f1a 100%);--gradient-card:linear-gradient(145deg, #1b3a4b80 0%, #0d1b2ab3 100%);--gradient-signal-glow:radial-gradient(ellipse at 50% 50%, #e89b3e26 0%, transparent 70%);--gradient-converge:radial-gradient(ellipse at 50% 50%, #e89b3e1a 0%, #4a8fa80a 40%, transparent 70%);--gradient-amber-fade:linear-gradient(180deg, #e89b3e0f 0%, transparent 60%);--match-glow:var(--amber);--confetti-1:var(--amber);--confetti-2:var(--gold);--confetti-3:var(--bone);--confetti-4:var(--frost);--confetti-5:var(--success);--glass-bg:#080f1ad9;--glass-border:var(--border-subtle);--font-display:"Playfair Display", Georgia, "Times New Roman", serif;--font-body:"DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "SF Mono", "Fira Code", monospace;--font-title:400 32px/1.2 var(--font-display);--font-card-title:400 22px/1.25 var(--font-display);--font-body-text:300 14px/1.6 var(--font-body);--font-chip:500 12px/1 var(--font-body);--font-button:500 14px/1 var(--font-mono);--font-label:400 10px/1.4 var(--font-mono);--font-data:500 12px/1.4 var(--font-mono);--font-celebration:400 36px/1.1 var(--font-display);--font-celebration-sub:italic 400 18px/1.3 var(--font-display);--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:40px;--space-2xl:64px;--radius-sm:4px;--radius-md:8px;--radius-lg:16px;--radius-pill:100px;--shadow-button:0 2px 8px #0003}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);background:var(--abyss);color:var(--bone);overscroll-behavior:none;min-height:100dvh;font-weight:300;overflow-x:hidden}#root{flex-direction:column;min-height:100dvh;display:flex}img{max-width:100%;display:block}button{font-family:var(--font-body);cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent;background:0 0;border:none}@keyframes converge-in{0%{opacity:0;filter:blur(6px);transform:scale(1.08)}to{opacity:1;filter:blur();transform:scale(1)}}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes glow-pulse{0%,to{box-shadow:0 0 #e89b3e66}50%{box-shadow:0 0 40px #e89b3e26}}@keyframes breathe{0%,to{opacity:.6}50%{opacity:1}}@keyframes confetti-fall{0%{opacity:1;transform:translateY(-10vh)rotate(0)}80%{opacity:1}to{transform:translateY(110vh) rotate(var(--confetti-rotation,720deg));opacity:0}}@keyframes confetti-drift{0%,to{transform:translate(0)}50%{transform:translateX(var(--confetti-drift,30px))}}@keyframes pulse-accent{0%,to{box-shadow:0 0 #e89b3e66}50%{box-shadow:0 0 0 8px #e89b3e00}}.pulse{animation:1.5s ease-in-out 3 pulse-accent}.btn{font:var(--font-button);text-transform:uppercase;letter-spacing:.06em;padding:var(--space-md) var(--space-xl);border-radius:var(--radius-sm);justify-content:center;align-items:center;min-height:48px;transition:transform .15s ease-out,background-color .2s ease-out,border-color .2s ease-out;display:inline-flex}.btn:active{transform:scale(.95)}.btn-filled{background:var(--amber);color:var(--abyss)}.btn-filled:hover{background:var(--gold)}.btn-filled:disabled{opacity:.4;pointer-events:none}.btn-outline{border:1px solid var(--border-strong);color:var(--frost);background:0 0}.btn-outline:hover{border-color:var(--frost);color:var(--mist)}.genre-chip{font:var(--font-chip);border-radius:var(--radius-pill);border:1px solid var(--border-medium);color:var(--smoke);text-align:center;background:0 0;padding:10px 16px;transition:background-color .2s ease-out,border-color .2s ease-out,color .2s ease-out,transform .15s ease-out}.genre-chip:active{transform:scale(.95)}.genre-chip.selected{border-color:var(--border-signal);color:var(--amber);background:#e89b3e14;font-weight:500}.action-btn{border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;font-size:24px;transition:transform .15s ease-out;display:flex}.action-btn:active{transform:scale(.88)}.action-btn-skip{border:2px solid var(--border-strong);color:var(--storm);background:#080f1a99}.action-btn-like{border:2px solid var(--border-signal);color:var(--amber);background:#080f1a99}.action-btn-super{color:var(--gold);background:#080f1a99;border:2px solid #f4b9424d}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom,16px)}.safe-area-top{padding-top:env(safe-area-inset-top,0px)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.1s!important;animation-duration:.1s!important}}