:root{--bg: #0f0a1e;--bg-2: #1a1230;--card: #1e1638;--border: #2c2050;--text: #f5f0ff;--muted: #9a8fc4;--accent: #ff3ec9;--accent-2: #6effe7;--correct: #1fcf6c;--wrong: #ff4d6d}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,sans-serif;font-size:16px;line-height:1.5}body{background:var(--bg)}.bg-blobs{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden}.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.32;will-change:transform}.blob.b1{width:460px;height:460px;background:#ff3ec9;top:-12%;left:-10%;animation:drift1 24s ease-in-out infinite alternate}.blob.b2{width:540px;height:540px;background:#6effe7;bottom:-18%;right:-12%;animation:drift2 30s ease-in-out infinite alternate}.blob.b3{width:380px;height:380px;background:#5ab2ff;top:38%;left:28%;animation:drift3 34s ease-in-out infinite alternate}@keyframes drift1{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(80px,100px,0) scale(1.1)}}@keyframes drift2{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(-90px,-60px,0) scale(1.15)}}@keyframes drift3{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(120px,-80px,0) scale(.9)}}.screen{position:relative;z-index:1}@media (prefers-reduced-motion: reduce){.blob{animation:none}}.screen{min-height:100vh;padding:24px 16px}.screen.center{display:flex;align-items:center;justify-content:center;flex-direction:column}.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:24px;width:100%;max-width:420px;box-shadow:0 18px 50px #0006;position:relative}.card.wide{max-width:640px;margin:0 auto 16px}.title{margin:0 0 4px;font-size:28px;background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.muted{color:var(--muted)}.small{font-size:13px}.center-text{text-align:center}.label{display:block;margin-top:16px;margin-bottom:6px;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.input,select.input{width:100%;background:var(--bg-2);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:12px 14px;font-size:16px;font-family:inherit}.input:focus{outline:2px solid var(--accent)}.input.mono{font-family:ui-monospace,SFMono-Regular,monospace;letter-spacing:.1em;text-transform:uppercase}.btn{background:var(--bg-2);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:12px 18px;font-size:15px;font-family:inherit;cursor:pointer;transition:transform .05s,background .15s}.btn:hover:not(:disabled){background:#251a44}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:linear-gradient(135deg,var(--accent),#b426d8);border-color:transparent;font-weight:600}.btn.primary:hover:not(:disabled){filter:brightness(1.1)}.btn.block{display:block;width:100%;margin-top:16px}.btn.big{padding:16px 20px;font-size:17px}.btn.small{padding:8px 14px;font-size:13px}.btn.link{background:transparent;border:none;color:var(--muted);padding:4px 8px}.btn.link:hover{background:transparent;color:var(--text)}.btn.tl{position:absolute;top:12px;left:12px}.row{display:flex;gap:10px}.row>.input{flex:1}.row>.btn.block{margin-top:0;width:auto}.divider{display:flex;align-items:center;margin:20px 0 4px;color:var(--muted);font-size:12px;text-transform:uppercase}.divider:before,.divider:after{content:"";flex:1;border-top:1px solid var(--border)}.divider span{padding:0 12px}.error-msg{margin-top:12px;padding:10px 12px;background:#ff4d6d26;border:1px solid var(--wrong);border-radius:8px;color:#ffd4dc;font-size:14px}.code-display{text-align:center;margin:16px 0;padding:16px;background:var(--bg-2);border-radius:12px;border:1px solid var(--border)}.code{font-family:ui-monospace,SFMono-Regular,monospace;font-size:40px;font-weight:700;letter-spacing:.12em;margin:4px 0 12px;color:var(--accent-2)}.section{margin:22px 0}.section-title{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:10px}.players,.leaderboard-list{list-style:none;margin:0;padding:0}.players li,.leaderboard-list li{display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--bg-2);border-radius:8px;margin-bottom:6px}.players li.me,.leaderboard-list li.me{outline:1px solid var(--c, var(--accent))}.score{margin-left:auto;font-weight:700;color:var(--accent-2)}.badge{margin-left:auto;font-size:11px;background:var(--accent);color:#fff;padding:2px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.05em}.badge.subtle{background:var(--border);color:var(--muted);margin-left:4px}.players li .badge:not(:last-child){margin-left:auto}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{background:var(--bg-2);border:1px solid var(--border);color:var(--text);padding:8px 14px;border-radius:999px;font-size:14px;text-transform:capitalize;cursor:pointer}.chip:hover:not(:disabled){background:#251a44}.chip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.chip:disabled{cursor:not-allowed;opacity:.6}.host-bar{display:flex;justify-content:flex-end;max-width:640px;margin:0 auto 8px}.end-btn{font-size:12px;letter-spacing:.04em;color:var(--muted);background:#1e1638b3;border:1px solid var(--border);padding:6px 12px;border-radius:8px}.end-btn:hover{color:var(--wrong);border-color:var(--wrong);background:#ff4d6d1a}.score-row{display:flex;flex-wrap:wrap;gap:8px;max-width:640px;margin:0 auto 10px;padding:0}.pscore{flex:1 1 0;min-width:0;display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--card);border:1px solid var(--border);border-radius:999px;transition:border-color .2s,background .2s}.pscore{position:relative}.pscore.me{border-color:var(--c, var(--accent));box-shadow:0 0 0 1px var(--c, var(--accent)) inset}.pscore.answered{background:#1fcf6c1f;border-color:var(--correct)}.pscore.sabotaged{background:#ff4d6d2e;border-color:var(--wrong);animation:shake .5s ease-out}.sab-btn{background:transparent;border:1px solid var(--border);color:var(--text);border-radius:999px;padding:4px 10px;font-size:14px;cursor:pointer;margin-left:4px;opacity:.7;transition:opacity .15s,background .15s,transform .05s}.sab-btn:hover{opacity:1;background:#ff4d6d33;border-color:var(--wrong);transform:scale(1.1)}.sab-btn:active{transform:scale(.95)}.delta{position:absolute;top:-6px;right:8px;font-weight:800;font-size:15px;pointer-events:none;animation:floatUp 1.8s ease-out forwards;text-shadow:0 0 8px rgba(0,0,0,.6)}.delta.pos{color:var(--correct)}.delta.neg{color:var(--wrong)}@keyframes floatUp{0%{opacity:0;transform:translateY(0)}15%{opacity:1;transform:translateY(-6px)}80%{opacity:1;transform:translateY(-22px)}to{opacity:0;transform:translateY(-30px)}}.tokens-hint{max-width:640px;margin:-4px auto 10px;text-align:center;color:var(--accent-2)}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;color:#0f0a1e;font-size:15px;flex-shrink:0}.avatar-sm{width:28px;height:28px;font-size:13px}.pname-inline{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pinfo{display:flex;flex-direction:column;line-height:1.15;min-width:0;flex:1}.pname{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pts{font-size:17px;font-weight:700;color:var(--accent-2);font-variant-numeric:tabular-nums}.game-bar{display:flex;justify-content:space-between;align-items:center;max-width:640px;margin:0 auto 12px;padding:10px 16px;background:var(--card);border:1px solid var(--border);border-radius:12px;font-size:14px;color:var(--muted)}.timer{font-size:22px;font-weight:700;color:var(--accent-2);font-family:ui-monospace,SFMono-Regular,monospace;transition:color .2s}.timer.low{color:var(--wrong);animation:pulse .8s infinite}.timer-bar{max-width:640px;height:4px;margin:0 auto 12px;background:var(--border);border-radius:999px;overflow:hidden}.timer-bar-fill{height:100%;border-radius:999px;transition:width .1s linear,background .4s}.qcat{margin-bottom:6px}.question{font-size:22px;line-height:1.35;margin:4px 0 20px}.choices{display:grid;grid-template-columns:1fr;gap:10px}@media (min-width: 520px){.choices{grid-template-columns:1fr 1fr}}.choice{display:flex;align-items:center;gap:12px;text-align:left;background:var(--bg-2);border:2px solid var(--border);color:var(--text);padding:14px 16px;border-radius:12px;font-size:16px;font-family:inherit;cursor:pointer;transition:background .15s,border-color .15s,transform .05s,opacity .3s;position:relative;overflow:hidden}.choice-letter{width:28px;height:28px;border-radius:8px;background:var(--border);color:var(--text);display:grid;place-items:center;font-weight:700;font-size:13px;flex-shrink:0;transition:background .2s,color .2s}.choice:hover:not(:disabled) .choice-letter{background:var(--me, var(--accent));color:#0f0a1e}.choice.picked .choice-letter{background:var(--me, var(--accent));color:#0f0a1e}.choice.correct .choice-letter{background:var(--correct);color:#fff}.choice.wrong .choice-letter{background:var(--wrong);color:#fff}.choice-text{flex:1}.choice:hover:not(:disabled){background:#251a44;border-color:var(--me, var(--accent))}.choice:active:not(:disabled){transform:scale(.99)}.choice:disabled{cursor:default}.choice.picked{border-color:var(--me, var(--accent));background:color-mix(in srgb,var(--me, var(--accent)) 18%,transparent)}.choice.correct{border-color:var(--correct);background:#1fcf6c2e}.choice.wrong{border-color:var(--wrong);background:#ff4d6d2e}.reveal{margin-top:16px;font-size:16px;animation:fadeIn .35s ease-out}.reveal-answer{color:var(--correct)}.reveal-host{margin-top:12px;display:flex;flex-direction:column;align-items:center;gap:8px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@keyframes pop{0%{transform:scale(.7);opacity:0}60%{transform:scale(1.08);opacity:1}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-7px)}40%{transform:translate(7px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}@keyframes correctBounce{0%{transform:scale(1)}30%{transform:scale(1.08);box-shadow:0 0 0 6px #1fcf6c2e,0 0 30px #1fcf6c80}60%{transform:scale(.98)}to{transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}@keyframes listenPulse{0%,to{transform:scale(1);box-shadow:0 0 0 0 var(--me, var(--accent-2))}50%{transform:scale(1.08);box-shadow:0 0 0 18px transparent}}@keyframes scoreBump{0%{transform:scale(1)}30%{transform:scale(1.45);color:var(--correct)}to{transform:scale(1);color:var(--accent-2)}}@keyframes avatarTada{0%{transform:scale(1) rotate(0)}20%{transform:scale(1.15) rotate(-8deg)}40%{transform:scale(1.15) rotate(8deg)}60%{transform:scale(1.1) rotate(-4deg)}80%{transform:scale(1.1) rotate(4deg)}to{transform:scale(1) rotate(0)}}@keyframes confettiFall{0%{transform:translateY(-20vh) rotate(0);opacity:1}to{transform:translateY(110vh) rotate(720deg);opacity:.9}}@keyframes trophyDance{0%,to{transform:rotate(-6deg) scale(1)}50%{transform:rotate(6deg) scale(1.06)}}.question-card{animation:fadeInDown .35s ease-out}.question{animation:fadeInUp .4s ease-out .05s backwards}.qcat{animation:fadeIn .4s ease-out}.score-row{animation:fadeInDown .4s ease-out}.game-bar{animation:fadeInDown .45s ease-out .05s backwards}.choice{animation:fadeInUp .35s ease-out backwards;animation-delay:calc(var(--i, 0) * 80ms)}.choice.picked{animation:pop .35s ease-out}.choice.correct{animation:correctBounce .7s ease-out}.choice.wrong{animation:shake .5s ease-out}.choice.dim{opacity:.4;transition:opacity .3s}.pscore.answered .avatar{animation:avatarTada .6s ease-out}.pts{transition:color .3s}.pscore.answered .pts{animation:scoreBump .7s ease-out}.leaderboard ol{list-style:none;margin:0;padding:0}.leaderboard li{display:flex;padding:8px 12px;background:var(--bg-2);border-radius:8px;margin-bottom:4px}.leaderboard li.me{outline:1px solid var(--accent)}.winner{text-align:center;font-size:20px;padding:24px 16px;margin:16px 0;background:linear-gradient(135deg,#ff3ec92e,#6effe71f);border-radius:16px;position:relative;overflow:hidden}.trophy{font-size:56px;display:inline-block;animation:trophyDance 1.5s ease-in-out infinite;filter:drop-shadow(0 4px 16px rgba(255,200,80,.5))}.winner-name{display:block;font-size:28px;margin-top:6px;letter-spacing:.02em}.winner-score{font-size:16px;color:var(--muted);margin-top:2px}.end-card{animation:pop .6s ease-out;position:relative;z-index:2}.listen-state{display:flex;flex-direction:column;align-items:center;gap:16px;padding:36px 16px;animation:fadeIn .3s}.listen-dot{width:72px;height:72px;border-radius:50%;background:var(--bg-2);display:grid;place-items:center;font-size:32px;animation:listenPulse 1.4s ease-in-out infinite}.listen-text{color:var(--muted);font-size:15px;letter-spacing:.02em}.skip-btn{opacity:.7}.end-screen{position:relative;overflow:hidden;min-height:100vh}.confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:1}.confetti-piece{position:absolute;top:-20px;border-radius:2px;animation:confettiFall linear forwards}
