/* DiplomatsWorld DearFlip integration */
#dw-webp-reader {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

#dw-webp-reader .dw-webp-stage {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
}

#dw-webp-reader .dw-dearflip-book {
    width: 100% !important;
    height: 760px !important;
    min-height: 760px !important;
    max-height: none !important;
    overflow: hidden;
}

#dw-webp-reader .df-container {
    width: 100% !important;
    height: 100% !important;
}

@media (max-width: 640px) {
    #dw-webp-reader .dw-dearflip-book {
        height: min(620px, 142vw) !important;
        min-height: 0 !important;
    }
}

/* Keep DearFlip touch pan/zoom inside the reader on mobile. */
@media (max-width: 640px) {
    #dw-webp-reader,
    #dw-webp-reader .dw-webp-stage,
    #dw-webp-reader .dw-dearflip-book,
    #dw-webp-reader .df-container,
    #dw-webp-reader .df-viewer-container {
        overscroll-behavior: contain;
    }

    #dw-webp-reader .df-container,
    #dw-webp-reader .df-viewer-container {
        /*
         * Allow normal vertical website scrolling when a touch starts
         * over the magazine. DearFlip retains horizontal page gestures.
         */
        touch-action: pan-y;
    }
}


/*
 * DearFlip mobile fullscreen:
 * DearFlip fixes the fullscreen container to the viewport but leaves
 * its 3D canvas at top:0. Centre only those canvas layers vertically.
 */
@media (max-width: 640px) {
    #dw-webp-reader .df-container.df-fullscreen > .df-3dcanvas {
        top: 50% !important;
        transform: translateY(-50%) !important;
    }
}