:root{color-scheme:dark;--bg:#14212d;--panel:#1d2d3a;--line:#344653;--muted:#8c9da9;--cream:#f2e6c8;--gold:#e9c177}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--cream);font-family:system-ui,-apple-system,'Apple SD Gothic Neo',sans-serif}button{font:inherit;cursor:pointer;color:inherit;border:1px solid var(--line);background:#243643;border-radius:7px;transition:background .15s,transform .15s}button:hover{background:#344a57}button:active{transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.shell{max-width:1400px;margin:auto;padding:0 45px}header{height:92px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--cream);font-weight:800;font-size:19px;letter-spacing:1.4px}.brand>span{font-size:38px;color:var(--gold)}.brand small{display:block;font-size:10px;font-weight:400;letter-spacing:3px;color:var(--muted);margin-top:4px}.top-actions{display:flex;align-items:center;gap:9px}.top-actions button{font-size:11px;padding:8px 11px}.chapter{font-size:10px;letter-spacing:1px;color:#8fa0ac;margin-right:20px}main{padding-top:29px}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--gold);margin:0 0 10px}h1{font-size:32px;letter-spacing:-1.5px;margin:0;font-weight:750}.subtitle{font-size:12px;color:var(--muted);margin:10px 0 0}.progress{text-align:right}.progress span{display:block;font-size:26px;letter-spacing:6px;color:var(--gold)}.progress small{font-size:9px;color:var(--muted)}.arena{border:1px solid #41505a;border-radius:13px;overflow:hidden;background:var(--panel)}.scoreboard{display:flex;gap:45px;align-items:center;padding:19px 25px}.base-status{flex:1}.base-status>span{display:flex;justify-content:space-between;font-size:11px;color:#a9cee1;gap:10px}.base-status b{font-size:10px;font-weight:500;color:var(--muted)}.health{height:6px;margin-top:9px;border-radius:5px;background:#101d27;overflow:hidden}.health i{display:block;height:100%;width:100%;background:#71b6d0;transition:width .2s}.enemy>span{color:#e8a598}.enemy .health{transform:scaleX(-1)}.enemy .health i{background:#cf806e}.battle-time{text-align:center;min-width:70px}.battle-time strong{display:block;font-weight:500;font-size:20px;letter-spacing:2px;font-variant-numeric:tabular-nums}.battle-time small{font-size:8px;color:var(--muted);display:block;margin-top:4px;letter-spacing:1px}.stage{position:relative;line-height:0;background:#86b0b8}canvas{width:100%;display:block;height:auto}.map-tag{position:absolute;left:20px;top:18px;font-size:9px;letter-spacing:2px;color:#d6eced;line-height:1;text-shadow:0 1px 4px #334b55}.map-tag span{display:block;font-size:8px;letter-spacing:0;margin-top:7px;color:#f0ebd5}.stage-controls{display:flex;gap:7px;position:absolute;right:17px;top:14px}.stage-controls button{width:34px;height:30px;font-size:11px;background:#1d3548a8;border-color:#afc9d244}.frontline{padding:14px 22px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#a0b0b9;gap:10px}.frontline b{color:var(--cream);margin:0 3px}.blue-dot,.red-dot{display:inline-block;height:6px;width:6px;background:#79b8d2;border-radius:50%;margin:0 8px 1px 0}.red-dot{background:#da8c7e;margin:0 0 1px 8px}#notice{font-size:10px;color:#b3baa4;text-align:center}.command{display:grid;grid-template-columns:190px minmax(0,1fr) 155px;gap:23px;margin-top:23px}.resource{padding:5px 20px 0 0;border-right:1px solid var(--line)}.resource>div:first-child{display:flex;align-items:center;justify-content:space-between}.resource span{font-size:10px;color:#a1b8bf}.resource strong{font-size:23px;color:#a9dbe8;font-weight:550}.resource strong small{font-size:10px;color:var(--muted)}.mana-track{height:4px;background:#0f1c25;border-radius:4px;margin:9px 0 14px;overflow:hidden}.mana-track i{height:100%;display:block;background:#8dc5d6;width:66%}.resource button{width:100%;font-size:10px;padding:9px 7px;display:flex;justify-content:space-between}.resource button b{font-weight:500;color:var(--gold)}.resource>small{display:block;font-size:9px;color:var(--muted);margin-top:9px}.command-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 10px}.command-heading>span{font-size:11px}.command-heading small{font-size:9px;color:var(--muted)}#units{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.unit{position:relative;display:grid;grid-template-columns:33px 1fr;text-align:left;padding:13px 10px;gap:8px;align-items:center;overflow:hidden;background:#213340;min-height:96px}.unit .symbol{font-size:31px;color:var(--gold);text-align:center}.unit strong{font-size:13px;display:block}.unit small{font-size:8px;color:var(--muted);display:block;margin-top:4px}.unit .price{font-size:11px;color:#b9d7dc;grid-column:2}.unit .key{position:absolute;right:7px;top:6px;font-size:8px;color:#8193a0}.unit .cooldown{position:absolute;inset:0;display:grid;place-items:center;background:#101c27aa;font-size:20px}.unit .cooldown[hidden]{display:none}.ultimate{background:#343d47;border-color:#6e6856;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px;gap:6px}.ultimate>span{font-size:36px;line-height:1;color:var(--gold)}.ultimate strong{font-size:12px}.ultimate small{font-size:9px;color:#b4ab95}.ultimate b{font-size:7px;letter-spacing:1px;color:#888c91;border:1px solid #5c6266;padding:3px 5px;border-radius:3px}footer{display:flex;justify-content:space-between;font-size:9px;color:#8294a1;padding:24px 0 30px;gap:15px}footer b{font-size:8px;color:var(--gold);margin-right:8px}#overlay{position:absolute;inset:0;display:grid;place-items:center;background:#182c3b75;backdrop-filter:blur(3px);padding:12px;line-height:normal}#overlay[hidden]{display:none}.dialog{max-width:390px;text-align:center;background:#1b2c39f2;padding:29px 35px;border:1px solid #b6a77c88;border-radius:12px;box-shadow:0 20px 50px #14202e88}.dialog h2{font-size:27px;margin:10px 0 15px}.dialog>p:not(.eyebrow){font-size:12px;line-height:1.9;color:#a4b5bd;white-space:pre-line}.dialog button{display:block;width:100%;padding:12px 17px;margin-top:17px;font-size:12px;background:var(--gold);color:#273444;border:0;font-weight:700}.dialog button span{float:right}.dialog #secondary{background:transparent;border:1px solid var(--line);color:#a5b4bd;margin-top:8px}.dialog #secondary[hidden]{display:none}@media(max-width:1050px){.shell{padding:0 25px}.command{grid-template-columns:160px minmax(0,1fr) 130px;gap:14px}.unit{padding:10px 7px;grid-template-columns:25px 1fr;gap:4px}.unit .symbol{font-size:25px}.unit small{display:none}.unit .price{grid-column:1/-1;text-align:center}.chapter{display:none}}@media(max-width:760px){.shell{padding:0 14px}header{height:73px}.brand{font-size:15px}.brand>span{font-size:30px}.brand small{font-size:8px}.top-actions button{font-size:10px;padding:7px 9px}main{padding-top:23px}.intro{margin-bottom:20px}h1{font-size:24px;letter-spacing:-1px}.eyebrow{font-size:7px;letter-spacing:1.2px}.subtitle{font-size:10px;line-height:1.6}.progress{display:none}.scoreboard{padding:12px;gap:12px}.base-status>span{font-size:8px;display:block}.base-status b{display:block;font-size:8px;margin-top:5px}.enemy>span{display:flex;flex-direction:column-reverse;text-align:right}.battle-time{min-width:48px}.battle-time strong{font-size:15px}.battle-time small{font-size:7px}.health{height:4px;margin-top:7px}.map-tag{top:12px;left:12px;font-size:7px}.map-tag span{display:none}.stage-controls{top:8px;right:8px;gap:5px}.stage-controls button{width:27px;height:25px;font-size:9px}.frontline{padding:11px;font-size:8px}#notice{font-size:8px;max-width:150px}.blue-dot,.red-dot{width:4px;height:4px;margin:0 4px}.command{grid-template-columns:1fr 115px;gap:14px;margin-top:17px}.resource{grid-column:1/-1;border:0;display:grid;grid-template-columns:1fr 150px;gap:5px 20px;padding:0}.resource>div:first-child{grid-column:1}.resource strong{font-size:20px}.mana-track{grid-row:2;grid-column:1;margin:0;align-self:center}.resource button{grid-column:2;grid-row:1}.resource>small{grid-column:2;grid-row:2;margin:0;font-size:8px;text-align:right}.army{grid-column:1/-1;grid-row:2}.command-heading{margin-top:3px}.ultimate{grid-column:1/-1;flex-direction:row;gap:13px;padding:10px;min-height:55px}.ultimate>span{font-size:29px}.ultimate b{margin-left:auto}.ultimate small{font-size:9px}.unit{min-height:89px;grid-template-columns:1fr;text-align:center;padding:9px 5px;gap:2px}.unit .symbol{font-size:26px}.unit strong{font-size:11px}.unit .price{font-size:9px}.command-heading small{font-size:8px}footer{font-size:8px;line-height:1.7;padding-top:17px}footer>span:last-child{display:none}.dialog{padding:14px 19px}.dialog h2{font-size:19px;margin:5px 0}.dialog .eyebrow{margin-bottom:4px}.dialog>p:not(.eyebrow){font-size:9px;margin:7px 0;line-height:1.65}.dialog button{padding:9px;margin-top:9px;font-size:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.campaign{margin-left:auto;margin-right:25px}.campaign label{display:block;font-size:9px;color:var(--muted);margin-bottom:8px}.campaign select{font:inherit;font-size:11px;color:var(--cream);background:#243643;border:1px solid var(--line);border-radius:7px;padding:9px;width:190px}.campaign select:focus-visible{outline:2px solid var(--gold)}.campaign select:disabled{opacity:.55}.progress span{font-size:23px;letter-spacing:1px}#units{grid-template-columns:repeat(5,minmax(0,1fr))}.unit{min-height:82px}.command{align-items:start}.ultimate{min-height:183px}.resource{padding-top:20px}@media(max-width:1050px){.intro{flex-wrap:wrap;gap:15px}.campaign{margin-left:0}.progress{margin-left:auto}#units{gap:7px}}@media(max-width:760px){.campaign{width:100%;display:flex;align-items:center;gap:12px;margin:0}.campaign label{margin:0;white-space:nowrap}.campaign select{flex:1;min-width:0;font-size:10px;padding:8px}.resource{padding:0}#units{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.unit{min-height:85px}.unit strong{font-size:10px}.unit .symbol{font-size:23px}.ultimate{min-height:55px}.intro{gap:12px}.dialog>p:not(.eyebrow){font-size:8px}.dialog h2{font-size:17px}}
