:root{--bg:#1b1030;--bg-2:#2a1a4a;--card:#2d1b52;--text:#f3eeff;--muted:#b7a9d8;--accent:#aa3bff;--accent-2:#ff5db1;--a:#e8482f;--b:#2f7de8;--c:#f0a92b;--d:#35b06a;color:var(--text);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-font-smoothing:antialiased;font:18px/1.4 system-ui,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:linear-gradient(160deg, var(--bg), var(--bg-2));background-attachment:fixed}#app{flex-direction:column;max-width:520px;min-height:100svh;margin:0 auto;display:flex}.screen{padding:28px 22px calc(28px + env(safe-area-inset-bottom));text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:20px;display:flex}h1{margin:0;font-size:34px;font-weight:700}h2{margin:0;font-size:24px;font-weight:600}.label{margin:0;font-size:20px;font-weight:600}.hint{color:var(--muted);max-width:32ch;margin:0;font-size:15px}.status{color:var(--muted);white-space:pre-line;font-size:20px}input.field{text-align:center;width:100%;max-width:340px;color:var(--text);background:#ffffff14;border:2px solid #0000;border-radius:14px;outline:none;padding:16px;font-size:22px}input.field:focus{border-color:var(--accent)}.btn{color:#fff;background:linear-gradient(135deg, var(--accent), var(--accent-2));cursor:pointer;border:none;border-radius:14px;width:100%;max-width:340px;padding:16px 20px;font-size:20px;font-weight:700;transition:transform 80ms,opacity .2s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:default}.btn.ghost{color:var(--text);background:0 0;border:2px solid #ffffff40}.genders{gap:14px;display:flex}.gender{width:76px;height:76px;color:var(--text);cursor:pointer;background:#ffffff0f;border:3px solid #fff3;border-radius:50%;font-size:32px}.gender.on{border-color:var(--accent);background:var(--accent-bg,#aa3bff40)}.avatar{object-fit:cover;background:#ffffff14;border-radius:50%;width:128px;height:128px}.player-name{font-size:22px;font-weight:700}.gameid{color:var(--muted);letter-spacing:2px;font-size:16px}.answers{flex-direction:column;gap:14px;width:100%;display:flex}.answer{text-align:left;color:#fff;cursor:pointer;border:none;border-radius:16px;align-items:center;gap:14px;width:100%;padding:16px;font-size:18px;transition:transform 80ms;display:flex}.answer:active{transform:scale(.98)}.answer .badge{background:#00000040;border-radius:10px;flex:none;place-items:center;width:40px;height:40px;font-size:20px;font-weight:800;display:grid}.answer.A{background:var(--a)}.answer.B{background:var(--b)}.answer.C{background:var(--c)}.answer.D{background:var(--d)}.category{min-height:1.4em;font-size:22px;font-weight:700}.countdown{width:96px;height:96px;position:relative}.countdown svg{width:100%;height:100%;transform:rotate(-90deg)}.countdown .track{fill:none;stroke:#ffffff26;stroke-width:8px}.countdown .bar{fill:none;stroke:var(--accent-2);stroke-width:8px;stroke-linecap:round;transition:stroke-dashoffset .1s linear}.countdown .num{place-items:center;font-size:32px;font-weight:800;display:grid;position:absolute;inset:0}.result-row{gap:40px;display:flex}.result-box{flex-direction:column;display:flex}.result-box .big{color:var(--accent-2);font-size:40px;font-weight:800}.result-box .cap{letter-spacing:1px;color:var(--muted);font-size:14px}.place{font-size:56px;font-weight:800}.place sup{font-size:24px}.overlay{z-index:10;background:#0009;place-items:center;padding:22px;display:grid;position:fixed;inset:0}.popup{background:var(--card);border-radius:20px;flex-direction:column;align-items:center;gap:14px;width:100%;max-width:360px;padding:28px 24px;display:flex}.popup .oops{color:var(--accent-2);font-size:28px;font-weight:800}.spinner{border:5px solid #ffffff26;border-top-color:var(--accent-2);border-radius:50%;width:46px;height:46px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}