.cutscene{position:fixed;inset:0;z-index:1000;background:#000;animation:cutscene-in .9s ease-out both;overflow:hidden}
.cutscene.is-closing{animation:cutscene-out 1.05s ease-in both}
.cutscene-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.cutscene-number{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;
  animation:cutscene-number 2.4s cubic-bezier(.2,.8,.2,1) both}
.cutscene-number>*{transform:scale(var(--cutscene-scale,1));max-width:94vw;filter:drop-shadow(0 0 30px rgba(255,255,255,.35))}
.cutscene[data-kind="aberration"] .cutscene-number>*{animation:cutscene-chroma 1.6s ease-out both}
.cutscene[data-kind="singularity"] .cutscene-number{animation-duration:3.2s}
.cutscene[data-kind="numinous"] .cutscene-number{animation-duration:3.6s}
.cutscene-skip{position:absolute;right:18px;bottom:18px;padding:6px 14px;border:1px solid #ffffff40;border-radius:999px;
  color:#ffffffb0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;background:#0006;backdrop-filter:blur(6px);opacity:.55;transition:opacity .2s}
.cutscene-skip:hover,.cutscene-skip:focus-visible{opacity:1}
@keyframes cutscene-in{from{opacity:0}to{opacity:1}}
@keyframes cutscene-out{from{opacity:1}to{opacity:0}}
@keyframes cutscene-number{0%{opacity:0;filter:blur(18px);transform:scale(.6)}55%{opacity:1}100%{opacity:1;filter:blur(0);transform:scale(1)}}
@keyframes cutscene-chroma{0%{filter:drop-shadow(-14px 0 0 #f00a) drop-shadow(14px 0 0 #0ffa)}100%{filter:drop-shadow(0 0 30px rgba(255,255,255,.35))}}
@media(prefers-reduced-motion:reduce){.cutscene-number{animation:none}}

.cutscene:before,.cutscene:after{content:'';position:absolute;left:0;right:0;height:7vh;background:#000;z-index:2;pointer-events:none}.cutscene:before{top:0}.cutscene:after{bottom:0}.cutscene-skip{z-index:3;bottom:calc(7vh + 12px)}.cutscene-number{z-index:1}.cutscene[data-kind=divine] .cutscene-number>*{filter:drop-shadow(0 0 24px #e8bd6860)}
.orb-arrival{position:fixed;inset:0;pointer-events:none;z-index:1100;width:100%;height:100%;background:transparent}
.cutscene[data-kind="otherworldly"] .cutscene-number>*{filter:drop-shadow(0 0 3px #000) drop-shadow(0 0 18px #39ff6a)}