.ipg-grid {
    display: grid;
    grid-template-columns: repeat(var(--ipg-columns, 4), minmax(0, 1fr));
    gap: var(--ipg-gap, 2px);
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ipg-grid-item {
    min-width: 0;
    list-style: none;
}

.ipg-item {
    position: relative;
    display: block;
    min-width: 0;
    aspect-ratio: var(--ipg-ratio, 1/1);
    overflow: hidden;
    border-radius: var(--ipg-radius, 0);
    background: #f1f1f1;
    text-decoration: none;
}

.ipg-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 240ms ease, opacity 240ms ease;
}

.ipg-item:hover img,
.ipg-item:focus-visible img {
    transform: scale(1.035);
    opacity: 0.9;
}

.ipg-item:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.ipg-message {
    padding: 12px;
    border: 1px solid currentColor;
    font-size: 14px;
}

@media (max-width: 700px) {
    .ipg-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}