:root{--p1:#f5a524;--p2:#3fb8ff;--bg:#1b1e2b;--fg:#f4efe6;color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Rubik,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;height:100%;margin:0;overflow:hidden}#stage{position:fixed;inset:0}#stage canvas{touch-action:manipulation;display:block}.labels{pointer-events:none;direction:ltr;position:absolute;inset:0}.count{text-align:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0a0c148c;border-radius:999px;min-width:2em;padding:.15em .5em;font-size:clamp(12px,2.2vmin,18px);font-weight:700}.count.store{font-size:clamp(15px,3vmin,24px)}.count.bump{animation:.25s ease-out bump}@keyframes bump{40%{transform:scale(1.3)}}.hud{top:max(10px, env(safe-area-inset-top));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap;background:#0a0c148c;border-radius:16px;align-items:center;gap:clamp(8px,2vw,24px);max-width:calc(100vw - 16px);padding:8px 12px;display:flex;position:fixed;left:50%;transform:translate(-50%)}.player{border:2px solid #0000;border-radius:12px;align-items:center;gap:8px;padding:6px 12px;font-size:clamp(13px,2.4vmin,18px);transition:border-color .2s,background .2s;display:flex}.player .dot{border-radius:50%;width:12px;height:12px}.p1 .dot{background:var(--p1)}.p2 .dot{background:var(--p2)}.player .score{font-size:1.3em;font-weight:800}.player.active.p1{border-color:var(--p1);background:#f5a52426}.player.active.p2{border-color:var(--p2);background:#3fb8ff26}.turn{opacity:.8;text-align:center;min-width:6em;font-size:clamp(12px,2vmin,15px)}@media (width<=700px){.turn{display:none}.player .name{text-overflow:ellipsis;max-width:5.5em;overflow:hidden}.hud{gap:6px;padding:6px 8px}.player{gap:6px;padding:4px 8px}.icon{width:32px;height:32px;font-size:17px}}@media (width<=420px){.player .name{max-width:3.4em}.hud{gap:4px;padding:5px 6px}.player{gap:4px;padding:3px 6px}.tools{gap:3px}.icon{width:30px;height:30px;font-size:15px}}button{font:inherit;color:inherit;cursor:pointer;border:none}.tools{gap:6px;display:flex}.icon{background:#ffffff1a;border-radius:50%;width:36px;height:36px;font-size:19px;line-height:1}.icon:hover{background:#fff3}.hint{bottom:max(12px, env(safe-area-inset-bottom));opacity:.55;pointer-events:none;white-space:nowrap;font-size:13px;transition:opacity .6s;position:fixed;left:50%;transform:translate(-50%)}.hint.gone{opacity:0}.toast{text-shadow:0 4px 20px #0009;opacity:0;pointer-events:none;font-size:clamp(22px,6vmin,48px);font-weight:800;transition:opacity .25s,transform .25s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(.8)}.toast.show{opacity:1;transform:translate(-50%,-50%)scale(1)}.overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0a0c148c;place-items:center;transition:opacity .3s;display:grid;position:fixed;inset:0}.overlay.hidden{opacity:0;pointer-events:none}.card{text-align:center;background:#1e2234f2;border-radius:20px;padding:28px 40px;box-shadow:0 20px 60px #00000080}.card h1{margin:0 0 8px;font-size:clamp(26px,6vmin,44px)}.card p{opacity:.8;margin:0 0 20px;font-size:18px}.card .primary,.card .secondary{border-radius:12px;padding:12px 16px;font-size:18px;font-weight:700}.card .primary{background:var(--p1);color:#1b1e2b}.card .secondary{background:#ffffff1f}.actions{justify-content:center;gap:10px;display:flex}.setup{text-align:start;flex-direction:column;gap:16px;width:min(92vw,380px);max-height:92vh;padding:24px;display:flex;overflow:auto}.setup h1{text-align:center}.field{flex-direction:column;gap:6px;display:flex}.field.hidden{display:none}.field-label{opacity:.75;align-items:center;gap:6px;font-size:14px;display:flex}.field-label .dot{border-radius:50%;width:10px;height:10px}.p1-dot{background:var(--p1)}.p2-dot{background:var(--p2)}.segmented{background:#ffffff14;border-radius:12px;gap:4px;padding:4px;display:flex}.segmented button{background:0 0;border-radius:9px;flex:1;padding:10px 6px;font-size:15px}.segmented button.selected{background:#ffffff2e;font-weight:700}.setup input{font:inherit;color:inherit;-webkit-user-select:text;user-select:text;background:#ffffff0f;border:1px solid #ffffff26;border-radius:10px;padding:10px 12px;font-size:16px}.setup input:focus{outline:2px solid var(--p1);border-color:#0000}.setup .primary{margin-top:4px}.hidden{display:none!important}.lead{text-align:center;opacity:.85;margin:0;line-height:1.5}.warn{color:#ffcf70;margin:0;font-size:13px;line-height:1.4}#invite-link{text-align:left;font-size:14px}.share-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.share-grid .primary{grid-column:1/-1}.card .secondary.done{background:#78dc8c4d}.waiting{opacity:.8;justify-content:center;align-items:center;gap:10px;margin:0;display:flex}.spinner{border:2px solid #ffffff40;border-top-color:var(--p1);border-radius:50%;width:16px;height:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.link{opacity:.65;background:0 0;padding:4px;font-size:15px;text-decoration:underline}.banner{top:calc(max(10px, env(safe-area-inset-top)) + 64px);color:#ffcf70;white-space:nowrap;pointer-events:none;background:#28140ad9;border-radius:999px;padding:8px 16px;font-size:14px;position:fixed;left:50%;transform:translate(-50%)}.player .you{opacity:.7;font-size:.75em}.icon.muted{opacity:.45}.sound-panel{top:calc(max(10px, env(safe-area-inset-top)) + 64px);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:5;background:#0a0c14cc;border-radius:14px;gap:18px;padding:10px 16px;display:flex;position:fixed;left:50%;transform:translate(-50%)}.switch{cursor:pointer;white-space:nowrap;align-items:center;gap:8px;font-size:15px;display:flex}.switch input{appearance:none;cursor:pointer;background:#fff3;border-radius:999px;width:36px;height:20px;margin:0;transition:background .2s;position:relative}.switch input:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .2s;position:absolute;top:2px;right:2px}.switch input:checked{background:var(--p1)}.switch input:checked:after{transform:translate(-16px)}
