:root{--bg-1: #0e1122;--bg-2: #1b1035;--panel: #191e38;--panel-deep: #10142a;--ink: #e9edff;--muted: #8b93b8;--accent: #ffd23f;--win: #3ddc84;--loss: #ff5470;--draw: #9aa4c8;--line: #2b3157}*{box-sizing:border-box}button{font-family:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}body{margin:0;min-height:100vh;display:flex;justify-content:center;color:var(--ink);background:radial-gradient(60rem 40rem at 50% -10%,var(--bg-2),transparent),var(--bg-1);font-family:system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}main{width:min(26rem,100%);padding:1.25rem 1rem 2rem;display:flex;flex-direction:column;gap:.9rem;text-align:center}h1{margin:0;font-size:1.9rem;font-weight:900;text-transform:uppercase;letter-spacing:.45em;padding-left:.45em;color:var(--accent);text-shadow:0 0 24px rgba(255,210,63,.35)}#tagline{margin:.2rem 0 0;color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.18em}#scoreboard{display:flex;align-items:center;justify-content:space-between;background:var(--panel);border:1px solid var(--line);border-radius:.9rem;padding:.5rem 1.4rem}.score{display:flex;flex-direction:column;min-width:4rem}.score .label{color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.2em}.score .points{font-size:2.3rem;font-weight:900;line-height:1.1}.score .points.pop{animation:pop .45s ease-out}#round-indicator{color:var(--muted);font-size:.85rem;text-transform:uppercase;letter-spacing:.15em}#timer-track{height:8px;border-radius:999px;background:var(--panel-deep);overflow:hidden}#timer-bar{height:100%;width:0%;border-radius:inherit;background:var(--accent);transition:width .1s linear}#timer-bar.urgent{background:var(--loss)}#arena{background:var(--panel);border:1px solid var(--line);border-radius:1.1rem;padding:1rem 1rem 1.2rem;display:flex;flex-direction:column;align-items:center;gap:.35rem}.fighter{display:flex;flex-direction:column;align-items:center;gap:.35rem}.hand{width:6.2rem;height:6.2rem;display:grid;place-items:center;font-size:3.6rem;border-radius:50%;background:var(--panel-deep);border:2px solid var(--line);-webkit-user-select:none;user-select:none}.hand.flip{transform:scaleX(-1)}.hand.shaking{animation:shake .45s ease-in-out infinite}.hand.revealed{animation:slam .35s ease-out;border-color:var(--accent)}.nameplate{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.2em}#opponent-badge{display:inline-block;margin-left:.4rem;padding:.1rem .55rem;border-radius:999px;background:var(--accent);color:#1b1503;font-weight:800;letter-spacing:.05em;animation:pulse 1.1s ease-in-out infinite}#opponent-badge:empty{display:none}#banner{min-height:2.4rem;display:grid;place-items:center;font-size:1.5rem;font-weight:900;text-transform:uppercase;letter-spacing:.25em;padding-left:.25em}#banner.show{animation:slam .3s ease-out}#banner.win{color:var(--win);text-shadow:0 0 18px rgba(61,220,132,.45)}#banner.loss{color:var(--loss);text-shadow:0 0 18px rgba(255,84,112,.45)}#banner.draw{color:var(--draw)}#banner.info{color:var(--accent)}#moves{display:flex;justify-content:center;gap:.6rem}#moves button{flex:1;max-width:7rem;display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.6rem .4rem .5rem;border-radius:.9rem;border:2px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;transition:transform .08s ease,border-color .08s ease}#moves button .icon{font-size:2rem;line-height:1}#moves button .name{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}@media(hover:hover){#moves button:not(:disabled):hover{transform:translateY(-3px) scale(1.04);border-color:var(--accent)}}#moves button:disabled{opacity:.35;cursor:default}#actions{display:flex;justify-content:center;flex-wrap:wrap;gap:.6rem}#actions button.attention{border-color:var(--accent);animation:pulse 1.1s ease-in-out infinite}#invite-panel:not([hidden]){display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.6rem}#invite-link{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;padding:.35rem .6rem;border:1px solid var(--line);border-radius:.5rem;background:var(--panel-deep);color:var(--accent);word-break:break-all;-webkit-user-select:all;user-select:all}#invite-share{padding:.4rem .9rem;border-radius:999px;border:1px solid var(--accent);background:var(--panel);color:var(--ink);font-weight:700;font-size:.85rem;cursor:pointer}#actions button{padding:.55rem 1.1rem;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font-weight:700;cursor:pointer;transition:border-color .08s ease,transform .08s ease}@media(hover:hover){#actions button:not(:disabled):hover{border-color:var(--accent);transform:translateY(-1px)}}#actions button:disabled{opacity:.35;cursor:default}#status{margin:0;min-height:2.4em;color:var(--muted);font-size:.9rem}@keyframes shake{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-7px) rotate(-8deg)}75%{transform:translateY(3px) rotate(6deg)}}@keyframes shake-flipped{0%,to{transform:scaleX(-1) translateY(0) rotate(0)}25%{transform:scaleX(-1) translateY(-7px) rotate(8deg)}75%{transform:scaleX(-1) translateY(3px) rotate(-6deg)}}.hand.flip.shaking{animation:shake-flipped .45s ease-in-out infinite}@keyframes slam{0%{transform:scale(1.55);opacity:.2}to{transform:scale(1);opacity:1}}.hand.flip.revealed{animation:slam-flipped .35s ease-out}@keyframes slam-flipped{0%{transform:scaleX(-1.55) scaleY(1.55);opacity:.2}to{transform:scaleX(-1) scaleY(1);opacity:1}}@keyframes pop{40%{transform:scale(1.45);color:var(--accent)}}@keyframes pulse{50%{transform:scale(1.07);opacity:.85}}@media(max-height:700px){main{padding:.6rem 1rem .9rem;gap:.5rem}h1{font-size:1.3rem}#tagline{font-size:.65rem}#scoreboard{padding:.3rem 1.2rem}.score .points{font-size:1.7rem}#arena{padding:.6rem .8rem .7rem;gap:.25rem}.hand{width:4.4rem;height:4.4rem;font-size:2.5rem}#banner{min-height:1.7rem;font-size:1.05rem}#moves button{padding:.4rem .3rem .35rem}#moves button .icon{font-size:1.6rem}#actions button{padding:.4rem .9rem;font-size:.85rem}#status{min-height:2em;font-size:.8rem}}