:root{--bg: #0a0a0f;--bg2: #12121a;--bg3: #1a1a2e;--purple: #a855f7;--purple-dim: #7c3aed;--teal: #14b8a6;--coral: #f97316;--yellow: #eab308;--green: #22c55e;--pink: #ec4899;--white: #f0f0f0;--grey: #444;--font: "Press Start 2P", cursive}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%;overflow-x:hidden}body{background:var(--bg);color:var(--white);font-family:var(--font);font-size:12px;line-height:1.8;-webkit-font-smoothing:none}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.07) 2px,rgba(0,0,0,.07) 4px);pointer-events:none;z-index:9999}.glow-purple{text-shadow:0 0 10px var(--purple),0 0 20px var(--purple)}.glow-teal{text-shadow:0 0 10px var(--teal),0 0 20px var(--teal)}.glow-coral{text-shadow:0 0 10px var(--coral),0 0 20px var(--coral)}.glow-yellow{text-shadow:0 0 10px var(--yellow),0 0 20px var(--yellow)}.pixel-box{border:3px solid var(--purple);box-shadow:0 0 12px #a855f766,inset 0 0 12px #a855f70d;background:var(--bg2)}.pixel-box-teal{border:3px solid var(--teal);box-shadow:0 0 12px #14b8a666,inset 0 0 12px #14b8a60d;background:var(--bg2)}.pixel-box-coral{border:3px solid var(--coral);box-shadow:0 0 12px #f9731666;background:var(--bg2)}.pixel-box-yellow{border:3px solid var(--yellow);box-shadow:0 0 12px #eab30866;background:var(--bg2)}.btn{font-family:var(--font);font-size:10px;padding:12px 20px;cursor:pointer;border:3px solid currentColor;background:transparent;color:var(--white);text-transform:uppercase;letter-spacing:1px;transition:all .1s;display:inline-block}.btn:hover:not(:disabled){background:#ffffff14;transform:translateY(-2px)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.35;cursor:not-allowed}.btn-purple{color:var(--purple);border-color:var(--purple);box-shadow:0 0 8px #a855f766}.btn-purple:hover:not(:disabled){background:#a855f726;box-shadow:0 0 20px #a855f7b3}.btn-teal{color:var(--teal);border-color:var(--teal);box-shadow:0 0 8px #14b8a666}.btn-teal:hover:not(:disabled){background:#14b8a626}.btn-coral{color:var(--coral);border-color:var(--coral);box-shadow:0 0 8px #f9731666}.btn-coral:hover:not(:disabled){background:#f9731626}.btn-yellow{color:var(--yellow);border-color:var(--yellow);box-shadow:0 0 8px #eab30866}.btn-yellow:hover:not(:disabled){background:#eab30826}.btn-green{color:var(--green);border-color:var(--green);box-shadow:0 0 8px #22c55e66}.btn-green:hover:not(:disabled){background:#22c55e26}.btn-lg{font-size:14px;padding:16px 32px}.btn-sm{font-size:8px;padding:8px 14px}.pixel-input{font-family:var(--font);font-size:11px;padding:10px 14px;background:var(--bg3);border:2px solid var(--grey);color:var(--white);outline:none;width:100%;transition:border-color .2s,box-shadow .2s}.pixel-input:focus{border-color:var(--teal);box-shadow:0 0 8px #14b8a666}.pixel-input::placeholder{color:var(--grey);font-size:9px}.arcade-title{font-size:clamp(14px,4vw,28px);text-align:center;letter-spacing:2px;color:var(--purple);text-shadow:0 0 20px var(--purple),0 0 40px rgba(168,85,247,.5);animation:flicker 5s infinite}.arcade-subtitle{font-size:clamp(7px,2vw,11px);text-align:center;color:var(--teal);text-shadow:0 0 10px var(--teal);letter-spacing:3px;margin-top:8px}@keyframes flicker{0%,95%,to{opacity:1}96%{opacity:.8}97%{opacity:1}98%{opacity:.6}99%{opacity:1}}@keyframes blink{50%{opacity:0}}.blink{animation:blink 1s step-end infinite}@keyframes slide-in-up{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}.slide-in-up{animation:slide-in-up .4s ease-out}@keyframes slide-in-down{0%{transform:translateY(-40px);opacity:0}to{transform:translateY(0);opacity:1}}.slide-in-down{animation:slide-in-down .4s ease-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}@keyframes countdown-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2);color:#f33;text-shadow:0 0 20px #ff3333}}.countdown-urgent{animation:countdown-pulse .5s ease-in-out infinite;color:var(--coral)}@keyframes spin-in{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.spin-in{animation:spin-in .5s cubic-bezier(.175,.885,.32,1.275)}@keyframes neon-pulse{0%,to{box-shadow:0 0 8px currentColor}50%{box-shadow:0 0 24px currentColor,0 0 48px currentColor}}.neon-pulse{animation:neon-pulse 2s ease-in-out infinite}.full-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.container{width:100%;max-width:960px;margin:0 auto;padding:20px}.card{padding:20px;margin:12px 0}.options-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}@media (max-width: 500px){.options-grid{grid-template-columns:1fr}}.option-btn{padding:14px 16px;border:3px solid var(--grey);background:var(--bg2);color:var(--white);font-family:var(--font);font-size:9px;cursor:pointer;text-align:left;line-height:1.6;transition:all .15s;width:100%}.option-btn:hover:not(:disabled){border-color:var(--teal);background:#14b8a61a;box-shadow:0 0 10px #14b8a64d}.option-btn.selected{border-color:var(--yellow);background:#eab30826;box-shadow:0 0 12px #eab30866}.option-btn.correct{border-color:var(--green);background:#22c55e33}.option-btn.wrong{border-color:#ef4444;background:#ef444426;animation:shake .3s ease}.option-btn:disabled{cursor:default}.progress-bar{height:6px;background:var(--bg3);border:1px solid var(--grey);overflow:hidden}.progress-fill{height:100%;background:var(--teal);box-shadow:0 0 8px var(--teal);transition:width .1s linear}.progress-fill.urgent{background:var(--coral);box-shadow:0 0 8px var(--coral)}.room-code{font-size:clamp(22px,5vw,44px);color:var(--teal);text-shadow:0 0 20px var(--teal);letter-spacing:8px;text-align:center}.tag{display:inline-block;padding:4px 10px;border:2px solid currentColor;font-size:8px;text-transform:uppercase}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--purple-dim)}