:root{--bg: #e9e9e9;--ink: #222;--ink-soft: #777;--bar: #2c2c2c;--ease: cubic-bezier(.22, 1, .36, 1);--tap: 44px}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:DM Sans,system-ui,sans-serif;color:var(--ink);background:var(--bg);-webkit-text-size-adjust:100%}.app{height:100%;height:100dvh;display:grid;grid-template-rows:auto 1fr auto}.topbar{display:flex;align-items:center;gap:.65rem;padding:.45rem .75rem;background:#fff;border-bottom:1px solid #ddd;min-width:0}.title{margin:0;flex:1;min-width:0;text-align:center;font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:clamp(.95rem,2.5vw,1.6rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.icon-btn{appearance:none;border:none;background:#f3f3f3;color:var(--ink);width:2.1rem;height:2.1rem;min-width:2.1rem;min-height:2.1rem;border-radius:999px;display:inline-grid;place-items:center;cursor:pointer;transition:background .15s ease;font-size:1.1rem;line-height:1;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.icon-btn:hover{background:#e8e8e8}.icon-btn.muted .wave{opacity:.25}.sound-toggle{width:auto;height:auto;min-width:0;min-height:var(--tap);padding:.35rem .75rem .35rem .55rem;border-radius:999px;display:inline-flex;align-items:center;gap:.4rem;flex-shrink:0;font-family:DM Sans,system-ui,sans-serif;font-size:.8rem;font-weight:500;letter-spacing:.01em;white-space:nowrap}.sound-toggle svg{flex-shrink:0}.sound-toggle-label{line-height:1}.stage{position:relative;display:grid;grid-template-columns:56px 1fr 56px;align-items:center;min-height:0;padding:.35rem 0;background:var(--bg);touch-action:manipulation;overflow:hidden}.book-wrap{position:relative;height:100%;width:100%;display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden;touch-action:none}#book{margin:0 auto;position:relative;z-index:1;touch-action:none}.spine-crease{position:absolute;left:50%;width:34px;transform:translate(-50%);pointer-events:none;z-index:8;background:linear-gradient(90deg,transparent 0%,rgba(30,28,25,.012) 16%,rgba(30,28,25,.04) 32%,rgba(30,28,25,.08) 44%,rgba(30,28,25,.13) 49.5%,rgba(30,28,25,.16) 50%,rgba(30,28,25,.13) 50.5%,rgba(30,28,25,.08) 56%,rgba(30,28,25,.04) 68%,rgba(30,28,25,.012) 84%,transparent 100%)}#book.is-flipping~.spine-crease{display:none}html.is-portrait-book .spine-crease{display:none!important}html.is-portrait-book .book-wrap{justify-content:center}html.is-portrait-book #book,html.is-portrait-book .stf__parent,html.is-portrait-book .stf__wrapper{margin-left:auto!important;margin-right:auto!important}html:not(.is-portrait-book) #book.is-cover{transform:translate(-25%)}html.is-portrait-book #book.is-cover{transform:none}.page{background:#fff;overflow:hidden}.page canvas,.page img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;-webkit-user-drag:none;user-select:none}.page-placeholder{width:100%;height:100%;background:#fff}.loading{position:absolute;inset:0;display:grid;place-content:center;gap:.75rem;text-align:center;color:var(--ink-soft);background:var(--bg);transition:opacity .35s var(--ease);z-index:2}.loading.hidden{opacity:0;pointer-events:none}.spinner{width:2rem;height:2rem;margin:0 auto;border-radius:50%;border:2px solid #ddd;border-top-color:#0362fc;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.nav-arrow{appearance:none;border:none;background:transparent;color:#00000047;width:100%;min-width:var(--tap);height:var(--tap);min-height:var(--tap);cursor:pointer;display:grid;place-items:center;transition:color .15s ease,background .15s ease;z-index:5;border-radius:8px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.nav-arrow:hover:not(:disabled){color:#000000b3;background:#ffffff8c}.nav-arrow:disabled{opacity:.2;cursor:default}.toolbar{display:grid;grid-template-columns:8rem 1fr auto;align-items:center;gap:.75rem 1rem;padding:.55rem 1rem;background:var(--bar);color:#f2f2f2}.page-meta{font-size:.85rem;font-variant-numeric:tabular-nums;letter-spacing:.02em;color:#f2f2f2e6;white-space:nowrap}.progress-track{position:relative;height:var(--tap);display:flex;align-items:center;cursor:pointer;outline:none;background:transparent;touch-action:manipulation}.progress-track:before{content:"";position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;border-radius:999px;background:#ffffff2e;pointer-events:none}.progress-fill{position:absolute;left:0;top:50%;height:4px;margin-top:-2px;width:0%;border-radius:999px;background:#0362fc;transition:width .2s var(--ease);pointer-events:none;z-index:1}.progress-track:focus-visible{box-shadow:0 0 0 2px #0362fc73}.zoom-controls{display:flex;align-items:center;gap:.35rem}.zoom-controls .icon-btn{background:#ffffff1a;color:#f2f2f2;width:var(--tap);height:var(--tap);min-width:var(--tap);min-height:var(--tap)}.zoom-controls .icon-btn:hover{background:#fff3}#zoomRange{width:90px;accent-color:#0362fc;height:var(--tap);touch-action:manipulation}@media(max-width:767px){.title{font-size:clamp(.9rem,3.8vw,1.15rem)}.topbar{padding:.3rem .55rem;min-height:0}.stage{grid-template-columns:1fr;padding:0;position:relative}.nav-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:12;width:44px;height:64px;min-width:44px;color:#00000073;background:#ffffff8c}.nav-arrow.prev{left:2px}.nav-arrow.next{right:2px}.nav-arrow:hover:not(:disabled){background:#ffffffd9;color:#000000bf}.book-wrap{width:100%;height:100%;padding:2px 0}.toolbar{grid-template-columns:minmax(4.5rem,auto) 1fr;grid-template-rows:auto auto;gap:.55rem .75rem;padding:.5rem .75rem calc(.5rem + env(safe-area-inset-bottom,0))}.zoom-controls{grid-column:1 / -1;justify-content:center;flex-wrap:wrap;row-gap:.45rem}#zoomRange{width:min(120px,32vw)}}@media(max-width:480px){.topbar{padding:.35rem .5rem;gap:.4rem}.title{max-width:100%}.sound-toggle{padding:.3rem .55rem .3rem .4rem;font-size:.75rem;gap:.3rem}.page-meta{font-size:.78rem}}@media(max-width:360px){.title{display:none}.topbar{justify-content:flex-end}}.chrome-hide{display:none;appearance:none;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:.45rem .85rem;min-height:var(--tap);margin-left:.35rem;background:#ffffff1f;color:#fff;font-family:DM Sans,system-ui,sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.02em;cursor:pointer;white-space:nowrap;touch-action:manipulation;-webkit-tap-highlight-color:transparent;align-items:center;justify-content:center}.chrome-hide:active{transform:scale(.98)}.app.chrome-hidden{grid-template-rows:auto 1fr}.app.chrome-hidden .toolbar{display:none!important}.app.chrome-hidden .topbar{display:flex!important}.app.chrome-hidden .stage{grid-template-columns:1fr;padding:0;min-height:0}.chrome-toggle{display:none;position:fixed;z-index:40;left:50%;right:auto;bottom:max(.65rem,env(safe-area-inset-bottom));transform:translate(-50%);appearance:none;border:none;border-radius:999px;padding:.55rem 1rem;min-height:40px;background:#0362fceb;color:#fff;font-family:DM Sans,system-ui,sans-serif;font-size:.8rem;font-weight:600;letter-spacing:.02em;cursor:pointer;box-shadow:0 6px 18px #00000047;touch-action:manipulation;-webkit-tap-highlight-color:transparent;align-items:center;justify-content:center}.chrome-toggle:active{transform:translate(-50%) scale(.98)}@media(max-width:767px){.chrome-hide{display:inline-flex}body.chrome-hidden .chrome-toggle{display:inline-flex!important}}.stf__parent{position:relative;display:block;box-sizing:border-box;transform:translateZ(0);-ms-touch-action:pan-y;touch-action:pan-y}.sft__wrapper{position:relative;width:100%;box-sizing:border-box}.stf__parent canvas{position:absolute;width:100%;height:100%;left:0;top:0}.stf__block{position:absolute;width:100%;height:100%;box-sizing:border-box;perspective:2000px}.stf__item{display:none;position:absolute;transform-style:preserve-3d}.stf__outerShadow,.stf__innerShadow,.stf__hardShadow,.stf__hardInnerShadow{position:absolute;left:0;top:0}
