:root{--bg: #14121f;--panel: rgba(28, 25, 48, .92);--ink: #f4f1ff;--dim: #9a93c2;--x: #ff5d73;--o: #2ad4c4;--gold: #ffd23f;--safe-t: env(safe-area-inset-top);--safe-b: env(safe-area-inset-bottom);--safe-l: env(safe-area-inset-left);--safe-r: env(safe-area-inset-right)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:ui-rounded,SF Pro Rounded,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}#stage{position:fixed;inset:0;width:100vw;height:100dvh;display:block;touch-action:none}#hud{position:fixed;inset:0;pointer-events:none;padding:calc(var(--safe-t) + 8px) calc(var(--safe-r) + 10px) calc(var(--safe-b) + 8px) calc(var(--safe-l) + 10px)}#hud button,#hud input,.panel{pointer-events:auto}button{font:inherit;color:var(--ink);background:#3a3463;border:0;border-radius:12px;min-height:44px;min-width:44px;padding:0 14px;cursor:pointer}button:active{transform:scale(.96)}button.big{min-height:56px;font-size:1.2rem;font-weight:800;background:var(--gold);color:#241d00;width:100%}button.icon{font-size:1.2rem;padding:0;background:#3a3463cc}#topbar{display:flex;align-items:center;justify-content:space-between;gap:8px}.chip{background:#3a3463d9;border-radius:999px;padding:8px 12px;font-weight:800;font-size:.85rem;letter-spacing:.04em}.chip.blitz{background:var(--x);animation:pulse .6s infinite alternate}#alive{font-weight:900;font-size:1.1rem;text-shadow:0 2px 0 #000}#alive b{font-size:2.2rem;color:var(--gold);display:inline-block}#alive b.bump{animation:bump .25s}#alive-of{color:var(--dim)}.buttons{display:flex;gap:8px}#duel{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin-top:6px}#duel .vs{font-weight:900;color:var(--dim)}.side{background:#1c1930cc;border-radius:12px;padding:8px 10px;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"m n s";gap:2px 6px;align-items:center;border:2px solid transparent}.mark.me{color:var(--gold)}.mark.them{color:var(--x)}.side.me{background:#ffd23f24}.side.turn{border-color:var(--gold);box-shadow:0 0 16px #ffd23f59}.side.me .name:after{content:" (you)";color:var(--gold)}.side .mark{grid-area:m;font-weight:900;font-size:1.2rem}.mark.x{color:var(--x)}.mark.o{color:var(--o)}.side .name{grid-area:n;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.85rem}#status{position:absolute;left:0;right:0;bottom:calc(var(--safe-b) + 150px);text-align:center;font-weight:800;text-shadow:0 2px 4px #000;padding:0 16px}#banner{position:absolute;left:0;right:0;top:42%;text-align:center;font-size:clamp(2rem,min(11vw,13vh),5rem);font-weight:900;letter-spacing:.02em;text-shadow:0 4px 0 #000,0 0 30px rgba(0,0,0,.6);opacity:0;transform:scale(.6);pointer-events:none}#banner.show{animation:banner 1.4s ease-out forwards}#banner.win{color:var(--gold)}#banner.lose{color:var(--x)}#banner.info{color:var(--ink)}#feed{position:absolute;right:calc(var(--safe-r) + 10px);top:calc(var(--safe-t) + 120px);margin:0;padding:0;list-style:none;font-size:.75rem;text-align:right;max-width:55vw}#feed li{background:#14121fbf;border-radius:8px;padding:3px 8px;margin-bottom:4px;animation:slidein .25s ease-out;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#feed li b{color:var(--gold)}#dock{position:absolute;left:0;right:0;bottom:calc(var(--safe-b) + 8px);display:flex;flex-direction:column;align-items:center;gap:6px}#dock .row{display:flex;justify-content:center;gap:8px}#reactions button{font-size:1.5rem;background:#3a3463bf}#modes button{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:64px;padding:2px 8px;background:#3a3463cc;border:2px solid transparent;font-size:1.2rem;line-height:1}#modes button small{font-size:.6rem;font-weight:800;letter-spacing:.04em;margin-top:2px;color:var(--dim)}#modes button.on{border-color:#c04dff;background:#c04dff4d}#modes button.on small{color:var(--ink)}.stat{background:#14121fcc;border-radius:999px;padding:4px 10px;font-weight:800;font-size:.95rem;white-space:nowrap}.stat.warn{color:#ff8fa3}.stat.warn.hot{background:#ff2d55;color:#fff;animation:pulse .35s infinite alternate}.stat:empty{display:none}#countdown{position:fixed;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;pointer-events:none;text-shadow:0 3px 0 #000,0 0 18px rgba(0,0,0,.6)}#countdown b{font-size:clamp(1.8rem,9vw,3rem);font-weight:900;font-variant-numeric:tabular-nums;line-height:1}#countdown small{font-size:.65rem;font-weight:900;letter-spacing:.06em;margin-top:4px;white-space:nowrap}#countdown.x b,#countdown.them b{color:var(--x)}#countdown.o b{color:var(--o)}#countdown.mine b{color:var(--gold)}#countdown small.bank{margin-top:1px;color:var(--ink);opacity:.8}#countdown small.bank:empty{display:none}#toast{position:fixed;transform:translate(-50%,-100%);padding:6px 14px;border-radius:999px;background:#14121fe6;border:2px solid var(--gold);color:var(--gold);font-weight:900;font-size:.95rem;white-space:nowrap;pointer-events:none;opacity:0}#toast.show{animation:toast 1.8s ease-out forwards}@keyframes toast{0%{opacity:0;transform:translate(-50%,-60%) scale(.8)}12%{opacity:1;transform:translate(-50%,-100%) scale(1.05)}75%{opacity:1}to{opacity:0;transform:translate(-50%,-120%)}}#countdown.mine small{color:var(--gold)}#countdown.low b{color:#fff;animation:tick .25s infinite alternate}@keyframes tick{0%{transform:scale(1)}to{transform:scale(1.25);color:var(--x)}}button.next{background:var(--gold);color:#241d00;font-weight:900;padding:0 18px;box-shadow:0 4px 16px #ffd23f59}#results .big{margin:12px 0 4px}.side .hearts{grid-area:s;font-size:.9rem;font-weight:800;white-space:nowrap}.float{position:fixed;bottom:80px;font-size:2rem;pointer-events:none;animation:floatup 2s ease-out forwards}.panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(92vw,420px);max-height:86dvh;overflow:auto;background:var(--panel);border-radius:20px;padding:18px;box-shadow:0 20px 60px #0009;text-align:center}.panel h1{margin:0 0 4px;font-size:1.9rem;font-weight:900}.panel h1 em{color:var(--gold);font-style:normal}.panel .sub{color:var(--dim);margin:0 0 12px;font-size:.9rem}.code-row{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:800;color:var(--dim)}.code-row b{font-size:1.8rem;color:var(--ink);letter-spacing:.15em}.name-row{display:flex;align-items:center;gap:8px;justify-content:center;margin:12px 0;color:var(--dim)}.name-row input{font:inherit;font-size:16px;min-height:44px;border-radius:10px;border:2px solid #3a3463;background:#1d1a33;color:var(--ink);padding:0 10px;width:12em}#lobby-list{list-style:none;padding:0;margin:8px 0;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}#lobby-list li{background:#2a2645;border-radius:999px;padding:4px 10px;font-size:.85rem}#lobby-list li.me{background:var(--gold);color:#241d00}#lobby-timer{color:var(--dim)}#results h2{font-size:2.2rem;margin:0;color:var(--gold)}#reconnecting{position:absolute;top:40%;left:50%;transform:translate(-50%);width:max-content;max-width:86vw;text-align:center;background:var(--x);padding:10px 16px;border-radius:12px;font-weight:800}#debug{position:absolute;left:calc(var(--safe-l) + 8px);bottom:calc(var(--safe-b) + 64px);margin:0;font:700 13px/1.35 ui-monospace,Menlo,monospace;background:#000000b3;color:#7cfc8a;padding:6px 8px;border-radius:8px}[hidden]{display:none!important}@keyframes pulse{to{opacity:.55}}@keyframes bump{50%{transform:scale(1.35)}}@keyframes banner{0%{opacity:0;transform:scale(.6)}15%{opacity:1;transform:scale(1.08)}25%{transform:scale(1)}80%{opacity:1}to{opacity:0;transform:scale(1.05)}}@keyframes slidein{0%{transform:translate(30px);opacity:0}}@keyframes floatup{to{transform:translateY(-45dvh) scale(1.4);opacity:0}}@media(orientation:landscape)and (max-height:560px){#duel{position:absolute;left:50%;transform:translate(-50%);bottom:calc(var(--safe-b) + 6px);width:min(56vw,520px);margin:0}#dock{left:auto;right:calc(var(--safe-r) + 8px);top:calc(var(--safe-t) + 64px);bottom:auto}#dock .row{flex-direction:column;gap:6px}#modes button{min-width:56px;min-height:44px;padding:2px 4px}#reactions button{height:40px;min-height:40px;font-size:1.15rem;line-height:1}#dock #reactions.row{gap:4px}#mestats{position:fixed;left:calc(var(--safe-l) + 10px);top:calc(var(--safe-t) + 64px);align-items:flex-start}#dock #mestats.row{flex-direction:column;gap:4px;width:118px}#mestats .stat{white-space:normal;text-align:left}.stat{font-size:.8rem}#countdown b{font-size:clamp(1.3rem,8vh,2.2rem)}#duel .side{padding:4px 8px}#countdown small{font-size:.55rem}#status{bottom:calc(var(--safe-b) + 74px)!important}#feed{top:42%;left:calc(var(--safe-l) + 10px);right:auto;text-align:left;max-width:22vw}}