:root{color-scheme:light;--bg:#e6e8e7;--ink:#232b28;--muted:#66716b;--green:#087f32;--line:#c9cfcb;font-family:"Helvetica Neue","Apple SD Gothic Neo",Arial,sans-serif;color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:disabled{opacity:.25;cursor:default}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--green);outline-offset:5px}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.header{height:96px;display:flex;align-items:center;justify-content:space-between;margin:0 48px;border-bottom:1px solid var(--line)}.identity{display:flex;gap:16px;align-items:center}.mark{font-family:Arial,sans-serif;font-size:54px;font-weight:900;line-height:1;color:var(--green);letter-spacing:-6px;padding-right:5px}h1{font-size:18px;letter-spacing:-.5px;margin:0;font-weight:650}.identity p{margin:7px 0 0;font-size:13px;color:var(--muted)}.tools{display:flex;gap:14px}.tool{display:flex;align-items:center;gap:8px;padding:10px;font-size:14px;border-radius:5px}.tool:hover{background:#d5dcd7}.stage{height:calc(100dvh - 213px);min-height:330px;position:relative;display:flex;align-items:center;justify-content:center;perspective:2400px}.book-wrap{position:relative;display:flex;align-items:center;justify-content:center}.book{position:relative;width:min(1120px,calc(100vw - 190px),calc((100dvh - 265px)*1.4142));aspect-ratio:1.4142;transition:transform .8s cubic-bezier(.3,.7,.3,1);touch-action:pan-y}.book.cover{transform:translateX(-25%)}.book.back-cover{transform:translateX(25%)}.spread-page,.turn-underlay{position:absolute;top:0;width:50%;height:100%;background:#f6f5f1;box-shadow:1px 3px 5px #28332b20,8px 18px 30px #28332b18}.spread-page[hidden]{display:none}.left{left:0}.right{left:50%}.spread-page img,.turn-underlay img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none}.spread-page:after,.turn-underlay:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#00000014,transparent 5%)}.spread-page.left:after,.turn-underlay.left:after{background:linear-gradient(270deg,#00000012,transparent 5%)}.turn-layer{position:absolute;inset:0;z-index:2;perspective:2400px;pointer-events:none}.sheet{position:absolute;left:50%;top:0;width:50%;height:100%;z-index:1;transform-origin:left center;transform-style:preserve-3d}.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#f6f5f1;overflow:hidden;box-shadow:1px 3px 5px #28332b20,8px 18px 30px #28332b18}.face.front{transform:translateZ(.1px)}.face img{display:block;width:100%;height:100%;object-fit:fill;user-select:none;-webkit-user-drag:none}.face.back{transform:rotateY(180deg) translateZ(.1px)}.face.front:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#00000014,transparent 5%)}.face.back:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(270deg,#00000012,transparent 5%)}.nav{position:absolute;width:48px;height:48px;border:1px solid #c1c9c3;border-radius:50%;display:grid;place-items:center;transition:background .2s;z-index:30}.nav:hover:enabled{background:#d1d9d3}.previous{left:42px}.next{right:42px}.reader-footer{margin:0 auto;width:min(540px,calc(100vw - 64px));text-align:center}.position{display:flex;justify-content:space-between;align-items:center;font-size:14px}.counter{font-variant-numeric:tabular-nums;color:var(--muted)}.progress{height:2px;background:#c7cec9;margin-top:17px;overflow:hidden}.progress span{display:block;height:100%;background:var(--green);width:5%;transition:width .4s}.hint{font-size:13px;color:var(--muted);margin:19px 0 0}.mobile-hint,.mobile-page{display:none}.load-error{position:absolute;bottom:0;font-size:14px;background:#fff;padding:12px;z-index:40}.load-error button{text-decoration:underline}dialog{padding:0;color:var(--ink);background:#f0f2ef;border:1px solid #bfc8c0;border-radius:8px;box-shadow:0 28px 80px #0003}dialog::backdrop{background:#17241ecc;backdrop-filter:blur(6px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid #d5dbd6;gap:10px}.dialog-header h2{font-size:17px;margin:0;white-space:nowrap}.close{font-size:28px;width:40px;height:40px;line-height:1;border-radius:4px}.close:hover{background:#d7dfd9}.contents-dialog{width:min(920px,calc(100vw - 32px));max-height:calc(100dvh - 64px)}.thumbnails{display:grid;grid-template-columns:repeat(5,1fr);gap:24px 18px;padding:26px;max-height:calc(100dvh - 170px);overflow:auto}.thumbnail{padding:5px;text-align:left;border-radius:4px}.thumbnail img{width:100%;aspect-ratio:.7071;object-fit:contain;box-shadow:0 4px 12px #0002}.thumbnail span{display:block;margin-top:10px;font-size:13px;color:var(--muted)}.thumbnail:hover{background:#dce4dd}.thumbnail[aria-current=true]{outline:2px solid var(--green)}.zoom-dialog{width:calc(100vw - 48px);max-width:1800px;height:calc(100dvh - 48px);max-height:none;overflow:hidden}.zoom-tools{display:flex;align-items:center;gap:6px}.zoom-tools button:not(.close){height:36px;min-width:36px;border:1px solid #c6cfc7;border-radius:4px}.zoom-tools span{font-size:13px;min-width:50px;text-align:center}.zoom-scroller{height:calc(100% - 123px);overflow:auto;cursor:grab;touch-action:pan-x pan-y}.zoom-scroller.dragging{cursor:grabbing;user-select:none}.zoom-pages{display:flex;align-items:flex-start;width:100%;min-height:100%;justify-content:center;gap:0;padding:24px;box-sizing:border-box}.zoom-pages img{display:block;object-fit:contain;width:50%;height:auto;box-shadow:0 8px 24px #0002;flex-shrink:0;user-select:none;-webkit-user-drag:none}.zoom-pages.single img{width:50%;max-width:none}.zoom-hint{font-size:13px;text-align:center;color:var(--muted);margin:12px 0}.book,.mobile-page{cursor:pointer}
@media(max-width:700px){.header{height:80px;margin:0 20px}.identity{gap:10px}.mark{font-size:43px}h1{font-size:15px}.identity p{font-size:12px;margin-top:5px}.tools{gap:0}.tool{padding:10px}.tool span{display:none}.stage{height:calc(100dvh - 198px);min-height:300px}.book{display:none}.mobile-page{display:block;width:min(calc(100vw - 68px),calc((100dvh - 247px)*.7071));aspect-ratio:.7071;background:#faf9f6;box-shadow:0 14px 30px #263a2e28;touch-action:pan-y;overflow:hidden}.mobile-page img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none}.mobile-page.changing img{animation:page-change .25s ease-out}.nav{width:29px;height:42px;border:0;border-radius:3px}.nav svg{width:20px}.previous{left:3px}.next{right:3px}.reader-footer{width:calc(100vw - 64px)}.desktop-hint{display:none}.mobile-hint{display:inline}.thumbnails{grid-template-columns:repeat(3,1fr);gap:18px 10px;padding:20px}.dialog-header{padding:12px 14px}.zoom-dialog{width:calc(100vw - 16px);height:calc(100dvh - 24px)}.zoom-tools{gap:4px}.zoom-tools button:not(.close){min-width:30px}.zoom-tools span{min-width:40px}.zoom-pages{padding:12px}.zoom-pages.single img{width:100%;max-width:none}.zoom-scroller{height:calc(100% - 111px)}.zoom-hint{font-size:12px}.contents-dialog{max-height:calc(100dvh - 32px)}}
@keyframes page-change{from{opacity:.6;transform:translateX(9px)}to{opacity:1;transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}