:root { --material-size: 180px; --material-opacity: .12; --material-blend: multiply; }
.material-paper,.material-paint,.material-ink,.material-wash { position:relative; isolation:isolate; overflow:hidden; }
.material-paper::before,.material-paint::before,.material-ink::before,.material-wash::before { content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none; opacity:var(--material-opacity); mix-blend-mode:var(--material-blend); background-size:var(--material-size); }
.material-paper::before { background-image:radial-gradient(circle at 20% 30%,currentColor 0 .45px,transparent .7px),radial-gradient(circle at 75% 65%,currentColor 0 .35px,transparent .65px); background-size:9px 11px,13px 15px; opacity:.055; }
.material-paint::before { background-image:linear-gradient(97deg,transparent 5%,currentColor 35%,transparent 63%),repeating-linear-gradient(2deg,transparent 0 4px,currentColor 5px 6px); opacity:.08; }
.material-ink::before { background-image:repeating-radial-gradient(ellipse at 20% 50%,transparent 0 3px,currentColor 4px 5px,transparent 6px 10px); opacity:.1; }
.material-wash::before { background-image:radial-gradient(ellipse at 15% 20%,currentColor,transparent 45%),radial-gradient(ellipse at 85% 75%,currentColor,transparent 40%); opacity:.08; }
