.narin-gateway .nga-atmosphere{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:strict}
.narin-gateway .gateway-shell{position:relative;z-index:1}
.narin-gateway .nga-bank{position:absolute;inset:-12%;transform:translate3d(0,0,0);will-change:transform}
.narin-gateway .nga-wisp{position:absolute;inset:0;background:url('mist.svg') center/100% 100% no-repeat;mix-blend-mode:screen;opacity:.32;mask-image:radial-gradient(ellipse 48% 34% at 42% 46%,#000 12%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 48% 34% at 42% 46%,#000 12%,transparent 100%);animation:nga-drift-one 24s ease-in-out infinite alternate;animation-duration:24s!important;will-change:transform}
.narin-gateway .nga-bank:nth-child(2) .nga-wisp{opacity:.23;mask-image:radial-gradient(ellipse 46% 27% at 68% 64%,#000 10%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 46% 27% at 68% 64%,#000 10%,transparent 100%);animation:nga-drift-two 31s ease-in-out -12s infinite alternate;animation-duration:31s!important;background-size:120% 120%}
.narin-gateway{touch-action:pinch-zoom}
.narin-gateway .nga-field{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.narin-gateway.nga-hidden .nga-wisp{animation-play-state:paused;will-change:auto}
.narin-gateway .gateway-stat-label{color:#969692}
.narin-gateway .gateway-enter{position:relative;isolation:isolate;transition:color .4s ease,text-shadow .4s ease}
.narin-gateway .gateway-enter::before{content:"";position:absolute;pointer-events:none;z-index:-1;inset:-42px -74px;background:radial-gradient(ellipse,rgba(190,205,210,.12),transparent 68%);opacity:0;transition:opacity .6s ease}
.narin-gateway .gateway-enter::after{content:"";position:absolute;left:15%;right:15%;bottom:1px;height:1px;background:linear-gradient(90deg,transparent,rgba(230,230,225,.9),transparent);opacity:0;transform:scaleX(.35);transition:opacity .35s ease,transform .6s ease}
.narin-gateway .gateway-enter:is(:hover,:focus-visible,:active){color:#fffdf8;text-shadow:0 0 14px rgba(238,239,232,.65),0 0 32px rgba(210,222,230,.3)}
.narin-gateway .gateway-enter:is(:hover,:focus-visible,:active)::after{opacity:1;transform:scaleX(1)}
.narin-gateway .gateway-enter:is(:hover,:focus-visible,:active)::before{opacity:1}
.narin-gateway .gateway-enter:focus-visible{outline:1px solid #b7b5b2;outline-offset:6px;border-radius:2px}
@keyframes nga-drift-one{from{transform:translate3d(-7%,2%,0) scale(1.04) rotate(-3deg)}to{transform:translate3d(7%,-3%,0) scale(1.13) rotate(3deg)}}
@keyframes nga-drift-two{from{transform:translate3d(6%,-3%,0) scale(1.1) rotate(5deg)}to{transform:translate3d(-8%,3%,0) scale(1.03) rotate(-4deg)}}
@media(max-width:640px){.narin-gateway .nga-wisp{opacity:.29;background-size:160% 100%}.narin-gateway .nga-bank:nth-child(2) .nga-wisp{opacity:.21;background-size:180% 120%}}
@media(prefers-reduced-motion:reduce){.narin-gateway .nga-wisp{animation-duration:37s!important}.narin-gateway .nga-bank:nth-child(2) .nga-wisp{animation-duration:48s!important}.narin-gateway .gateway-enter::before,.narin-gateway .gateway-enter::after{transition-duration:.4s!important}}
.narin-gateway .nga-fluid{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;filter:blur(2px)}
/* The Gateway is an interactive scene: dragging should move mist, not select its labels. */
.narin-gateway,.narin-gateway *{-webkit-user-select:none;user-select:none}
.narin-gateway img,.narin-gateway a{-webkit-user-drag:none}
.narin-gateway{-webkit-touch-callout:none}
.narin-gateway .gateway-enter{-webkit-touch-callout:default}
