.login-page .login-story {
  isolation: isolate;
}

.login-page .login-story::after {
  inset: -52px;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background: url("chat-wallpaper-night.png?v=20260924-restore-1") center / clamp(640px, 54vw, 820px) auto repeat;
  filter: grayscale(1) contrast(2);
  mix-blend-mode: screen;
  opacity: .34;
  mask-image: linear-gradient(#000 30%, #0007 44% 61%, #000 76%);
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  .login-page .login-story::after {
    animation: login-wallpaper-drift 32s ease-in-out -12s infinite alternate;
  }
}

@keyframes login-wallpaper-drift {
  from { transform: translate(-42px, 40px); }
  to { transform: translate(42px, -40px); }
}

.password-reset-page {
  background: radial-gradient(circle at 80% 15%, rgba(225, 37, 27, .07), transparent 30%);
  min-width: 0;
  padding: 40px;
}

.password-reset-card {
  border-color: #e2dfdc;
  border-radius: 16px;
  box-shadow: 0 25px 70px rgba(45, 35, 32, .12);
  gap: 16px;
  max-width: 410px;
  padding: 40px;
}

html[data-theme="dark"] .password-reset-card {
  background: var(--paper);
  border-color: #30465a;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .38);
}

.password-reset-card > .login-brand {
  display: none;
}

.password-reset-card h1 {
  font-weight: 850;
  letter-spacing: -.025em;
  margin: 0 0 6px;
}

.password-reset-card .fields label {
  color: #496277;
  font-weight: 700;
  gap: 7px;
}

html[data-theme="dark"] .password-reset-card .fields label {
  color: #b5c3cf;
}

.password-reset-card .fields.two {
  grid-template-columns: 1fr;
}

.password-reset-card .fields.two > .span-2 {
  grid-column: auto;
}

.password-reset-card .reset-back-link {
  color: var(--blue);
}