.subgrid-columns {
  display: grid;
  gap: inherit;
  grid-template-columns: subgrid;
  grid-column: var(--colstart, auto) / span var(--span, 1);

  > *:not([class*='subgrid']) {
    grid-column-end: span var(--span, 1);
    max-width: 100%;
  }
}

.subgrid-rows {
  display: grid;
  gap: inherit;
  grid-template-rows: subgrid;
  grid-row: var(--rowstart, auto) / span var(--rowspan, 1);

  > *:not([class*='subgrid']) {
    grid-row-end: span var(--rowspan, 1);
  }
}

.subgrid {
  display: grid;
  gap: inherit;
  grid-template-columns: subgrid;
  grid-template-rows: subgrid;
  grid-column: var(--colstart, auto) / span var(--span, 1);
  grid-row: var(--rowstart, auto) / span var(--rowspan, 1);

  > *:not([class*='subgrid']) {
    grid-column-end: span var(--span, 1);
    grid-row-end: span var(--rowspan, 1);
    max-width: 100%;
  }
}