:root {
    --zoom-factor-desktop: 1.5;
    --zoom-factor-mobile: 1.0;
}

/* Default styles for mobile devices */
.zoom-wrapper {
    /* Mobile zoom or scale */
    zoom: var(--zoom-factor-mobile);
    transform: scale(var(--zoom-factor-mobile));
    transform-origin: top left;
    width: calc(100% / var(--zoom-factor-mobile));
    /* `clip`, not `hidden`: `overflow-x: hidden` forces overflow-y to compute
       as `auto`, turning this wrapper into a scroll container. Combined with
       the transform (which makes it a containing block) that strands content
       revealed later — the share button — in an unreachable inner scrollport
       on Gecko. */
    overflow-x: clip;
}

/* Styles for devices with fine pointer (e.g., mouse) and hover capability */
@media (hover: hover) and (pointer: fine) {
    .zoom-wrapper {
        /* Desktop zoom or scale */
        zoom: var(--zoom-factor-desktop);
        -moz-transform: scale(var(--zoom-factor-desktop));
        transform: scale(var(--zoom-factor-desktop));
        width: calc(100% / var(--zoom-factor-desktop));
    }
}