.wallpaper.login-wallpaper {
  background: #28a3d0 url("../aero-world.png") center center/cover no-repeat;
}
.wallpaper.login-wallpaper > .hill,
.wallpaper.login-wallpaper > .cloud {
  display: none;
}
.wallpaper.login-wallpaper > .sunlight {
  opacity: 0.5;
}
.wallpaper.login-wallpaper > .aero-ribbon {
  opacity: 0.45;
}
.aero-bubbles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.aero-bubble {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--size);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid #efffffbd;
  background:
    radial-gradient(circle at 28% 23%, #ffffffe6 0, transparent 9%),
    radial-gradient(circle at 34% 26%, #ffffff47 0, transparent 46%),
    radial-gradient(circle at 66% 78%, #a1fff957, transparent 55%);
  box-shadow:
    inset 2px 3px 6px #ffffff5c,
    inset -3px -4px 9px #65bfd755,
    0 2px 9px #187e9915;
  animation: bubble-float var(--duration, 14s) ease-in-out infinite alternate;
  animation-delay: var(--delay, 0s);
}
.aero-bubble:after {
  content: "";
  position: absolute;
  inset: 7% 11% 51% 13%;
  border-top: 2px solid #ffffffe0;
  border-radius: 50%;
  transform: rotate(-28deg);
}
@keyframes bubble-float {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(13px, -30px, 0);
  }
}
.login-screen {
  background: linear-gradient(110deg, #12658948, #13588012 60%, #d6ffff0a);
}
.desktop-watermark {
  text-shadow: 0 2px 18px #1777a178;
}
.desktop-heading {
  color: #fff;
}
@media (prefers-reduced-motion: reduce) {
  .aero-bubble {
    animation: none;
  }
}