:root{color-scheme:light;--green:#721e1d;--ink:#20342c;--muted:#68776e;--line:#d9e2db}
*{box-sizing:border-box}
body{margin:0;font:14px system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#f0f0ef}
button,input{font:inherit;font-size:14px}button{cursor:pointer;touch-action:manipulation;background:#fff;border:1px solid var(--line);color:var(--ink);border-radius:7px;padding:10px 14px}button:hover{background:#e4ebe5}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #78a58a;outline-offset:3px}button:disabled{opacity:.35;cursor:default}[hidden]{display:none!important}
.reader{height:100vh;height:100dvh;min-height:280px;display:flex;flex-direction:column;position:relative;overflow:hidden}.reader:fullscreen{background:#f0f0ef}
.catalogue-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 32px;background:#fff;border-bottom:1px solid var(--line);z-index:3;flex-shrink:0}
.catalogue-label{font-size:14px;color:#78736d}.tools{display:flex;gap:8px}.tools button{background:#fff;border-color:#e8e4df;color:#705640;padding:8px 12px;border-radius:4px;white-space:nowrap}.tools button:hover{background:#f7f5f2}
main{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:26px 42px;overflow:hidden;perspective:2200px;touch-action:pan-y}
.book{display:flex;position:relative;width:100%;max-width:1900px;box-shadow:0 18px 60px #24432b20,0 2px 9px #24432b18;background:#fff;transform-origin:center;flex-shrink:0;perspective:2400px}
.book img{height:100%;object-fit:contain;display:block;user-select:none}.book>img{width:50%;background:#fff}.book.single>img{width:100%}.book.single #rightPage{display:none}
#leaf{display:none;position:absolute;top:0;width:50%;height:100%;transform-style:preserve-3d;z-index:2}#leaf img{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden;background:#fff}#leaf .back{transform:rotateY(180deg)}#leaf.forward{display:block;left:50%;transform-origin:left}#leaf.backward{display:block;left:0;transform-origin:right}
.book:not(.single):after{content:"";position:absolute;left:50%;top:0;height:100%;width:1px;background:#0002;pointer-events:none}
#error{position:absolute;inset:20%;background:#fff;padding:30px;text-align:center}
footer{display:flex;align-items:center;justify-content:center;gap:28px;padding:12px 24px;z-index:3;background:#f0f0ef;flex-shrink:0}
.position{display:flex;align-items:center;gap:7px;color:var(--muted);flex-wrap:wrap;justify-content:center;max-width:300px}#pageNumber{width:56px;padding:7px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);text-align:center}#progress{flex-basis:100%;width:100%;height:4px;accent-color:var(--green);margin-top:7px}
.hint{text-align:center;font-size:12px;color:var(--muted);padding:0 12px 12px;flex-shrink:0}.sr{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}
aside{position:absolute;right:16px;top:64px;bottom:100px;width:min(400px,calc(100% - 32px));background:#fff;box-shadow:0 12px 50px #18332930;border:1px solid var(--line);border-radius:10px;z-index:5;overflow:auto;padding:16px}
.thumbHeading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}#thumbGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.thumb{padding:6px;background:#f5f7f4;text-align:left;font-size:12px}.thumb img{width:100%;aspect-ratio:5/4;object-fit:contain;display:block;margin-bottom:6px}.thumb[aria-current="page"]{border:2px solid var(--green);padding:5px}
main.zoomed{display:block;overflow:auto;touch-action:pan-x pan-y}main.zoomed .book{max-width:none;box-shadow:0 4px 18px #24432b20;margin:auto}
@media(max-width:700px){.catalogue-toolbar{padding:10px 14px;gap:8px}.tools{gap:6px}.tools button{padding:8px 9px}.catalogue-label{font-size:12px}main{padding:12px}footer{padding:12px;gap:12px}footer button{padding:10px}footer button span{display:none}.position{max-width:210px}}
@media(max-width:380px){.catalogue-toolbar{padding:8px 10px}.tools{gap:4px}.tools button{font-size:12px;padding:7px}.catalogue-label{font-size:12px;max-width:80px}}
@media(max-height:440px){.catalogue-toolbar{padding:6px 20px}.tools button{padding:6px 9px}.hint{display:none}footer{padding:6px;gap:18px}main{padding:8px 20px}aside{top:52px;bottom:64px}}