/* Original footage geometry: 960 × 720; the whole stage scales uniformly. */
.game-shell.in-battle{background:#171510;min-height:100svh;height:100svh}
.in-battle .world-art,.in-battle .scene-shade,.in-battle .ambient-particles{display:none}
.in-battle .screen{padding:0;min-height:0;height:100%;display:flex;align-items:center;justify-content:center}
.in-battle .topbar{top:8px;right:8px;left:auto;padding:0;z-index:7;opacity:0;transition:opacity .2s}
.in-battle .topbar:hover,.in-battle .topbar:focus-within{opacity:1}
.in-battle .edition,.in-battle .footer{display:none}
.in-battle .utility{width:30px;height:30px}
.battle-viewport{position:relative;flex:none;overflow:hidden;box-shadow:0 0 60px #0009}
.battle-stage{position:absolute;left:0;top:0;width:960px;height:720px;transform-origin:top left;background:#171510;color:#fff3c1;font:14px/1.35 "SimSun","Microsoft YaHei",serif;user-select:none;touch-action:none}
.battle-stage button{font-family:inherit;line-height:1.2;padding:0;touch-action:none}
.battle-stage button:focus-visible{outline:2px solid #fffba2;outline-offset:2px}
.battle-map{position:absolute;left:20px;top:0;width:920px;height:558px;object-fit:fill;pointer-events:none}
.battle-canvas{position:absolute;left:0;top:0;width:960px;height:558px;cursor:default}
.battle-canvas.placing{cursor:crosshair}
.battle-top{position:absolute;inset:0 0 auto;height:78px;pointer-events:none;text-shadow:1px 1px #211800,-1px -1px #211800}
.battle-avatar{position:absolute;top:-3px;left:69px;width:76px;height:76px;object-fit:contain;z-index:2}
.battle-avatar.enemy{left:auto;right:67px}
.strength-frame{position:absolute;left:127px;top:1px;width:264px;height:31px;clip-path:polygon(0 0,96% 0,100% 50%,96% 100%,0 100%);padding:5px 10px 5px 7px;background:linear-gradient(#fceda2,#ad7e33 18%,#67451d 35%,#fff0a6 55%,#ae7b35);filter:drop-shadow(1px 2px 0 #392a12)}
.strength-frame.enemy{left:auto;right:126px;transform:scaleX(-1)}
.strength-track{position:relative;height:21px;border:1px solid #493b1f;background:#d99c5c;overflow:hidden}
.strength-fill{height:100%;background:linear-gradient(#ee7561,#e34029 45%,#ee5638);transition:width .3s}
.strength-frame.enemy .strength-fill{background:linear-gradient(#ee765f,#ea3929 45%,#f96440)}
.strength-value{position:absolute;inset:0;text-align:center;font-weight:bold;font-size:17px;line-height:20px;color:#fff1a8;text-shadow:1px 2px #554820,-1px -1px #554820}
.strength-frame.enemy .strength-value{transform:scaleX(-1)}
.battle-name{position:absolute;top:38px;left:147px;font-weight:bold;color:#fff575;font-size:14px;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.battle-name.enemy{left:auto;right:146px}
.battle-clock{position:absolute;left:429px;top:9px;width:100px;text-align:center;color:#fff4b5;font-weight:bold;text-shadow:1px 2px #443313;opacity:.94}
.battle-actions{position:absolute;left:0;right:0;top:485px;height:85px;z-index:3;pointer-events:none}
.source-action{position:absolute;bottom:0;background:transparent;border:0;filter:drop-shadow(1px 1px 1px #332613);pointer-events:auto;transition:filter .1s,transform .1s}
.source-action img{display:block;width:100%;height:100%;pointer-events:none}
.source-action:hover{filter:brightness(1.18) drop-shadow(0 0 4px #ffeb8c)}
.source-action:active{transform:translateY(2px)}
.source-action.active{filter:brightness(1.15) drop-shadow(0 0 5px #ffff75)}
.source-action:disabled{opacity:.5;cursor:not-allowed}
.source-action.remove{left:40px;width:79px;height:84px}.source-action.save{left:118px;width:82px;height:84px}.source-action.formation{left:674px;width:67px;height:84px}.source-action.start{left:748px;width:86px;height:84px}.source-action.leave{left:839px;width:80px;height:84px}
.battle-hud{position:absolute;left:20px;right:20px;top:558px;height:162px;border:4px ridge #b2934d;border-radius:0 0 8px 8px;background:linear-gradient(90deg,#44290f,#563717 35%,#482d14 75%,#533616);box-shadow:inset 0 0 0 3px #231508,inset 0 0 25px #261709}
.battle-hud::before{content:"";position:absolute;left:0;right:0;top:-8px;height:12px;background:linear-gradient(#ecd88c,#685023 35%,#e6cf86 55%,#211506 80%);pointer-events:none}
.troop-tray{position:absolute;left:54px;top:17px;width:381px;display:grid;grid-template-columns:repeat(5,64px);grid-template-rows:64px 64px;column-gap:14px;row-gap:4px}
.troop-slot{position:relative;width:64px;height:64px;display:grid;place-items:start center;border:3px ridge #dedbd1;background:linear-gradient(135deg,#120f0e,#372c25);box-shadow:0 0 0 2px #1f1309,0 2px 3px #000b}
.troop-slot img{width:57px;height:48px;object-fit:fill;pointer-events:none}
.troop-slot .troop-count{position:absolute;bottom:0;right:3px;color:#fff17c;font:bold 16px/1.1 "SimSun",serif;text-shadow:1px 1px #241504,-1px -1px #241504}
.troop-slot:hover{border-color:#ffeda2;filter:brightness(1.13)}
.troop-slot.selected{border-color:#fff478;box-shadow:0 0 0 2px #816513,0 0 9px #ffda56}
.troop-slot.exhausted{filter:grayscale(.9);opacity:.5;cursor:not-allowed}
.troop-slot.empty{opacity:.45;border-color:#785c3d;pointer-events:none}
.tray-arrow{position:absolute;top:63px;width:34px;height:42px;border:0;background:none;color:#fff575;font-size:38px;font-family:serif!important;text-shadow:2px 2px #2c1909,-1px -1px #ffe9a0}
.tray-arrow:hover{filter:brightness(1.3)}.tray-arrow:disabled{color:#c2bbb0;opacity:.7;cursor:default}.tray-arrow.unit-prev{left:9px}.tray-arrow.unit-next{left:442px}.tray-arrow.hero-prev{left:490px}.tray-arrow.hero-next{right:7px}
.hero-tray{position:absolute;left:525px;top:15px;display:flex;gap:8px}
.hero-slot{position:relative;width:103px;height:134px;border:0;border-radius:10px;background:linear-gradient(90deg,#251408,#422711 16%,#301b0c 85%,#1e1209);box-shadow:inset 0 0 5px #160d06,1px 1px 0 #795329}
.hero-slot img{position:absolute;left:7px;bottom:8px;width:89px;height:89px;object-fit:contain;pointer-events:none}
.hero-slot strong{position:absolute;top:9px;left:0;right:0;text-align:center;font-size:13px;color:#ffe8b1;text-shadow:1px 2px #251905;font-weight:normal}
.hero-slot.selected{box-shadow:inset 0 0 0 2px #f3dc73,0 0 6px #f6d765}
.hero-slot:hover img{filter:brightness(1.15)}
.hero-slot.deployed img{opacity:.14;filter:grayscale(1)}
.hero-slot.deployed::after{content:"已出阵";position:absolute;left:8px;right:8px;top:72px;color:#b39a62;font-size:15px;text-align:center}
.combat-heroes{display:flex;gap:0;height:100%;padding:10px 15px}
.combat-hero{position:relative;width:300px;height:140px;border-right:2px solid #37200c;padding:4px 0}
.combat-hero:last-child{border:0}
.combat-portrait{position:absolute;left:16px;top:41px;width:88px;height:89px;object-fit:contain}
.combat-hero-name{position:absolute;left:18px;top:10px;color:#ffe79b;font-weight:bold;font-size:14px}
.hero-bars{position:absolute;left:111px;right:13px;top:45px}
.hero-bar{height:12px;border:1px solid #ac9864;margin-bottom:4px;background:#141914;box-shadow:0 0 0 1px #140c05;position:relative}
.hero-bar i{display:block;height:100%;background:linear-gradient(#80fa55,#279319);transition:width .2s}
.hero-bar.mana i{background:linear-gradient(#68cafd,#1768d3)}
.hero-bar span{position:absolute;inset:0;text-align:center;font:10px/10px Arial;color:#fff;text-shadow:1px 1px #000}
.skill-row{position:absolute;left:112px;top:85px;display:flex;gap:9px}
.skill-slot{position:relative;width:45px;height:45px;border:1px solid #bba973;background:#29281a;box-shadow:0 0 0 2px #1b140a}
.skill-slot img{display:block;width:43px;height:43px;pointer-events:none}
.skill-slot .cooldown-veil{position:absolute;inset:0;background:#182029ba;clip-path:inset(0 0 100% 0)}
.skill-slot .cooldown-number{position:absolute;inset:0;display:grid;place-items:center;color:white;font:bold 18px Arial;text-shadow:1px 1px #111}
.skill-slot .skill-key{position:absolute;right:2px;bottom:0;color:#fff5ba;font:10px Arial;text-shadow:1px 1px #000}
.skill-slot:hover{box-shadow:0 0 0 2px #fce78b,0 0 8px #ffe575}
.skill-slot.armed{box-shadow:0 0 0 3px #fff988,0 0 15px #ffc544}
.skill-slot.unavailable img{filter:grayscale(1);opacity:.6}.skill-slot.unavailable{cursor:not-allowed}
.combat-hero.dead{filter:grayscale(1);opacity:.48}.empty-combat-hero{display:grid;place-items:center;color:#ae9166;font-size:15px}
.battle-help-link{position:absolute;top:67px;right:32px;background:#2c351d88;color:#eee3a5;border:1px solid #d3be7477;border-radius:10px;width:23px;height:23px;font-size:15px;z-index:4}
.battle-tip{position:absolute;z-index:8;left:50%;top:78px;transform:translateX(-50%);max-width:570px;padding:8px 18px;border:1px solid #e0c168;background:#32200fe8;box-shadow:0 2px 10px #0005;color:#fff4b5;text-align:center;font-size:14px;pointer-events:none;transition:opacity .2s;opacity:0}
.battle-tip.visible{opacity:1}
.battle-tooltip{position:absolute;z-index:15;width:240px;padding:11px 13px;color:#ffefb8;background:#22180ef5;border:2px ridge #c7a668;box-shadow:0 5px 12px #0008;pointer-events:none;font-size:13px;line-height:1.5}
.battle-tooltip strong{font-size:15px;color:#ffe35c}.battle-tooltip p{margin:4px 0}.battle-tooltip small{color:#cabc92}
.battle-overlay{position:absolute;z-index:10;inset:0;background:#0006;display:flex;align-items:center;justify-content:center}
.battle-modal{position:relative;width:600px;padding:26px 30px;color:#f5dfa0;border:6px ridge #d3b875;background:radial-gradient(ellipse at top,#65471f,#3b240f 85%);box-shadow:0 0 0 2px #211607,0 15px 50px #000a;text-shadow:1px 1px #251504}
.battle-modal h2{margin:0 0 20px;text-align:center;font-size:27px;font-weight:bold;color:#fff0bc;text-shadow:2px 3px #211306}
.battle-modal p{margin:10px 0;line-height:1.7}.battle-modal .modal-close{position:absolute;right:9px;top:8px;width:36px;height:36px;padding:0;border:0;background:none}.modal-close img{width:100%;height:100%}
.gold-game-button{padding:9px 20px!important;background:linear-gradient(#6c783d,#364422);border:3px ridge #d8ca8d;box-shadow:0 0 0 1px #1f180b,0 2px 4px #0006;border-radius:3px;color:#fff6c4;text-shadow:1px 2px #19200a;font-size:16px;min-height:36px}
.gold-game-button:hover{filter:brightness(1.16)}.gold-game-button.secondary{background:linear-gradient(#706143,#423018)}
.modal-button-row{display:flex;gap:12px;justify-content:center;margin-top:24px}
.battle-modal .formation-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.formation-choice{padding:15px!important;background:#23160a88;border:2px ridge #92713e;text-align:left;color:#ffe8a5;font-size:17px}.formation-choice:hover{background:#76532788}.formation-choice span{display:block;color:#ceb48c;font-size:13px;margin-top:7px}
.battle-modal .result-value{font-size:36px;color:#ffdc64;text-align:center;margin:12px 0}
.battle-curtain{position:absolute;z-index:11;inset:0;background:#050702;pointer-events:none;animation:battleFade .7s ease forwards}
@keyframes battleFade{from{opacity:1}to{opacity:0}}
.training-layer{position:absolute;z-index:9;inset:0;background:#0005;display:flex;align-items:center;justify-content:center;overflow:hidden}
.training-scale{position:relative;width:960px;height:720px;flex:none;transform-origin:center;font-family:"SimSun","Microsoft YaHei",serif}
.training-modal{position:absolute;left:137px;top:105px;width:680px;height:480px;border:6px ridge #dac185;box-shadow:0 0 0 2px #34220a,0 5px 24px #0009;background:linear-gradient(100deg,#43270f,#573819 50%,#3a240d);color:#fff0b8;text-shadow:1px 1px #322009}
.training-title{margin:14px 0 24px;text-align:center;font-size:32px;font-weight:bold;line-height:1.3;text-shadow:2px 3px #251707}
.training-modal .modal-close{position:absolute;top:12px;right:12px;width:43px;height:43px;border:0;background:transparent;padding:0}
.training-counter{position:absolute;left:35px;top:23px;color:#e54038;font-size:19px;font-weight:bold;text-shadow:1px 1px #390500}.training-counter b{color:#fff450;font-size:32px;padding:0 4px}
.opponent-list{position:absolute;left:30px;right:28px;top:80px;padding:5px;background:#211509;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.opponent-card{position:relative;height:91px;border:3px ridge #e6d9aa;background:linear-gradient(115deg,#e4d3a7,#f3e5bf 70%,#cebc94);color:#53421e;text-shadow:none;text-align:left;box-shadow:2px 3px 0 #0008;transition:filter .1s}
.opponent-card:hover{filter:brightness(1.08);outline:2px solid #ffdc59;z-index:1}
.opponent-card:active{transform:translateY(1px)}
.opponent-card img{position:absolute;left:17px;top:10px;width:61px;height:64px;border:3px ridge #ad9558;object-fit:cover}
.opponent-info{display:grid;grid-template-columns:65px 1fr;gap:10px 4px;position:absolute;top:18px;left:100px;font-size:15px;line-height:1.2;width:172px}
.opponent-info b{font-weight:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.difficulty{font-weight:bold!important;font-size:18px;text-shadow:1px 1px #655919}
.difficulty.easy{color:#19b923}.difficulty.normal{color:#e9b817}.difficulty.hard{color:#e72b25}
.training-bottom{position:absolute;left:56px;right:33px;bottom:20px;display:flex;justify-content:space-between;align-items:center;font-size:15px}
.training-bottom .timer{color:#f7eaca;font-weight:bold}.training-bottom button{min-width:100px}
.training-loader{position:absolute;z-index:20;inset:0;display:grid;place-items:center;background:#0002}
.training-loader img{width:253px;height:249px;animation:runeTurn 2.2s linear infinite;mix-blend-mode:screen;filter:drop-shadow(0 0 3px #cdeaff88)}
.training-loader .load-error{position:absolute;top:66%;background:#3c2710;border:2px solid #bda060;padding:12px 22px;color:#ffe9bc;text-align:center}
@keyframes runeTurn{to{transform:rotate(360deg)}}
.city-battle-button{display:flex;align-items:center;gap:9px;padding:9px 20px;background:linear-gradient(#95733b,#67431f);border:2px ridge #dfc987;border-radius:5px;font-size:16px;color:#fff1b3;box-shadow:0 3px 10px #0005;text-shadow:1px 2px #452407}.city-battle-button:hover{filter:brightness(1.13)}.city-battle-button svg{width:26px;height:26px}
.login-battle-link{margin:14px auto 0;display:block;border:0;border-bottom:1px solid #bea977;background:none;color:#ffe0a0;padding:3px 9px;font-size:13px}
@media(prefers-reduced-motion:reduce){.battle-curtain{animation-duration:.1s}.training-loader img{animation-duration:5s}}

.training-recharge{display:flex;align-items:center;gap:15px}.training-add{font:12px "SimSun",serif!important;color:#e9e2b3;background:linear-gradient(#3998a1,#266578);border:2px ridge #d3c28d;border-radius:2px;padding:3px 6px!important;min-width:0!important}.training-add:disabled{opacity:.45;cursor:default}.opponent-card:disabled{filter:grayscale(.7);opacity:.55;cursor:not-allowed}.troop-slot img{clip-path:inset(0 0 5px 0)}

.hero-slot.deployed img{inset:0;width:103px;height:133px;opacity:1;filter:none}.hero-slot.deployed::after{display:none}.hero-slot.deployed strong{display:none}
