/* Page loader shown before the SSO bundle boots — a faithful port of the
   dashboard web loader (dashboard/web/index.html: pulsating Stundio logo),
   adapted to this portal's strict CSP. The dashboard inlines its splash CSS in
   a <style> block and hides it from an inline <script>; both are forbidden here
   by `style-src 'self'` / `script-src 'self'`, so the styles live in this
   self-hosted file (linked from index.html) and main.ts removes the overlay.

   Colours are hard-coded (not var(--ink)) on purpose: this file is linked
   directly in <head> and must render correctly on the very first paint, before
   the Vite-bundled styles.css applies (and in dev, where styles.css is injected
   by JS only after the module runs). */
#splash {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Matches the login shell (var(--ink) = #14201b) so the fade is seamless. */
  background: #14201b;
  transition:
    opacity 0.4s ease-out,
    visibility 0.4s ease-out;
}

#splash.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.splash-logo {
  width: 180px;
  height: auto;
  /* stundio.png is a dark wordmark — invert it to chalk on the dark splash,
     the same trick .aside-brand uses on the ink panel. */
  filter: brightness(0) invert(1);
  opacity: 0.92;
  animation: splash-pulse 2s ease-in-out infinite;
}

@keyframes splash-pulse {
  0%,
  100% {
    opacity: 0.92;
    transform: scale(1);
  }
  50% {
    opacity: 0.6;
    transform: scale(0.96);
  }
}

/* Respect reduced-motion: hold a steady logo, snap the overlay out. */
@media (prefers-reduced-motion: reduce) {
  .splash-logo {
    animation: none;
  }
  #splash {
    transition: none;
  }
}
