/* ═══════════════════════════════════════════════════════════════════════
   PDF HTML Viewer — Scribd-style (ported from PDFViewer.scss)
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Main viewer container ── */
.pdftopost-viewer {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto !important;
    margin: 0 auto;
    padding: 0;
    display: block;
    box-sizing: border-box;
    background: transparent !important;
    background-color: transparent !important;
    overflow: visible !important;
    /* Prevent iOS from auto-enlarging text — breaks pdf2htmlEX absolute positioning.
       Must be 'none' not '100%' — Chrome iOS ignores '100%' when CSS zoom is applied. */
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    text-size-adjust: none;
}

/* ── Fullscreen mode (each prefix in own block — browsers drop entire block if one selector invalid) ── */
.pdftopost-viewer:fullscreen {
    background: #f7f8f9 !important;
    background-color: #f7f8f9 !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
    padding: 0 !important;
}
.pdftopost-viewer:-webkit-full-screen {
    background: #f7f8f9 !important;
    background-color: #f7f8f9 !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
    padding: 0 !important;
}
.pdftopost-viewer:-moz-full-screen {
    background: #f7f8f9 !important;
    background-color: #f7f8f9 !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
    padding: 0 !important;
}

/* Class-based fallback (JS adds this) */
.pdftopost-viewer.pdftopost-is-fullscreen {
    background: #f7f8f9 !important;
    background-color: #f7f8f9 !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
    padding: 0 !important;
}

.pdftopost-viewer:fullscreen .pdftopost-toolbar-container {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: #f7f8f9 !important;
}
.pdftopost-viewer:-webkit-full-screen .pdftopost-toolbar-container {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: #f7f8f9 !important;
}
.pdftopost-viewer.pdftopost-is-fullscreen .pdftopost-toolbar-container {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: #f7f8f9 !important;
}

/* ── Sticky horizontal scrollbar (PC/tablet, visible when zoomed) ── */
.pdftopost-hscroll-bar {
    display: none; /* hidden by default, JS shows when zoomed */
    position: sticky;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    overflow-x: auto;
    overflow-y: hidden;
    background: rgba(255,255,255,0.95);
    /* Removed backdrop-filter: blur(4px) — caused severe scroll jank in
       iOS Safari (re-rasterizes blurred region every frame). Higher alpha
       compensates visually for absent blur. */
    border-top: 1px solid #e0e0e0;
    height: 16px;
    cursor: grab;
}

.pdftopost-hscroll-bar:active {
    cursor: grabbing;
}

/* Inner element sets the scrollable width */
.pdftopost-hscroll-inner {
    height: 1px;
}

@media (max-width: 768px) {
    .pdftopost-hscroll-bar {
        display: none !important; /* mobile uses native touch scroll */
    }
}

/* ── Toolbar container (sticky) ── */
.pdftopost-toolbar-container {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0;
    z-index: 1000;
    padding: 12px 0;
    background: #f7f8f9;
    width: 100%;
    box-sizing: border-box;
    /* When WP admin bar is showing */
}

.admin-bar .pdftopost-toolbar-container {
    top: 32px;
}

@media screen and (max-width: 782px) {
    .admin-bar .pdftopost-toolbar-container {
        top: 46px;
    }
}

/* ── Toolbar bar (white rounded, hardened) ── */
.pdftopost-viewer-toolbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 8px 12px !important;
    background: white !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
    gap: 8px !important;
    min-height: 50px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    border: none !important;
}

/* ── Toolbar sections ── */
.pdftopost-toolbar-section {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Left and right share equal flex space so the center section is always
   visually centered in the toolbar, regardless of how many buttons sit
   on either side. */
.pdftopost-toolbar-left {
    flex: 1 1 0;
    justify-content: flex-start;
}

.pdftopost-toolbar-center {
    flex: 0 0 auto;
    justify-content: center;
}

.pdftopost-toolbar-right {
    flex: 1 1 0;
    justify-content: flex-end;
}

/* ── Download button (green) ── */
.pdftopost-download-btn {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 16px !important;
    background: #3ddc97 !important;
    color: black !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    line-height: normal !important;
    height: auto !important;
    margin: 0 !important;
}

.pdftopost-download-btn:hover {
    background: #35c885 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 2px 4px rgba(61,220,151,0.3) !important;
    color: black !important;
    text-decoration: none !important;
}

.pdftopost-download-btn:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(61,220,151,0.3) !important;
}

.pdftopost-download-btn:active {
    background: #2db877 !important;
    transform: translateY(0) !important;
    box-shadow: none !important;
}

.pdftopost-download-btn svg {
    width: 16px !important;
    height: 16px !important;
    stroke: black !important;
}

/* ── Page input (scoped to override theme resets) ── */
.pdftopost-page-input-wrap {
    display: flex !important;
    align-items: center !important;
    background: white !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    padding: 4px 8px 4px 0 !important;
    max-width: 120px !important;
    margin: 0 !important;
}

.pdftopost-viewer-toolbar .pdftopost-page-input,
.pdftopost-page-input-wrap .pdftopost-page-input {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 50px !important;
    padding: 4px !important;
    border: none !important;
    border-radius: 4px !important;
    text-align: center !important;
    font-size: 14px !important;
    background: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    height: auto !important;
    line-height: normal !important;
}

.pdftopost-page-input:focus {
    background: #f5f5f5 !important;
}

.pdftopost-page-total {
    color: #666 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}

/* ── Download wrapper + dropdown ── */
.pdftopost-download-wrapper {
    position: relative !important;
    display: inline-block !important;
}

.pdftopost-download-dropdown {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    background: white !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
    min-width: 140px !important;
    z-index: 1001 !important;
    overflow: hidden !important;
    padding: 6px !important;
    animation: pdftopost-fadeDown 0.15s ease-out !important;
    margin: 0 !important;
    list-style: none !important;
    font-family: inherit !important;
}

/* Mobile dropdown opens upward */
.pdftopost-dropdown-up {
    top: auto !important;
    bottom: calc(100% + 8px) !important;
    animation: pdftopost-fadeUp 0.15s ease-out !important;
}

@keyframes pdftopost-fadeDown {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes pdftopost-fadeUp {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

.pdftopost-dropdown-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 10px 14px !important;
    border: none !important;
    background: transparent !important;
    color: #333 !important;
    font-size: 14px !important;
    text-align: left !important;
    cursor: pointer !important;
    border-radius: 8px !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
    line-height: normal !important;
    box-shadow: none !important;
    margin: 0 !important;
    font-weight: 400 !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    outline: none !important;
}

.pdftopost-dropdown-item:hover {
    background: #f5f5f5 !important;
    color: #111 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    border: none !important;
}

.pdftopost-dropdown-item:focus {
    background: #f5f5f5 !important;
    outline: none !important;
    box-shadow: none !important;
}

.pdftopost-dropdown-item:active {
    background: #ebebeb !important;
    transform: scale(0.98) !important;
}

.pdftopost-dropdown-item svg {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
    color: #666 !important;
}

.pdftopost-dropdown-item:hover svg {
    color: #333 !important;
}

/* ── Download gate modal ── */
.pdftopost-download-modal {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 100000 !important;
    /* display is controlled by inline style (JS toggle) — do NOT set display here */
    align-items: center !important;
    justify-content: center !important;
    animation: pdftopost-modalFadeIn 0.2s ease-out !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

@keyframes pdftopost-modalFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.pdftopost-modal-overlay {
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    background: rgba(0,0,0,0.6) !important;
    /* Removed backdrop-filter: blur(4px) — Safari scroll-jank GPU cost.
       Higher alpha (0.6 vs 0.5) compensates for absent blur. */
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.pdftopost-modal-content {
    position: relative !important;
    background: white !important;
    border-radius: 16px !important;
    padding: 32px !important;
    max-width: 400px !important;
    width: 90% !important;
    text-align: center !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15) !important;
    animation: pdftopost-modalSlideUp 0.3s ease-out !important;
    border: none !important;
    margin: 0 !important;
    color: #333 !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
}

@keyframes pdftopost-modalSlideUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.pdftopost-modal-close {
    position: absolute !important;
    top: 12px !important;
    right: 16px !important;
    background: none !important;
    border: none !important;
    font-size: 24px !important;
    color: #999 !important;
    cursor: pointer !important;
    line-height: 1 !important;
    padding: 4px !important;
    border-radius: 50% !important;
    transition: all 0.2s !important;
    margin: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    width: auto !important;
    height: auto !important;
    min-width: auto !important;
}

.pdftopost-modal-close:hover {
    background: #f0f0f0 !important;
    color: #333 !important;
    box-shadow: none !important;
    border: none !important;
}

.pdftopost-modal-close:focus {
    outline: none !important;
    box-shadow: none !important;
}

.pdftopost-modal-close:active {
    background: #e5e5e5 !important;
    transform: scale(0.95) !important;
}

.pdftopost-modal-icon {
    margin-bottom: 16px !important;
}

.pdftopost-modal-content h3,
.pdftopost-modal-heading {
    margin: 0 0 8px !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    padding: 0 !important;
    border: none !important;
    line-height: 1.3 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.pdftopost-modal-content p {
    margin: 0 0 8px !important;
    font-size: 15px !important;
    color: #555 !important;
    line-height: 1.5 !important;
    padding: 0 !important;
    border: none !important;
}

.pdftopost-modal-count {
    margin-bottom: 24px !important;
}

.pdftopost-modal-upload-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 12px 28px !important;
    background: #3ddc97 !important;
    color: black !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    box-shadow: none !important;
    line-height: normal !important;
    margin: 0 !important;
    font-family: inherit !important;
    outline: none !important;
}

.pdftopost-modal-upload-btn:hover {
    background: #35c885 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(61,220,151,0.3) !important;
    color: black !important;
    text-decoration: none !important;
}

.pdftopost-modal-upload-btn:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(61,220,151,0.3) !important;
}

.pdftopost-modal-upload-btn:active {
    background: #2db877 !important;
    transform: translateY(0) !important;
    box-shadow: none !important;
}

.pdftopost-modal-upload-btn svg {
    width: 18px !important;
    height: 18px !important;
}

/* ── Auth modal (login/signup) ── */
.pdftopost-auth-modal {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 100001 !important;
    /* display is controlled by inline style (JS toggle) — do NOT set display here */
    align-items: center !important;
    justify-content: center !important;
    animation: pdftopost-modalFadeIn 0.2s ease-out !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

.pdftopost-auth-content {
    max-width: 380px !important;
    padding: 32px 28px !important;
}

.pdftopost-auth-tab:not(.active) {
    display: none !important;
}

.pdftopost-auth-tab.active {
    display: block !important;
}

.pdftopost-auth-form {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    margin-top: 16px !important;
    padding: 0 !important;
    border: none !important;
}

.pdftopost-auth-form input {
    width: 100% !important;
    padding: 12px 14px !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s !important;
    outline: none !important;
    background: white !important;
    color: #333 !important;
    margin: 0 !important;
    box-shadow: none !important;
    height: auto !important;
    line-height: normal !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.pdftopost-auth-form input:focus {
    border-color: #3ddc97 !important;
    box-shadow: 0 0 0 3px rgba(61,220,151,0.12) !important;
    outline: none !important;
    background: white !important;
}

.pdftopost-auth-form input:hover {
    border-color: #ccc !important;
}

.pdftopost-auth-form input::placeholder {
    color: #999 !important;
    opacity: 1 !important;
}

.pdftopost-auth-submit {
    width: 100% !important;
    padding: 12px !important;
    background: #3ddc97 !important;
    color: black !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    margin-top: 4px !important;
    box-shadow: none !important;
    line-height: normal !important;
    font-family: inherit !important;
    outline: none !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.pdftopost-auth-submit:hover {
    background: #35c885 !important;
    color: black !important;
    box-shadow: 0 2px 8px rgba(61,220,151,0.3) !important;
    transform: translateY(-1px) !important;
}

.pdftopost-auth-submit:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(61,220,151,0.3) !important;
}

.pdftopost-auth-submit:active {
    background: #2db877 !important;
    transform: translateY(0) !important;
    box-shadow: none !important;
}

.pdftopost-auth-submit:disabled {
    opacity: 0.6 !important;
    cursor: wait !important;
    transform: none !important;
    box-shadow: none !important;
}

.pdftopost-auth-error {
    padding: 10px 14px !important;
    background: #fef0f0 !important;
    border: 1px solid #f5c6cb !important;
    border-radius: 8px !important;
    color: #c00 !important;
    font-size: 13px !important;
    margin: 0 !important;
    line-height: 1.5 !important;
    text-align: left !important;
}

.pdftopost-auth-switch {
    margin-top: 16px !important;
    font-size: 14px !important;
    color: #666 !important;
    text-align: center !important;
    padding: 0 !important;
    border: none !important;
}

.pdftopost-auth-switch a {
    color: #3ddc97 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    border: none !important;
    background: none !important;
}

.pdftopost-auth-switch a:hover {
    text-decoration: underline !important;
    color: #35c885 !important;
}

.pdftopost-auth-switch a:focus {
    outline: none !important;
    color: #2db877 !important;
}

/* ── Google sign-in button ── */
.pdftopost-google-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 12px 16px !important;
    background: white !important;
    border: 1px solid #dadce0 !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #3c4043 !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    margin-top: 16px !important;
    font-family: inherit !important;
    box-shadow: none !important;
    line-height: normal !important;
    text-decoration: none !important;
    outline: none !important;
    box-sizing: border-box !important;
    height: auto !important;
}

.pdftopost-google-btn:hover {
    background: #f7f8f8 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
    border-color: #c6c9cd !important;
    color: #3c4043 !important;
    text-decoration: none !important;
}

.pdftopost-google-btn:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(66,133,244,0.2) !important;
    border-color: #4285f4 !important;
}

.pdftopost-google-btn:active {
    background: #f0f1f1 !important;
    box-shadow: none !important;
    transform: scale(0.99) !important;
}

.pdftopost-google-btn svg {
    flex-shrink: 0 !important;
    width: 20px !important;
    height: 20px !important;
}

/* ── "or" divider ── */
.pdftopost-auth-divider {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 16px 0 !important;
    color: #999 !important;
    font-size: 13px !important;
    padding: 0 !important;
    border: none !important;
}

.pdftopost-auth-divider::before,
.pdftopost-auth-divider::after {
    content: '' !important;
    flex: 1 !important;
    height: 1px !important;
    background: #e0e0e0 !important;
    border: none !important;
}

/* ── Icon buttons (hardened against theme resets) ── */
.pdftopost-icon-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border: none !important;
    background: transparent !important;
    color: #666 !important;
    cursor: pointer !important;
    border-radius: 8px !important;
    transition: all 0.2s !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    line-height: 1 !important;
}

.pdftopost-icon-btn:hover {
    background: #f5f5f5 !important;
    color: #333 !important;
}

.pdftopost-icon-btn svg {
    width: 18px !important;
    height: 18px !important;
}

/* ── Desktop: bigger toolbar ── */
@media (min-width: 769px) {
    .pdftopost-viewer-toolbar {
        padding: 10px 12px;
        gap: 12px;
    }

    .pdftopost-download-btn {
        gap: 10px;
        padding: 10px 20px;
        font-size: 16px;
    }

    .pdftopost-download-btn svg {
        width: 18px;
        height: 18px;
    }

    .pdftopost-icon-btn {
        width: 44px;
        height: 44px;
    }

    .pdftopost-icon-btn svg {
        width: 20px;
        height: 20px;
    }

    .pdftopost-page-input {
        width: 45px;
        font-size: 16px;
        padding: 6px;
    }

    .pdftopost-page-total {
        font-size: 16px;
    }

    .pdftopost-page-input-wrap {
        border-radius: 8px;
        padding: 6px 10px 6px 0;
    }
}

/* ── Fix Elementor ancestor overflow that breaks sticky ── */
.elementor-widget-pdftopost_viewer,
.elementor-widget-pdftopost_viewer .elementor-widget-container,
.elementor-element:has(.pdftopost-viewer),
.elementor-section:has(.pdftopost-viewer),
.elementor-container:has(.pdftopost-viewer),
.elementor-column:has(.pdftopost-viewer),
.elementor-column-wrap:has(.pdftopost-viewer),
.elementor-widget-wrap:has(.pdftopost-viewer) {
    overflow: visible !important;
    transform: none !important;
    contain: none !important;
    isolation: auto !important;
}

/* On mobile, prevent Elementor ancestor overflow:visible from causing horizontal scroll */
@media (max-width: 768px) {
    .elementor-widget-pdftopost_viewer,
    .elementor-widget-pdftopost_viewer .elementor-widget-container,
    .elementor-element:has(.pdftopost-viewer),
    .elementor-section:has(.pdftopost-viewer),
    .elementor-container:has(.pdftopost-viewer),
    .elementor-column:has(.pdftopost-viewer),
    .elementor-column-wrap:has(.pdftopost-viewer),
    .elementor-widget-wrap:has(.pdftopost-viewer) {
        overflow-x: hidden !important;
    }
}

/* ── Scroll wrapper — clips horizontal overflow, JS syncs with sticky scrollbar ── */
.pdftopost-viewer-scroll {
    width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
}

/* ── Pages container (matches .pdf-pages-container) ── */
.pdftopost-pages-container {
    max-width: none !important;
    min-width: 0;
    height: auto;
    margin: 0 auto;
    padding-top: 8px;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    background: transparent !important;
    gap: 20px;
    transform-origin: top center;
    /* Removed will-change: transform — causes excessive GPU memory on iOS Safari,
       leading to stuttering/lag during scroll. Each .pf uses contain instead. */
    box-sizing: border-box;
    text-align: center;
    overflow-y: visible;
    overflow-x: visible;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
}

/* ── Scaling: per-page CSS variables (--base-scale, --pw, --ph) are set inline
   by PHP (SSR) and refined by JS. --zoom is inherited from .pdftopost-viewer.
   Pages render scaled on first paint — no visibility toggling, zero CLS. ── */

/* ── .pf — pdf2htmlEX page elements ── */
/* Per-page scaling via inline CSS custom properties set by PHP (SSR) and JS (lazy):
     --base-scale : fit-to-container ratio (unique per page width class)
     --zoom       : user zoom multiplier (inherited from .pdftopost-viewer, default 1)
     --pw / --ph  : page natural width / height in px (unique per page)
   The product --base-scale * --zoom gives the effective scale. */
.pdftopost-pages-container .pf {
    background: white !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    /* Divide border-radius by scale so it stays visually ~8px after transform */
    border-radius: calc(8px / (var(--base-scale, 1) * var(--zoom, 1))) !important;
    transform: scale(calc(var(--base-scale, 1) * var(--zoom, 1)));
    transform-origin: top center;
    /* Collapse vertical gap left by transform shrinking the visual height */
    margin-bottom: calc(-1px * var(--ph, 792) * (1 - var(--base-scale, 1) * var(--zoom, 1))) !important;
    /* Centre using per-page width — margin:auto collapses for overflowing items,
       this calc never does. */
    margin-left: calc(50% - 0.5px * var(--pw, 612)) !important;
    margin-right: calc(50% - 0.5px * var(--pw, 612)) !important;
    margin-top: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
    position: static !important;
    box-sizing: border-box !important;
    /* Isolate each page for rendering — prevents Safari from re-laying-out
       ALL pages on every scroll frame. Massive iOS Safari perf win. */
    contain: layout style paint !important;
    /* Removed: content-visibility: auto — caused white-flash on scroll
       in Safari (macOS + iOS) on re-paint. `contain: layout style paint`
       above is sufficient for render isolation without the side-effect. */
    /* Prevent iOS from auto-enlarging small text — essential for pdf2htmlEX positioning.
       Must be 'none' (not '100%') — Chrome iOS ignores '100%' on zoomed elements. */
    -webkit-text-size-adjust: none !important;
    -moz-text-size-adjust: none !important;
    text-size-adjust: none !important;
}

/* Force ALL descendants inside pdf2htmlEX pages to disable text inflation.
   Chrome iOS WebKit applies inflation per-element — a selector on .pf alone
   is not inherited by deeply nested spans inside .t divs. The wildcard is essential. */
.pdftopost-pages-container .pf * {
    -webkit-text-size-adjust: none !important;
    text-size-adjust: none !important;
}

/* Explicit on text/content elements for specificity against pdf2htmlEX's own styles */
.pdftopost-pages-container .t,
.pdftopost-pages-container .c,
.pdftopost-pages-container .t span,
.pdftopost-pages-container .c span {
    -webkit-text-size-adjust: none !important;
    text-size-adjust: none !important;
}

/* Loaded page gets subtle shadow */
.pdftopost-pages-container .pdftopost-page-loaded {
    box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
}

/* Placeholder pages (before content loads) */
.pdftopost-placeholder-page {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ccc;
    font-size: 14px;
}

.pdftopost-placeholder-page::after {
    content: '';
    width: 30px;
    height: 30px;
    border: 3px solid #e0e0e0;
    border-top-color: #999;
    border-radius: 50%;
    animation: pdftopost-spin 0.8s linear infinite;
}

/* ── Text layer — selectable text (matches .t rules from PDFViewer.scss) ── */
.pdftopost-pages-container .t {
    user-select: text !important;
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
}

/* ── Text selection highlights (matches PDFViewer.scss) ── */
.pdftopost-pages-container .text-selection-highlight,
.pdftopost-pages-container mark.text-selection-highlight {
    background-color: rgba(255, 255, 0, 0.6) !important;
    background: rgba(255, 255, 0, 0.6) !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    padding: 2px 0 !important;
    border-radius: 2px !important;
    display: inline !important;
    position: relative !important;
    z-index: 3 !important;
    cursor: pointer;
}

.pdftopost-pages-container .t .text-selection-highlight,
.pdftopost-pages-container .t mark.text-selection-highlight {
    background-color: rgba(255, 255, 0, 0.6) !important;
    background: rgba(255, 255, 0, 0.6) !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    display: inline !important;
    position: relative !important;
    z-index: 3 !important;
}

/* ── iframe handling inside pages (YouTube etc.) ── */
.pdftopost-pages-container .pf iframe {
    max-width: 100%;
    aspect-ratio: 16/9;
}

/* ── Loading overlay ── */
.pdftopost-viewer-loading {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(247, 248, 249, 0.95);
    z-index: 20;
    gap: 12px;
    color: #666;
    font-size: 14px;
}

.pdftopost-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #e0e0e0;
    border-top-color: #0073aa;
    border-radius: 50%;
    animation: pdftopost-spin 0.8s linear infinite;
}

@keyframes pdftopost-spin {
    to { transform: rotate(360deg); }
}

/* ── Error state ── */
.pdftopost-viewer-error {
    padding: 20px;
    text-align: center;
    color: #c00;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

/* ── Elementor editor placeholder ── */
.pdftopost-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    background: #f9f9f9;
    color: #999;
    font-size: 14px;
    padding: 20px;
    text-align: center;
}

/* ── Responsive (matches PDFViewer.scss media queries) ── */
@media (max-width: 768px) {
    .pdftopost-viewer-toolbar {
        padding: 6px 10px;
        gap: 4px;
    }

    .pdftopost-pages-container {
        gap: 10px;
        width: 100vw !important;
        max-width: 100% !important;
        overflow-x: hidden;
    }

    .pdftopost-pages-container .pf {
        border: 1px solid rgba(0,0,0,0.12) !important;
        border-radius: calc(8px / (var(--base-scale, 1) * var(--zoom, 1))) !important;
        box-shadow: none !important;
        /* Centering handled by the main rule's calc(50% - ...) formula */
    }

    .pdftopost-pages-container .pdftopost-page-loaded {
        box-shadow: none !important;
    }
}

@media (max-width: 480px) {
    .pdftopost-pages-container {
        gap: 8px;
    }
}

/* ═══════════════════════════════════════════════════════════════
   Mobile Bottom Toolbar (matches MobileToolbar.scss)
   ═══════════════════════════════════════════════════════════════ */

/* Hidden on desktop */
.pdftopost-mobile-toolbar {
    display: none;
}

/* Desktop toolbar hidden on mobile */
@media (max-width: 768px) {
    .pdftopost-toolbar-container {
        display: none !important;
    }

    .pdftopost-mobile-toolbar {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        display: flex !important;
        flex-direction: column;
        background: white !important;
        border-top: 1px solid #e0e0e0;
        box-shadow: 0 -1px 3px rgba(0,0,0,0.05);
        z-index: 99999 !important;
        padding: 8px 16px;
        padding-bottom: calc(8px + env(safe-area-inset-bottom));
        box-sizing: border-box;
        width: 100% !important;
        min-height: 68px;
        gap: 8px;
        animation: pdftopost-slideUp 0.6s ease-out;
    }

    /* No bottom padding on mobile — toolbar overlay is acceptable per design */
    .pdftopost-pages-container {
        padding-bottom: 0 !important;
    }
}

@keyframes pdftopost-slideUp {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* Top row: horizontally scrollable text buttons */
.pdftopost-mobile-top-row {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    padding-bottom: 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
}

.pdftopost-mobile-top-row::-webkit-scrollbar {
    display: none;
}

/* Text buttons (hardened) */
.pdftopost-mobile-text-btn {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 12px !important;
    background: white !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    color: #333 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    line-height: normal !important;
    height: auto !important;
    min-width: auto !important;
    box-shadow: none !important;
    margin: 0 !important;
}

.pdftopost-mobile-text-btn svg {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
}

.pdftopost-mobile-text-btn:active {
    background: #f5f5f5 !important;
    transform: scale(0.98) !important;
}

/* Bottom row */
.pdftopost-mobile-bottom-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
}

.pdftopost-mobile-left {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* Page navigation */
.pdftopost-mobile-page-wrap {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

/* Mobile page input (hardened) */
.pdftopost-mobile-page-input-wrap {
    display: flex !important;
    align-items: center !important;
    background: white !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    padding: 4px 8px 4px 0 !important;
    max-width: 100px !important;
    margin: 0 !important;
}

.pdftopost-mobile-toolbar .pdftopost-mobile-page-input,
.pdftopost-mobile-page-input-wrap .pdftopost-mobile-page-input {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 44px !important;
    padding: 6px 4px !important;
    border: none !important;
    border-radius: 4px !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    background: transparent !important;
    outline: none !important;
    color: #333 !important;
    box-shadow: none !important;
    margin: 0 !important;
    height: auto !important;
    line-height: normal !important;
}

.pdftopost-mobile-page-input:focus {
    background: #f5f5f5 !important;
}

.pdftopost-mobile-page-total {
    color: #666 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}

/* Mobile icon buttons (hardened) */
.pdftopost-mobile-icon-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f8fbff !important;
    border: none !important;
    border-radius: 8px !important;
    color: #333 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    line-height: 1 !important;
}

.pdftopost-mobile-icon-btn svg {
    width: 18px !important;
    height: 18px !important;
}

.pdftopost-mobile-icon-btn:active {
    background: #f0f7ff !important;
    transform: scale(0.95) !important;
}

/* Mobile download button (hardened) */
.pdftopost-mobile-download-btn {
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 6px 16px !important;
    background: #3ddc97 !important;
    border: none !important;
    border-radius: 8px !important;
    color: black !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 4px rgba(61,220,151,0.3) !important;
    white-space: nowrap !important;
    margin: 0 !important;
    line-height: normal !important;
}

.pdftopost-mobile-download-btn svg {
    width: 16px !important;
    height: 16px !important;
    stroke: black !important;
}

.pdftopost-mobile-download-btn:hover {
    color: black !important;
    text-decoration: none !important;
}

.pdftopost-mobile-download-btn:active {
    transform: scale(0.98) !important;
}

/* ── Mobile 3-dots "more" menu (Upvote/Downvote/Share/Report/Print/Embed) ── */
.pdftopost-mobile-more-wrap {
    position: relative !important;
    display: inline-block !important;
}

.pdftopost-mobile-more-btn {
    background: #f8fbff !important;
    border: none !important;
    padding: 8px 12px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    color: #1f2937 !important;
    border-radius: 8px !important;
}

.pdftopost-mobile-more-btn svg {
    color: #1f2937 !important;
    margin: 0 !important;
}

.pdftopost-mobile-more-wrap.is-open .pdftopost-mobile-more-btn {
    background: #eef4fc !important;
}

/* Share submenu — single panel visible at a time */
.pdftopost-mobile-more-panel[hidden] {
    display: none !important;
}

.pdftopost-mobile-share-back {
    color: #6b7280 !important;
    font-size: 13px !important;
    border-bottom: 1px solid #f3f4f6 !important;
    margin-bottom: 4px !important;
}

.pdftopost-mobile-more-dropdown {
    position: absolute !important;
    bottom: calc(100% + 8px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    min-width: 180px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18) !important;
    padding: 6px !important;
    z-index: 1000 !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
}

.pdftopost-mobile-more-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 10px 12px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    color: #1f2937 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-align: left !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
    box-shadow: none !important;
    margin: 0 !important;
    line-height: normal !important;
    height: auto !important;
    min-width: 0 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.pdftopost-mobile-more-item:hover,
.pdftopost-mobile-more-item:focus {
    background: #f3f4f6 !important;
    outline: none !important;
}

.pdftopost-mobile-more-item svg {
    flex-shrink: 0 !important;
    color: #6b7280 !important;
    width: 16px !important;
    height: 16px !important;
}

/* ── Post title above viewer ── */
.pdftopost-viewer-title {
    font-size: 24px;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 16px;
    padding: 0;
    line-height: 1.3;
}

@media (max-width: 768px) {
    .pdftopost-viewer-title {
        font-size: 18px;
        margin-bottom: 12px;
    }
}

/* ═══════════════════════════════════════════════════════════════
   External Link Confirmation Modal
   ═══════════════════════════════════════════════════════════════ */

.pdftopost-extlink-modal {
    position: fixed !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    z-index: 100000 !important;
    /* display is controlled by JS (dynamically created/removed) — do NOT set display here */
    align-items: center !important;
    justify-content: center !important;
    animation: pdftopost-modalFadeIn 0.2s ease-out !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* Scribd-style left-aligned modal content */
.pdftopost-extlink-content {
    text-align: left !important;
    padding: 28px 32px !important;
    max-width: 420px !important;
    overflow: hidden !important;
}

.pdftopost-extlink-heading {
    margin: 0 0 20px !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    line-height: 1.3 !important;
    padding: 0 !important;
    border: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    text-align: left !important;
}

.pdftopost-extlink-desc {
    margin: 0 0 20px !important;
    font-size: 15px !important;
    color: #333 !important;
    line-height: 1.6 !important;
    padding: 0 !important;
    border: none !important;
    text-align: left !important;
}

.pdftopost-extlink-continue {
    display: inline !important;
    color: #1a1a1a !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    transition: color 0.2s !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 0 4px !important;
    line-height: 1.6 !important;
    font-family: inherit !important;
    outline: none !important;
    box-shadow: none !important;
    word-break: break-all !important;
}

.pdftopost-extlink-continue:hover {
    color: #555 !important;
    text-decoration: underline !important;
    background: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.pdftopost-extlink-continue:focus {
    outline: none !important;
    color: #333 !important;
    box-shadow: none !important;
}

.pdftopost-extlink-continue:active {
    color: #000 !important;
    background: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.pdftopost-extlink-actions {
    display: flex !important;
    margin-top: 28px !important;
    padding: 0 !important;
    border: none !important;
    gap: 0 !important;
}

.pdftopost-extlink-cancel {
    width: 100% !important;
    padding: 14px 24px !important;
    background: #3ddc97 !important;
    border: none !important;
    border-radius: 28px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: black !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    text-decoration: none !important;
    box-shadow: none !important;
    line-height: normal !important;
    font-family: inherit !important;
    outline: none !important;
    margin: 0 !important;
    text-align: center !important;
}

.pdftopost-extlink-cancel:hover {
    background: #35c885 !important;
    color: black !important;
    box-shadow: 0 2px 8px rgba(61,220,151,0.3) !important;
    transform: translateY(-1px) !important;
}

.pdftopost-extlink-cancel:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(61,220,151,0.3) !important;
}

.pdftopost-extlink-cancel:active {
    background: #2db877 !important;
    transform: scale(0.98) !important;
    box-shadow: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   Page Thumbnails Sidebar (pdf.js-style)
   ═══════════════════════════════════════════════════════════════════════ */

/* Desktop toolbar sidebar toggle (icon-only) — NOT the mobile variant */
.pdftopost-toolbar-left .pdftopost-sidebar-toggle:not(.pdftopost-sidebar-toggle-m) {
    background: transparent !important;
    border: none !important;
    color: inherit !important;
    cursor: pointer !important;
    padding: 6px !important;
    border-radius: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background-color 0.15s ease !important;
}

.pdftopost-toolbar-left .pdftopost-sidebar-toggle:not(.pdftopost-sidebar-toggle-m):hover {
    background: rgba(0, 0, 0, 0.06) !important;
}

.pdftopost-viewer.pdftopost-sidebar-open .pdftopost-toolbar-left .pdftopost-sidebar-toggle:not(.pdftopost-sidebar-toggle-m) {
    background: rgba(61, 220, 151, 0.18) !important;
    color: #1a8f5f !important;
}

/* Scroll area must be positioning context so the sidebar stays inside it */
.pdftopost-viewer-scroll {
    position: relative;
}

/* Sidebar panel — lives inside the scroll area, below the toolbar.
   White theme, slides in from the left with a smooth transform animation. */
/* The anchor is now a passive zero-size wrapper — it no longer drives the
   sticky behaviour. The sidebar itself uses position:fixed so it pins to
   the viewport just below the toolbar (matching toolbar behaviour). */
.pdftopost-sidebar-anchor {
    position: static !important;
    height: 0 !important;
    width: 0 !important;
}

/* Sidebar: fixed to the viewport so it always sits just below the toolbar,
   tracking it on scroll. JS writes --pdftopost-sidebar-top (= toolbar's
   bottom edge) and --pdftopost-sidebar-left (= viewer's left edge) on
   init / resize / scroll. */
.pdftopost-sidebar {
    position: fixed !important;
    top: var(--pdftopost-sidebar-top, 72px) !important;
    left: var(--pdftopost-sidebar-left, 0px) !important;
    width: 200px !important;
    max-width: 80vw !important;
    height: calc(100vh - var(--pdftopost-sidebar-top, 72px) - 8px) !important;
    max-height: calc(100vh - var(--pdftopost-sidebar-top, 72px) - 8px) !important;
    z-index: 999 !important; /* just below the toolbar's 1000 */
    background: #ffffff !important;
    color: #1f2328 !important;
    transform: translateX(-105%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition:
        transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.28s ease,
        visibility 0s linear 0.28s;
    display: flex !important;
    flex-direction: column !important;
    box-shadow: none !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    overflow: hidden !important;
}

/* Top/left/height are all driven by CSS vars written by JS from the
   toolbar's actual position — no admin-bar or fullscreen overrides
   needed here (the toolbar's bottom already reflects both). */

.pdftopost-viewer.pdftopost-sidebar-open .pdftopost-sidebar {
    transform: translateX(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition:
        transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.28s ease,
        visibility 0s linear 0s;
}

.pdftopost-sidebar-header {
    display: flex !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    padding: 0 10px !important;
    border-bottom: 1px solid #e5e7eb !important;
    background: #f9fafb !important;
    flex-shrink: 0 !important;
}

.pdftopost-sidebar-tabs {
    display: flex !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.pdftopost-sidebar-tab {
    flex: 1 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    border-bottom: 1px solid transparent !important;
    padding: 12px 14px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #4b5563 !important;
    cursor: pointer !important;
    transition: font-weight 0.15s ease, border-color 0.15s ease !important;
    text-align: center !important;
}

.pdftopost-sidebar-tab:hover {
    color: #111827 !important;
    background: transparent !important;
}

/* Active tab: keep same color as inactive, only bump the weight and
   show a thin 1px underline. No background, no box-shadow. */
.pdftopost-sidebar-tab.is-active,
.pdftopost-sidebar-tab[aria-selected="true"] {
    color: #4b5563 !important;
    background: transparent !important;
    font-weight: 700 !important;
    border-bottom: 1px solid #4b5563 !important;
    box-shadow: none !important;
}

.pdftopost-sidebar-tab:active {
    background: transparent !important;
    color: #4b5563 !important;
}

.pdftopost-sidebar-tab:focus-visible {
    outline: 1px solid #9ca3af !important;
    outline-offset: -1px !important;
}

/* When there's only the single Pages tab, make the header look like a plain title */
.pdftopost-sidebar:not(.pdftopost-sidebar--has-toc) .pdftopost-sidebar-tab {
    cursor: default !important;
    color: #4b5563 !important;
    border-bottom-color: transparent !important;
    text-align: left !important;
    padding-left: 14px !important;
    box-shadow: none !important;
}

.pdftopost-sidebar-close {
    background: transparent !important;
    color: #4b5563 !important;
    border: none !important;
    font-size: 22px !important;
    line-height: 1 !important;
    padding: 0 12px !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
    flex-shrink: 0 !important;
    align-self: stretch !important;
}

.pdftopost-sidebar-close:hover {
    background: #f3f4f6 !important;
    color: #111827 !important;
}

/* Panels wrapper — takes remaining height; only ONE child scrolls at a time */
.pdftopost-sidebar-panels {
    flex: 1 !important;
    position: relative !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

/* ⚠️ CRITICAL — DO NOT MOVE overflow-y TO .pdftopost-sidebar-list
 *
 * .pdftopost-sidebar-panel is the IntersectionObserver root for thumb
 * lazy-loading (see ensureThumbObserver in pdf-viewer.js). IO roots must
 * be the actual scroll container — that's the element with overflow-y.
 *
 * If overflow is moved down to .pdftopost-sidebar-list:
 *   → IO root has no scroll clipping (the list expands to fit all thumbs)
 *   → every thumb reports as intersecting on the first rAF
 *   → all N thumbs (can be 240+) kick off loadThumbBatch simultaneously
 *   → N simultaneous fetch() calls for page{i}.html
 *   → browser connection queue saturates, main page loads stall
 *
 * The full height chain that makes this work:
 *   .pdftopost-sidebar          height: calc(100vh - …)           ← outer bound
 *   .pdftopost-sidebar-panels   flex: 1; min-height: 0             ← flex shrink allowed
 *   .pdftopost-sidebar-panel    height: 100%; overflow-y: scroll   ← THE scrollport + IO root
 *   .pdftopost-sidebar-list     no overflow rules                  ← just grows inside panel
 *
 * `min-height: 0` on .pdftopost-sidebar-panels is load-bearing. Deleting
 * it causes flex children to refuse shrinking below their content size,
 * the panel stops clipping, and IO falls back to the viewport — same
 * silent 240-fetch failure.
 *
 * ensureThumbObserver() also runtime-asserts getComputedStyle(panel).overflowY
 * to catch regressions in dev; that assertion depends on the rule below.
 */
.pdftopost-sidebar-panel {
    display: none !important;
    height: 100% !important;
    overflow-y: scroll !important;
    overflow-x: hidden !important;
    background: #ffffff !important;
    scrollbar-width: thin !important;
    scrollbar-color: #94a3b8 #f1f5f9 !important;
    scrollbar-gutter: stable !important;
}

.pdftopost-sidebar-panel.is-active {
    display: block !important;
}

.pdftopost-sidebar-panel::-webkit-scrollbar {
    width: 10px !important;
}

.pdftopost-sidebar-panel::-webkit-scrollbar-track {
    background: #f1f5f9 !important;
}

.pdftopost-sidebar-panel::-webkit-scrollbar-thumb {
    background: #94a3b8 !important;
    border-radius: 4px !important;
    border: 2px solid #f1f5f9 !important;
}

.pdftopost-sidebar-panel::-webkit-scrollbar-thumb:hover {
    background: #64748b !important;
}

/* Chrome-PDF-viewer-style thumbnails list: centered column, generous gap,
   minimal chrome on each thumbnail. */
.pdftopost-sidebar-list {
    padding: 16px 12px 24px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    text-align: center !important;
}

/* Outline / Table of Contents */
.pdftopost-sidebar-outline {
    padding: 10px 14px 16px !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    color: #1f2328 !important;
}

.pdftopost-sidebar-outline ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.pdftopost-sidebar-outline li {
    margin: 0 !important;
}

.pdftopost-sidebar-outline ul ul {
    padding-left: 14px !important;
    border-left: 1px solid #e5e7eb !important;
    margin-left: 6px !important;
}

.pdftopost-sidebar-outline a {
    display: block !important;
    padding: 6px 8px !important;
    color: #1f2328 !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
    word-break: break-word !important;
}

.pdftopost-sidebar-outline a:hover {
    background: #f3f4f6 !important;
    color: #1d4ed8 !important;
}

.pdftopost-sidebar-outline a.is-active {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    font-weight: 600 !important;
}

/* Each thumbnail — mirrors Chrome's built-in PDF viewer:
   fixed-size image (~108x140), page number below, blue outline on active. */
.pdftopost-sidebar-thumb {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
    outline: none !important;
    transition: transform 0.12s ease !important;
}

.pdftopost-sidebar-thumb:hover {
    background: rgba(26, 115, 232, 0.08) !important;
    border-radius: 4px !important;
}

.pdftopost-sidebar-thumb:hover .pdftopost-sidebar-thumb-img {
    outline: 2px solid #8ab4f8 !important;
    outline-offset: 0 !important;
}

/* Momentary press feedback — fires during mousedown/touch, so the user
   gets instant visual ack before the :is-active class is applied. */
.pdftopost-sidebar-thumb:active {
    background: rgba(26, 115, 232, 0.22) !important;
    border-radius: 4px !important;
    transform: scale(0.98) !important;
}

/* Selected state — applied by updateSidebarActive() to whichever thumb
   corresponds to the current page in the main viewer. */
.pdftopost-sidebar-thumb.is-active {
    background: rgba(26, 115, 232, 0.18) !important;
    border-radius: 4px !important;
}

.pdftopost-sidebar-thumb.is-active .pdftopost-sidebar-thumb-img {
    outline: 3px solid #1a73e8 !important;
    outline-offset: 0 !important;
    box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.25) !important;
}

/* Tinted blue wash ACROSS the mini-page preview so the "currently open
   page" is unmistakable in a long list of look-alike thumbs. */
.pdftopost-sidebar-thumb.is-active .pdftopost-sidebar-thumb-img::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: rgba(26, 115, 232, 0.15) !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.pdftopost-sidebar-thumb.is-active .pdftopost-sidebar-thumb-num {
    color: #1a73e8 !important;
    font-weight: 700 !important;
}

.pdftopost-sidebar-thumb:focus-visible .pdftopost-sidebar-thumb-img {
    outline: 2px solid #1a73e8 !important;
    outline-offset: 2px !important;
}

.pdftopost-sidebar-thumb-img {
    display: block !important;
    position: relative !important; /* anchor the loading spinner */
    width: 108px !important;
    height: 140px !important;
    background: #ffffff !important;
    border: 1px solid #dadce0 !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

.pdftopost-sidebar-thumb-img img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: #fff !important;
}

/* Container that receives the real page{n}.html .pf element, injected
   by pdf-viewer.js. The injected .pf carries its own inline --base-scale
   sized to fit this 108x140 box; we just anchor it to the top-left and
   hide overflow (pages aren't always the same aspect ratio as the box). */
.pdftopost-sidebar-thumb-scaler {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    background: #fff !important;
    pointer-events: none !important; /* parent button handles clicks */
}

/* Reproduce the main viewer's .pf scale transform inside sidebar thumbs.
   The main rule is scoped to `.pdftopost-pages-container .pf`, so without
   this sibling block the injected mini-page would render at its native
   612x792 — no scaling, no styling visible in the 108x140 thumb box.
   We use --zoom:1 (thumb zoom is fixed) and the JS-set --base-scale. */
.pdftopost-sidebar-thumb-scaler .pf {
    background: white !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    /* Transform to the JS-computed fit ratio. --zoom stays 1 so the
       main viewer's user zoom doesn't affect the thumbs. */
    transform: scale(var(--base-scale, 0.18)) !important;
    transform-origin: top left !important;
    margin: 0 !important;
    /* Lock paint/layout per thumb — prevents a scroll inside the list
       from re-laying-out every mini-page. */
    contain: layout style paint !important;
}

/* Hide any internal page scrollbar / link affordance inside the mini. */
.pdftopost-sidebar-thumb-scaler .pf a {
    pointer-events: none !important;
    cursor: default !important;
}

/* Loading spinner shown while a batch-of-5 thumb is fetching its
   bg{n}.jpg. Class is toggled from pdf-viewer.js on batch start/end. */
.pdftopost-sidebar-thumb.is-loading .pdftopost-sidebar-thumb-img::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 22px !important;
    height: 22px !important;
    margin: -11px 0 0 -11px !important;
    border: 2px solid #e0e0e0 !important;
    border-top-color: #1a73e8 !important;
    border-radius: 50% !important;
    animation: pdftopost-spin 0.8s linear infinite !important;
    pointer-events: none !important;
}

.pdftopost-sidebar-thumb-num {
    font-size: 12px !important;
    color: #5f6368 !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    margin-top: 2px !important;
}

/* Backdrop removed — no dimming overlay on pages when the sidebar opens.
   Kept as an invisible element so the close-on-tap behavior can still be
   wired to it on mobile if needed; it does NOT tint pages. */
.pdftopost-sidebar-backdrop {
    display: none !important;
}

/* Hide mobile sidebar toggle on desktop */
.pdftopost-sidebar-toggle-m {
    display: none !important;
}

@media (max-width: 768px) {
    .pdftopost-sidebar {
        /* On mobile, use a proper full-height drawer */
        width: 240px !important;
        height: calc(100vh - 20px) !important;
        max-height: calc(100vh - 20px) !important;
        top: 10px !important;
        border-radius: 0 6px 6px 0 !important;
    }
    /* Show mobile toggle, hide desktop toggle on small screens */
    .pdftopost-sidebar-toggle-m {
        display: inline-flex !important;
    }
}