/* Capacity lives directly above the fight button; the board geometry stays intact. */
body.playing #hud-deploy-count{top:auto;bottom:calc(100% + 5px);right:0;width:108px;min-width:108px;height:28px;min-height:28px;padding:4px 5px;display:flex;align-items:center;justify-content:space-between;gap:4px;background:#152434;box-shadow:0 2px 0 #0a1420,inset 0 1px #ffffff1a;border:2px solid #ea8790;border-radius:6px;color:#ff9ba4;font-size:13px;line-height:1;font-variant-numeric:tabular-nums;pointer-events:none}
body.playing #hud-deploy-count::before{content:none}
body.playing #hud-deploy-count[data-ready=true]{color:#9effd7;border-color:#71e7bb}
#limit-text{white-space:nowrap;flex-shrink:0}
#hud-deploy-slots{display:flex;flex:1;justify-content:flex-end;gap:2px;min-width:0}
#hud-deploy-slots i{display:block;flex:0 1 8px;height:11px;min-width:4px;background:#ee8797;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);position:relative}
#hud-deploy-slots i:not(.filled)::after{content:'';position:absolute;inset:2px 1px;background:#263246;clip-path:inherit}
#hud-deploy-count[data-ready=true] #hud-deploy-slots i{background:#8cf2c7}
#hud-deploy-count.deployment-complete{animation:deployment-border .7s ease-out}
#hud-deploy-count.deployment-complete #hud-deploy-slots i{animation:deployment-slot .42s ease-out both;animation-delay:calc(var(--slot)*25ms)}
@keyframes deployment-border{15%{border-color:#e2fff2;box-shadow:0 0 0 3px #a4f9d866,0 2px 0 #0a1420}100%{box-shadow:0 0 0 7px #a4f9d800,0 2px 0 #0a1420}}
@keyframes deployment-slot{35%{transform:translateY(-2px);background:#edfff9}100%{transform:none}}
body.playing .hud-xp-track .progress{position:relative;height:7px;min-height:7px;background:#081523;border-radius:0;overflow:visible;box-shadow:0 1px 0 #709bb33d}
body.playing #xp-bar{visibility:hidden;transition:none}
#hud-xp-segments{position:absolute;inset:0;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:2px}
#hud-xp-segments i{display:block;width:auto;min-width:0;background:#243d54;border-top:1px solid #536b7e;overflow:hidden}
#hud-xp-segments b{display:block;width:var(--fill,0%);height:100%;background:linear-gradient(#b0eaff,#50abe0);transition:width .12s linear}
@media(max-width:1100px) and (max-height:780px),(pointer:coarse) and (max-height:740px){
 body.playing #hud-deploy-count{width:108px;min-width:108px;height:25px;min-height:25px;bottom:calc(100% + 4px);padding:3px 5px;font-size:12px}
 body.playing .hud-xp-track .progress{height:6px;min-height:6px}
 /* Keep readable text and ten XP segments without shrinking the touch controls. */
 body.playing #hud-level{width:104px}
}
@media(prefers-reduced-motion:reduce){
 #hud-deploy-count.deployment-complete,#hud-deploy-count.deployment-complete #hud-deploy-slots i{animation:none}
 #hud-xp-segments b{transition:none}
}
body.reduce-fx #hud-deploy-count.deployment-complete,body.reduce-fx #hud-deploy-count.deployment-complete #hud-deploy-slots i{animation:none}