.grid {
  display: grid;
  /* The track floor yields to the container (min(…, 100%)); a grid inside a
     shrink-to-fit parent (flex item with auto basis, max-content, absolute)
     needs an explicit inline-size. */
  grid-template-columns: repeat(
    var(--grid-placement, auto-fill),
    minmax(min(var(--grid-min-item-size, 16rem), 100%), 1fr)
  );
  gap: var(--gutter, var(--space-s-md));
}

.grid[data-layout="50-50"] {
  --grid-placement: auto-fit;
  --grid-min-item-size: clamp(16rem, 50vw, 26rem);
}

.grid[data-rows="masonry"] {
  grid-template-rows: masonry;
  align-items: flex-start;
}