/* Static vector surfaces, animated only with compositor transforms and opacity. */
.login-atmosphere {
  display: none;
}
.client-portal .login-screen {
  background:
    radial-gradient(ellipse 650px 650px at 14% 15%, #203b6524, transparent 75%),
    radial-gradient(ellipse 900px 700px at 90% 90%, #1c3d7829, transparent 75%), #0c111a;
}
.client-portal .login-screen::before,
.client-portal .login-screen::after {
  content: none;
}
.client-portal .login-atmosphere {
  display: block;
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  contain: paint;
  pointer-events: none;
  perspective: 1400px;
  perspective-origin: 50% 48%;
}
.login-orbit-plane {
  --orbit-size: clamp(920px, 82vw, 1260px);
  position: absolute;
  width: var(--orbit-size);
  height: var(--orbit-size);
  left: 50%;
  top: 50%;
  margin: calc(var(--orbit-size) / -2);
  transform-style: preserve-3d;
  opacity: 0.66;
  transform: translate3d(170px, -100px, -100px) rotateZ(-29deg) rotateX(62deg);
  animation: login-orbit-tilt 24s ease-in-out infinite alternate;
}
.login-orbit-surface {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  animation: login-metal-reflection 38s linear infinite;
}
.login-orbit-plane-secondary {
  --orbit-size: clamp(780px, 67vw, 1020px);
  opacity: 0.38;
  transform: translate3d(-190px, 170px, -180px) rotateZ(32deg) rotateX(66deg);
  animation: login-orbit-countertilt 29s ease-in-out infinite alternate;
}
.login-orbit-plane-secondary .login-orbit-surface {
  animation-duration: 57s;
  animation-direction: reverse;
}
.login-atmosphere[data-paused] .login-orbit-plane,
.login-atmosphere[data-paused] .login-orbit-surface {
  animation-play-state: paused;
}
@keyframes login-metal-reflection {
  to {
    transform: rotateZ(360deg);
  }
}
@keyframes login-orbit-tilt {
  from {
    transform: translate3d(170px, -100px, -100px) rotateZ(-29deg) rotateX(62deg);
  }
  to {
    transform: translate3d(120px, -35px, -100px) rotateZ(-18deg) rotateX(53deg);
  }
}
@keyframes login-orbit-countertilt {
  from {
    transform: translate3d(-190px, 170px, -180px) rotateZ(32deg) rotateX(66deg);
  }
  to {
    transform: translate3d(-120px, 110px, -180px) rotateZ(43deg) rotateX(59deg);
  }
}
@media (max-width: 600px) {
  .login-orbit-plane {
    --orbit-size: 680px;
    opacity: 0.46;
    animation-name: login-orbit-mobile;
    transform: translate3d(45px, -90px, -100px) rotateZ(-32deg) rotateX(58deg);
  }
  .login-orbit-plane-secondary {
    display: none;
  }
  @keyframes login-orbit-mobile {
    from {
      transform: translate3d(45px, -90px, -100px) rotateZ(-32deg) rotateX(58deg);
    }
    to {
      transform: translate3d(-20px, -35px, -100px) rotateZ(-18deg) rotateX(48deg);
    }
  }
}
@media (prefers-reduced-motion: reduce) {
  .login-orbit-plane,
  .login-orbit-surface {
    animation: none;
  }
}
