*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0b0a12;--bg-2: #14111f;--bg-3: #1c1830;--line: rgba(244, 241, 255, .1);--line-strong: rgba(244, 241, 255, .22);--ink: #f4f1ff;--muted: #a89cc8;--dim: #6f6494;--lime: #d6f545;--pink: #ff4fa3;--violet: #8b5cf6;--cyan: #45e3ff;--orange: #ff8a3c;--gold: #ffd60a;--green: #1ed760;--red: #ff5470;--font-display: "Unbounded", sans-serif;--font-body: "Space Grotesk", sans-serif;--font-serif: "Instrument Serif", serif;--font-mono: "JetBrains Mono", monospace}html,body{height:100%;background:var(--bg);color:var(--ink);font-family:var(--font-body);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;position:relative;z-index:1}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#d6f54559;border-radius:4px}::selection{background:var(--lime);color:#0b0a12}.display{font-family:var(--font-display);font-weight:900;line-height:.98;letter-spacing:-.01em;text-transform:uppercase}.heading-giant{font-family:var(--font-display);font-weight:900;font-size:clamp(2.6rem,13vw,6.5rem);line-height:.94;text-transform:uppercase;letter-spacing:-.02em}.heading-xl{font-family:var(--font-display);font-weight:900;font-size:clamp(2rem,9vw,4rem);line-height:.98;text-transform:uppercase}.heading-lg{font-family:var(--font-display);font-weight:700;font-size:clamp(1.5rem,6vw,2.6rem);line-height:1;text-transform:uppercase}.outline-text{color:transparent;-webkit-text-stroke:2px var(--ink)}.outline-text-lime{color:transparent;-webkit-text-stroke:2px var(--lime)}.serif-note{font-family:var(--font-serif);font-style:italic;font-weight:400;letter-spacing:.01em}.mono-label{font-family:var(--font-mono);font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:var(--dim)}.marquee{overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;pointer-events:none;mask-image:linear-gradient(90deg,transparent,black 8%,black 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,black 8%,black 92%,transparent)}.marquee-inner{display:inline-block;animation:marqueeScroll 28s linear infinite;font-family:var(--font-display);font-weight:700;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--dim)}.marquee-inner em{font-style:normal;color:var(--lime)}@keyframes marqueeScroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.panel{position:relative;border-radius:22px;background:var(--bg-2);border:1px solid var(--line)}.panel-inset{border-radius:14px;background:#f4f1ff0a;border:1px solid var(--line)}.sticker{display:inline-block;font-family:var(--font-display);font-weight:700;font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;padding:5px 10px;border-radius:8px;background:var(--lime);color:#0b0a12;transform:rotate(-2.5deg)}.sticker.pink{background:var(--pink);color:#fff}.sticker.cyan{background:var(--cyan)}.sticker.gold{background:var(--gold)}.sticker.tilt-r{transform:rotate(2deg)}.btn-primary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:clamp(15px,3vw,19px) clamp(16px,4vw,24px);border-radius:16px;border:2px solid #0b0a12;cursor:pointer;background:var(--lime);color:#0b0a12;font-family:var(--font-display);font-weight:700;font-size:clamp(.82rem,2.6vw,.98rem);text-transform:uppercase;letter-spacing:.05em;box-shadow:5px 5px 0 var(--pink);transition:transform .14s ease,box-shadow .14s ease,opacity .2s}.btn-primary:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--pink)}.btn-primary:active:not(:disabled){transform:translate(3px,3px);box-shadow:0 0 0 var(--pink)}.btn-primary:disabled{opacity:.55;cursor:default}.btn-primary.pink{background:var(--pink);color:#fff;box-shadow:5px 5px 0 var(--lime)}.btn-primary.pink:hover:not(:disabled){box-shadow:8px 8px 0 var(--lime)}.btn-primary.pink:active:not(:disabled){box-shadow:0 0 0 var(--lime)}.btn-ghost{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:12px;border:1px solid var(--line-strong);background:transparent;color:var(--muted);font-family:var(--font-body);font-weight:600;font-size:.88rem;cursor:pointer;transition:border-color .15s,color .15s,background .15s}.btn-ghost:hover{border-color:var(--lime);color:var(--lime)}.btn-ghost.danger:hover{border-color:var(--red);color:var(--red);background:#ff54700f}.text-input{width:100%;padding:clamp(12px,2.5vw,15px) 16px;border-radius:12px;outline:none;background:#f4f1ff0d;border:2px solid var(--line);color:var(--ink);font-family:var(--font-body);font-weight:500;font-size:clamp(.88rem,2.5vw,.98rem);transition:border-color .15s,box-shadow .15s,background .15s}.text-input::placeholder{color:var(--dim)}.text-input:focus{border-color:var(--lime);background:#d6f5450a;box-shadow:0 0 0 4px #d6f5451f}.text-input.code{font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:.45em;text-align:center;font-size:1.35rem}.chip{padding:7px 13px;border-radius:999px;border:1px solid var(--line-strong);background:transparent;color:var(--muted);font-family:var(--font-mono);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;transition:all .15s}.chip:hover:not(:disabled):not(.active){border-color:var(--lime);color:var(--lime)}.chip.active{background:var(--lime);border-color:var(--lime);color:#0b0a12}.chip:disabled{cursor:default}.chip:disabled:not(.active){opacity:.45}.vinyl{border-radius:50%;background:radial-gradient(circle at 50% 50%,#241f38 0 17%,#0d0b16 17% 19%,transparent 19%),repeating-radial-gradient(circle at 50% 50%,#17141f 0,#17141f 2px,#201b2e 2px,#201b2e 4px);border:1px solid rgba(244,241,255,.14);position:relative;display:grid;place-items:center;flex-shrink:0}.vinyl:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:conic-gradient(from 40deg,transparent 0 20%,rgba(255,255,255,.07) 25%,transparent 32% 68%,rgba(255,255,255,.05) 75%,transparent 82%);pointer-events:none}.vinyl.spinning{animation:spinSlow 2.4s linear infinite}@keyframes spinSlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.eq{display:inline-flex;align-items:flex-end;gap:2.5px;height:14px}.eq span{width:3px;border-radius:2px;background:var(--lime);animation:eqBounce .9s ease-in-out infinite}.eq span:nth-child(1){height:40%;animation-delay:0s}.eq span:nth-child(2){height:90%;animation-delay:.18s}.eq span:nth-child(3){height:60%;animation-delay:.36s}.eq span:nth-child(4){height:100%;animation-delay:.1s}.eq.paused span{animation-play-state:paused;height:25%}@keyframes eqBounce{0%,to{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}@keyframes cardFly{0%{transform:scale(1) translateY(0);opacity:1}50%{transform:scale(.9) translateY(-40px);opacity:.7}to{transform:scale(.7) translateY(0);opacity:1}}@keyframes slamIn{0%{opacity:0;transform:scale(1.6) rotate(4deg)}60%{opacity:1;transform:scale(.95) rotate(-1deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes floatDrift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(4vw,-3vh) scale(1.08)}66%{transform:translate(-3vw,4vh) scale(.94)}}@keyframes pulseGlow{0%,to{opacity:.55}50%{opacity:1}}.fade-up{animation:fadeUp .45s cubic-bezier(.22,.9,.34,1) both}.pop-in{animation:popIn .38s cubic-bezier(.34,1.56,.64,1) both}.slam-in{animation:slamIn .5s cubic-bezier(.22,.9,.3,1.2) both}.card-fly-out{animation:cardFly .5s ease forwards}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{display:inline-block;width:18px;height:18px;border:2px solid rgba(11,10,18,.25);border-top-color:#0b0a12;border-radius:50%;animation:spin .7s linear infinite}.spinner.on-dark{border-color:#f4f1ff40;border-top-color:var(--ink)}.error-banner{padding:12px 16px;border-radius:12px;background:#ff547017;border:1px solid rgba(255,84,112,.3);color:var(--red);font-size:.85rem;font-weight:500;text-align:center;line-height:1.5}.container{width:100%;max-width:720px;margin:0 auto;padding:24px 16px 40px}.grid-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}@media (max-width: 480px){.grid-2{grid-template-columns:minmax(0,1fr)}}@media (max-width: 480px){.game-hud{position:sticky;top:0;z-index:5;padding:10px 4px 12px;margin:-10px -4px 8px;background:linear-gradient(to bottom,#0b0a12f7 80%,#0b0a1200);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}}.round-segments{display:flex;gap:5px}.round-segments i{flex:1;height:5px;border-radius:3px;background:#f4f1ff1a;transition:background .4s}.round-segments i.done{background:var(--lime)}.round-segments i.current{background:var(--pink);animation:pulseGlow 1.4s ease-in-out infinite}@keyframes buzzerPulse{0%,to{box-shadow:0 0 #ff54708c,6px 6px #ff547059;transform:scale(1)}50%{box-shadow:0 0 0 22px #ff547000,6px 6px #ff547059;transform:scale(1.045)}}.buzzer-button{width:min(190px,60vw);height:min(190px,60vw);margin:0 auto;border-radius:50%;border:3px solid #fff;background:radial-gradient(circle at 35% 28%,#ff8fa8,var(--red) 55%,#b3123d);color:#fff;font-family:var(--font-display);font-weight:900;font-size:clamp(1.3rem,7vw,1.9rem);letter-spacing:.04em;cursor:pointer;animation:buzzerPulse 1.1s ease-in-out infinite;transition:transform .1s}.buzzer-button:active{transform:scale(.92);animation:none}@keyframes timerShake{0%,to{transform:translate(0)}25%{transform:translate(-1.5px)}75%{transform:translate(1.5px)}}.timer-urgent{animation:timerShake .4s linear infinite}@media (max-width: 480px){.timeline-track{height:40px!important}.timeline-thumb{width:30px!important;height:30px!important}}.volume-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:5px;border-radius:3px;background:#d6f54526;outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:13px;height:13px;border-radius:50%;background:var(--lime);border:2px solid #0b0a12;box-shadow:0 0 8px #d6f545b3;cursor:pointer;transition:transform .15s,box-shadow .15s}.volume-slider::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:var(--lime);border:2px solid #0b0a12;box-shadow:0 0 8px #d6f545b3;cursor:pointer;transition:transform .15s,box-shadow .15s}.volume-slider::-webkit-slider-thumb:hover,.volume-slider:active::-webkit-slider-thumb{transform:scale(1.25);box-shadow:0 0 14px #d6f545}.volume-slider::-moz-range-thumb:hover,.volume-slider:active::-moz-range-thumb{transform:scale(1.25);box-shadow:0 0 14px #d6f545}.volume-slider:disabled::-webkit-slider-thumb{cursor:default;box-shadow:none}.volume-slider:disabled::-moz-range-thumb{cursor:default;box-shadow:none}.track-intro{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:grid;place-items:center;pointer-events:none;background:#0b0a12d1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);animation:introBackdrop 1.5s ease forwards}@keyframes introBackdrop{0%{opacity:0}12%{opacity:1}78%{opacity:1}to{opacity:0}}.track-intro-title{font-family:var(--font-display);font-weight:900;font-size:clamp(3rem,16vw,7rem);text-transform:uppercase;letter-spacing:-.02em;color:var(--lime);text-shadow:6px 6px 0 rgba(255,79,163,.55);animation:introTitle 1.5s cubic-bezier(.2,.9,.3,1.15) forwards}@keyframes introTitle{0%{opacity:0;transform:scale(2.4) rotate(5deg)}20%{opacity:1;transform:scale(1) rotate(-1.5deg)}74%{opacity:1;transform:scale(1.04) rotate(-1.5deg)}to{opacity:0;transform:scale(1.1) rotate(-1.5deg)}}.track-intro-sub{font-family:var(--font-serif);font-style:italic;font-size:clamp(1rem,4vw,1.4rem);color:var(--muted);text-align:center;margin-top:8px;animation:introBackdrop 1.5s ease forwards}.icon-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line-strong);background:transparent;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:15px;line-height:1;transition:border-color .15s,color .15s,transform .12s}.icon-btn:hover{border-color:var(--lime);color:var(--lime)}.icon-btn:active{transform:scale(.9)}@keyframes confettiFall{0%{transform:translateY(-10vh) rotate(0);opacity:1}to{transform:translateY(110vh) rotate(720deg);opacity:.25}}.confetti-piece{position:fixed;top:0;width:9px;height:14px;border-radius:2px;pointer-events:none;z-index:0;animation:confettiFall linear infinite}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}