:root{--bg: #0b0b16;--bg-2: #14142a;--panel: #1b1b34;--panel-2: #232347;--ink: #eef0ff;--muted: #9aa0c4;--line: #2d2d52;--accent: #7c5cff;--accent-2: #00d4ff;--good: #38e08b;--bad: #ff4d6d;--warn: #ffb703;--rock: #ff8c5a;--paper: #5ad1ff;--scissors: #c98bff;--radius: 16px;--shadow: 0 12px 40px rgba(0, 0, 0, .45)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 800px at 50% -10%,#1d1d3e 0%,var(--bg) 55%) fixed;color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}#root{display:flex;flex-direction:column;align-items:center}button{font-family:inherit;cursor:pointer}.app{width:100%;max-width:940px;padding:20px 16px 60px;display:flex;flex-direction:column;gap:18px}.brand{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:18px}.brand h1{font-size:26px;letter-spacing:.5px;margin:0;background:linear-gradient(90deg,var(--accent-2),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}.brand .emojis{font-size:26px;filter:drop-shadow(0 4px 10px rgba(124,92,255,.5))}.panel{background:linear-gradient(180deg,var(--panel),var(--bg-2));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}.center-screen{display:flex;flex-direction:column;gap:16px;align-items:stretch;width:100%;max-width:460px;margin:6vh auto 0}input.field{width:100%;background:#0e0e22;border:1px solid var(--line);color:var(--ink);padding:14px 16px;border-radius:12px;font-size:16px;outline:none;transition:border-color .15s,box-shadow .15s}input.field:focus{border-color:var(--accent);box-shadow:0 0 0 3px #7c5cff40}.btn{border:none;border-radius:12px;padding:14px 18px;font-size:16px;font-weight:700;color:#fff;background:linear-gradient(90deg,var(--accent),#5a3cff);transition:transform .08s ease,filter .15s,opacity .15s}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(1px) scale(.99)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.ghost{background:transparent;border:1px solid var(--line);color:var(--muted)}.btn.ghost:hover{color:var(--ink);border-color:var(--accent)}.btn.accent2{background:linear-gradient(90deg,var(--accent-2),#0096ff)}.row{display:flex;gap:12px}.row.between{justify-content:space-between;align-items:center}.muted{color:var(--muted)}.label{font-size:13px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);font-weight:700}.divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--line)}.error-toast{background:#ff4d6d1f;border:1px solid rgba(255,77,109,.5);color:#ffb3c1;padding:12px 14px;border-radius:12px;font-size:14px}.code-chip{display:inline-flex;gap:8px;align-items:center;font-size:34px;font-weight:800;letter-spacing:8px;padding:14px 22px;background:#0e0e22;border:1px dashed var(--accent);border-radius:14px;color:var(--accent-2)}.battle{display:flex;flex-direction:column;gap:14px}.scoreboard{display:flex;justify-content:space-between;align-items:center;gap:12px}.turn-pill{background:var(--panel-2);border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-weight:700;font-size:13px;color:var(--muted)}.side-name{display:flex;flex-direction:column;gap:2px}.side-name .name{font-weight:800;font-size:16px}.side-name.me .name{color:var(--accent-2)}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.dot.on{background:var(--good)}.dot.off{background:var(--bad)}.ready-tag{font-size:12px;font-weight:700;color:var(--good)}.field-grid{display:grid;grid-template-columns:1fr;gap:14px}.hands-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hand-card{position:relative;background:linear-gradient(180deg,var(--panel-2),#181834);border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;align-items:center;gap:8px;min-height:150px;overflow:visible}.hand-card.dead{opacity:.4;filter:grayscale(.8)}.hand-card.targetable{cursor:pointer;border-color:var(--bad);box-shadow:0 0 0 2px #ff4d6d66,0 0 22px #ff4d6d40}.hand-card.selected-target{border-color:var(--bad);box-shadow:0 0 0 3px var(--bad)}.hand-glyph{font-size:52px;line-height:1;filter:drop-shadow(0 6px 12px rgba(0,0,0,.5))}.hand-type{font-weight:800;font-size:14px;letter-spacing:.5px}.hand-type.rock{color:var(--rock)}.hand-type.paper{color:var(--paper)}.hand-type.scissors{color:var(--scissors)}.hearts{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;min-height:18px}.heart{font-size:14px;line-height:1}.badge{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800;white-space:nowrap;z-index:4;box-shadow:var(--shadow)}.badge.attack{border-color:var(--bad);color:var(--bad)}.badge.block{border-color:var(--accent-2);color:var(--accent-2)}.badge.switch{border-color:var(--warn);color:var(--warn)}.float-dmg{position:absolute;top:6px;right:8px;font-weight:900;font-size:26px;z-index:6;pointer-events:none;text-shadow:0 2px 8px rgba(0,0,0,.7)}.shield-fx{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius);border:2px solid var(--accent-2);box-shadow:inset 0 0 30px #00d4ff66;pointer-events:none}.controls{display:flex;flex-direction:column;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px}.ctrl-hand{border:1px solid var(--line);border-radius:12px;padding:12px;background:#12122a}.ctrl-hand.dead{opacity:.4}.ctrl-hand h4{margin:0 0 10px;display:flex;align-items:center;gap:8px;font-size:15px}.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.seg button{background:#1a1a38;border:1px solid var(--line);color:var(--ink);border-radius:10px;padding:10px 6px;font-weight:700;font-size:14px;transition:all .12s}.seg button:hover:not(:disabled){border-color:var(--accent)}.seg button.on{background:linear-gradient(90deg,var(--accent),#5a3cff);border-color:transparent}.seg button:disabled{opacity:.35;cursor:not-allowed}.sub-choice{margin-top:10px;display:flex;flex-direction:column;gap:6px}.sub-choice .label{margin-bottom:2px}.chip-row{display:flex;gap:8px;flex-wrap:wrap}.chip{background:#1a1a38;border:1px solid var(--line);color:var(--ink);border-radius:999px;padding:8px 14px;font-weight:700;font-size:14px;transition:all .12s}.chip.on{background:var(--bad);border-color:transparent}.chip.type.on{background:var(--warn);color:#2a1a00}.chip:hover:not(:disabled){border-color:var(--accent)}.waiting{display:flex;align-items:center;justify-content:center;gap:10px;padding:16px;color:var(--muted);font-weight:700}.spinner{width:16px;height:16px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.banner{text-align:center;font-weight:800;font-size:18px;padding:10px;letter-spacing:.4px}.gameover{text-align:center;display:flex;flex-direction:column;gap:18px;align-items:center}.gameover .result{font-size:40px;font-weight:900}.gameover .result.win{color:var(--good)}.gameover .result.lose{color:var(--bad)}.gameover .result.draw{color:var(--warn)}.rules{font-size:13.5px;line-height:1.7;color:var(--muted)}.rules b{color:var(--ink)}.rules .tag{display:inline-block;padding:1px 7px;border-radius:6px;font-weight:800;font-size:12px}.tag.super{background:#ff4d6d33;color:var(--bad)}.tag.equal{background:#ffb70333;color:var(--warn)}.tag.weak{background:#8ecae633;color:var(--paper)}.footer{text-align:center;color:var(--muted);font-size:12px;margin-top:8px}@media(max-width:520px){.brand h1{font-size:22px}.hand-glyph{font-size:44px}.code-chip{font-size:28px;letter-spacing:6px}}