html[data-page-loading='true'],
html[data-page-loading='true'] body {
  overflow: hidden;
  overscroll-behavior: none;
}

html[data-page-loading='true'] body > :not(.page-loader),
html[data-page-loading='true'] body > :not(.page-loader) * {
  animation-play-state: paused !important;
}

html[data-page-loading='true']:not([data-page-revealing='true']) .site-header,
html[data-page-loading='true']:not([data-page-revealing='true']) .skip-link,
html[data-page-loading='true']:not([data-page-revealing='true']) .scene-layout > :not(.world),
html[data-page-loading='true']:not([data-page-revealing='true']) .scene-layout > :not(.world) * {
  visibility: hidden !important;
}

html[data-page-loading='true'] .camera-film { opacity: 0 !important; }

.world { background-image: var(--opening-poster, url('../assets/scene-quay.jpg')); }

.page-loader {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  min-height: 100svh;
  padding: 32px;
  overflow: hidden;
  color: #fff;
  background: transparent;
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  opacity: 1;
  transition: opacity var(--page-loader-exit-duration, 1500ms) cubic-bezier(.4, 0, .2, 1);
  touch-action: none;
}

.page-loader[hidden] { display: none; }
.page-loader[data-state='leaving'] { opacity: 0; }
.page-loader:focus { outline: none; }
.page-loader__content {
  width: clamp(180px, 55vw, 240px);
  max-width: 100%;
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
  transition: transform 637.5ms cubic-bezier(.22, 1, .36, 1), opacity 525ms ease, filter 637.5ms ease;
}
.page-loader[data-state='leaving'] .page-loader__content {
  opacity: 0;
  transform: translateY(-20px) scale(.8);
  filter: blur(4px);
}
.page-loader__icon, .page-loader__icon img { display: block; width: 100%; height: auto; }
.page-loader__message { position: absolute; top: calc(50% + 115px); left: 50%; width: min(340px, calc(100% - 48px)); transform: translateX(-50%); text-align: center; }
.page-loader__label { font-size: 14px; line-height: 1.5; }
.page-loader__detail { margin-top: 12px; font-size: 11px; line-height: 1.5; color: #e1ebf4; overflow-wrap: anywhere; }
.page-loader__retry { margin-top: 22px; padding: 12px 24px; border: 1px solid #ffffff61; border-radius: 999px; color: #fff; background: #ffffff24; box-shadow: inset 0 1px 1px #ffffff29; cursor: pointer; }
.page-loader__retry[hidden] { display: none; }

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html[data-page-loading='true'] .world { filter: blur(24px) !important; }
  html[data-page-loading='true'][data-page-revealing='true'] .world {
    filter: blur(0) !important;
    transition: filter var(--page-loader-exit-duration, 1500ms) cubic-bezier(.4, 0, .2, 1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-loader, .page-loader__content { transition: none; }
}