:root{color-scheme:dark;--gold:#d4ad62;--ink:#181c12;--paper:#f5f0e7}*{box-sizing:border-box}body{margin:0;background:#181c12;color:var(--paper);font-family:Arial,sans-serif;font-size:16px}header{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 4vw;border-bottom:1px solid #ffffff1f}.brand{text-decoration:none;color:var(--gold);text-align:center;letter-spacing:.17em}.brand span{display:block;font-family:Georgia,serif;font-size:25px}.brand small{display:block;font-size:12px;margin-top:5px;letter-spacing:.37em}nav{display:flex;gap:10px;align-items:center}button,nav a,.sharelinks a{font:inherit;font-size:14px;border:1px solid #ffffff3c;padding:12px 17px;border-radius:5px;color:inherit;background:transparent;text-decoration:none;cursor:pointer}button:hover,nav a:hover{background:#ffffff12}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.gold{background:var(--gold);color:#181c12;border-color:var(--gold);font-weight:bold}.gold:hover{background:#e5c585}main{padding:0 18px}.intro{text-align:center;font-size:14px;color:#d1cabd;padding:20px 0 16px}.intro span{color:var(--gold);margin:0 8px}.stage{height:calc(100dvh - 225px);min-height:360px;display:flex;align-items:center;justify-content:center;position:relative;gap:25px;perspective:1800px}#book{height:100%;display:flex;max-width:calc(100vw - 165px);filter:drop-shadow(0 16px 22px #0007);position:relative;touch-action:pan-y}.leaf{position:relative;aspect-ratio:436.5354/612.2835;height:100%;max-width:100%;background:#f3f0e8;transform-origin:left center;overflow:hidden}.leaf img{display:block;width:100%;height:100%;object-fit:fill}.leaf a.hotspot{position:absolute;display:block;border-radius:2px}.leaf a.hotspot:hover{outline:2px solid var(--gold);background:#d4ad621a}#book.double .leaf:first-child:after{content:'';position:absolute;inset:0 0 0 auto;width:12px;background:linear-gradient(90deg,transparent,#0003);pointer-events:none}#book.double .leaf:last-child:after{content:'';position:absolute;inset:0 auto 0 0;width:10px;background:linear-gradient(90deg,#0002,transparent);pointer-events:none}.arrow{border:1px solid #d4ad6255;color:var(--gold);border-radius:50%;font:36px Georgia;width:48px;height:48px;flex-shrink:0;padding:0 0 5px}.arrow:disabled{opacity:.2;cursor:default}.turn-next{animation:turnNext .42s ease-in-out}.turn-prev{animation:turnPrev .42s ease-in-out}@keyframes turnNext{0%{transform:rotateY(0);filter:brightness(1)}49%{transform:rotateY(-75deg);filter:brightness(.65)}50%{transform:rotateY(65deg);filter:brightness(.7)}100%{transform:rotateY(0);filter:brightness(1)}}@keyframes turnPrev{0%{transform:rotateY(0)}49%{transform:rotateY(75deg);filter:brightness(.65)}50%{transform:rotateY(-65deg)}100%{transform:rotateY(0)}}footer{text-align:center;padding:17px 0}.pagecontrol{display:flex;gap:10px;justify-content:center;align-items:center;font-size:14px}input{font:inherit;color:inherit;background:#ffffff0d;border:1px solid #ffffff40;border-radius:4px;padding:9px}#page{width:66px;text-align:center}#hint{font-size:13px;color:#c2beb3;margin:12px 0 0}dialog{color:var(--paper);background:#24291e;border:1px solid #d4ad6255;border-radius:12px;padding:30px;width:min(520px,94vw)}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}dialog h1{font-family:Georgia,serif;font-size:28px;font-weight:normal;margin:15px 0}dialog p{color:#d1cabd;line-height:1.6}.close{float:right;border:0;font-size:22px;padding:4px 8px}.sharelinks{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.sharelinks a{background:#ffffff0b}dialog label{display:block;font-size:14px;margin-bottom:8px}.copyrow{display:flex;gap:8px}.copyrow input{width:100%;min-width:0;font-size:14px}#zoomDialog{width:96vw;max-width:none;max-height:96dvh;padding:12px;overflow:auto;background:#14170f}.zoomtop{position:sticky;top:-12px;background:#14170f;display:flex;align-items:center;justify-content:space-between;padding:10px;z-index:3}#zoomPages .leaf{height:auto;width:min(1100px,100%);max-width:none;margin:10px auto}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:12px 20px;background:var(--paper);color:var(--ink);border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s}#toast.visible{opacity:1}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:700px){header{padding:14px 15px;min-height:76px;gap:8px}.brand span{font-size:18px}.brand small{font-size:10px}nav{gap:6px}nav button,nav a{font-size:13px;padding:10px}.download{display:none}.intro{padding:16px 0;font-size:13px}.stage{height:calc(100dvh - 235px);min-height:310px;gap:6px}.arrow{width:31px;height:40px;border:0;font-size:36px}#book{max-width:calc(100vw - 90px);height:auto;max-height:100%}.leaf{height:auto;width:100%;max-height:calc(100dvh - 235px)}.leaf img{max-height:calc(100dvh - 235px);width:auto;max-width:100%;object-fit:contain}main{padding:0 7px}#zoomPages .leaf,#zoomPages .leaf img{max-height:none;width:100%;height:auto}#hint{max-width:270px;margin:12px auto;line-height:1.4}}@media(prefers-reduced-motion:reduce){.turn-next,.turn-prev{animation:none}}

/* Explicit page sizes prevent intrinsic flex sizing from collapsing the reader. */
#book{flex-shrink:0;max-height:none}#book .leaf{max-height:none}#book .leaf img{width:100%;height:100%;max-height:none;object-fit:contain}
