@layer components {
  .rs-grid {
    --rs-grid-min: 220px;
    --rs-grid-gap: var(--rs-unit-x4);
    display: grid;
    grid-template-columns: repeat(
      auto-fit,
      minmax(min(var(--rs-grid-min), 100%), 1fr)
    );
    gap: var(--rs-grid-gap);
  }

  .rs-grid[data-min="compact"] {
    --rs-grid-min: 160px;
  }

  .rs-grid[data-gap="small"] {
    --rs-grid-gap: var(--rs-unit-x2);
  }
}