:root {
  --startup-background: #f5f8ff;
  --startup-foreground: #13233f;
  --startup-muted: #52647f;
  --startup-track: #dbe7ff;
}
:root[data-startup-theme="dark"] {
  --startup-background: #070b16;
  --startup-foreground: #e5edf8;
  --startup-muted: #a5b4cd;
  --startup-track: #172a4b;
}
html, body { margin: 0; background: var(--startup-background); }
#platform-startup {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: grid;
  place-items: center;
  padding: 24px;
  box-sizing: border-box;
  background: radial-gradient(ellipse at 50% 42%, #2563eb0c, transparent 60%), var(--startup-background);
  color: var(--startup-foreground);
  font: 15px/1.6 system-ui, -apple-system, "Segoe UI", sans-serif;
  text-align: center;
  opacity: 1;
  transition: opacity 220ms ease;
}
#platform-startup.startup-ready { opacity: 0; pointer-events: none; }
.startup-content { width: min(100%, 380px); }
.startup-logo {
  width: 88px;
  height: 88px;
  margin: 0 auto 22px;
  border-radius: 24px;
  box-shadow: 0 18px 45px #2563eb30;
  animation: startup-float 2.8s ease-in-out infinite;
}
.startup-logo img { display: block; border-radius: inherit; }
.startup-brand { margin: 0 0 8px; font-size: 24px; font-weight: 750; letter-spacing: -.7px; }
#startup-message { margin: 0; font-weight: 600; }
#startup-detail { margin: 18px 0 0; color: var(--startup-muted); font-size: 13px; }
.startup-track {
  width: 144px;
  height: 3px;
  margin: 22px auto 0;
  border-radius: 3px;
  overflow: hidden;
  background: var(--startup-track);
}
.startup-track span {
  display: block;
  width: 45%;
  height: 100%;
  background: #2563eb;
  border-radius: inherit;
  animation: startup-progress 1.6s ease-in-out infinite;
}
#startup-retry {
  margin-top: 20px;
  padding: 9px 18px;
  border: 1px solid #2563eb;
  border-radius: 8px;
  background: #2563eb;
  color: white;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
#startup-retry:focus-visible { outline: 3px solid #60a5fa; outline-offset: 4px; }
@keyframes startup-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-9px); }
}
@keyframes startup-progress {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(330%); }
}
@media (prefers-reduced-motion: reduce) {
  .startup-logo, .startup-track span { animation: none; }
  .startup-track span { width: 100%; opacity: .65; }
  #platform-startup { transition: none; }
}
