/* ===========================================================
   GRAIN — textura de granulado sobre a página inteira
   Overlay fixo em cima de tudo (inclusive dos elementos claros),
   sem capturar clique. O ruído é gerado por feTurbulence em SVG
   inline — nenhum arquivo de imagem, nenhuma requisição.
   =========================================================== */
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:9999;
  pointer-events:none;      /* o overlay nunca rouba clique/hover */

  /* feComponentTransfer: estica o contraste do ruido (slope 3 / intercept -1)
     e força alpha=1 — sem isso o feTurbulence sai lavado e o grão some */
  background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.86' numOctaves='4' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncR type='linear' slope='3' intercept='-1.25'/><feFuncG type='linear' slope='3' intercept='-1.25'/><feFuncB type='linear' slope='3' intercept='-1.25'/><feFuncA type='linear' slope='0' intercept='1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
  background-size:260px 260px;
  background-repeat:repeat;

  /* Blend normal, de propósito: o ruído é cinza médio, então sobre o preto
     ele clareia (grão claro) e sobre o creme ele escurece (grão escuro) —
     aparece nos dois. `overlay`/`soft-light` seriam o caminho normal, mas
     em cima de #010101 a conta dá zero e o grão simplesmente some. */
  /* BASE = telas 1× (IPS, monitores comuns). Aqui 1 px de CSS é 1 px de
     tela, então cada grão é grosso e aparece mais — por isso a opacidade
     é MENOR. .05 é o ponto onde a textura marca sem pesar. */
  opacity:.05;
}

/* Telas 2×+ (Retina): o grão é reamostrado e fica fino, então some com
   mais facilidade — pode ter opacidade maior. Este é o valor que já
   estava bom no Mac. Também encolhe o tile pra não virar "bolha". */
@media (min-resolution:2dppx){
  body::after{background-size:180px 180px;opacity:.075;}
}