/* okitoki-v4 — screenshot strip (v3 Owl gallery): scroll-snap track + prev/next. */

.v-gallery { position: relative; }
.v-gallery__track {
    display: grid;
    grid-auto-columns: calc((100% - 2 * var(--v-space)) / 3);
    grid-auto-flow: column;
    gap: var(--v-space);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.v-gallery__track::-webkit-scrollbar { display: none; }
.v-gallery__track:focus-visible { outline: none; box-shadow: var(--v-focus-ring); border-radius: var(--v-radius); }
.v-gallery__item { margin: 0; scroll-snap-align: start; }
.v-gallery__image {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid rgb(var(--v-color-border));
    border-radius: var(--v-radius);
    background: rgb(var(--v-color-white));
}
.v-gallery__nav { display: flex; justify-content: center; gap: var(--v-space-sm); margin-top: var(--v-space-lg); }
.v-gallery__nav[hidden] { display: none; }
.v-gallery__nav .v-button { --v-button-size: 44px; }
.v-gallery__prev .v-icon { transform: rotate(90deg); }
.v-gallery__next .v-icon { transform: rotate(-90deg); }
.v-gallery__nav .v-icon { width: 20px; height: 20px; }

@media (max-width: 991.98px) { .v-gallery__track { grid-auto-columns: calc((100% - var(--v-space)) / 2); } }
@media (max-width: 575.98px) { .v-gallery__track { grid-auto-columns: 85%; } }