/* Keep legacy page CSS from fading the entire document during startup/handoff. */
body[data-valovate-boot-shell] { opacity: 1; animation: none; }

.ValovateStartup {
  --startup-surface: #0e131b;
  --startup-text: #f7fcfe;
  --startup-muted: #a9bac6;
  --startup-logo: url('./startup-logo.svg');
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  padding: 24px;
  background: var(--startup-surface);
  color: var(--startup-text);
  font-family: 'Segoe UI', system-ui, sans-serif;
}
.light .ValovateStartup {
  --startup-surface: #f7fcfe;
  --startup-text: #18333f;
  --startup-muted: #506572;
}
.ValovateStartup__brand { display: flex; flex-direction: column; align-items: center; gap: 22px; }
.ValovateStartup__mark { position: relative; width: 106px; height: 120px; }
.ValovateStartup__logo { display: block; width: 100%; height: 100%; object-fit: contain; opacity: .62; }
.ValovateStartup__light {
  position: absolute;
  inset: 0;
  -webkit-mask: var(--startup-logo) center / contain no-repeat;
  mask: var(--startup-logo) center / contain no-repeat;
  overflow: hidden;
}
.ValovateStartup__light::before {
  content: '';
  position: absolute;
  top: -30%;
  left: -110%;
  width: 60%;
  height: 160%;
  transform: rotate(-25deg);
  background: linear-gradient(90deg, transparent, #ffb3a8 50%, transparent);
  animation: valovate-startup-sweep 3.2s ease-in-out infinite;
}
.ValovateStartup__wordmark { font-size: 21px; line-height: 1.1; font-weight: 500; letter-spacing: .24em; padding-left: .24em; }
.ValovateStartup__recovery {
  position: absolute;
  bottom: max(24px, env(safe-area-inset-bottom));
  left: 24px;
  right: 24px;
  text-align: center;
  color: var(--startup-muted);
  font-size: 14px;
}
.ValovateStartup__recovery[hidden] { display: none; }
.ValovateStartup__recovery p { margin: 0 0 12px; }
.ValovateStartup__recovery button {
  padding: 10px 16px;
  border: 1px solid #159db5;
  border-radius: 6px;
  background: var(--startup-surface);
  color: var(--startup-text);
  font: inherit;
  cursor: pointer;
}
.ValovateStartup__recovery button:focus-visible { outline: 2px solid #22bbd7; outline-offset: 3px; }
html[data-startup-auxiliary] .ValovateStartup { display: none; }
@keyframes valovate-startup-sweep { 0%, 10% { left: -110%; } 70%, 100% { left: 170%; } }
@media (prefers-reduced-motion: reduce) {
  .ValovateStartup__light { display: none; }
  .ValovateStartup__light::before { animation: none; }
  .ValovateStartup__logo { opacity: 1; }
}
@media (max-height: 400px) {
  .ValovateStartup__brand { gap: 14px; }
  .ValovateStartup__mark { width: 70px; height: 80px; }
  .ValovateStartup:has(.ValovateStartup__recovery:not([hidden])) .ValovateStartup__brand { transform: translateY(-42px); }
}
