*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:#17402f;color:#fff;-webkit-text-size-adjust:100%;overflow-x:hidden;min-width:0}
main{min-height:100%;min-height:100dvh;display:flex;flex-direction:column;padding:max(14px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));gap:12px;max-width:520px;margin:0 auto;width:100%}
.top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;color:#cfe3d8;min-width:0}
.top b{color:#e9c46a;letter-spacing:.06em;white-space:nowrap}
.top span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#e76f51;margin-right:6px;vertical-align:middle}
.dot.on{background:#7bd389}
h1{font-size:clamp(22px,7vw,30px);line-height:1.15;font-weight:800;overflow-wrap:anywhere}
p{font-size:16px;line-height:1.45;color:#e6efe9;overflow-wrap:anywhere}
.small{font-size:13px;color:#b9d2c4}
.card{background:rgba(255,255,255,.08);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:10px;min-width:0}
label{font-size:14px;color:#cfe3d8}
input{width:100%;min-width:0;font:inherit;font-size:20px;padding:12px 14px;border-radius:12px;border:2px solid transparent;background:#fff;color:#17402f}
input:focus{outline:none;border-color:#e9c46a}
input.code{text-transform:uppercase;letter-spacing:.3em;text-align:center;font-weight:800}
button{font:inherit;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.btn{width:100%;padding:14px 16px;border-radius:14px;background:#e9c46a;color:#17402f;font-weight:800;font-size:18px;min-height:52px}
.btn.ghost{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.35);font-weight:600;font-size:16px;min-height:46px}
.btn:disabled{opacity:.5}
.teams{display:grid;grid-template-columns:1fr;gap:8px}
.teams button{padding:13px 14px;border-radius:12px;background:#fff;color:#17402f;font-size:17px;font-weight:700;text-align:left;overflow-wrap:anywhere;min-height:50px}
.teams button.sel{background:#e9c46a}
.opts{display:grid;grid-template-columns:1fr;gap:10px;flex:1}
.opt{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:#fff;color:#17402f;font-size:17px;font-weight:600;text-align:left;min-height:64px;min-width:0}
.opt i{font-style:normal;flex:0 0 44px;height:44px;border-radius:12px;display:grid;place-items:center;color:#fff;font-weight:900;font-size:22px}
.opt span{min-width:0;overflow-wrap:anywhere}
.o0 i{background:#e63946}.o1 i{background:#277da1}.o2 i{background:#f4a261}.o3 i{background:#2a9d8f}
.opt.chosen{outline:4px solid #e9c46a;outline-offset:2px}
.opt.dim{opacity:.45}
.opt.right{background:#c7f2cf}.opt.wrong{background:#ffd6d6}
@media (min-width:420px) and (min-height:560px){.opts.four{grid-template-columns:1fr 1fr}.opts.four .opt{flex-direction:column;justify-content:center;text-align:center;min-height:120px}}
.buzz{flex:1;display:grid;place-items:center;min-height:220px}
.buzz button{width:min(78vw,300px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff7b7b,#d62828 60%,#9b1515);color:#fff;font-size:clamp(28px,10vw,44px);font-weight:900;letter-spacing:.04em;box-shadow:0 10px 0 #6d0f0f,0 18px 30px rgba(0,0,0,.35)}
.buzz button:active{transform:translateY(6px);box-shadow:0 4px 0 #6d0f0f,0 8px 16px rgba(0,0,0,.35)}
.buzz button:disabled{filter:grayscale(.6);opacity:.6}
.big{font-size:clamp(40px,16vw,72px);font-weight:900;color:#e9c46a;text-align:center;line-height:1}
.center{text-align:center}
.foot{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.err{background:#e76f51;color:#fff;border-radius:12px;padding:10px 12px;font-size:15px}
.gap{margin-top:8vh}