/* Reveal the real scene only after its first complete render. */
html.planet-auth-route, html.planet-auth-route body { background: #06090b !important; }
.planet-auth .planet-auth-scene {
  opacity: 0;
  animation: none;
  transform: none;
}
/* The illustration has a different composition from WebGL; never flash it while loading. */
.planet-auth .planet-auth-scene:not(.is-fallback) > .planet-fallback { display: none !important; }
.planet-auth .planet-auth-scene:is(.is-ready, .is-fallback) {
  animation: planet-auth-arrival 1.8s cubic-bezier(.22, 1, .36, 1) both;
  transform-origin: 72% 62%;
}
@keyframes planet-auth-arrival {
  from { opacity: 0; transform: translate3d(0, 8px, 0) scale(.985); }
  to { opacity: .78; transform: translate3d(0, 0, 0) scale(1); }
}
.planet-auth > .planet-auth-content {
  transition: opacity .65s ease !important;
}
.planet-auth:has(.planet-auth-scene:not(.is-ready):not(.is-fallback)) > .planet-auth-content {
  opacity: 0;
}
.planet-auth:has(.planet-auth-scene:is(.is-ready, .is-fallback)) > .planet-auth-content {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .planet-auth .planet-auth-scene:is(.is-ready, .is-fallback) { animation: none; opacity: .78; transform: none; }
  .planet-auth > .planet-auth-content { transition: none !important; }
}