.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;
}

.material-paper::before {
  opacity: var(--material-opacity, .42);
  background:
    radial-gradient(circle at 18% 24%, rgb(255 255 255 / .75) 0 1px, transparent 1.4px),
    radial-gradient(circle at 72% 64%, rgb(25 46 44 / .1) 0 .8px, transparent 1.2px),
    linear-gradient(112deg, transparent 30%, rgb(255 255 255 / .35) 50%, transparent 68%);
  background-size: 17px 19px, 23px 21px, 100% 100%;
  mix-blend-mode: multiply;
}

.material-paint::before {
  opacity: var(--material-opacity, .2);
  background:
    linear-gradient(96deg, transparent, rgb(255 255 255 / .6) 42%, transparent 72%),
    repeating-linear-gradient(0deg, rgb(255 255 255 / .08) 0 1px, transparent 1px 4px);
  mix-blend-mode: screen;
}

.material-ink::before {
  opacity: var(--material-opacity, .15);
  background: repeating-linear-gradient(105deg, transparent 0 3px, rgb(237 242 241 / .5) 3px 4px, transparent 4px 8px);
}

.material-wash::before {
  opacity: var(--material-opacity, .62);
  background:
    radial-gradient(circle at 12% 25%, rgb(255 255 255 / .72), transparent 35%),
    radial-gradient(circle at 86% 82%, rgb(171 196 193 / .46), transparent 42%);
}
