:root{--u: clamp(11px, 2.4vmin, 20px);--ink: #ffffff;--panel: rgba(20, 26, 38, .82);--accent: #ff8f1f}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#54647a}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}#game{position:fixed;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}[hidden]{display:none!important}#hud{position:fixed;top:max(10px,env(safe-area-inset-top));left:50%;transform:translate(-50%);text-align:center;pointer-events:none}.score{display:flex;align-items:center;gap:calc(var(--u) * .6);padding:calc(var(--u) * .35) calc(var(--u) * 1.1);background:var(--panel);border-radius:999px;font-size:calc(var(--u) * 1.15);box-shadow:0 4px 14px #00000040}.score b{font-size:1.6em;min-width:1.3em;font-variant-numeric:tabular-nums}.score .colon{opacity:.6;font-weight:700}.side{display:flex;align-items:center;gap:.35em;font-weight:600;opacity:.9}.you{color:#ff8a8c}.cpu{color:#ffd84d}.serve{width:.55em;height:.55em;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px #ffffffb3}@media(max-width:560px){#hud{top:calc(max(10px,env(safe-area-inset-top)) + 54px)}}.level{margin-top:.35em;font-size:calc(var(--u) * .8);opacity:.75;text-shadow:0 1px 3px rgba(0,0,0,.4)}.corner{position:fixed;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));display:flex;gap:8px}.round{width:44px;height:44px;border-radius:50%;border:2px solid rgba(255,255,255,.45);background:var(--panel);font-size:20px;line-height:1}.hint{position:fixed;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translate(-50%);padding:.5em 1.1em;background:var(--panel);border-radius:999px;font-size:var(--u);white-space:nowrap;pointer-events:none;animation:breathe 1.6s ease-in-out infinite}@keyframes breathe{50%{opacity:.65}}.flash{position:fixed;left:50%;top:32%;transform:translate(-50%,-50%);font-size:calc(var(--u) * 2.6);font-weight:800;text-shadow:0 3px 0 rgba(0,0,0,.35),0 0 18px rgba(0,0,0,.25);pointer-events:none;white-space:nowrap}.flash.pop{animation:pop .9s ease-out forwards}@keyframes pop{0%{transform:translate(-50%,-50%) scale(.6);opacity:0}20%{transform:translate(-50%,-50%) scale(1.08);opacity:1}70%{opacity:1}to{transform:translate(-50%,-60%) scale(1);opacity:0}}.paused{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0a0e1673;font-size:calc(var(--u) * 2);font-weight:700}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:72px 16px 16px;background:#12182459}.card{width:min(560px,100%);max-height:100%;overflow:auto;padding:calc(var(--u) * 1.4);text-align:center;background:var(--panel);border-radius:calc(var(--u) * 1.3);box-shadow:0 10px 40px #00000059}h1,h2{margin:0;font-size:calc(var(--u) * 2.2);letter-spacing:-.02em}.sub{margin:.4em 0 1.1em;opacity:.8;font-size:calc(var(--u) * 1.05)}.choices{display:flex;gap:calc(var(--u) * .7);justify-content:center;flex-wrap:wrap}.choices button{flex:1 1 0;min-width:120px;min-height:52px;padding:.7em .9em;border:0;border-radius:calc(var(--u) * .9);background:#fff;color:#1d2433;display:grid;gap:.15em;box-shadow:0 4px #00000040;transition:transform .1s}.choices button b{font-size:calc(var(--u) * 1.25)}.choices button small{font-size:calc(var(--u) * .8);opacity:.7}.choices button:hover{transform:translateY(-2px)}.choices button:active{transform:translateY(2px);box-shadow:0 2px #00000040}.choices button.last{outline:3px solid var(--accent);outline-offset:2px}.how{margin:1.2em 0 0;font-size:calc(var(--u) * .85);line-height:1.45;opacity:.78}.fatal{position:fixed;top:0;right:0;bottom:0;left:0;margin:0;padding:16px;color:#fff;background:#222;white-space:pre-wrap}
