/* Reference-inspired comic funnel, drawn locally; palette stays near the page green. */
.outfit-scene .whirl{display:none;left:22%;right:22%;top:0;bottom:0;clip-path:none;background:none;border:0;border-radius:0;overflow:visible;filter:none}
.outfit-scene .whirl:before,.outfit-scene .whirl:after{display:none;content:none}
.vortex-svg{width:100%;height:100%;overflow:visible;display:block}
.vortex-body{fill:url(#spg-vortex-green)}
.vortex-shade{fill:none;stroke:#19523b;stroke-width:16;stroke-linecap:round;opacity:.6}
.wind-ink{fill:none;stroke:#001f14;stroke-width:3.5;stroke-linecap:round;stroke-dasharray:82 18 26 12;opacity:.88}
.wind-fast{stroke:#072d1d;stroke-width:5;stroke-dasharray:40 34 90 17;opacity:.85}
.spinning .whirl{display:block;animation:green-vortex-in .95s ease-in-out both}
.spinning .vortex-shell{transform-origin:50% 55%;animation:green-funnel-wobble .15s ease-in-out infinite alternate}
.spinning .wind-ink{animation:ink-racing .2s linear infinite}
.spinning .wind-fast{animation:ink-racing .15s linear infinite reverse}
.spinning .wind-flecks{animation:wind-flecks .18s ease-in-out infinite alternate;transform-origin:center}
.spinning .pose.visible{animation:green-costume-turn .95s ease-in-out both}
.outfit-scene:not(.settled) .avatar.outfits{transition:opacity .45s ease,transform .45s ease}
.outfit-bridge{text-align:center;font:normal clamp(23px,3vw,32px)/1.2 Georgia;color:#fff7e5;margin:0 auto 20px;animation:enter .35s both}
.outfit-scene.settled .outfit-bridge{display:none}
@keyframes green-vortex-in{0%{opacity:0;transform:scale(.4,.85)}15%{opacity:1;transform:scale(1.06,1)}30%,76%{opacity:1;transform:scale(1.03,1)}88%{opacity:1;transform:scale(.8,1)}100%{opacity:0;transform:scale(.25,.9)}}
@keyframes green-funnel-wobble{from{transform:translateX(-4px) skewX(-1.5deg)}to{transform:translateX(4px) skewX(1.5deg)}}
@keyframes ink-racing{to{stroke-dashoffset:-138}}
@keyframes wind-flecks{from{opacity:.3;transform:translate(-2px,-3px)}to{opacity:.9;transform:translate(3px,2px)}}
@keyframes green-costume-turn{0%{opacity:1;transform:rotateY(0);filter:blur(0)}15%{opacity:0;transform:rotateY(350deg) scaleX(.7);filter:blur(7px)}80%{opacity:0;transform:rotateY(1800deg) scaleX(.7);filter:blur(7px)}100%{opacity:1;transform:rotateY(2160deg);filter:blur(0)}}
@media(max-width:700px){
 .outfit-scene:not(.settled) .avatar.outfits{width:100%;height:calc(min(120vw,500px) * 2 / 3);min-height:0;margin:12px 0;overflow:hidden}
 .outfit-scene:not(.settled) .avatar.outfits>.pose{width:min(120vw,500px);height:calc(min(120vw,500px) * 2 / 3);inset:0 auto auto 50%;margin-left:calc(min(120vw,500px) / -2)}
 .outfit-scene:not(.settled) .whirl{left:16%;right:16%;top:0;bottom:0}
 .outfit-bridge{font-size:25px;margin-bottom:18px}
}
@media(prefers-reduced-motion:reduce){.outfit-scene .whirl{display:none!important}.outfit-scene .pose{animation:none!important}.outfit-bridge{animation:none}}