/* Shared low-density overlay. Difference blending stays subtle on both themes. */
.watermark-layer {
  position: fixed;
  inset: 0;
  z-index: var(--z-watermark, 90);
  overflow: hidden;
  opacity: 1;
  transform: translateZ(0);
  mix-blend-mode: difference;
  pointer-events: none;
  user-select: none;
  transition: opacity 160ms ease, visibility 160ms;
}

.watermark-grid {
  position: absolute;
  inset: -28%;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(470px, 1fr));
  grid-auto-rows: 345px;
  align-items: center;
  transform: rotate(-24deg);
  transform-origin: center;
}

.watermark-item {
  color: rgb(255 255 255 / 8.8%);
  font-size: .75rem;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: .12em;
  text-align: center;
  white-space: nowrap;
}

body.watermark-off .watermark-layer { visibility: hidden; opacity: 0; }

@media (max-width: 760px) {
  .watermark-grid {
    inset: -24%;
    grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
    grid-auto-rows: 260px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .watermark-layer { transition: none; }
}