.phg-gallery {
    --phg-gap: 14px;
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    outline: none;
}

.phg-viewport {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    touch-action: pan-y pinch-zoom;
    cursor: grab;
    overscroll-behavior: contain;
}

.phg-gallery.is-dragging .phg-viewport {
    cursor: grabbing;
}

.phg-track {
    display: flex;
    align-items: flex-start;
    gap: var(--phg-gap);
    will-change: transform;
    transform: translate3d(0, 0, 0);
}

.phg-slide {
    box-sizing: border-box;
    flex: 0 0 auto;
    min-width: 0;
    margin: 0;
}

.phg-image {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: contain;
    user-select: none;
    -webkit-user-drag: none;
    pointer-events: none;
}

.phg-gallery:focus-visible {
    box-shadow: inset 0 0 0 2px #4cb05c;
}

.phg-empty {
    padding: 14px 16px;
    border-left: 4px solid #4cb05c;
    background: #f6f8f7;
}
