html.spl1,html.spl1 body{overflow:hidden}
#spl{position:fixed;inset:0;z-index:500;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;perspective:900px;touch-action:none;-webkit-user-select:none;user-select:none}
#spl.out{animation:splout .7s cubic-bezier(.7,0,.3,1) forwards}
@keyframes splout{to{opacity:0;transform:scale(1.18);filter:blur(12px)}}
.spbg{position:absolute;inset:0;background:radial-gradient(circle at 50% 46%,rgba(0,245,255,.42),transparent 62%);opacity:0;animation:spglow 3s ease forwards}
@keyframes spglow{0%{opacity:0}38%{opacity:.18}46%{opacity:1}100%{opacity:.5}}
.sps{position:relative;width:min(72vw,310px);transform-style:flat;transform:rotateY(calc(var(--px,0)*16deg)) rotateX(calc(var(--py,0)*-16deg));transition:transform .18s ease-out}
.spw{display:flex;width:100%}
.wg{position:relative;width:50%;will-change:transform,opacity,filter}
.wg img{display:block;width:100%;height:auto;transition:transform .55s cubic-bezier(.2,1.7,.4,1)}
.wg::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.95) 50%,transparent 65%);background-size:300% 100%;background-position:100% 0;-webkit-mask-image:var(--m);mask-image:var(--m);-webkit-mask-size:100% 100%;mask-size:100% 100%;opacity:0}
.wg.l{animation:wl 1.5s cubic-bezier(.22,.9,.25,1) .3s both}
.wg.r{animation:wr 1.5s cubic-bezier(.22,.9,.25,1) .3s both}
.wg.l::after{animation:shn .5s ease 1.95s both}
.wg.r::after{animation:shn .5s ease 2.4s both}
@keyframes shn{0%{opacity:1;background-position:100% 0}100%{opacity:1;background-position:0 0}}
@keyframes wl{0%{transform:translate3d(-210px,-34px,0) rotate(-16deg) scale(.8);opacity:0;filter:blur(16px)}30%{opacity:1;filter:blur(3px) drop-shadow(0 0 30px #00f5ff)}62%{transform:translate3d(-22px,0,0) rotate(-2deg) scale(1.02);filter:blur(0) drop-shadow(0 0 34px #00f5ff)}78%{transform:translate3d(7px,0,0) rotate(.6deg) scale(1.04)}100%{transform:none;opacity:1;filter:drop-shadow(0 0 16px rgba(0,245,255,.55))}}
@keyframes wr{0%{transform:translate3d(210px,-34px,0) rotate(16deg) scale(.8);opacity:0;filter:blur(16px)}30%{opacity:1;filter:blur(3px) drop-shadow(0 0 30px #00f5ff)}62%{transform:translate3d(22px,0,0) rotate(2deg) scale(1.02);filter:blur(0) drop-shadow(0 0 34px #00f5ff)}78%{transform:translate3d(-7px,0,0) rotate(-.6deg) scale(1.04)}100%{transform:none;opacity:1;filter:drop-shadow(0 0 16px rgba(0,245,255,.55))}}
.sps.pull .wg.l img{transform:translateX(-24px) rotate(-4deg)}
.sps.pull .wg.r img{transform:translateX(24px) rotate(4deg)}
.spx{position:absolute;left:50%;top:-8%;width:3px;height:116%;margin-left:-1.5px;background:linear-gradient(transparent,#fff 30%,#fff 70%,transparent);box-shadow:0 0 34px 10px #00f5ff;opacity:0;animation:spx .6s ease 1.1s both;border-radius:3px}
@keyframes spx{0%{opacity:0;transform:scaleY(.2)}25%{opacity:1;transform:scaleY(1)}100%{opacity:0;transform:scaleY(1.35)}}
.spb{position:absolute;left:50%;top:50%;width:300px;height:300px;margin:-150px 0 0 -150px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.9) 0,rgba(0,245,255,.55) 22%,transparent 62%);opacity:0;transform:scale(.3);animation:spb 1.1s ease-out 1.1s both;pointer-events:none}
@keyframes spb{0%{opacity:0;transform:scale(.3)}22%{opacity:.95}100%{opacity:0;transform:scale(2.1)}}
.spa{position:absolute;left:50%;top:50%;width:150vw;height:2px;margin:-1px 0 0 -75vw;background:linear-gradient(90deg,transparent,rgba(0,245,255,.9) 30%,#fff 50%,rgba(0,245,255,.9) 70%,transparent);box-shadow:0 0 22px 4px rgba(0,245,255,.7);opacity:0;transform:scaleX(0);animation:spa 1s cubic-bezier(.2,.8,.2,1) 1.1s both;pointer-events:none}
@keyframes spa{0%{opacity:0;transform:scaleX(0)}20%{opacity:1}100%{opacity:0;transform:scaleX(1)}}
.ss{position:absolute;left:50%;top:50%;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;border-radius:50%;background:#fff;box-shadow:0 0 8px 2px #00f5ff;opacity:0;animation:ssp 1.2s cubic-bezier(.15,.7,.3,1) 1.15s both}
.ss:nth-of-type(3n){--d:230px}.ss:nth-of-type(3n+1){--d:140px}.ss:nth-of-type(3n+2){--d:185px}
@keyframes ssp{0%{opacity:0;transform:rotate(var(--a)) translateY(0) scale(1)}12%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d,170px)*-1)) scale(.3)}}
.spt{margin-top:30px;color:#fff;font-weight:800;font-size:1.5rem;letter-spacing:22px;padding-left:22px;opacity:0;animation:spt 1s ease 1.85s forwards;text-shadow:0 0 24px rgba(0,245,255,.7)}
@keyframes spt{from{opacity:0;letter-spacing:26px;transform:translateY(10px)}to{opacity:1;letter-spacing:11px;transform:none}}
.spg{margin-top:8px;color:rgba(255,255,255,.7);font-size:.95rem;direction:rtl;opacity:0;animation:spg .8s ease 2.4s forwards}
@keyframes spg{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
#spk{position:absolute;bottom:calc(env(safe-area-inset-bottom,0px) + 26px);left:50%;transform:translateX(-50%);background:none;border:0;color:rgba(255,255,255,.55);font:inherit;font-size:.8rem;cursor:pointer;opacity:0;animation:spg .6s ease 1.2s forwards}
html.spl1 #wl *{animation-play-state:paused!important}
.sl .loading{width:58px;height:54px;border:0;border-radius:0;transform:translateX(-50%);background-image:url("/media/splash/logo-wing-left.png"),url("/media/splash/logo-wing-right.png");background-position:left center,right center;background-size:50% 100%;background-repeat:no-repeat;animation:splloader .85s ease-in-out infinite alternate;filter:drop-shadow(0 0 10px rgba(0,245,255,.8))}
@keyframes splloader{to{opacity:.58;transform:translateX(-50%) scale(.88)}}
@media(prefers-reduced-motion:reduce){#spl *{animation-duration:.01s!important;animation-delay:0s!important}}
html:not(.spl1) #spl{display:none}
