:root{color-scheme:light;font-family:"Yu Gothic",Meiryo,sans-serif;color:#303936;background:#e8ebe9}*{box-sizing:border-box}body{margin:0}header{height:82px;display:flex;align-items:center;padding:0 5vw;gap:28px;border-bottom:1px solid #ccd3ce;background:#f8f9f8}.brand{font-size:40px;line-height:1;text-decoration:none;letter-spacing:-2px;color:inherit}.brand span{display:block;font-size:10px;letter-spacing:2.2px;margin-top:5px}.title{font-size:14px;letter-spacing:.14em}button,select{font:inherit;color:inherit}button{cursor:pointer}#zoom{margin-left:auto;background:transparent;border:1px solid #929f98;border-radius:30px;padding:10px 18px;font-size:14px}main{padding:24px 18px 0}.stage{display:flex;justify-content:center;align-items:center;gap:34px;min-height:200px;perspective:1800px}.book{position:relative;width:min(calc((100svh - 235px)*.7033),calc(100vw - 170px));box-shadow:0 14px 40px #25382b26,3px 3px 0 #fff,6px 6px 0 #c7cec9;transform-origin:left center;background:white}.book img{display:block;width:100%;height:auto}.turn{position:absolute;inset:0;border:0;background:transparent}.turn:focus-visible{outline:3px solid #486856;outline-offset:4px}.edge{width:48px;height:48px;flex-shrink:0;border-radius:50%;border:1px solid #a8b6ad;background:#f8faf8;font-size:36px;line-height:1;transition:background .2s}.edge:hover{background:#d2dcd5}.edge:disabled{opacity:.25;cursor:default}nav{display:flex;align-items:center;justify-content:center;gap:18px;margin:22px auto 0;flex-wrap:wrap}#count{font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:.12em}select{background:transparent;border:0;border-bottom:1px solid #929f98;font-size:14px;padding:5px}.track{display:flex;gap:5px}.dot{width:16px;height:22px;background:transparent;border:0;padding:8px 1px}.dot:after{content:'';display:block;height:3px;background:#b7c2ba;border-radius:2px}.dot[aria-current=true]:after{background:#354c3f}.hint{font-size:12px;color:#64726a;text-align:center;margin:14px 0}footer{text-align:center;color:#718077;font-size:12px;padding:6px 0 16px}.zoomed .book{width:min(1100px,100%)}.zoomed .stage{align-items:flex-start;gap:12px}.zoomed .edge{position:sticky;top:20px}.zoomed .turn{display:none}#error{text-align:center;color:#9a322a}@media(max-width:600px){header{height:68px;padding:0 18px;gap:18px}.brand{font-size:32px}.title{font-size:12px}#zoom{font-size:12px;padding:8px 12px}main{padding:20px 12px 0}.stage{gap:8px}.edge{width:32px;height:44px;font-size:28px}.book{width:min(calc((100svh - 230px)*.7033),calc(100vw - 104px))}nav{gap:12px;margin-top:20px}.track{width:100%;justify-content:center}.hint{font-size:12px}.zoomed .stage{display:block}.zoomed .edge{display:none}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}