:root{--bg: #0a0a12;--bg2: #12121f;--you: #22e0c4;--them: #ff5d8f;--accent: #8b5cf6;--text: #eef0ff;--muted: #8a8ca6;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}html,body,#root{height:100%;margin:0}body{background:radial-gradient(120% 80% at 50% -10%,#1a1030 0%,var(--bg) 55%);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;overflow:hidden;touch-action:manipulation}.screen{height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) 20px env(safe-area-inset-bottom);max-width:520px;margin:0 auto}.home{align-items:center;justify-content:center;text-align:center;gap:22px;position:relative}.glow{position:absolute;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.35),transparent 70%);filter:blur(40px);top:18%;pointer-events:none}.brand .logo{font-size:56px;filter:drop-shadow(0 0 20px var(--accent))}.brand h1{font-size:40px;margin:6px 0 0;letter-spacing:-1px}.brand h1 span{color:var(--accent)}.tagline{color:var(--muted);line-height:1.5;margin:10px 0 0;font-size:15px}.pills{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.pill{border:1px solid rgba(139,92,246,.4);background:#8b5cf61a;color:#cbb8ff;padding:7px 14px;border-radius:999px;font-size:13px;font-weight:600}.cta{background:linear-gradient(135deg,var(--accent),#6d28d9);color:#fff;border:none;padding:18px 40px;font-size:19px;font-weight:800;border-radius:16px;box-shadow:0 10px 30px #8b5cf673;cursor:pointer;transition:transform .08s}.cta:active{transform:scale(.96)}.cta:disabled{opacity:.6}.cta.small{padding:13px 28px;font-size:16px;margin-top:8px}.mode-note{color:var(--muted);font-size:12px}.game{justify-content:space-between;gap:12px;padding-top:calc(env(safe-area-inset-top) + 14px)}.hud{display:flex;justify-content:space-between;gap:10px}.hud-item{flex:1;background:var(--bg2);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:10px;text-align:center}.hud-label{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.hud-value{display:block;font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}.hud-value.good{color:var(--you)}.arena{flex:1;display:flex;flex-direction:column;justify-content:center;gap:18px;position:relative}.side-label{position:absolute;top:6px;font-weight:800;font-size:13px;letter-spacing:1px}.side-label.you{left:4px;color:var(--you)}.side-label.them{right:4px;color:var(--them)}.rope-track{position:relative;height:90px;border-radius:16px;background:linear-gradient(90deg,#22e0c429,#14141f99 50%,#ff5d8f29);border:1px solid rgba(255,255,255,.08);overflow:hidden}.center-line{position:absolute;left:50%;top:0;bottom:0;width:2px;background:#ffffff40;transform:translate(-1px)}.flag{position:absolute;top:50%;transform:translate(-50%,-50%);font-size:40px;transition:left .09s linear;filter:drop-shadow(0 0 10px rgba(255,255,255,.4))}.flag[data-lead=you]{filter:drop-shadow(0 0 14px var(--you))}.flag[data-lead=them]{filter:drop-shadow(0 0 14px var(--them))}.score{display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:20px;font-variant-numeric:tabular-nums;padding:0 6px}.score span:first-child{color:var(--you)}.score span:last-child{color:var(--them)}.score .vs{color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase}.note{text-align:center;color:var(--muted);font-size:14px;min-height:18px}.controls{display:flex;flex-direction:column;gap:14px;padding-bottom:8px}.boost{position:relative;height:52px;border-radius:14px;border:1px solid rgba(139,92,246,.5);background:#8b5cf614;color:#cbb8ff;font-weight:800;font-size:15px;overflow:hidden;cursor:pointer}.boost-fill{position:absolute;left:0;top:0;bottom:0;background:#8b5cf659;transition:width .2s linear}.boost-text{position:relative;z-index:1}.boost.ready{border-color:var(--accent);background:var(--accent);color:#fff;animation:pulse 1s infinite}@keyframes pulse{50%{box-shadow:0 0 22px var(--accent)}}.tap-btn{height:160px;border-radius:22px;border:none;background:radial-gradient(circle at 50% 30%,#2ee6c8,#12b39a);color:#04231f;font-size:42px;font-weight:900;letter-spacing:3px;box-shadow:0 14px #0b7d6c,0 20px 40px #22e0c466;cursor:pointer;transition:transform .05s,box-shadow .05s}.tap-btn:active{transform:translateY(8px);box-shadow:0 6px #0b7d6c,0 10px 24px #22e0c466}.tap-btn:disabled{filter:grayscale(.6) brightness(.7)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#06060cd1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:24px;z-index:10}.card{background:var(--bg2);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:28px 24px;text-align:center;max-width:380px;width:100%}.card h2{margin:8px 0;font-size:26px}.card h2.win{color:var(--you)}.card h2.lose{color:var(--them)}.card p{color:var(--muted);font-size:14px;line-height:1.5}.card .muted{font-size:12px}.explorer{display:inline-block;margin:14px 0 4px;color:var(--accent);font-weight:700;text-decoration:none;font-size:15px}.spinner{width:44px;height:44px;margin:6px auto 14px;border:4px solid rgba(139,92,246,.25);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.lobby{display:flex;flex-direction:column;gap:14px;width:100%;max-width:360px}.join-row{display:flex;gap:8px}.code-input{flex:1;background:var(--bg2);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:0 14px;color:var(--text);font-size:13px;-webkit-user-select:text;user-select:text}.code-input::placeholder{color:var(--muted)}.duel-code{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center;background:var(--bg2);border:1px solid rgba(139,92,246,.35);border-radius:12px;padding:10px 12px;margin-top:6px}.dc-label{color:var(--muted);font-size:12px;width:100%;text-align:center}.dc-value{font-size:12px;color:#cbb8ff;word-break:break-all;-webkit-user-select:text;user-select:text}.dc-copy{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:6px 12px;font-weight:700;font-size:12px;cursor:pointer}.rpc-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11px;color:var(--muted);background:var(--bg2);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:7px 10px}.rpc-bar.down{border-color:#ff5d8f80}.rpc-bar b{color:var(--text)}.rpc-sep{opacity:.6}.rpc-kit{margin-left:auto;color:#cbb8ff;background:#8b5cf61f;border:1px solid rgba(139,92,246,.3);border-radius:999px;padding:2px 8px;font-weight:600}.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.dot.ok{background:var(--you);box-shadow:0 0 8px var(--you)}.dot.bad{background:var(--them);box-shadow:0 0 8px var(--them)}