@media screen and (max-width: 651px) {
    html, body {
        overflow: hidden;
        height: 100%;
        margin: 0;
        /* Hide scrollbar completely */
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    html::-webkit-scrollbar,
    body::-webkit-scrollbar {
        display: none;
    }

    .mobile-selected-work {
        position: absolute;
        top: 8dvh;
        left: 1rem;
        right: 1rem;
        bottom: 0;
        overflow-y: auto;
        /* Improve rendering performance on some browsers */
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        /* Prevent text/element selection during wheel scrolling */
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        /* Hide scrollbar */
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .mobile-selected-work::-webkit-scrollbar {
        display: none;
    }

    .mobile-selected-work .selected-work-image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
        opacity: 0;
        /* Add a very subtle and fast transition */
        /* transition: opacity 0.15s ease-out; */
        /* Hint to the browser to optimize for opacity changes */
        /* will-change: opacity; */
        /* Prevent image selection/dragging */
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        pointer-events: none;
    }

    .mobile-selected-work .selected-work-image.active {
        opacity: 1;
    }
}