.login-light{display:none;position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:strict}
body:has(.auth-page) .login-light{display:block}
body:has(.auth-page) #app{position:relative;z-index:1}
.login-light>i{position:absolute;display:block;inset:-30%;transform-origin:center;will-change:transform;background-repeat:no-repeat}
.login-light>i:nth-child(1){background:radial-gradient(ellipse at 18% 25%,#ef98ae42,transparent 52%),radial-gradient(ellipse at 75% 85%,#c4d89b38,transparent 49%);animation:login-light-drift 24s ease-in-out -6s infinite alternate}
.login-light>i:nth-child(2){background:radial-gradient(ellipse at 60% 35%,#a0dfe628,transparent 48%),radial-gradient(ellipse at 63% 37%,#eab5cf20,transparent 46%);animation:login-light-refraction 31s ease-in-out -12s infinite alternate}
.login-light>i:nth-child(3){background:radial-gradient(ellipse at 34% 70%,#e6d4b932,transparent 42%),radial-gradient(ellipse at 36% 71%,#eaa5bd24,transparent 43%);animation:login-light-drift 39s ease-in-out -19s infinite alternate-reverse}
:root[data-theme=dark] .login-light>i:nth-child(1){background:radial-gradient(ellipse at 18% 25%,#b95d8048,transparent 52%),radial-gradient(ellipse at 75% 85%,#829c3438,transparent 49%)}
:root[data-theme=dark] .login-light>i:nth-child(2){background:radial-gradient(ellipse at 60% 35%,#4b9ba52b,transparent 48%),radial-gradient(ellipse at 63% 37%,#bb668724,transparent 46%)}
:root[data-theme=dark] .login-light>i:nth-child(3){background:radial-gradient(ellipse at 34% 70%,#98713f32,transparent 42%),radial-gradient(ellipse at 36% 71%,#b65f8826,transparent 43%)}
.app-is-hidden .login-light>i{animation-play-state:paused}
@keyframes login-light-drift{from{transform:translate3d(-10%,-8%,0) scale(1.08)}to{transform:translate3d(12%,10%,0) scale(1.22)}}
@keyframes login-light-refraction{from{transform:translate3d(12%,-9%,0) scale(1.08)}to{transform:translate3d(-12%,10%,0) scale(1.18)}}
@media(prefers-reduced-motion:reduce){.login-light>i{animation:none!important;will-change:auto}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.login-light{display:none!important}}
/* Only login and registration receive the moving light layer. */
:root[data-theme] body:has(.auth-page) .login-light{display:block}
/* Keep the light material painted through the Home Screen gesture area. */
@media(max-width:900px){
 :root.standalone-app body:has(.auth-page) .login-light{position:absolute;inset:0;height:100%;min-height:0;contain:none;background:var(--bg)}
}
