/* A base stance belongs to the identity of the portrait, not its resource values. */
.arena .portrait-title{display:flex;align-items:center;gap:7px;min-width:0;min-height:1.25em}
.arena .portrait-title>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arena .portrait-name{max-width:calc(100% - 102px)}
.arena .mode-slot{display:contents}
.arena .mode-presence{--mode-light:#91d8fa;display:inline-flex;flex:0 0 31px;width:31px;height:36px;position:relative;align-items:center;justify-content:center;pointer-events:none;isolation:isolate}
.arena .mode-presence[data-mode-kind=""]{display:none}
.arena .mode-presence[data-mode-color=red]{--mode-light:#ff9f9c}
.arena .mode-presence[data-mode-color=gold]{--mode-light:#f5d595}
.arena .mode-presence[data-mode-color=green]{--mode-light:#93e4bc}
.arena .mode-presence[data-mode-color=purple]{--mode-light:#c7b2f5}
.arena .mode-presence:before{content:"";position:absolute;inset:-14px -18px;z-index:-1;background:radial-gradient(ellipse,color-mix(in srgb,var(--mode-light) 19%,transparent),transparent 68%);pointer-events:none}
.arena .mode-presence>svg{width:100%;height:100%;overflow:visible;color:var(--mode-light);filter:drop-shadow(0 1px 2px #061c2fd9)}
.arena .mode-presence svg g{display:none}
.arena .mode-presence[data-mode-kind=guard] .mode-guard,.arena .mode-presence[data-mode-kind=strike] .mode-strike,.arena .mode-presence[data-mode-kind=crest] .mode-crest{display:block}
.arena .mode-glass{fill:#102c3bb3;stroke:currentColor;stroke-opacity:.14;stroke-width:4}
.arena .mode-edge{stroke:currentColor;stroke-width:1.25;stroke-linejoin:round;fill:currentColor;fill-opacity:.075}
.arena .mode-engraving{stroke:currentColor;stroke-width:.85;stroke-opacity:.45;stroke-linecap:round;stroke-linejoin:round}
.arena .mode-glint{stroke:#f1fbff;stroke-width:1.7;stroke-linecap:round;stroke-dasharray:9 101;stroke-dashoffset:9;opacity:0;animation:mode-contour 7s ease-in-out infinite}
@keyframes mode-contour{0%,65%,100%{opacity:0;stroke-dashoffset:9}70%{opacity:.8}88%{opacity:.25;stroke-dashoffset:-91}92%{opacity:0;stroke-dashoffset:-101}}
.arena .mode-presence.mode-arriving .mode-edge{animation:mode-arrive .65s ease-out both}
@keyframes mode-arrive{from{stroke-dasharray:100;stroke-dashoffset:100;fill-opacity:0}to{stroke-dasharray:100;stroke-dashoffset:0;fill-opacity:.075}}
.arena.is-replaying .mode-slot>.mode-presence:not(.playback-mode){display:none}
.arena .fighter.defeated .mode-presence,.arena .fighter[data-playback-alive=false] .mode-presence{display:none}
.arena.is-replaying .fighter[data-playback-alive=true] .mode-presence.playback-mode:not([data-mode-kind=""]){display:inline-flex}
@media(max-width:1100px){
 .arena .mode-presence{flex-basis:21px;width:21px;height:25px}
 .arena .portrait-title{gap:4px}
 .arena .portrait-name{max-width:calc(100% - 56px)}
}
@media(prefers-reduced-motion:reduce){.arena .mode-presence *{animation:none!important}}