/* Browser-level splash: the gradient only, plus a linear progress bar.
   Kept deliberately bare because this only ever shows while the Flutter engine
   boots; the app's own BrandedSplashScreen carries the branding and fades in
   over the top of it. */

html, body { margin: 0; background: #2962ff; }

#app-splash {
  position: fixed; inset: 0; z-index: 10000; overflow: auto;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 20px;
  /* The CSS translation of the Dart splash's
     LinearGradient(topRight -> bottomCenter), colour for colour. Because both
     layers paint this same gradient, `flutter-first-frame` can cross-fade them
     with nothing visible changing except the progress indicator. */
  background: linear-gradient(207deg, #2962ff, #82b1ff);
  color: #eaf3ff; font-family: Arial, sans-serif; text-align: center;
  opacity: 1;
}

/* Applied by splash.js on the app's first frame, then removed. */
#app-splash.splash-hidden { opacity: 0; transition: opacity 400ms ease-in-out; }

.splash-track { width: 96px; height: 3px; overflow: hidden; background: rgba(255, 255, 255, .25); border-radius: 3px; }
.splash-track span { display: block; width: 40%; height: 100%; background: rgba(255, 255, 255, .75); animation: track-sweep 1400ms ease-in-out infinite; }

/* Only ever revealed on a slow load or a startup failure. */
#splash-status { margin: 0; font-size: 13px; }
#splash-status[hidden] { display: none; }
#splash-retry { padding: 10px 20px; border: 0; border-radius: 8px; background: #fff; color: #2962ff; cursor: pointer; font: inherit; }
#splash-retry[hidden] { display: none; }

@keyframes track-sweep { from { transform: translateX(-100%); } to { transform: translateX(350%); } }

@media (prefers-reduced-motion: reduce) {
  .splash-track span { animation: none; width: 100%; }
  #app-splash.splash-hidden { transition: none; }
}