body{background:#07060e}
.auth-wrap{position:relative;z-index:2;min-height:100dvh;display:flex;flex-direction:column;justify-content:center}


.va-bg{position:fixed;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.va-orb{position:absolute;border-radius:50%;filter:blur(64px);opacity:.42;will-change:transform}
.va-orb.a{width:min(64vw,360px);aspect-ratio:1;top:-12%;left:-10%;background:var(--neon);animation:vaD1 15s ease-in-out infinite}
.va-orb.b{width:min(56vw,320px);aspect-ratio:1;bottom:-14%;right:-12%;background:var(--neon-2,var(--neon));opacity:.34;animation:vaD2 19s ease-in-out infinite}
.va-orb.c{width:min(40vw,220px);aspect-ratio:1;top:24%;right:6%;background:var(--neon);opacity:.20;animation:vaD3 13s ease-in-out infinite}
@keyframes vaD1{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(26px,22px,0)}}
@keyframes vaD2{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-30px,-18px,0)}}
@keyframes vaD3{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-16px,20px,0)}}
.va-veil{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(120% 78% at 50% 34%,transparent 24%,rgba(6,6,16,.55) 76%,rgba(6,6,16,.88) 100%)}

.va-spark{position:absolute;bottom:-10px;width:4px;height:4px;border-radius:50%;background:var(--neon);
  box-shadow:0 0 8px var(--neon);opacity:0;z-index:0;pointer-events:none;animation:vaRise linear infinite}
@keyframes vaRise{0%{transform:translateY(0) scale(.6);opacity:0}14%{opacity:.85}86%{opacity:.5}100%{transform:translateY(-46vh) scale(1);opacity:0}}
html.has-authbg .va-bg,html.has-authbg .va-veil{display:none}   


.auth-panel{background:rgba(255,255,255,.05)!important;border:1px solid color-mix(in srgb,var(--neon) 26%,transparent)!important;
  backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);
  box-shadow:0 24px 60px -24px rgba(0,0,0,.85),0 0 40px -12px color-mix(in srgb,var(--neon) 30%,transparent),0 1px 0 rgba(255,255,255,.14) inset!important;
  padding:26px 22px 24px}


.brand-logo{position:relative;margin:2px 0 14px!important;
  filter:drop-shadow(0 0 26px color-mix(in srgb,var(--neon) 40%,transparent)) drop-shadow(0 10px 22px rgba(0,0,0,.5))}
.brand-logo .brand-img{max-height:132px!important}

.brand-logo.has-img{min-height:132px;display:flex;align-items:center;justify-content:center}
.brand-logo.has-img .name{display:none}
.brand-logo .name{background:linear-gradient(120deg,#fff,var(--neon));-webkit-background-clip:text;background-clip:text;color:transparent!important}
.brand-logo::after{content:"";position:absolute;left:50%;top:50%;width:118px;height:118px;margin:-59px 0 0 -59px;
  border-radius:28px;border:1.5px solid color-mix(in srgb,var(--neon) 38%,transparent);z-index:-1;pointer-events:none;
  animation:vaPulse 3s ease-out infinite}
@keyframes vaPulse{0%{transform:scale(.82);opacity:.5}100%{transform:scale(1.3);opacity:0}}

.auth-h{color:var(--text);opacity:.92;letter-spacing:.02em;margin:6px 0 18px!important}


.form-field input{background:rgba(255,255,255,.06)!important;border-color:color-mix(in srgb,var(--neon) 16%,rgba(255,255,255,.12))!important;
  border-radius:13px!important;transition:border-color .18s,box-shadow .18s}
.form-field input:focus{border-color:var(--neon)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--neon) 22%,transparent)!important;outline:none}


.btn-grad{position:relative;overflow:hidden;border-radius:13px!important;letter-spacing:.03em;
  box-shadow:0 14px 32px -10px color-mix(in srgb,var(--neon) 62%,transparent),0 0 0 1px rgba(255,255,255,.16) inset!important;
  animation:vaBtnGlow 2.6s ease-in-out infinite}
.btn-grad:hover{box-shadow:0 16px 40px -8px color-mix(in srgb,var(--neon) 72%,transparent),inset 0 1px 0 rgba(255,255,255,.24)!important}
.btn-grad::after{content:"";position:absolute;top:0;left:0;width:36%;height:100%;pointer-events:none;
  transform:translateX(-160%) skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
  animation:vaSweep 3.2s ease-in-out infinite}
@keyframes vaSweep{0%{transform:translateX(-160%) skewX(-20deg)}55%,100%{transform:translateX(430%) skewX(-20deg)}}
@keyframes vaBtnGlow{
  0%,100%{box-shadow:0 14px 32px -12px color-mix(in srgb,var(--neon) 60%,transparent),inset 0 1px 0 rgba(255,255,255,.2)}
  50%{box-shadow:0 18px 44px -8px color-mix(in srgb,var(--neon) 92%,transparent),inset 0 1px 0 rgba(255,255,255,.28)}}
.btn-grad:disabled{animation:none}
.btn-grad:disabled::after{display:none}



html.va-ready .va-en{opacity:0;animation:vaUp .3s cubic-bezier(.2,.7,.3,1) forwards}
html.va-ready .va-pop{animation:vaPop .3s cubic-bezier(.2,1.3,.4,1) forwards}
html.va-ready .d1{animation-delay:0s}
html.va-ready .d2{animation-delay:.04s}
html.va-ready .d3{animation-delay:.08s}
@keyframes vaUp{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}
@keyframes vaPop{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:scale(1)}}


@media(prefers-reduced-motion:reduce){
  .va-orb,.va-spark,.brand-logo::after,.btn-grad,.btn-grad::after{animation:none!important}
  .va-spark{opacity:0}
  html.va-ready .va-en,html.va-ready .va-pop{opacity:1!important;animation:none!important;transform:none!important}
}


.va-games{position:fixed;inset:0;z-index:0;pointer-events:none;
  
  background:#0a0d12 url(auth-games.f3f92d21.webp) center top/cover no-repeat}
.va-games::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(7,6,14,.70) 0%,rgba(7,6,14,.52) 26%,rgba(7,6,14,.60) 56%,rgba(7,6,14,.90) 100%)}
html.has-authbg .va-games{display:none}


html:not(.has-authbg) .auth-panel{background:rgba(10,12,20,.40)!important;
  backdrop-filter:blur(7px) saturate(1.15)!important;-webkit-backdrop-filter:blur(7px) saturate(1.15)!important;
  box-shadow:0 24px 64px -22px rgba(0,0,0,.9),0 0 44px -12px color-mix(in srgb,var(--neon) 30%,transparent),0 1px 0 rgba(255,255,255,.12) inset!important}

.va-orb.a{opacity:.30}.va-orb.b{opacity:.24}.va-orb.c{opacity:.16}


.lang-cur{backdrop-filter:blur(16px) saturate(1.2)!important;-webkit-backdrop-filter:blur(16px) saturate(1.2)!important}


@media (hover:none) and (pointer:coarse){
  .va-bg,.va-spark,.va-veil{display:none}                         
  html:not(.has-authbg) .auth-panel{
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    background:rgba(9,11,18,.82)!important}              
  html.has-authbg .auth-panel{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(9,11,18,.82)}
  .lang-cur{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    background:linear-gradient(135deg,rgba(60,12,80,.92),rgba(40,20,90,.92))!important}
}