/*
 * First hard-load cover — hides mis-stacked content until layout/fonts settle.
 * Base placement is duplicated inline in HTML for the earliest possible paint.
 */

/* Hide navbar logo while booting (html class set by inline head script). */
html.wd-boot-active body.idx .nav-brand {
  visibility: hidden;
  pointer-events: none;
}

#wd-boot-cover {
  position: fixed;
  inset: 0;
  /* Below .navbar (20) so the bar stays usable; above video (0) and main (1). */
  z-index: 19;
  background: radial-gradient(ellipse 120% 80% at 50% 45%, #121214 0%, #070708 55%, #040405 100%);
  pointer-events: none;
  transition: opacity 0.28s ease;
  box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.45);
}

#wd-boot-cover[data-wd-off="1"] {
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  #wd-boot-cover {
    transition: none;
  }
}

/* Status label — all motion preferences */
#wd-boot-cover::before {
  content: "Loading";
  position: absolute;
  left: 50%;
  top: calc(50% + 2.85rem);
  transform: translateX(-50%);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(236, 234, 230, 0.45);
  white-space: nowrap;
}

#wd-boot-cover[data-wd-off="1"]::before {
  opacity: 0;
}

/* Spinner arc (reduced motion: label only, no spin) */
@media (prefers-reduced-motion: no-preference) {
  #wd-boot-cover::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 3rem;
    height: 3rem;
    margin: -1.5rem 0 0 -1.5rem;
    border-radius: 50%;
    border: 3px solid rgba(255, 237, 0, 0.14);
    border-top-color: #ffed00;
    border-right-color: rgba(255, 237, 0, 0.35);
    box-shadow:
      0 0 0 1px rgba(255, 237, 0, 0.06),
      0 0 28px rgba(255, 237, 0, 0.08);
    animation: wd-boot-spin 0.72s cubic-bezier(0.5, 0.1, 0.5, 0.9) infinite;
  }

  #wd-boot-cover[data-wd-off="1"]::after {
    animation: none;
    opacity: 0;
    box-shadow: none;
  }
}

@keyframes wd-boot-spin {
  to {
    transform: rotate(360deg);
  }
}