/* Halftone. Birinci kusakta acik bir tram, on ikinci kusakta cokmus bloklar.
   Yogunlugu --halftone token'i tasir, kaydirma --generation ile buyutur. */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9;
  opacity: calc(var(--halftone) + var(--generation) * 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4'%3E%3Ccircle cx='1' cy='1' r='1' fill='%23000'/%3E%3C/svg%3E");
  background-size: 4px 4px;
  transition: opacity var(--transition-ms) steps(4, end);
}

/* Fotokopide kagit hicbir zaman tam duz oturmaz: kenarlar kirlenir ve her
   kusakta biraz daha kararir.

   Blur yaricapi bilerek --generation'a baglanmadi: baglansaydi her kaydirma
   karesinde tam ekran bir golge yeniden hesaplanirdi. Golge sabit, yogunlugu
   opaklikla suruluyor ve opaklik compositor'da kalir. Bu bir onlem, olculmus
   bir arizanin duzeltmesi degil; kare hizi bu makinede henuz olculmedi. */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 8;
  box-shadow: inset 0 0 6rem rgba(0, 0, 0, 0.55);
  opacity: calc(0.35 + var(--generation) * 0.65);
  will-change: opacity;
}

/* Register kaymasi: ayni metnin bir kusak onceki izi, hafif otelenmis. */
h1.display, h2.display, .stat-value, .pact-cta {
  text-shadow:
    var(--misregister) 0 0 color-mix(in srgb, var(--accent) 55%, transparent),
    calc(var(--misregister) * -0.6) 0 0 color-mix(in srgb, var(--ink) 22%, transparent);
}

/* Tarama cubugu. Yalniz gecis suresince var: lamba sayfayi yukaridan asagi
   tarar ve arkasinda kalan her sey bir sonraki kusaktir. */
.is-copying::after {
  content: '';
  position: fixed;
  inset-inline: 0;
  inset-block-start: 0;
  block-size: 22vh;
  z-index: 20;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    transparent,
    color-mix(in srgb, var(--field) 70%, transparent),
    #fff,
    transparent
  );
  animation: scan var(--transition-ms) linear;
}

@keyframes scan {
  from { transform: translateY(-22vh); }
  to { transform: translateY(100vh); }
}

@media (prefers-reduced-motion: reduce) {
  .is-copying::after { content: none; animation: none; }
  body::after { transition: none; }
}