/* ============================================================
   grain.css — Film Grain Overlay
   Darkroom Portfolio — Phase 1 Foundation
   Pattern: SVG feTurbulence via body::before pseudo-element
   ============================================================ */

/* The grain is rendered via an inline SVG data URI using
   feTurbulence fractalNoise — a static, authentic film grain pattern.
   pointer-events: none ensures it never blocks interaction.
   z-index: 9999 ensures it sits above all content visually. */

body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: var(--grain-opacity);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23grain)'/%3E%3C/svg%3E");
  background-size: 200px 200px;
  background-repeat: repeat;
}