/* A transparent site-wide surveying pass. It never intercepts input. */
body::after {
  --oversight-height: 150px;
  content: "";
  position: fixed;
  z-index: 30;
  pointer-events: none;
  left: 0;
  right: 0;
  top: calc(-1 * var(--oversight-height));
  height: var(--oversight-height);
  opacity: 0;
  mix-blend-mode: screen;
  background:
    linear-gradient(180deg, transparent 8%, rgba(229, 195, 126, .025) 39%, rgba(241, 211, 151, .20) 50%, rgba(229, 195, 126, .025) 61%, transparent 92%),
    repeating-linear-gradient(90deg, transparent 0, transparent 79px, rgba(236, 203, 138, .08) 79px, rgba(236, 203, 138, .08) 80px);
  box-shadow: 0 0 22px rgba(222, 184, 112, .13);
}
html[data-motion="on"] body::after {
  animation: zd-oversight-pass 15s linear infinite;
}
html[data-motion="off"] body::after {
  opacity: 0 !important;
  animation: none !important;
}
@keyframes zd-oversight-pass {
  0%, 8% { transform: translateY(0); opacity: 0; }
  16% { opacity: .42; }
  84% { opacity: .42; }
  94%, 100% { transform: translateY(calc(100vh + var(--oversight-height))); opacity: 0; }
}
@media (max-width: 650px) {
  body::after { --oversight-height: 100px; }
  body::after { filter: opacity(.65); }
}