/* Loaded after the page styles; touch layouts also cover iPad desktop mode. */
.lightbox, .lightbox-container, .lightbox-media, .offcanvas-overlay, .offcanvas-panel {
    height: 100dvh;
}
.lightbox, .lightbox-media { touch-action: pan-y pinch-zoom; }
.lightbox-media img, .lightbox-media video { max-height: 100dvh; }
.lightbox-media { position: relative; touch-action: pinch-zoom; }
.lightbox-media.swiping { will-change: transform; }
.lightbox-media .swipe-preview {
    position: absolute; top: 0; width: 100%; height: 100%;
    max-width: none; max-height: none; object-fit: contain; pointer-events: none;
}
.contact-modal, .legal-modal { height: 100dvh; overflow-y: auto; overscroll-behavior: contain; }
.contact-container, .legal-container { box-sizing: border-box; max-height: 100%; overflow-y: auto; }
.rating-toggle { display: inline-flex; align-items: center; color: inherit; font: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.rating-option { border: 0; color: #fff; font-family: inherit; cursor: pointer; }
.aperture-rating.is-open .rating-options { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }

@media (min-width: 769px) and (max-width: 1199px) {
    .gallery-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
    .gallery-container { grid-template-columns: minmax(0, 1fr); padding-inline: 12px; gap: 16px; }
    .site-title { overflow-wrap: anywhere; }
}
@media (pointer: coarse), (max-width: 1024px) {
    input, select, textarea, .form-group input, .form-group textarea, .offcanvas-search-form input { font-size: 16px; }
    button, .pagination-link, .filter-select, .custom-select-option, .footer-meta-link, .basket-clear {
        min-height: 44px;
    }
    .page-kebab-btn, .close-btn, .offcanvas-close, .select-box-btn { min-width: 44px; min-height: 44px; }
    .close-btn { top: calc(12px + env(safe-area-inset-top)); right: calc(12px + env(safe-area-inset-right)); }
    .offcanvas-panel {
        padding: calc(20px + env(safe-area-inset-top)) calc(20px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) 20px;
        overscroll-behavior: contain;
    }
    .contact-modal, .legal-modal {
        padding: calc(64px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));
    }
    .contact-container, .legal-container { padding: 24px 18px; }
    .lightbox-meta-bottom, .lightbox-meta-bottom.collapsed { bottom: calc(12px + env(safe-area-inset-bottom)); }
    .lightbox-meta-bottom { box-sizing: border-box; max-height: 45dvh; overflow-y: auto; overscroll-behavior: contain; padding: 8px 14px 14px; }
    .lightbox-meta-bottom.collapsed { padding: 0; min-height: 44px; }
    .meta-inline-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .meta-inline-item .value { overflow-wrap: anywhere; }
    .download-basket { bottom: calc(12px + env(safe-area-inset-bottom)); max-width: calc(100% - 24px); box-sizing: border-box; }
    .gallery-item .select-box-btn { opacity: 1; }
    .gallery-item:hover, .gallery-item:hover .media-element { transform: none; }
    .exif-overlay { pointer-events: none; }
    .aperture-rating { padding: 0; flex-wrap: wrap; justify-content: center; max-width: 100%; }
    .rating-toggle { min-height: 44px; padding: 8px 16px; }
    .aperture-rating:not(.is-open) .rating-options { display: none; }
    .aperture-rating.is-open .rating-options {
        position: static; display: flex; flex-basis: 100%; width: 260px; max-width: 100%;
        box-sizing: border-box; opacity: 1; pointer-events: auto; transform: none;
    }
    .rating-option { min-width: 44px; min-height: 44px; }
    .rating-options::after { display: none; }
    .share-btn { min-height: 44px; }
}
@media (pointer: coarse) and (orientation: landscape) and (max-height: 600px) {
    .lightbox-meta-bottom { max-height: 40dvh; }
    .contact-modal, .legal-modal { padding-top: calc(56px + env(safe-area-inset-top)); }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}