:root{--bg: #0d1117;--panel: #161b22;--line: #30363d;--text: #c9d1d9;--muted: #8b949e;--you: #3fb950;--bot: #f85149;--accent: #58a6ff;--spell: #d2a8ff;--buff: #e3b341}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:SF Mono,Fira Code,Menlo,Consolas,monospace;font-size:14px;line-height:1.4}#app{max-width:820px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:12px}.header h1{margin:0;letter-spacing:6px;font-size:24px}.tagline{color:var(--muted);font-size:13px}.rules{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 14px}.rules-title{color:var(--accent);font-weight:700;letter-spacing:2px;font-size:12px;margin-bottom:6px}.rules-list{margin:0;padding-left:18px;color:var(--text);font-size:12px}.rules-list li{margin:3px 0}.section-label{color:var(--muted);letter-spacing:2px;font-size:12px;margin-top:4px}.hero-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hero-panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px;cursor:pointer;transition:border-color .1s,transform .1s}.hero-panel:hover{border-color:var(--accent);transform:translateY(-2px)}.hero-selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.hero-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.hero-name{font-weight:700;font-size:16px}.hero-arch{color:var(--muted);font-size:12px}.lib-label{color:var(--muted);font-size:11px;letter-spacing:1px;margin:10px 0 6px}.lib{display:flex;flex-wrap:wrap;gap:8px}.select-footer{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:12px}.terr-desc{color:var(--muted);font-size:12px;flex:1;min-width:160px}.match-top{display:flex;gap:8px;flex-wrap:wrap}.pill{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:12px}.pill-energy{color:var(--accent);border-color:var(--accent)}.battlefield{color:var(--muted);font-size:12px;margin-top:6px}.score{display:flex;justify-content:space-between;gap:12px}.score-you,.score-bot{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 12px}.score-you{border-left:3px solid var(--you)}.score-bot{border-left:3px solid var(--bot);text-align:right}.score-pts{font-size:15px}.score-you .score-pts b{color:var(--you)}.score-bot .score-pts b{color:var(--bot)}.score-zones{color:var(--muted);font-size:11px}.gain{color:var(--you);font-weight:700;animation:popgain .6s ease-out}.score-bot .gain{color:var(--bot)}@keyframes popgain{0%{transform:scale(1.6);opacity:0}to{transform:scale(1);opacity:1}}.zones{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.zone{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:6px;transition:border-color .1s,transform .1s}.zone-you{border-left:3px solid var(--you)}.zone-bot{border-left:3px solid var(--bot)}.zone-tie{border-left:3px solid var(--muted)}.zone-targetable{cursor:pointer;border-color:var(--accent)}.zone-targetable:hover{transform:translateY(-2px);box-shadow:0 0 0 1px var(--accent)}.zone-name-row{display:flex;align-items:center;justify-content:space-between}.zone-name{font-weight:700;letter-spacing:2px}.zone-pip{font-size:10px;font-weight:700}.pip-you{color:var(--you)}.pip-bot{color:var(--bot)}.zone-ctrl{font-size:11px;color:var(--muted)}.tug{display:flex;height:12px;margin-top:2px;border-radius:6px;overflow:hidden;background:var(--bg);border:1px solid var(--line)}.tug-you{background:var(--you);transition:width .3s ease}.tug-bot{background:var(--bot);transition:width .3s ease}.zone-nums{display:flex;align-items:center;justify-content:space-between;font-size:14px}.zone-nums .num{font-weight:700}.zone-nums .num.you{color:var(--you)}.zone-nums .num.bot{color:var(--bot)}.zone-vs{color:var(--muted);font-size:10px}.lastplay{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;min-height:56px}.lastplay-head{color:var(--muted);letter-spacing:2px;font-size:10px;margin-bottom:8px}.lastplay-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}.lastplay-col{display:flex;flex-direction:column;gap:6px;min-width:0;padding-left:8px}.lastplay-col.you{border-left:3px solid var(--you)}.lastplay-col.opp{border-left:3px solid var(--bot)}.lastplay-who{font-size:11px;font-weight:700;letter-spacing:1px}.lastplay-col.you .lastplay-who{color:var(--you)}.lastplay-col.opp .lastplay-who{color:var(--bot)}.lastplay-col .card{width:100%;cursor:default}.lastplay-col .card:hover{transform:none;border-color:var(--line)}.lastplay-ability{font-size:12px;font-weight:700;color:var(--spell)}.lastplay-impact{font-size:11px;color:var(--muted)}.lastplay-pass{font-style:italic}.muted{color:var(--muted)}.oppdeck-toggle{align-self:flex-start}.oppdeck{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 12px}.resolving{background:var(--panel);border:1px dashed var(--accent);border-radius:8px;padding:16px;text-align:center;display:flex;flex-direction:column;gap:6px;animation:pulse 1s ease-in-out infinite}.resolving-title{color:var(--accent);font-weight:700;letter-spacing:2px}.resolving-line.you{color:var(--you)}.resolving-line.bot{color:var(--bot)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}.banner{text-align:center;font-size:18px;font-weight:700;padding:14px;border-radius:8px;letter-spacing:2px}.banner.win{background:#3fb95026;color:var(--you);border:1px solid var(--you)}.banner.lose{background:#f8514926;color:var(--bot);border:1px solid var(--bot)}.banner.draw{background:var(--panel);color:var(--muted);border:1px solid var(--line)}.ability{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--spell);border-radius:8px;padding:8px 12px}.ability-ready{border-color:var(--spell);box-shadow:0 0 0 1px var(--spell)}.ability-name{font-weight:700;color:var(--spell)}.ability-text{font-size:11px;color:var(--muted)}.ability-action{display:flex;align-items:center;gap:8px;white-space:nowrap}.ability-armed{color:var(--spell);font-size:12px;font-weight:700}.ability-cd{color:var(--muted);font-size:12px}.btn-sm{padding:5px 10px;font-size:12px}.btn-ability{background:var(--spell);color:#0d1117;font-weight:700;border-color:var(--spell)}.hand-prompt{color:var(--accent);font-size:12px}.hand{display:flex;gap:10px;flex-wrap:wrap}.card{position:relative;width:150px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px;cursor:pointer;transition:transform .1s,border-color .1s}.card:hover{transform:translateY(-3px);border-color:var(--accent)}.card-mini{width:132px;cursor:default}.card-mini:hover{transform:none;border-color:var(--line)}.card-unit{border-top:3px solid var(--you)}.card-spell{border-top:3px solid var(--spell)}.card-buff{border-top:3px solid var(--buff)}.card-selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.card-disabled{opacity:.4;cursor:not-allowed}.card-disabled:hover{transform:none;border-color:var(--line)}.card-cost{position:absolute;top:-8px;right:-8px;width:22px;height:22px;background:var(--accent);color:#0d1117;border-radius:50%;text-align:center;line-height:22px;font-weight:700}.card-count{position:absolute;top:-8px;left:-8px;background:var(--line);color:var(--text);border-radius:999px;padding:1px 7px;font-size:11px;font-weight:700}.card-name{font-weight:700}.card-kind{font-size:10px;color:var(--muted);letter-spacing:1px}.card-text{font-size:11px;color:var(--muted);margin-top:6px}.controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:12px}.btn{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:8px 14px;font-family:inherit;font-size:13px;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--accent);color:#0d1117;font-weight:700;border-color:var(--accent)}.btn-big{padding:10px 18px;font-size:14px;margin-left:auto}.btn-ghost{color:var(--muted)}.selector{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.selector select{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:4px 6px;font-family:inherit;font-size:12px}.menu{display:flex;flex-direction:column;gap:10px;max-width:320px}.menu .btn-big{margin-left:0;width:100%;text-align:left}.status{color:var(--muted);font-size:13px}.account{display:flex;align-items:center;gap:12px;margin-top:4px;max-width:320px;font-size:12px}.account-who{color:var(--you)}.account-who.muted{color:var(--muted)}.auth-form{display:flex;flex-direction:column;gap:10px;max-width:340px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:14px}.auth-field{display:flex;flex-direction:column;gap:4px}.auth-label{color:var(--muted);letter-spacing:1px;font-size:11px;text-transform:uppercase}.auth-input{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:8px 10px;font-family:inherit;font-size:14px}.auth-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.auth-error{color:var(--bot);font-size:13px;max-width:340px}.join-wrap{display:flex;flex-direction:column;gap:8px}.code-input{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:10px 14px;font-family:inherit;font-size:28px;letter-spacing:10px;text-transform:uppercase;width:220px;text-align:center}.code-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.lobby{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:28px 16px;text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center}.lobby-label{color:var(--muted);letter-spacing:2px;font-size:12px}.lobby-code{font-size:48px;font-weight:700;letter-spacing:14px;color:var(--accent);text-indent:14px}.lobby-dots{color:var(--accent);letter-spacing:4px;animation:pulse 1.2s ease-in-out infinite}@media (max-width: 620px){.hero-choice{grid-template-columns:1fr}.zones{grid-template-columns:1fr 1fr 1fr;gap:6px}.zone{padding:7px;gap:4px}.zone-name{letter-spacing:1px;font-size:12px}.zone-pip{font-size:8px}.zone-ctrl{font-size:9px}.zone-nums{font-size:13px}.zone-vs{display:none}.lastplay-cols{grid-template-columns:1fr}.card{width:calc(50% - 5px)}.btn-big{margin-left:0}}