/* UI-FIX-030: mirror artwork independently of movement, labels and status UI. */
#game-frame .battle028 .sd028{scale:var(--idle-flip030,1) 1}
#game-frame .battle028 .mon028 .m-idle{scale:var(--idle-flip030,1) 1}
#game-frame .battle028 .mon028 .m-state{scale:var(--state-flip030,1) 1}
#game-frame .battle028 .fx-attack .sd028{animation:sdAtk028 .9s steps(1,end) both,facingAttack030 .9s steps(1,end) both;animation-delay:var(--age,0ms)}
#game-frame .battle028 .fx-cast .sd028{animation:sdCast028 .9s steps(1,end) both,glow028 .9s ease-out both,facingCast030 .9s steps(1,end) both;animation-delay:var(--age,0ms)}
#game-frame .battle028 .fx-hit .sd028{animation:sdHit028 .9s steps(1,end) both,facingHit030 .9s steps(1,end) both;animation-delay:var(--age,0ms)}
#game-frame .battle028 .fx-death .sd028{animation:sdDown028 .95s steps(1,end) both,fade028 .95s ease-in both,facingDown030 .95s steps(1,end) both;animation-delay:var(--age,0ms)}
#game-frame .battle028 .fx-hit .mon028,#game-frame .battle028 .fx-death .mon028{animation:none}
#game-frame .battle028 .fx-death .mon028{animation:fade028 .95s ease-in both;animation-delay:var(--age,0ms)}
#game-frame .battle028 .fx-hit .sw028{animation:recoil030 .5s ease-out both;animation-delay:var(--age,0ms)}
#game-frame .battle028 .fx-death .sw028{animation:fall030 .95s ease-in both;animation-delay:var(--age,0ms)}
@keyframes facingAttack030{0%{scale:var(--attack-flip030,1) 1}62%,100%{scale:var(--idle-flip030,1) 1}}
@keyframes facingCast030{0%{scale:var(--cast-flip030,1) 1}62%,100%{scale:var(--idle-flip030,1) 1}}
@keyframes facingHit030{0%{scale:var(--hit-flip030,1) 1}55%,100%{scale:var(--idle-flip030,1) 1}}
@keyframes facingDown030{0%{scale:var(--hit-flip030,1) 1}18%,100%{scale:var(--death-flip030,1) 1}}
@keyframes recoil030{0%,100%{transform:translateX(0)}12%{transform:translateX(var(--recoil030))}30%{transform:translateX(calc(var(--recoil030) * -.6))}48%{transform:translateX(calc(var(--recoil030) * .35))}66%{transform:translateX(calc(var(--recoil030) * -.2))}}
@keyframes fall030{0%{transform:translate(0,0)}100%{transform:translate(var(--fall030),12px)}}

/* Preserve card dimensions/frame. Use the original 384px idle frame at 88% visible height. */
#game-frame .unit-card011.card-frame022 .unit-image011 .card-sprite030,
#game-frame .cockpit.layout015 .formation-card.card-frame022 .merc-portrait .card-sprite030{position:absolute;left:50%;top:50%;max-width:none!important;max-height:none!important;min-width:0!important;margin:0!important;flex:none;transform:translate(-50%,-50%) translateY(var(--center030,0px));image-rendering:auto}

/* Reserve a strip below the standing figure for the existing tag and representative action. */
#game-frame.home-background021 .crimson-home .representative .hero-illustration{height:calc(100% - 100px);padding-top:8px}
#game-frame.home-background021 .crimson-home .representative .hero-illustration .valeria-art{height:100%;max-height:100%;width:100%;object-fit:contain;object-position:center bottom}
#game-frame .crimson-home .representative-dock030{position:absolute;left:8px;right:8px;bottom:8px;display:flex;align-items:center;justify-content:center;gap:8px;height:84px;z-index:4}
#game-frame .crimson-home .representative-dock030 .representative-name{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;min-width:0!important;width:230px!important;height:84px!important;flex:0 1 230px}
#game-frame .crimson-home .representative-dock030 .representative-change020{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:90px!important;min-width:0;flex:0 0 90px;height:42px}
@media(prefers-reduced-motion:reduce){#game-frame .battle028 .fx-hit .sw028,#game-frame .battle028 .fx-death .sw028{animation:none!important}}
