/* vko.media dither background. Canvas is added by shared/dither.js; html.dither is set only once WebGL draws. */
.dither-bg { position: fixed; left: 0; top: 0; z-index: -1; display: block; pointer-events: none; image-rendering: pixelated; opacity: 0; transition: opacity 600ms cubic-bezier(.22, 1, .36, 1); }
html.dither .dither-bg { opacity: 1; }
/* body stops painting the page colour so the canvas shows; html keeps it as the fallback */
html.dither body { background: transparent; }
/* the hero stays exactly as before */
html.dither .hero { background: var(--bg); }
@media print { .dither-bg { display: none; } html.dither body { background: var(--bg); } }