/* The 999 vinyl is the loading indicator; application readiness owns dismissal. */
#splash {
  overflow: hidden;
  background: #08070a;
}

#splash::before,
#splash::after {
  content: none;
}

#splash .splash-vinyl {
  display: block;
  width: clamp(176px, 44vw, 300px);
  height: auto;
  max-height: 64svh;
  overflow: visible;
  opacity: 1;
  animation: splash-vinyl-arrive .28s ease-out both;
}

#splash .splash-vinyl-disc {
  transform-box: fill-box;
  transform-origin: center;
  animation: splash-vinyl-spin 1.15s linear infinite;
}

#splash.splash-hide .splash-vinyl,
#splash.splash-hide .splash-vinyl * {
  animation-play-state: paused;
}

@keyframes splash-vinyl-arrive {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes splash-vinyl-spin {
  from { transform: rotate(-45deg); }
  to { transform: rotate(315deg); }
}

@media (prefers-reduced-motion: reduce) {
  #splash .splash-vinyl,
  #splash .splash-vinyl * {
    animation: none;
  }
}