body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  pointer-events: none;
  background: url('uploads/site-grain.svg') repeat;
  background-size: 160px 160px;
  opacity: .30;
  mix-blend-mode: overlay;
  animation: grain-flicker .65s steps(1, end) infinite;
}

@keyframes grain-flicker {
  0%, 100% { background-position: 0 0; }
  12.5% { background-position: -37px 71px; }
  25% { background-position: 83px -29px; }
  37.5% { background-position: -113px -67px; }
  50% { background-position: 47px 131px; }
  62.5% { background-position: 151px 19px; }
  75% { background-position: -79px 173px; }
  87.5% { background-position: 109px -139px; }
}

@media (prefers-reduced-motion: reduce) {
  body::after { animation: none; }
}