:root{--bg:#14161b;--panel:#1d2027;--panel-2:#262a33;--line:#343a46;--text:#e9ecf1;--muted:#98a1b3;--green:#3ddc84;--yellow:#f4c430;--red:#ef4444;--accent:#e8b339;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#app{background:var(--bg);height:100%;color:var(--text);-webkit-tap-highlight-color:transparent;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}button{font:inherit;color:inherit;background:var(--panel-2);border:1px solid var(--line);cursor:pointer;border-radius:8px;padding:8px 16px}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);color:#1a1a1a;border-color:var(--accent);font-weight:700}button.danger{color:#ffb4b4;border-color:#7f2d2d}.screen{flex-direction:column;height:100%;display:flex}.center{text-align:center;justify-content:center;align-items:center;gap:24px;padding:24px;overflow:auto}h1.logo{letter-spacing:2px;margin:0;font-size:clamp(36px,8vw,72px)}h1.logo span{color:var(--accent)}.tagline{color:var(--muted);max-width:560px;margin:0}.xp-chip{color:var(--muted);font-size:14px}.xp-chip b{color:var(--accent)}.factions{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.faction{text-align:left;background:var(--panel);border:2px solid var(--line);cursor:pointer;border-radius:14px;flex-direction:column;justify-content:flex-start;align-items:stretch;width:250px;padding:18px;transition:transform .12s,border-color .12s;display:flex}.faction:hover{border-color:var(--fc);transform:translateY(-3px)}.faction .f-flag{border-bottom:2px solid var(--line);border-radius:12px 12px 0 0;flex:none;height:22px;margin:-18px -18px 12px}.faction .f-icon{font-size:40px}.faction h3{color:var(--fc);margin:6px 0 2px;font-size:22px}.faction .f-main{color:var(--muted);margin-bottom:8px;font-size:13px}.faction p{margin:0;font-size:14px;line-height:1.4}.card{background:linear-gradient(180deg, color-mix(in srgb, var(--faction,#667) 28%, var(--panel-2)), var(--panel-2));border:3px solid var(--line);-webkit-user-select:none;user-select:none;text-align:center;border-radius:12px;flex-direction:column;flex:none;align-items:center;width:118px;height:168px;padding:8px 8px 6px;display:flex;position:relative}.card[data-status=green]{border-color:var(--green);box-shadow:0 0 12px #3ddc8455}.card[data-status=yellow]{border-color:var(--yellow)}.card[data-status=red]{border-color:var(--red);opacity:.8}.card-cost{background:#2c5fd6;border:2px solid #9db8ff;border-radius:50%;place-items:center;width:30px;height:30px;font-weight:800;display:grid;position:absolute;top:-9px;left:-9px}.card-key{color:var(--muted);font-size:11px;position:absolute;top:2px;right:6px}.card-icon{margin-top:8px;font-size:36px;line-height:1.1}.card-name{place-items:center;min-height:28px;margin-top:4px;font-size:13px;font-weight:700;line-height:1.1;display:grid}.card-type{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.card-text{color:#c9d0dd;flex:1;margin-top:3px;font-size:10px;line-height:1.2;overflow:hidden}.card-rarity{color:var(--accent);font-size:9px}.card[data-rarity=general] .card-rarity{color:#c8d6ff}.card[data-rarity=generalissimo] .card-rarity{color:#ff9eb5}.card.locked{filter:grayscale(.9)brightness(.55)}.card-lock{background:#000c;border-radius:6px;padding:3px;font-size:11px;position:absolute;inset:auto 6px 22px}.deck-screen{gap:10px;padding:12px 16px}.deck-head{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.deck-head h2{flex:1;min-width:200px;margin:0}.deck-body{flex:1;gap:14px;min-height:0;display:flex}.collection{flex-wrap:wrap;flex:1;align-content:flex-start;gap:18px 14px;padding:12px 8px;display:flex;overflow:auto}.collection .slot{cursor:pointer;position:relative}.collection .slot .count{background:var(--accent);color:#111;text-align:center;border-radius:10px;min-width:24px;padding:0 9px;font-size:13px;font-weight:800;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.collection .slot .count.zero{background:var(--panel-2);color:var(--muted)}.deck-list{background:var(--panel);border-radius:12px;flex-direction:column;gap:8px;width:270px;padding:12px;display:flex}.deck-list ul{flex:1;margin:0;padding:0;list-style:none;overflow:auto}.deck-list li{cursor:pointer;gap:8px;padding:3px 0;font-size:14px;display:flex}.deck-list li .c{color:#9db8ff;width:18px;font-weight:700}.deck-list li .n{flex:1}.deck-count{font-size:22px;font-weight:800}.deck-count.ok{color:var(--green)}.deck-error{color:var(--yellow);min-height:18px;font-size:13px}.match{position:relative}.topbar,.bottombar{background:var(--panel);flex:none;align-items:center;gap:14px;padding:6px 12px;display:flex}.topbar{border-bottom:1px solid var(--line);min-height:44px}.topbar .who{font-weight:700}.stat{color:var(--muted);white-space:nowrap;font-size:14px}.stat b{color:var(--text)}.spacer{flex:1}#field{flex:1;min-height:0;position:relative}#field canvas{touch-action:none;display:block;position:absolute;inset:0}.bottombar{border-top:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:4px 14px;padding:6px 12px}.topbar{flex-wrap:wrap;row-gap:4px}.resources{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.energy{align-items:center;gap:8px;display:flex}.energy .pips{gap:3px;display:flex}.pip{background:var(--panel-2);border:1px solid var(--line);border-radius:3px;width:14px;height:22px}.pip.on{background:#3b82f6;border-color:#93c5fd}.pip.partial{background:linear-gradient(0deg, #3b82f6 var(--fill,0%), var(--panel-2) var(--fill,0%))}.draw{background:var(--panel-2);border-radius:4px;width:120px;height:8px;overflow:hidden}.draw i{background:var(--accent);height:100%;display:block}.hand{background:var(--panel);border-bottom:1px solid var(--line);flex:none;justify-content:safe center;gap:12px;padding:14px 12px 10px;display:flex;overflow-x:auto}.hand .card{cursor:pointer;transition:transform .1s}.hand .card:hover{transform:translateY(6px)}.hand .card.selected{outline:3px solid #fff;transform:translateY(8px)}.hand .card.shake{animation:.3s shake}@keyframes shake{25%{transform:translate(-5px)}75%{transform:translate(5px)}}.hint{color:var(--accent);min-height:18px;font-size:14px}.toasts{pointer-events:none;z-index:5;flex-direction:column;align-items:flex-end;gap:6px;display:flex;position:absolute;top:8px;right:8px}.toast{border:1px solid var(--line);background:#000d;border-radius:8px;padding:6px 10px;font-size:14px;animation:3.2s forwards fade}.toast.enemy{border-color:var(--red)}.toast.warn{border-color:var(--yellow)}@keyframes fade{0%{opacity:0;transform:translate(14px)}8%{opacity:1;transform:none}80%{opacity:1}to{opacity:0}}.overlay{z-index:10;text-align:center;background:#000b;place-items:center;display:grid;position:absolute;inset:0}.overlay .box{background:var(--panel);border:2px solid var(--accent);border-radius:16px;flex-direction:column;gap:14px;padding:28px 40px;display:flex}.overlay h2{margin:0;font-size:44px}.overlay h2.win{color:var(--green)}.overlay h2.loss{color:var(--red)}.overlay h2.draw{color:var(--yellow)}.result .delta{font-size:28px;font-weight:800}.result .delta.plus{color:var(--green)}.result .delta.minus{color:var(--red)}.unlocked{flex-wrap:wrap;justify-content:center;gap:14px;display:flex}.loading{color:var(--muted)}.error{color:#ffb4b4;white-space:pre-wrap;max-width:640px}@media (max-width:720px){.card{width:92px;height:136px}.card-icon{margin-top:4px;font-size:26px}.card-text{display:none}.card-name{min-height:24px;font-size:11px}.hand{gap:8px}.deck-body{flex-direction:column}.deck-list{width:100%;max-height:32%}}@media (max-height:820px){.card{border-width:2px;width:96px;height:130px;padding:6px 5px 4px}.card-cost{width:24px;height:24px;font-size:13px;top:-7px;left:-7px}.card-icon{margin-top:4px;font-size:26px}.card-name{min-height:22px;margin-top:2px;font-size:11px}.card-text,.card-type{display:none}.card-rarity{font-size:8px}.hand{gap:8px;padding:10px 10px 8px}.bottombar{gap:2px;padding-top:4px;padding-bottom:6px}.pip{width:11px;height:16px}}@media (max-height:560px){.card{width:74px;height:92px}.card-icon{margin-top:2px;font-size:20px}.card-name{min-height:20px;font-size:10px}.card-rarity,.card-key{display:none}.topbar{min-height:36px;padding:2px 10px}}.tip{z-index:100;pointer-events:none;border:1px solid var(--accent);background:#0d0f13f2;border-radius:10px;max-width:300px;padding:10px 12px;font-size:13px;line-height:1.35;position:fixed;box-shadow:0 8px 24px #000a}.tip-title{font-size:15px;font-weight:800}.tip-sub{color:var(--muted);margin-bottom:4px;font-size:12px}.tip-rows{grid-template-columns:auto 1fr;gap:2px 14px;display:grid}.tip-rows .k{color:var(--muted);white-space:nowrap}.tip-rows .v{text-align:right;font-weight:600}.tip-note{color:#c9d0dd;margin-top:6px}.tip-section{border-top:1px solid var(--line);margin-top:8px;padding-top:6px}.card-help{color:#fff;cursor:help;z-index:2;background:#000a;border:1px solid #fff8;border-radius:50%;place-items:center;width:20px;height:20px;font-size:12px;font-weight:700;display:grid;position:absolute;bottom:5px;right:5px}.card-help:hover{background:var(--accent);color:#111;border-color:var(--accent)}.arena{flex:1;min-height:0;display:flex}.arena #field{flex:1;min-width:0}.log{background:var(--panel);border-left:1px solid var(--line);flex-direction:column;flex:none;width:250px;display:flex}.log-title{color:var(--muted);border-bottom:1px solid var(--line);text-transform:uppercase;letter-spacing:.5px;padding:8px 10px;font-size:13px;font-weight:700}.log-list{flex-direction:column;flex:1;gap:4px;min-height:0;padding:6px;display:flex;overflow-y:auto}.log-row{border-left:3px solid var(--line);background:#0004;border-radius:4px;grid-template-columns:auto auto 1fr;align-items:baseline;gap:6px;padding:4px 6px;font-size:12px;line-height:1.3;display:grid}.log-row.mine{border-left-color:var(--green)}.log-row.enemy{border-left-color:var(--red)}.log-row.warn .log-text{color:var(--yellow)}.log-time{color:var(--muted);font-variant-numeric:tabular-nums}@media (max-width:720px){.log{display:none}.deck-screen{gap:8px;padding:8px 10px}.deck-head h2{min-width:0;font-size:20px}.deck-body{flex-direction:column;gap:8px;min-height:0}.collection{justify-content:center;gap:18px 10px;min-height:0;padding:12px 4px 4px}.deck-list{flex-flow:wrap;flex:none;align-items:center;gap:8px;width:100%;max-height:none;padding:10px}.deck-list ul{display:none}.deck-list .deck-count{font-size:20px}.deck-list .deck-error{flex-basis:100%;order:9;min-height:0;font-size:12px}.deck-list>div:not(.deck-count):not(.deck-error){flex:auto}.deck-list button.primary{flex:100%;order:8;padding:14px;font-size:16px}}.cards-box{align-items:center;gap:8px;min-width:0;display:flex}.cards-box .stat{white-space:nowrap}.ico{display:none}.warn{color:var(--red)}#field .hint{z-index:4;text-align:center;white-space:nowrap;border:1px solid var(--accent);pointer-events:none;background:#000c;border-radius:12px;max-width:94%;padding:4px 12px;font-size:13px;position:absolute;top:6px;left:50%;transform:translate(-50%)}#field .hint:empty{display:none}@media (max-width:720px){.lbl,.sep{display:none}.ico{display:inline}.max,.card-rarity{display:none}.topbar{flex-wrap:nowrap;gap:8px;min-height:0;padding:4px 8px;overflow:hidden}.topbar .stat,.bottombar .stat{font-size:12px}.energy{flex:0 auto;gap:4px;min-width:0}.energy b{font-size:13px}.pips{gap:2px;min-width:0}.pip{flex:0 7px;width:7px;height:14px}.cards-box{flex:none;padding-bottom:5px;display:block;position:relative}.cards-box .draw{border-radius:2px;width:auto;height:3px;position:absolute;bottom:0;left:0;right:0}.topbar button.danger{flex:none;padding:4px 8px;font-size:12px}.topbar .spacer{flex:1 1 0;min-width:0}.hand{gap:6px;padding:10px 8px 6px}.hand .card{border-width:2px;border-radius:9px;width:66px;height:88px;padding:4px 3px 3px}.hand .card-cost{border-width:1px;width:20px;height:20px;font-size:11px;top:-6px;left:-6px}.hand .card-icon{margin-top:2px;font-size:22px}.hand .card-name{min-height:22px;margin-top:1px;font-size:9px;line-height:1.05}.hand .card-key,.hand .card-type,.hand .card-text{display:none}.hand .card-help{width:16px;height:16px;font-size:10px;bottom:3px;right:3px}.bottombar{flex-wrap:nowrap;gap:8px;padding:4px 8px;overflow:hidden}.bottombar .who{white-space:nowrap;font-size:12px}.bottombar .stat{white-space:nowrap}}@supports (height:100dvh){html,body,#app{height:100dvh}}.hand .card{touch-action:pan-x}.hand .card.dragging{opacity:.35}.ghost-holder{z-index:200;pointer-events:none;filter:drop-shadow(0 8px 14px #000a);background:0 0;border:0;padding:0;display:block;position:fixed;overflow:visible;transform:translate(-50%,-62%)scale(1.08)}.ghost-holder .card{opacity:.95;margin:0}#field.drop-ok{outline:3px solid var(--green);outline-offset:-3px}.faction .f-motto{color:var(--text);opacity:.85;margin-bottom:4px;font-size:14px;font-style:italic}.login-form{gap:8px;width:min(420px,100%);display:flex}.login-form input{min-width:0;font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;flex:1;padding:12px 14px;font-size:18px}.login-form input:focus{outline:2px solid var(--accent);border-color:var(--accent)}.login-error{color:var(--yellow);max-width:460px;min-height:22px;font-size:14px}.lobby{gap:8px;padding:10px 14px;overflow:hidden}.lobby-head{flex-wrap:wrap;align-items:baseline;gap:14px;display:flex}.lobby-name{font-size:20px}.lobby-stat{color:var(--muted);font-size:14px}.tabs{border-bottom:1px solid var(--line);gap:6px;display:flex}.tab{background:var(--panel);border-bottom:0;border-radius:8px 8px 0 0;padding:8px 14px}.tab.on{background:var(--panel-2);border-color:var(--accent);color:var(--accent)}.lobby-body{flex:1;min-height:0;padding:8px 2px;overflow:auto}.center-col{text-align:center;flex-direction:column;align-items:center;gap:18px;display:flex}.plist{flex-direction:column;gap:6px;max-width:760px;display:flex}.empty{color:var(--muted);padding:24px 8px}.prow{background:var(--panel);border:1px solid var(--line);border-radius:10px}.pline{text-align:left;background:0 0;border:0;flex-wrap:wrap;align-items:center;gap:10px;width:100%;padding:10px 12px;display:flex}.pline.match{cursor:default}.pname{flex:1;min-width:120px;font-weight:600}.pfac{text-align:center;width:26px}.pxp{color:var(--muted);text-align:right;min-width:58px;font-size:13px}.pstatus{color:var(--muted);text-align:right;min-width:92px;font-size:12px}.pstatus.searching{color:var(--yellow)}.pstatus.playing{color:var(--green)}.dot{background:var(--muted);border-radius:50%;flex:none;width:10px;height:10px}.dot.searching{background:var(--yellow)}.dot.playing{background:var(--green)}.pinfo{color:#c9d0dd;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:4px 14px 12px;font-size:14px;display:flex}.spinner{border:5px solid var(--panel-2);border-top-color:var(--accent);border-radius:50%;width:54px;height:54px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#netbanner{z-index:300;background:var(--red);color:#fff;text-align:center;padding:6px;font-size:14px;transition:transform .2s;position:fixed;top:0;left:0;right:0;transform:translateY(-110%)}#netbanner.show{transform:none}@media (max-width:720px){.lobby{padding:8px}.lobby-name{font-size:17px}.pline{gap:6px;padding:8px 10px}.pstatus,.pxp{min-width:0}}.collection .slot .minus{z-index:3;background:var(--red);color:#fff;border:2px solid #fff;border-radius:50%;place-items:center;width:26px;height:26px;padding:0;font-size:18px;font-weight:800;line-height:1;display:grid;position:absolute;top:-8px;right:-8px}.coach-ring{z-index:390;pointer-events:none;border:3px solid var(--accent);box-shadow:0 0 0 9999px #0005, 0 0 18px var(--accent);border-radius:12px;transition:left .15s,top .15s,width .15s,height .15s;position:fixed}.coach{pointer-events:none;z-index:400;background:var(--panel);border:2px solid var(--accent);border-radius:12px;flex-direction:column;gap:6px;padding:12px 14px;display:flex;position:fixed;box-shadow:0 10px 30px #000a}.coach-title{color:var(--accent);font-size:16px;font-weight:800}.coach-text{color:#dde2ec;font-size:14px;line-height:1.45}.coach-actions{align-items:center;gap:8px;margin-top:4px;display:flex}.coach-skip{color:var(--muted);background:0 0;border:0;padding:6px 2px;font-size:13px;text-decoration:underline}.help-btn{padding:6px 12px;font-size:13px}.help-overlay{z-index:400;background:#000c;justify-content:center;align-items:center;padding:12px;display:flex;position:fixed;inset:0}.help-box{width:min(560px,100%);max-height:calc(100vh - 24px);background:var(--panel);border:2px solid var(--accent);border-radius:16px;max-height:calc(100dvh - 24px);padding:18px 20px 14px;overflow-y:auto}.help-box h2{margin:0 0 8px}.help-list{color:#dde2ec;margin:0 0 12px;padding-left:20px;font-size:14px;line-height:1.5}.help-list li{margin-bottom:7px}.help-nav{align-items:center;gap:8px;display:flex}kbd{background:var(--panel-2);border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:0 6px;font-size:13px}.coach button{pointer-events:auto}.ghost-chip{z-index:200;pointer-events:none;opacity:.8;border:3px solid #fff;border-radius:12px;place-items:center;line-height:1;display:grid;position:fixed;transform:translate(-50%,-50%);box-shadow:0 6px 14px #000a}.modal{z-index:500;text-align:center;background:#000b;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal .box{background:var(--panel);border:2px solid var(--accent);border-radius:16px;flex-direction:column;gap:12px;width:100%;max-width:460px;padding:24px 28px;display:flex}.modal h2{margin:0;font-size:26px}.modal p{margin:0}.modal-actions{flex-direction:column;gap:8px;margin-top:6px;display:flex}.card-kind{opacity:.92;pointer-events:auto;width:20px;height:20px;position:absolute;bottom:4px;left:4px}.card-kind svg{filter:drop-shadow(0 1px 1px #000a);width:100%;height:100%;display:block}@media (max-width:720px){.card-kind{width:15px;height:15px;bottom:3px;left:3px}}.log-icon.has-tip{cursor:help}.log-icon.has-tip:hover{filter:brightness(1.3)}.splash-art{border-radius:16px;width:min(780px,100%);height:auto;display:block;box-shadow:0 12px 40px #000b}.sr-only{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}@media (max-width:720px){.splash-art{border-radius:10px}}