html,body{margin:0;min-height:100%;background:#17281f;color:#f2e7c6}
/* Folding leaves may extend beyond the viewport without resizing the reader. */
html{height:100%;overflow:hidden}
body{height:100dvh;padding:88px 12px 12px;overflow:hidden}
.viewer{position:fixed;z-index:10000;top:0;left:0;right:0;display:flex;gap:9px;flex-wrap:wrap;align-items:center;justify-content:center;background:#14251cf5;box-shadow:0 2px 18px #0005;padding:12px;font:14px Arial,sans-serif;min-height:64px}
.viewer button,.viewer a{border:1px solid #ad925b;border-radius:5px;padding:8px 14px;background:#254530;color:#fff;text-decoration:none;cursor:pointer;touch-action:manipulation}
.viewer button:disabled{opacity:.4;cursor:default}
.viewer button:focus-visible,.viewer a:focus-visible,.viewer input:focus-visible{outline:2px solid #ebcf87;outline-offset:3px}
.viewer input{width:58px;padding:7px;border:1px solid #ad925b;border-radius:3px;font:inherit}
.viewer label{white-space:nowrap}.viewer #pages{min-width:48px;font-variant-numeric:tabular-nums}
.reader-stage{width:100%;max-width:min(1540px,calc((100dvh - 108px)*1.333333));height:calc(100dvh - 108px);min-height:390px;margin:0 auto;display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate}
#flipbook{margin:auto;filter:drop-shadow(0 12px 22px #0008)}
.reader-stage.is-ready #flipbook{transition:transform var(--reader-motion,750ms) ease}
.leaf{background:#eee3c5;overflow:hidden;position:relative;width:200mm;height:300mm}
.leaf>.page{position:absolute;top:0;left:0;margin:0;box-shadow:none;color:#233a29;transform:scale(var(--reader-page-scale,1));transform-origin:0 0;break-after:auto;pointer-events:none}
.leaf::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 1px #30241555}
.leaf.--left::after{background:linear-gradient(to left,#0002,transparent 6%)}
.leaf.--right::after{background:linear-gradient(to right,#0002,transparent 6%)}
.print-notice{display:none}.reader-stage.is-zoomed{transform:scale(1.6);transform-origin:top left;margin-bottom:60vh}
.reader-stage.is-zoomed #flipbook{pointer-events:none}
html.reader-zoomed{overflow:auto;scrollbar-gutter:stable}
body.reader-zoomed{height:auto;min-height:100dvh;overflow:visible}
@media(max-width:640px){body{padding:112px 8px 12px}.viewer{gap:6px;padding:9px}.viewer button,.viewer a{padding:8px 10px}.reader-stage{height:calc(100dvh - 132px);min-height:360px}}
@media print{.page,.viewer,.reader-stage{display:none!important}.print-notice{display:block!important;color:#000;font:14pt Arial}body{padding:20mm;background:#fff}}
