/**
 * App Ready Gate - Prevents FOUC (Flash of Unstyled Content)
 * Shows loading spinner until html.app-ready is set
 */

/* Dark overlay + spinner while loading */
html:not(.app-ready)::before {
  content: '';
  position: fixed;
  inset: 0;
  background: #141414;
  z-index: 99998;
}

html:not(.app-ready)::after {
  content: '';
  position: fixed;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 40px;
  margin: -20px 0 0 -20px;
  border: 3px solid rgba(229, 9, 20, 0.2);
  border-top-color: #E50914;
  border-radius: 50%;
  animation: app-spinner 0.8s linear infinite;
  z-index: 99999;
}

@keyframes app-spinner {
  to { transform: rotate(360deg); }
}

/* Hide overlay and spinner when ready */
html.app-ready::before,
html.app-ready::after {
  display: none !important;
}

/* CSS-only fallback: auto-hide overlay after 2.5s if JS fails */
@keyframes app-fallback-hide {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}

html:not(.app-ready)::before,
html:not(.app-ready)::after {
  animation: app-spinner 0.8s linear infinite, app-fallback-hide 0s 2.5s forwards;
}

html:not(.app-ready)::before {
  animation: app-fallback-hide 0s 2.5s forwards;
}