/* 6.2: SFII select-screen composition. Motion uses discrete frames. */
.home .entity-mode .ws-layout{max-width:980px;grid-template-columns:minmax(0,340px) minmax(0,1fr);grid-template-areas:"fighter map" "fighter roster";gap:12px 34px;align-items:start}
.entity-mode .ws-map-panel{grid-area:map;width:100%;min-width:0}
.entity-mode .ws-roster-panel{grid-area:roster;width:100%;min-width:0}
.entity-mode .ws-preview{grid-area:fighter;align-self:center;min-width:0}
.entity-mode .ws-map-footer{padding-block:5px;border-width:1px}
.entity-mode .ws-map-footer select{min-height:34px;max-width:60%;font-size:11px}
.entity-mode .ws-map-footer button{font-size:10px}
.entity-mode .ws-roster{gap:4px;grid-template-columns:repeat(3,minmax(0,1fr));max-width:540px;margin-inline:auto}
.entity-mode .ws-roster-heading{margin:4px 0 22px}
.arcade-stage .entity-mode .ws-tile{border:3px solid #9baac8;border-right-color:#526080;border-bottom-color:#526080;box-shadow:none;background:#101045;animation:none;transition:none;overflow:visible}
.arcade-stage .entity-mode .ws-tile img{aspect-ratio:1.28;object-fit:cover;object-position:center 12%;padding:0;background:#10235c;image-rendering:pixelated!important}
.arcade-stage .entity-mode .ws-tile>span{min-height:30px;padding:6px 2px;font:600 10px/1.5 PlexMono,monospace;background:#101045;color:#d6dffc}
.entity-mode .ws-tile[aria-pressed=true]{z-index:3;border-color:#ffdf87;transform:none;box-shadow:none}
.entity-mode .ws-tile[aria-pressed=true]:before{content:'1P';position:absolute;left:4px;top:-24px;color:#52c8ff;background:transparent;padding:0;font:700 22px/1 Silkscreen,monospace;text-shadow:2px 2px #124b99;animation:none;z-index:4}
.entity-mode .ws-tile[aria-pressed=true]:after{inset:-5px;border:4px solid #ff5634;box-shadow:inset 0 0 0 2px #ffe4a5;animation:sf-cursor .72s steps(1,end) 4;pointer-events:none}
.entity-mode .ws-tile:focus-visible{outline:2px solid #fff;outline-offset:8px}
.arcade-stage .entity-mode .ws-preview-image{border:0;box-shadow:none;background:transparent;aspect-ratio:1;overflow:hidden}
.arcade-stage .entity-mode .ws-preview-image img{padding:0;animation:none;object-fit:contain!important;transform:none}
.entity-mode .ws-preview-bar{border:0;padding:0 0 4px;font:10px Silkscreen,monospace;color:#e5e9fa}
.entity-mode .ws-preview-bar b{color:#42c4ff;font-size:30px}
.entity-mode .ws-preview-copy{padding:0}
.entity-mode .ws-preview-copy h2{margin:5px 0 9px;font-size:27px;color:#ffcf7c;text-shadow:3px 3px #a54625}
.entity-mode .ws-preview-copy #ws-meta{margin-top:0;color:#79caff}
.entity-mode .ws-preview-copy #ws-artist{font-size:12px;margin-bottom:6px}
.entity-mode .ws-preview-content-enter,.entity-mode .ws-preview-content-enter img{animation:none}
.entity-mode .ws-preview-content-enter .ws-preview-image{animation:sf-portrait-in .16s steps(4,end)}
.entity-mode .ws-controls{display:flex;flex-wrap:wrap;justify-content:space-between;gap:5px;margin-top:14px;font-size:9px}
.entity-mode .ws-controls>span{display:inline;color:#ffda8e;font-size:9px}
.entity-mode .ws-controls:after{display:none}
.entity-mode #ws-entity-links{margin-top:8px}
.entity-mode #ws-entity-links button{min-height:38px}
.entity-mode .ws-open{margin-top:9px;text-align:center;font-family:Silkscreen,monospace;font-size:11px}
.world-select #ws-selected-pin{transition:none;transform:translate(-50%,-50%);border-color:#fff4c1}
.world-select #ws-selected-pin:after{animation:none}
.world-select #ws-selected-pin.sf-map-hit:after{animation:sf-map-hit .6s steps(1,end) 3}
.world-select .ws-pin.is-current span{color:#ff9a62}
.world-select .ws-pin.is-current:before{background:#ffd578;border-color:#fff5c3}
.entity-mode.is-confirming .ws-tile[aria-pressed=true]:after{animation:none;border-color:#ffe594;box-shadow:0 0 0 2px #ff5e36}
.entity-mode.is-confirming .ws-preview-image{animation:sf-lock .22s steps(3,end) both}
.entity-mode.is-confirming .ws-open{background:#fff2b6;color:#111147}
.stage-route{clip-path:none;visibility:hidden;opacity:0;transition:none;background:#05051c;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;overflow:hidden}
.stage-route.is-active{visibility:visible;opacity:1;animation:sf-curtain .18s steps(5,end) both}
.stage-route .stage-fighter{display:none;width:min(44vh,320px);height:min(44vh,320px);object-fit:contain;image-rendering:pixelated;filter:none}
.stage-route.has-fighter .stage-fighter{display:block}
.stage-route p{margin:0;color:#55c5ff;font:12px Silkscreen,monospace;letter-spacing:1px}
.stage-route strong{max-width:90vw;font:700 clamp(23px,4vw,48px)/1.3 Silkscreen,monospace;text-shadow:3px 3px #953d26;color:#ffd88c;overflow-wrap:anywhere}
.stage-route small{font:10px PlexMono,monospace;color:#c6d6f2}
.stage-route.is-active .stage-fighter{animation:sf-confirm-portrait .25s steps(5,end) both}
.stage-route.is-active strong{animation:sf-confirm-name .25s steps(5,end) both}
@keyframes sf-cursor{0%,100%{border-color:#ff5634}50%{border-color:#ffd889}}
@keyframes sf-map-hit{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes sf-portrait-in{from{transform:translateX(-14px);opacity:.65}to{transform:none;opacity:1}}
@keyframes sf-lock{to{transform:translateX(5px)}}
@keyframes sf-curtain{from{clip-path:inset(50% 0)}to{clip-path:inset(0)}}
@keyframes sf-confirm-portrait{from{transform:translateX(-44px)}to{transform:none}}
@keyframes sf-confirm-name{from{transform:translateX(44px)}to{transform:none}}
@media(max-width:760px){
 .home .entity-mode .ws-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"map" "roster" "fighter";gap:18px}
 .entity-mode .ws-map-panel summary{border:2px solid #484888;padding:10px;min-height:44px}
 .entity-mode .ws-map-footer select{font-size:16px;min-height:44px}
 .entity-mode .ws-roster{max-width:480px;gap:4px}
 .entity-mode .ws-roster-heading{margin:4px 0 23px}
 .arcade-stage .entity-mode .ws-tile img{aspect-ratio:1.08}
 .arcade-stage .entity-mode .ws-tile>span{font-size:9px;min-height:39px;padding:6px 2px}
 .entity-mode .ws-tile[aria-pressed=true]:before{font-size:19px;top:-22px}
 .entity-mode .ws-controls>span{display:none}
 .entity-mode .ws-controls:after{display:block;content:'PREVIEW BELOW ↓';font:9px PlexMono,monospace}
 .entity-mode .ws-preview{max-width:420px;justify-self:center;width:100%}
 .arcade-stage .entity-mode .ws-preview-image{max-width:300px;margin-inline:auto}
 .entity-mode .ws-preview-copy h2{font-size:26px}
}
.motion-off .entity-mode *, .motion-off .entity-mode *:before,.motion-off .entity-mode *:after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.stage-route{display:none!important}.entity-mode *,.entity-mode *:before,.entity-mode *:after{animation:none!important;transition:none!important}}

/* Static fighter artwork: retain the select-screen interface. */ .arcade-stage .entity-mode .ws-preview-content-enter .ws-preview-image,.arcade-stage .entity-mode.is-confirming .ws-preview-image,.stage-route.is-active .stage-fighter{animation:none;transform:none}


/* Keep original fighter artwork completely still. */
.arcade-stage .world-select.entity-mode .ws-preview-image,.arcade-stage .world-select.entity-mode .ws-preview-image img,.arcade-stage .world-select.entity-mode .ws-tile img,.stage-route.is-active .stage-fighter{animation:none!important;transform:none!important;transition:none!important}

/* QA fixes: keep the restored composition, correct input and motion states. */
.ws-mobile-region{display:none}
.ws-pin:disabled{opacity:.35;cursor:default}
.ws-pin:focus-visible{outline:2px solid #fff4c1;outline-offset:2px}
.entity-mode .ws-tile.sf-reselect[aria-pressed=true]:after{animation-name:sf-cursor-reselect}
@keyframes sf-cursor-reselect{0%,100%{border-color:#ff5634}50%{border-color:#ffd889}}
.arcade-stage.motion-off *,.arcade-stage.motion-off *:before,.arcade-stage.motion-off *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(max-width:760px){
 .world-select #ws-map-pins{pointer-events:none}
 .world-select .ws-map-footer{flex-wrap:wrap}
 .world-select .ws-mobile-region{display:flex;align-items:center;gap:8px;flex-basis:100%;color:#d6dffc}
 .world-select .ws-mobile-region select{flex:1;max-width:none;min-width:0;min-height:44px;font-size:16px}
 .world-select .ws-map-footer>select{min-width:0}
 .world-select #ws-entity-links button{min-height:44px}
}