/* Mobile Image Optimization Styles */
@media screen and (max-width: 768px) {
    /* Only disable transitions for loading, not carousel functionality */
    #container, html.multifile body.loaded #container, html.multifile.fade body.loaded #container {
        -ms-transition: none important;
        -webkit-transition: none important;
        transition: none important;
    }
    /* Preserve carousel functionality - only optimize image rendering */
    .pageItem {
        image-rendering: optimizeSpeed;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transform: translateZ(0);
    }
    /* Only force visibility for images that are actually loading */
    .pageItem img[data-src] {
        opacity: 1 important;
    }
    .pageItem.hd {
        -webkit-transition: transform 0s important;
        transition: transform 0s important;
    }
    .pageItem {
        image-rendering: optimizeSpeed;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transform: translateZ(0);
    }
    .pageItem.hd img[src*=".webp"], .pageItem.hd[data-src*=".webp"], img.hd[src*=".webp"] {
        -ms-transform: scale(1) important;
        -webkit-transform: scale(1) important;
        transform: scale(1) important;
    }
    .scroll, .scroll-vert, .scroll-horiz {
        -webkit-overflow-scrolling: touch;
        transform: translateZ(0);
    }
}
.pageItem.critical { animation: none; background: none; filter: none; }
.pageItem.low-priority { opacity: 0; transition: opacity 0.5s ease; }
.pageItem.low-priority.loaded { opacity: 1; }
