/* ========================================================================== VVP MONO / texture.css The grain layer, standalone and toggleable. Mechanism: - The grain is a tiling SVG noise image set as the BODY background-image, underneath every element background. Alpha is baked at ~5 percent. - Active only under html[data-variant="chalk-grain"]. - Kill switches: remove this file, add class "texture-off" to , or set --texture-image: none anywhere. - Legibility rule: grain never sits behind information-dense blocks. Cards are opaque by design (mono.css); the masks below cover the dense blocks that would otherwise sit on the bare page base. ========================================================================== */ html[data-variant="chalk-grain"] { --texture-image: url("data:image/svg+xml;utf8,"); } body { background-image: var(--texture-image, none); } /* Kill switch (one class or one custom property switches it off) */ html.texture-off, html[data-texture="off"] { --texture-image: none !important; } /* Legibility masks: opaque base fill under dense blocks that have no card surface of their own (hero stats, argument steps, bios, criteria groups). */ html[data-variant="chalk-grain"] .hero-stats, html[data-variant="chalk-grain"] .arg, html[data-variant="chalk-grain"] .partner-row, html[data-variant="chalk-grain"] .faq-group { background-color: var(--texture-mask); }