html::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: #191713;
  opacity: 0;
  pointer-events: none;
  transition: opacity 700ms ease;
}
html[data-page-enter]::after { opacity: 1; transition: none; pointer-events: auto; }
html[data-page-leave]::after { opacity: 1; transition-duration: 260ms; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) {
  html::after, html[data-page-leave]::after { transition: none; }
}