/* Visible camps share the authoritative life total used by the battle HUD. */
.battle-board .battle-camp{position:absolute;z-index:5;width:130px;pointer-events:none;padding:8px 10px 7px;border:1px solid #d7ba736e;border-radius:8px;background:linear-gradient(120deg,#172d22f2,#0c1c18ef);box-shadow:0 4px 15px #0004,inset 0 0 12px #dfbc4110;color:#f5e4ba;font-variant-numeric:tabular-nums}
.battle-board .enemy-camp{left:12px;top:9px;border-color:#c883626e}
.battle-board .own-camp{right:12px;bottom:9px;border-color:#8cc5a06b}
.battle-camp>small{display:block;font-size:8px;letter-spacing:1px;color:#d3c398;font-weight:800;margin-bottom:3px}
.battle-camp .camp-health-number{display:flex;align-items:baseline;gap:5px;white-space:nowrap}
.camp-health-number strong{font-size:23px;line-height:1;font-weight:850;color:#fff0c9}
.camp-health-number>span{font-size:9px;color:#cabc91}
.camp-health-track{position:relative;margin-top:5px;height:7px;background:#080f0ed9;border:1px solid #ebd3a22d;border-radius:5px;overflow:hidden}
.camp-health-track>span{position:absolute;inset:0 auto 0 0;height:100%}
.camp-health-previous{background:#f8c567;opacity:.65}
.camp-health-fill{background:linear-gradient(90deg,#6c9a5b,#a2c479);box-shadow:0 0 8px #bbd57b55}
.enemy-camp .camp-health-fill{background:linear-gradient(90deg,#a45238,#d08b4f)}
.camp-damage{position:absolute;right:0;bottom:-22px;display:block;color:#ffddb0;font-size:15px;text-shadow:0 2px 4px #24120e;font-weight:900;white-space:nowrap}
.enemy-camp .camp-damage{right:auto;left:0;bottom:auto;top:calc(100% + 5px)}
.battle-camp.is-hit{animation:camp-hit-shake .22s linear infinite;border-color:#ffd091;box-shadow:0 0 17px #fa9d4a9e}
.battle-camp.is-hit .camp-health-number strong{color:#ffc084}
.battle-camp.is-destroyed{border-color:#da633f;background:linear-gradient(120deg,#3d211aed,#21150fec)}
.battle-camp.is-destroyed .camp-health-fill{width:0!important}
.battle-board.is-resolving .battle-side .life-track span{transition:none}
.battlefield:has(#battle-reveal[data-phase="assault"]) .battle-phase{top:auto;bottom:7px;max-width:55%;transform:translateX(-50%);white-space:normal;text-align:center;font-size:9px;padding:5px 9px}
.battlefield:has(#battle-reveal[data-phase="assault"]) .battle-army-readout{opacity:.45}
@keyframes camp-hit-shake{0%,100%{transform:translate(0,0)}25%{transform:translate(-1px,1px)}75%{transform:translate(1px,-1px)}}
@media(max-width:760px){
 .battle-board .battle-camp{width:95px;padding:5px 6px;border-radius:6px}
 .battle-board .enemy-camp{left:7px;top:7px}.battle-board .own-camp{right:7px;bottom:7px}
 .battle-camp>small{font-size:6px;letter-spacing:.5px;margin-bottom:2px}
 .camp-health-number strong{font-size:19px}.camp-health-number>span{font-size:7px}
 .camp-health-track{height:6px;margin-top:4px}
 .camp-damage{font-size:11px;bottom:-16px}
 .battlefield:has(#battle-reveal[data-phase="assault"]) .battle-phase{font-size:7px;bottom:3px;max-width:44%;padding:3px 5px}
}
@media(prefers-reduced-motion:reduce){.battle-camp{animation:none!important}}

.battle-board>.battle-side .hero-card.ability-flare{border-color:#9be8e9;box-shadow:0 0 0 2px #70d1d2b3,0 0 26px #58d8eaaa;animation:ability-card-light .55s ease-in-out infinite alternate;filter:none;opacity:1}
.battle-board>.battle-side .hero-card.ability-reduction{border-color:#ffc48c;box-shadow:0 0 0 2px #e69b639e,0 0 26px #ec915ba1}
.battle-board .card-effect-burst{display:none;position:absolute;z-index:8;top:35px;left:3px;right:3px;border:1px solid #b1f7fbba;border-radius:4px;padding:4px 3px;color:#edffff;background:#17484ded;text-shadow:0 1px 2px #143d40;font-size:9px;font-weight:850;line-height:1.15;text-align:center;box-shadow:0 2px 8px #0006;pointer-events:none}
.battle-board .ability-flare .card-effect-burst{display:block;animation:ability-value-rise .24s ease-out both}
.battle-board .ability-reduction .card-effect-burst{background:#5e3124ee;border-color:#ffd4a6b3;color:#ffe5bf}
@keyframes ability-card-light{from{filter:brightness(1)}to{filter:brightness(1.18)}}
@keyframes ability-value-rise{from{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}
@media(max-width:760px){.battle-board .card-effect-burst{font-size:7px;top:29px;padding:3px 2px}}
@media(prefers-reduced-motion:reduce){.battle-board .ability-flare,.battle-board .card-effect-burst{animation:none!important}}

/* The calculation sheet clears the army's route during the cinematic. */
.battle-board #battle-reveal.replay-host:is([data-phase="charge"],[data-phase="impact"]){top:7px;transform:translateX(-50%);width:min(340px,45%);height:auto}
.replay-host:is([data-phase="charge"],[data-phase="impact"]) .replay-motion-numbers{font-size:8px;gap:7px}
.replay-host:is([data-phase="charge"],[data-phase="impact"]) .replay-motion-numbers>span{flex-direction:column;align-items:flex-start;gap:2px}
.replay-host:is([data-phase="charge"],[data-phase="impact"]) .replay-heading>b{font-size:10px}
.battlefield:has(#battle-reveal:is([data-phase="charge"],[data-phase="impact"])) .battle-phase{opacity:0}
.battle-board #battle-reveal.replay-host[data-phase="assault"]{top:50%;width:min(340px,44%);height:auto;max-height:calc(100% - 120px);transform:translateY(-50%)}
.battle-board #battle-reveal.replay-host[data-phase="assault"][data-winner-side="player"]{left:auto;right:8px}
.battle-board #battle-reveal.replay-host[data-phase="assault"][data-winner-side="opponent"]{left:8px;right:auto}
.replay-host[data-phase="assault"] .replay-heading,.replay-host[data-phase="assault"] .replay-progress{display:none}
.replay-host[data-phase="assault"] .battle-replay{padding:8px 10px}
.replay-host[data-phase="assault"] .replay-damage-formula{margin-top:5px}
@media(max-width:760px){
 .battle-board #battle-reveal.replay-host:is([data-phase="charge"],[data-phase="impact"]){top:6px;width:45%}
 .replay-host:is([data-phase="charge"],[data-phase="impact"]) .battle-replay{padding:5px 6px}
 .replay-host:is([data-phase="charge"],[data-phase="impact"]) .replay-heading>span{display:none}
 .replay-host:is([data-phase="charge"],[data-phase="impact"]) .replay-heading>b{font-size:8px}
 .replay-host:is([data-phase="charge"],[data-phase="impact"]) .replay-motion-numbers{font-size:6px}
 .replay-host:is([data-phase="charge"],[data-phase="impact"]) .replay-motion-numbers b{font-size:9px}
 .battle-board #battle-reveal.replay-host[data-phase="assault"]{width:44%;max-height:calc(100% - 120px)}
 .replay-host[data-phase="assault"] .battle-replay{padding:6px 7px}
 .replay-host[data-phase="assault"] .replay-assault-target{font-size:8px;line-height:1.15}
 .replay-host[data-phase="assault"] .replay-damage-formula{font-size:7px;line-height:1.2;gap:2px 4px}
 .replay-host[data-phase="assault"] .replay-assault-loss{font-size:7px}
 .replay-host[data-phase="assault"] .replay-assault-loss>b{font-size:17px}
 .replay-host[data-phase="assault"] .replay-assault-health{font-size:11px}
}

.battle-board #battle-reveal.replay-host[data-phase="assault"]{height:min(166px,calc(100% - 120px))}
.replay-host[data-phase="assault"] .replay-team{display:flex;flex-direction:column}
.replay-host .replay-assault-target{order:1}
.replay-host .replay-assault-loss{order:2}
.replay-host .replay-assault-health{order:3;margin-top:4px!important}
.replay-host .replay-damage-formula{order:4}
.replay-host .replay-assault .replay-team>small{order:5}

/* Reset old round-summary column layout and colors on the dark camp panel. */
.battle-board #battle-reveal.replay-host[data-phase="assault"]{height:min(166px,calc(100% - 130px));max-height:calc(100% - 130px)}
.battle-board .replay-host[data-phase="assault"] .replay-assault-target{display:block;flex-shrink:0;color:#f8e5b7}
.battle-board .replay-host[data-phase="assault"] .replay-assault-loss{display:flex;flex-direction:row;align-items:baseline;flex-shrink:0;gap:5px}
.battle-board .replay-host[data-phase="assault"] .replay-assault-health{display:block;flex-shrink:0;white-space:nowrap;color:#f5e7c2;line-height:1.3;font-size:17px}
.battle-board .replay-host[data-phase="assault"] .replay-damage-formula{display:flex;flex-direction:row;flex-shrink:0}
.battle-board .replay-host[data-phase="assault"] .replay-team>div>b{color:#ffdda0}
.battle-board .replay-host[data-phase="assault"] .replay-assault-loss>b{font-size:25px;color:#ffdb96}
.battle-board .replay-host[data-phase="assault"] .replay-team small{color:#e1ce9f}
@media(max-width:760px){
 .battle-board .replay-host[data-phase="assault"] .replay-assault-health{font-size:13px}
 .battle-board .replay-host[data-phase="assault"] .replay-assault-loss>b{font-size:19px}
}

.battle-board .own-camp .camp-damage{bottom:calc(100% + 4px);right:0}