/* One short HUD splice over the new scene. All surfaces are decorative and
   noninteractive; the controller also removes them without animation events. */
.scene-transition{position:fixed;inset:0;z-index:220;overflow:hidden;pointer-events:none!important;isolation:isolate;contain:strict;background:#0207131a;animation:scene-transition-fade var(--scene-transition-duration,340ms) linear both}
.scene-transition>i{position:absolute;display:block;pointer-events:none!important;margin:0;border:0;animation-duration:var(--scene-transition-duration,340ms);animation-iteration-count:1;animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
.scene-transition-shutter-top,.scene-transition-shutter-bottom{left:-3%;width:106%;height:53%;background:linear-gradient(115deg,#030813 0,#061629 55%,#07111d 100%);will-change:transform}
.scene-transition-shutter-top{top:0;clip-path:polygon(0 0,100% 0,100% 94%,74% 94%,72% 100%,28% 100%,26% 94%,0 94%);box-shadow:0 2px 0 #6beaff;animation-name:scene-shutter-up}
.scene-transition-shutter-bottom{bottom:0;clip-path:polygon(0 6%,26% 6%,28% 0,72% 0,74% 6%,100% 6%,100% 100%,0 100%);box-shadow:0 -2px 0 #e738e6;animation-name:scene-shutter-down}
.scene-transition-grid{inset:-10%;background:repeating-linear-gradient(0deg,transparent 0 28px,#4ccfff12 29px 30px),repeating-linear-gradient(90deg,transparent 0 54px,#4ccfff0d 55px 56px);mask-image:linear-gradient(transparent,#000 25%,#000 70%,transparent);animation-name:scene-grid-scan;will-change:transform,opacity}
.scene-transition-static{inset:-8%;background:url('../public/assets/transition-v1/static-lines.svg') 0 0/512px 256px;mix-blend-mode:screen;mask-image:linear-gradient(0deg,transparent 0 7%,#000 7% 9%,transparent 9% 18%,#000 18% 19%,transparent 19% 30%,#000 30% 34%,transparent 34% 47%,#000 47% 50%,transparent 50% 63%,#000 63% 65%,transparent 65% 77%,#000 77% 80%,transparent 80% 91%,#000 91% 92%,transparent 92%);animation-name:scene-static-splice;animation-timing-function:steps(1,end)!important;will-change:transform,opacity}
.scene-transition-static::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#e9faffb3 0 1px,transparent 1px 4px);opacity:.48}
.scene-transition-slit-a,.scene-transition-slit-b,.scene-transition-slit-c{left:-8%;width:116%;height:3px;background:linear-gradient(90deg,transparent 0,#5ce9ff 12%,#c4f7ff 36%,#67dfff 64%,transparent 95%);box-shadow:0 0 9px #16caff99,0 3px 0 #ee2dde7a;animation-timing-function:steps(2,end)!important;will-change:transform,opacity}
.scene-transition-slit-a{top:27%;height:4px;background:linear-gradient(90deg,transparent 0,#b9f4ff 12%,#fff 36%,#a8edff 64%,transparent 95%);box-shadow:0 0 12px #6feaffcc,0 4px 0 #fff8,0 -3px 0 #ee2dde88;clip-path:polygon(0 0,21% 0,21% 100%,29% 100%,29% 0,67% 0,67% 100%,74% 100%,74% 0,100% 0,100% 100%,0 100%);animation-name:scene-slit-left}
.scene-transition-slit-b{top:49.8%;height:7px;background:linear-gradient(90deg,transparent,#70e5ff 18%,#fff 50%,#f6baff 82%,transparent);box-shadow:0 0 14px #c7f4ffb3,0 5px 0 #fff6,0 -4px 0 #ee2dde70;animation-name:scene-slit-right}
.scene-transition-slit-c{top:72%;height:2px;background:linear-gradient(90deg,transparent,#cc34dc 17%,#ed9bff 48%,transparent 85%);animation-name:scene-slit-left;animation-direction:reverse}
.scene-transition-energy{left:-20%;top:calc(50% - 24px);width:140%;height:48px;background:radial-gradient(ellipse,#a1eaff50 0,#0ca9ef30 20%,#3a38d514 40%,transparent 68%);animation-name:scene-energy-pulse;will-change:transform,opacity}
.scene-transition-corners{inset:5vh 4vw;opacity:0;background:linear-gradient(#5cdbed,#5cdbed) left top/42px 1px no-repeat,linear-gradient(#5cdbed,#5cdbed) left top/1px 18px no-repeat,linear-gradient(#e755e7,#e755e7) right bottom/42px 1px no-repeat,linear-gradient(#e755e7,#e755e7) right bottom/1px 18px no-repeat;animation-name:scene-hud-markers}
@keyframes scene-transition-fade{0%,72%{opacity:1}100%{opacity:0}}
@keyframes scene-shutter-up{0%,22%{transform:translateY(0)}38%{transform:translateY(-8%)}100%{transform:translateY(-110%)}}
@keyframes scene-shutter-down{0%,22%{transform:translateY(0)}38%{transform:translateY(8%)}100%{transform:translateY(110%)}}
@keyframes scene-grid-scan{0%{opacity:0;transform:translateY(-5%)}16%{opacity:.8}55%{opacity:.35}100%{opacity:0;transform:translateY(5%)}}
@keyframes scene-static-splice{0%{opacity:.3;transform:translate(0,-2%)}12%{opacity:.88;transform:translate(-4%,1%)}30%{opacity:.8;transform:translate(3%,-1%)}48%{opacity:.56;transform:translate(-2%,3%)}67%{opacity:.2;transform:translate(2%,0)}84%,100%{opacity:0;transform:translate(0,4%)}}
@keyframes scene-slit-left{0%{opacity:0;transform:translateX(7%)}14%{opacity:.9;transform:translateX(-3%)}31%{opacity:.6;transform:translateX(2%)}56%,100%{opacity:0;transform:translateX(-8%)}}
@keyframes scene-slit-right{0%{opacity:0;transform:translateX(-7%)}18%{opacity:.85;transform:translateX(4%)}36%{opacity:.65;transform:translateX(-1%)}62%,100%{opacity:0;transform:translateX(8%)}}
@keyframes scene-energy-pulse{0%{opacity:0;transform:scaleY(.1)}30%{opacity:.9;transform:scaleY(1)}64%,100%{opacity:0;transform:scaleY(1.8)}}
@keyframes scene-hud-markers{0%,12%{opacity:0}25%{opacity:.65}58%,100%{opacity:0}}
.scene-transition[data-reduced="true"]{background:#04101cb8;animation:scene-transition-reduced var(--scene-transition-duration,140ms) ease-out both}
@keyframes scene-transition-reduced{from{opacity:.66}to{opacity:0}}
@media(prefers-reduced-motion:reduce){.scene-transition{background:#04101cb8;animation-name:scene-transition-reduced;animation-duration:140ms}.scene-transition>i{display:none}}
