.tfb{--ink:#292929;width:100%;max-width:1600px;margin:auto;box-sizing:border-box;color:var(--ink);font:14px/1.4 Arial,sans-serif;outline-offset:4px}.tfb *{box-sizing:border-box}.tfb-stage{background:#f2f1ef;border:1px solid #dedbd7;border-radius:14px;padding:24px;overflow:auto;display:flex;align-items:center;justify-content:center;min-height:280px}.tfb-book{display:flex;justify-content:center;width:min(100%,calc((100vh - 210px)*2));perspective:2000px;align-items:center}.tfb-page{display:block;width:50%;aspect-ratio:var(--page-ratio,1);object-fit:contain;box-shadow:0 12px 28px #0002;cursor:zoom-in;background:white}.tfb-book.single{width:min(100%,calc(100vh - 210px))}.tfb-book.single .tfb-page{width:100%}.tfb-book.turn-next{animation:tfbnext .32s ease}.tfb-book.turn-prev{animation:tfbprev .32s ease}.tfb-tools{display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;padding:16px 0 0}.tfb-tools button{font:inherit;color:#292929;background:#fff;border:1px solid #d6d3cf;border-radius:8px;padding:9px 15px;cursor:pointer;min-height:40px}.tfb-tools button:hover{background:#eee}.tfb-tools button:disabled{opacity:.35;cursor:default}.tfb-status{min-width:95px;text-align:center;font-variant-numeric:tabular-nums}.tfb-divider{width:1px;height:24px;background:#ddd}.tfb-hint{text-align:center;color:#777;font-size:12px;margin:12px 0}.tfb.zoomed .tfb-stage{justify-content:flex-start;align-items:flex-start;max-height:80vh}.tfb.zoomed .tfb-book{width:2200px;min-width:2200px;margin:auto}.tfb.zoomed .tfb-book.single{width:1400px;min-width:1400px}.tfb.zoomed .tfb-page{cursor:zoom-out}.tfb:fullscreen,.tfb.full-fallback{background:#f2f1ef;padding:16px;max-width:none;display:flex;flex-direction:column;height:100vh}.tfb:fullscreen .tfb-stage,.tfb.full-fallback .tfb-stage{flex:1;min-height:0}.tfb:fullscreen .tfb-book,.tfb.full-fallback .tfb-book{width:min(100%,calc((100vh - 130px)*2))}.tfb:fullscreen .tfb-book.single,.tfb.full-fallback .tfb-book.single{width:min(100%,calc(100vh - 130px))}.tfb.full-fallback{position:fixed;inset:0;z-index:999999}.tfb:fullscreen.zoomed .tfb-book,.tfb.full-fallback.zoomed .tfb-book{width:2200px}.tfb:fullscreen.zoomed .tfb-book.single,.tfb.full-fallback.zoomed .tfb-book.single{width:1400px}@keyframes tfbnext{from{opacity:.65;transform:rotateY(-7deg)}to{opacity:1;transform:rotateY(0)}}@keyframes tfbprev{from{opacity:.65;transform:rotateY(7deg)}to{opacity:1;transform:rotateY(0)}}@media(max-width:700px){.tfb-stage{padding:10px;min-height:0}.tfb-book,.tfb-book.single{width:100%}.tfb-page{width:100%}.tfb-tools{gap:8px}.tfb-tools button{padding:9px 12px}.tfb-divider{display:none}}@media(prefers-reduced-motion:reduce){.tfb-book{animation:none!important}}

/* Keep closed covers at the same dimensions as individual spread pages. */
.tfb-book{position:relative;transform-style:preserve-3d}
.tfb-book.single{width:min(100%,calc((100vh - 210px)*2));justify-content:flex-end}
.tfb-book.single .tfb-page{width:50%}
.tfb-book.single.last{justify-content:flex-start}
.tfb:fullscreen .tfb-book.single,.tfb.full-fallback .tfb-book.single{width:min(100%,calc((100vh - 130px)*2))}
.tfb.zoomed .tfb-book.single,.tfb:fullscreen.zoomed .tfb-book.single,.tfb.full-fallback.zoomed .tfb-book.single{width:2200px;min-width:2200px}
.tfb-leaf{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;z-index:3;pointer-events:none;animation:tfb-flip-forward .7s cubic-bezier(.35,.05,.2,1) forwards}
.tfb-leaf.reverse{left:0;transform-origin:right center;animation-name:tfb-flip-backward}
.tfb-leaf img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:white;backface-visibility:hidden;box-shadow:0 8px 24px #0003}
.tfb-leaf .tfb-leaf-back{transform:rotateY(180deg)}
@keyframes tfb-flip-forward{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}
@keyframes tfb-flip-backward{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}
@media(max-width:700px){.tfb-book.single,.tfb-book.single .tfb-page{width:100%}.tfb-leaf,.tfb-leaf.reverse{left:0;width:100%}.tfb:fullscreen .tfb-book.single,.tfb.full-fallback .tfb-book.single{width:min(100%,calc(100vh - 130px))}.tfb.zoomed .tfb-book.single{width:1400px;min-width:1400px}}
@media(prefers-reduced-motion:reduce){.tfb-leaf{animation:none!important;display:none}}

.tfb{--page-ratio:1}.tfb-book,.tfb-book.single{width:min(100%,calc((100vh - 210px)*2*var(--page-ratio)))}
.tfb:fullscreen .tfb-book,.tfb.full-fallback .tfb-book{width:min(100%,calc((100vh - 130px)*2*var(--page-ratio)))}
@media(max-width:700px){.tfb-book,.tfb-book.single{width:100%}.tfb:fullscreen .tfb-book,.tfb.full-fallback .tfb-book{width:min(100%,calc((100vh - 130px)*var(--page-ratio)))}}

/* Landscape brand guidelines: one centered slide at a time. */
.tfb-slides .tfb-book,.tfb-slides .tfb-book.single{width:100%;justify-content:center;perspective:none;transform-style:flat}
.tfb-slides .tfb-page,.tfb-slides .tfb-book.single .tfb-page{width:100%;aspect-ratio:var(--page-ratio);box-shadow:0 8px 24px #0002}
.tfb-slides .tfb-stage{overflow:hidden}
.tfb-slides.zoomed .tfb-stage{overflow:auto}
.tfb-slides:fullscreen .tfb-book,.tfb-slides.full-fallback .tfb-book{width:min(100%,calc((100vh - 160px)*var(--page-ratio)))}
.tfb-slides.zoomed .tfb-book,.tfb-slides.zoomed .tfb-book.single{width:2200px;min-width:2200px;justify-content:center}
