.pr-flipbook { width:100%; max-width:900px; margin:auto; overflow:hidden; }
.pr-page { display:none; }
.pr-page.active { display:block; animation:flip 0.35s ease; }
@keyframes flip{ from{opacity:0; transform:rotateY(90deg);} to{opacity:1; transform:rotateY(0);} }
.pr-page img { width:100%; border-radius:6px; }

.pr-controls, .pr-controls-top { text-align:center; margin:10px; }
.pr-btn, .pr-small-btn {
    padding:6px 12px; background:#333; color:#fff; border-radius:6px;
    margin:4px; cursor:pointer; user-select:none;
}

.pr-dark-mode { filter: invert(1) hue-rotate(180deg); }

.pr-index-panel {
    display:none;
    background:#fff;
    border:1px solid #ccc;
    padding:10px;
    max-width:300px;
    margin:10px auto;
}
.pr-index-item { padding:6px; border-bottom:1px solid #ddd; cursor:pointer; }
.pr-index-item:hover { background:#f0f0f0; }