:croot {
  --guide-columns: 6;
  --guide-margin: 164px;
  --guide-gutter: 40px;
  --guide-color: rgba(255, 0, 0, 0.1);
  --guide-column-width: calc(
    (100vw - (2 * var(--guide-margin)) - ((var(--guide-columns) - 1) * var(--guide-gutter))) /
      var(--guide-columns)
  );
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 99999;
  background-image:
    linear-gradient(
      to right,
      transparent 0,
      transparent var(--guide-margin),
      var(--guide-color) var(--guide-margin),
      var(--guide-color) calc(var(--guide-margin) + var(--guide-column-width)),
      transparent calc(var(--guide-margin) + var(--guide-column-width)),
      transparent calc(var(--guide-margin) + var(--guide-column-width) + var(--guide-gutter)),
      var(--guide-color) calc(var(--guide-margin) + var(--guide-column-width) + var(--guide-gutter)),
      var(--guide-color) calc(var(--guide-margin) + (2 * var(--guide-column-width)) + var(--guide-gutter)),
      transparent calc(var(--guide-margin) + (2 * var(--guide-column-width)) + var(--guide-gutter)),
      transparent calc(var(--guide-margin) + (2 * var(--guide-column-width)) + (2 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (2 * var(--guide-column-width)) + (2 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (3 * var(--guide-column-width)) + (2 * var(--guide-gutter))),
      transparent calc(var(--guide-margin) + (3 * var(--guide-column-width)) + (2 * var(--guide-gutter))),
      transparent calc(var(--guide-margin) + (3 * var(--guide-column-width)) + (3 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (3 * var(--guide-column-width)) + (3 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (4 * var(--guide-column-width)) + (3 * var(--guide-gutter))),
      transparent calc(var(--guide-margin) + (4 * var(--guide-column-width)) + (3 * var(--guide-gutter))),
      transparent calc(var(--guide-margin) + (4 * var(--guide-column-width)) + (4 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (4 * var(--guide-column-width)) + (4 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (5 * var(--guide-column-width)) + (4 * var(--guide-gutter))),
      transparent calc(var(--guide-margin) + (5 * var(--guide-column-width)) + (4 * var(--guide-gutter))),
      transparent calc(var(--guide-margin) + (5 * var(--guide-column-width)) + (5 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (5 * var(--guide-column-width)) + (5 * var(--guide-gutter))),
      var(--guide-color) calc(var(--guide-margin) + (6 * var(--guide-column-width)) + (5 * var(--guide-gutter))),
      transparent calc(var(--guide-margin) + (6 * var(--guide-column-width)) + (5 * var(--guide-gutter))),
      transparent 100%
    );
}