/* /styles/components/grain.css */

.grain-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-grain);
  pointer-events: none;
  opacity: 0.06;
  mix-blend-mode: overlay;
  filter: url(#noise-filter);
  background: var(--bg-base);
}

[data-theme="light"] .grain-overlay {
  opacity: 0.10;
  mix-blend-mode: multiply;
}

@media (prefers-reduced-motion: reduce) {
  .grain-overlay { opacity: 0.04; }
}