:root{color-scheme:dark;--bg:#0c1119;--edge:#2a3a51;--text:#edf0f5;--muted:#98acc7;--gold:#efc879}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 60% 0,#1d2c43,transparent 70%),var(--bg);color:var(--text);font:14px system-ui,"Yu Gothic",sans-serif}button,input{font:inherit}button{border:1px solid #465c79;border-radius:6px;color:inherit;background:#223147;padding:9px 13px;cursor:pointer}button:hover:not(:disabled){background:#374d6b}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.primary{background:var(--gold);color:#211b10;font-weight:800;border-color:var(--gold)}.danger{color:#ffaaaa}input{background:#0e1623;border:1px solid #41536c;border-radius:6px;color:white;padding:10px;max-width:100%;min-width:0}header{height:83px;border-bottom:1px solid var(--edge);padding:15px 3vw;display:flex;align-items:center;justify-content:space-between;gap:15px}.brand{color:#f2e3bd;font-size:25px;font-weight:800;text-decoration:none;white-space:nowrap}.brand em{color:var(--gold);font-style:normal}.brand small{display:block;font-size:9px;letter-spacing:.2em;color:var(--muted)}#connection{color:var(--muted);font-size:12px}main{max-width:1600px;margin:auto;padding:24px}.hero{max-width:1100px;margin:5vh auto}.eyebrow{color:var(--gold);font-size:11px;letter-spacing:.24em}h1{font-size:clamp(38px,5vw,72px);line-height:1.35;letter-spacing:-.04em;margin:15px 0}h2{font-size:18px;margin:0 0 12px}h3{font-size:14px;margin:0}p{line-height:1.8}.muted,small{color:var(--muted)}.hero-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px}.panel{background:linear-gradient(130deg,#19283d,#111a27);border:1px solid var(--edge);border-radius:12px;padding:18px}.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.spread{justify-content:space-between}.topbar{margin-bottom:15px}.pill{border:1px solid var(--edge);border-radius:30px;padding:6px 12px;font-size:12px}.layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:16px}.standings{display:flex;flex-direction:column;gap:7px}.standing{display:grid;grid-template-columns:26px 1fr auto;gap:6px;align-items:center;padding:10px 8px;text-align:left;width:100%;border-color:var(--edge);font-size:12px}.standing.self{border-color:var(--gold)}.standing.watching{background:#36445c}.standing.dead{opacity:.4}.avatar{width:26px;height:26px;background:#36425b;border-radius:50%;display:grid;place-items:center;color:var(--gold)}.arena{position:relative;overflow:hidden;border:1px solid #394a63;border-radius:12px;background:#101a2a}.arena-head{padding:14px 18px;background:#182438;display:flex;align-items:center;justify-content:space-between;gap:10px}.arena canvas{width:100%;height:280px;display:block;background:#111e2e}.timebar{height:6px;background:#333f52}.timebar>div{height:100%;width:100%;background:#76b7d1;transition:width .1s linear}.timebar.hot>div{background:#ff8a65}.battle-caption{padding:10px 16px;min-height:42px;color:#b5c6de;font-size:12px}.stats{display:flex;gap:14px;font-size:12px;flex-wrap:wrap}.stats b{color:var(--text)}.economy{margin:14px 0;display:flex;justify-content:space-between;gap:15px;align-items:center}.gold{color:var(--gold);font-weight:800;font-size:21px}.xp{width:130px;height:5px;background:#354059;margin-top:5px;border-radius:4px;overflow:hidden}.xp>i{display:block;height:100%;background:#b398f4}.odds{display:flex;gap:9px;flex-wrap:wrap;font-size:11px;margin:7px 0}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--rarity)}.shop{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:13px}.card{position:relative;min-width:0;border:1px solid var(--rarity);border-top:3px solid var(--rarity);border-radius:9px;background:linear-gradient(145deg,color-mix(in srgb,var(--rarity) 17%,#111a27),#111a27);overflow:hidden;color:var(--text);padding:10px;text-align:left;font-size:11px;transition:transform .15s}.card:hover{transform:translateY(-3px)}.card.selected{outline:2px solid var(--gold)}.card.dragging{opacity:.4}.art{height:68px;border-radius:5px;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity) 28%,transparent),transparent 70%);display:grid;place-items:center;font-size:44px;position:relative}.art:before{content:'';position:absolute;width:48px;height:48px;border:1px solid color-mix(in srgb,var(--rarity) 50%,transparent);transform:rotate(45deg);border-radius:8px}.art span{position:relative;filter:drop-shadow(0 3px 5px #0008)}.card strong{display:block;font-size:13px;margin:8px 0 4px}.card .type{color:var(--rarity);font-size:10px}.card .desc{min-height:43px;line-height:1.6;margin:6px 0}.card button{width:100%;padding:6px}.card .stars{color:var(--gold);font-size:11px;position:absolute;top:5px;right:6px}.slot{min-height:183px;border:1px dashed #405977;border-radius:8px;position:relative;display:flex;flex-direction:column;justify-content:center;text-align:center;color:#8b9eb9}.slot:has(.card){border:0}.slot .card{height:100%;min-height:183px}.slot.drop{outline:2px solid var(--gold)}.slotno{position:absolute;top:4px;left:6px;font-size:10px;z-index:1;color:#b2c5df}.deck,.bench{display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:8px;margin-top:12px}.bench .slot{min-height:120px}.bench .art{height:36px;font-size:30px}.bench .card{min-height:120px}.bench .desc{display:none}.bench .slotno{display:none}.section{margin-top:14px}.section-head{display:flex;justify-content:space-between;gap:10px;align-items:center}.selected-actions{min-height:35px;margin:10px 0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.log{height:82px;overflow:auto;color:#a4b9d5;font-size:11px}.log p{margin:3px 0}.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.result{font-size:12px;padding:10px;background:#202d40;border-radius:7px}.lobby-list{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:22px 0}.lobby-list>div{padding:20px 12px;border:1px solid var(--edge);border-radius:8px}.roomcode{font-size:23px;letter-spacing:.08em;color:var(--gold);word-break:break-all}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#f1d392;color:#282317;padding:12px 20px;border-radius:8px;z-index:10;display:none;max-width:90vw}dialog{max-width:640px;background:#172333;color:var(--text);border:1px solid #62748b;border-radius:12px;padding:28px}dialog::backdrop{background:#000b}details{font-size:12px;margin-top:12px}details p{margin:6px 0}.compact{font-size:11px}.emptyshop{min-height:220px;display:grid;place-items:center;border:1px dashed var(--edge);color:#8ea2be;border-radius:8px}.ready{color:#80d5a6}footer{margin:18px 0;color:var(--muted);font-size:11px}@media(min-width:1300px){.arena canvas{height:320px}.deck{grid-template-columns:repeat(8,minmax(0,1fr))}.deck .card{padding:8px}.deck .card strong{font-size:12px}}@media(max-width:900px){.layout{grid-template-columns:1fr}.standings{display:grid;grid-template-columns:repeat(4,1fr)}.standing{font-size:10px}.shop{gap:5px}.card{padding:7px}.card strong{font-size:11px}.art{height:50px;font-size:34px}.summary{grid-template-columns:1fr 1fr}}@media(max-width:600px){main{padding:12px}header{padding:12px;height:75px}.brand{font-size:20px}#connection{display:none}.hero-cards{grid-template-columns:1fr}.shop{grid-template-columns:repeat(2,1fr)}.shop>.card:last-child{grid-column:span 2}.shop .art{height:42px}.shop .desc{min-height:0}.standings{grid-template-columns:repeat(2,1fr)}.economy{flex-wrap:wrap}.panel{padding:12px}.deck,.bench{grid-template-columns:repeat(3,1fr)}.arena canvas{height:240px}.lobby-list{grid-template-columns:1fr 1fr}.stats{gap:7px}}
