/* Login-only refinement. Authentication markup and logic are unchanged. */
@property --hm-login-light-angle {
  syntax: '<angle>';
  initial-value: 200deg;
  inherits: false;
}

.auth-page:has(#login-title)::before {
  animation: hm-login-halo-breathe 16s ease-in-out infinite;
}

.auth-page:has(#login-title)::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -32%;
  left: 20%;
  width: 78%;
  aspect-ratio: 1.55;
  border-radius: 50%;
  pointer-events: none;
  background: conic-gradient(from var(--hm-login-light-angle),
    transparent 0deg 200deg,
    rgba(141, 124, 255, .05) 228deg,
    rgba(170, 155, 242, .48) 267deg,
    rgba(221, 216, 255, .85) 293deg,
    rgba(170, 203, 237, .66) 315deg,
    transparent 346deg 360deg);
  -webkit-mask: radial-gradient(ellipse, transparent 40%, #000 44% 50%, transparent 56%);
  mask: radial-gradient(ellipse, transparent 40%, #000 44% 50%, transparent 56%);
  filter: blur(12px);
  opacity: .8;
  animation: hm-login-halo-light 12s linear infinite,
    hm-login-halo-breathe 16s ease-in-out infinite;
}

@keyframes hm-login-halo-light {
  from { --hm-login-light-angle: 200deg; }
  to { --hm-login-light-angle: 560deg; }
}

@keyframes hm-login-halo-breathe {
  0%, 100% { transform: translate3d(-1%, 0, 0) rotate(-11deg) scale(.99); opacity: .64; }
  50% { transform: translate3d(2%, 2%, 0) rotate(-7deg) scale(1.035); opacity: .82; }
}

/* Keep reading and typing calm; resume from the same position after focus leaves. */
.auth-page:has(#login-title):has(.auth-card :focus)::before,
.auth-page:has(#login-title):has(.auth-card :focus)::after {
  animation-play-state: paused;
}

@media (max-width: 600px) {
  .auth-page:has(#login-title)::before,
  .auth-page:has(#login-title)::after { top: -110px; left: 4%; width: 105%; right: auto; bottom: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .auth-page:has(#login-title)::before,
  .auth-page:has(#login-title)::after { animation: none !important; transform: rotate(-9deg); }
  .auth-page:has(#login-title)::after { opacity: .3; }
}
