/* A separate isolated backdrop keeps photo treatment away from the login controls. */
html.man-login-atmosphere-enabled body[data-path="login"] {
  isolation: isolate;
  background-image: none !important;
  background-color: #183847 !important;
}
#man-login-atmosphere {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background: linear-gradient(145deg, #15334a, #205a62 58%, #102c42);
}
#man-login-atmosphere > div {position: absolute; inset: 0; pointer-events: none;}
#man-login-atmosphere .man-login-photo {
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0;
  filter: brightness(var(--man-photo-brightness, 1));
  transition: opacity var(--man-photo-fade-duration, 1200ms) ease, filter 12s linear;
}
#man-login-atmosphere[data-image="ready"] .man-login-photo {opacity: 1;}
#man-login-atmosphere .man-login-time-tint {
  background-color: var(--man-time-tint, transparent);
  transition: background-color 12s linear;
}
#man-login-atmosphere .man-login-glow {
  inset: -4%;
  opacity: 0;
  background: radial-gradient(ellipse at 14% 26%, rgba(49, 191, 220, .28), rgba(49, 191, 220, .11) 35%, transparent 72%),
    radial-gradient(ellipse at 85% 72%, rgba(95, 202, 171, .24), rgba(95, 202, 171, .09) 38%, transparent 74%);
  mix-blend-mode: screen;
  transition: opacity 2s ease;
}
#man-login-atmosphere[data-glow="ready"] .man-login-glow {
  opacity: .9;
  animation: man-login-ambient-drift 36s ease-in-out infinite alternate;
}
#man-login-atmosphere[data-paused="true"] .man-login-glow {animation-play-state: paused;}
@keyframes man-login-ambient-drift {
  from {transform: translate(-1.5%, -1%);}
  to {transform: translate(1.5%, 1%);}
}
@media (max-width: 600px) {
  #man-login-atmosphere[data-glow="ready"] .man-login-glow {opacity: .8; animation-duration: 48s;}
}
@media (prefers-reduced-motion: reduce) {
  #man-login-atmosphere .man-login-photo,
  #man-login-atmosphere .man-login-time-tint,
  #man-login-atmosphere .man-login-glow {transition: none;}
  #man-login-atmosphere[data-glow="ready"] .man-login-glow {animation: none; transform: none;}
}
