.gallery {
    --columns: 0;
    --col-gap: 0;
    --row-gap: 0;
    display: grid;
    grid-template-columns: 1fr;
    justify-content: center;
    column-gap: var(--col-gap);
    row-gap: var(--row-gap);
}

.gallery * {
    box-sizing: border-box;
}

@media screen and (min-width: 30em) {
    .gallery {
        grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
    }
}