.material-grid {
  background-image:
    linear-gradient(to right, rgb(31 121 173 / .07) 1px, transparent 1px),
    linear-gradient(to bottom, rgb(24 39 48 / .045) 1px, transparent 1px);
  background-size: 32px 32px;
}

.material-panel {
  position: relative;
  isolation: isolate;
  background-image: linear-gradient(145deg, rgb(255 255 255 / .98), rgb(226 230 233 / .8));
  box-shadow: 0 0 24px rgb(31 121 173 / .09), inset 0 0 0 1px rgb(255 255 255 / .8);
}

.material-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: repeating-linear-gradient(90deg, transparent 0 15px, rgb(31 121 173 / .045) 15px 16px);
}

.cut-corner {
  clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px));
}

.signal-rule {
  background: repeating-linear-gradient(90deg, currentColor 0 10px, transparent 10px 14px);
}