:root{--bg:#141A26;--panel:#1E2738;--line:#2C3850;--txt:#F2F4F8;--mut:#9AA6BD;--acc:#F59E2B;
--c0:#E21B3C;--c1:#1368CE;--c2:#D89E00;--c3:#26890C;--ok:#2BC46B;--bad:#E5484D}
*{box-sizing:border-box;margin:0}
html,body{height:100%}
body{background:var(--bg) radial-gradient(ellipse at 50% -20%,#23304a 0%,var(--bg) 60%) fixed;color:var(--txt);
font-family:Rubik,system-ui,sans-serif;overflow-x:hidden;-webkit-tap-highlight-color:transparent}
h1,h2,h3,.o{font-family:Oswald,Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em}
button{font:inherit;cursor:pointer;border:0;color:inherit}
.btn{background:var(--acc);color:#141A26;font-family:Oswald,sans-serif;font-weight:700;text-transform:uppercase;
font-size:clamp(1.1rem,2.2vw,2.2rem);padding:.6em 1.6em;border-radius:14px;box-shadow:0 6px 0 #b86f12;transition:transform .1s,box-shadow .1s}
.btn:active{transform:translateY(4px);box-shadow:0 2px 0 #b86f12}
.btn:disabled{opacity:.5}
.btn:focus-visible,input:focus-visible,.opt:focus-visible{outline:3px solid #fff;outline-offset:3px}
.screen{display:none;min-height:100vh;min-height:100dvh;padding:16px;flex-direction:column;align-items:center;justify-content:center;gap:2vh;text-align:center}
.screen.on{display:flex;animation:in .45s cubic-bezier(.2,.9,.3,1.2)}
@keyframes in{from{opacity:0;transform:translateY(24px) scale(.97)}}
.acc{color:var(--acc)}
.mut{color:var(--mut)}
.err{color:var(--bad);font-weight:600;min-height:1.4em}
#mute{position:fixed;top:12px;right:12px;z-index:50;background:var(--panel);border:1px solid var(--line);border-radius:50%;width:48px;height:48px;font-size:1.4rem}
#net{position:fixed;top:0;left:0;right:0;z-index:60;background:var(--bad);color:#fff;text-align:center;padding:6px;font-weight:600;display:none}
#net.on{display:block}
.shape{width:1em;height:1em;flex:none}
.c0{background:var(--c0)}.c1{background:var(--c1)}.c2{background:var(--c2)}.c3{background:var(--c3)}
.bonusbar{background:repeating-linear-gradient(45deg,#E5484D 0 22px,#b3262b 22px 44px);color:#fff;font-family:Oswald,sans-serif;
padding:.3em 1em;border-radius:10px;font-size:clamp(1rem,2.4vw,2.4rem);animation:pulse 1s infinite}
@keyframes pulse{50%{transform:scale(1.04)}}
canvas#confetti{position:fixed;inset:0;pointer-events:none;z-index:40}
