/*
 * Splash screen shown while the app bundle loads (index.html). Removed by src/shared/motion/splash.ts (RootLayout) after the
 * first render. External file: the Content-Security-Policy forbids inline styles. Colors mirror the theme
 * background (theme.css) because the design tokens are not loaded yet.
 */
.splash {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  background: #070709;
  transition:
    opacity 420ms cubic-bezier(0.2, 0.7, 0.2, 1),
    visibility 420ms;
}
[data-theme='light'] .splash {
  background: #f9f9fb;
}
.splash--hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.splash__mark {
  width: 56px;
  height: 56px;
  animation: splash-in 700ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
.splash__mark rect {
  animation: splash-breathe 1600ms ease-in-out 700ms infinite;
  transform-origin: center;
}
.splash__glow {
  position: absolute;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(79, 124, 255, 0.35), transparent 70%);
  filter: blur(20px);
  animation: splash-in 900ms ease-out both;
}
@keyframes splash-in {
  from {
    opacity: 0;
    transform: scale(0.85);
  }
}
@keyframes splash-breathe {
  50% {
    transform: scale(0.94);
  }
}
@media (prefers-reduced-motion: reduce) {
  .splash,
  .splash__mark,
  .splash__mark rect,
  .splash__glow {
    animation: none;
    transition: none;
  }
}
