.art-book-page{--ink:#444;--paper:#444;--sheet:#fff;--accent:#555;--line:#bbb;color-scheme:light;background:#d6d6d6;color:#444;overflow-x:clip}
.art-book-page::before{display:none}.art-book-page .site-header{height:84px;border:0;gap:28px;margin:0 4vw}.art-book-page .page-links{margin:0;gap:28px}.art-book-page .page-links a{color:#717171}.art-book-page .page-links a[aria-current="page"]{color:#333}.art-book-page .page-links a[aria-current="page"]::before{background:#555}.contents-toggle{margin-left:auto;min-height:44px;min-width:44px;font-size:21px;color:#555}.skip-link{position:fixed;top:-80px;left:20px;z-index:20;background:#fff;color:#333;padding:12px}.skip-link:focus{top:12px}
.art-book-page main{min-height:calc(100svh - 84px);display:flex;flex-direction:column}.art-book-page .book-intro{display:flex;justify-content:center!important;align-items:center;width:auto;margin:26px 20px 0!important}.chapter-switch{display:flex;gap:28px}.chapter-switch button{font-size:12px;color:#777;min-height:44px;padding:10px 0;border-bottom:1px solid transparent}.chapter-switch button[aria-pressed="true"]{color:#333;border-color:#777}
.reading-room{width:100%;position:relative;flex:1;display:flex;flex-direction:column;justify-content:center}.art-book-page .book-stage{position:relative;width:min(1340px,100%);margin:auto;padding:0!important;perspective:none}.book{position:relative;width:100%;height:clamp(440px,calc(100svh - 260px),760px);outline-offset:-20px!important;touch-action:pan-y;transform:none}.book:focus{outline:none}.book:focus-visible{outline:1px solid #777}.book canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.book #shadow-canvas{z-index:0}.book #book-canvas{z-index:1}.spread{position:absolute;left:50%;top:50%;width:52%;height:72%;transform:translate(-50%,-50%);display:flex;z-index:2;gap:0}.spread>button{display:block;flex:1;min-width:0;padding:0;opacity:0;cursor:zoom-in}.spread>button img{width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}.spread>button:focus-visible{opacity:1;background:#fff}.book.is-turning .spread{pointer-events:none}.book.is-dragging{cursor:grabbing}.book-fallback #book-canvas,.book-fallback #shadow-canvas{display:none}.book-fallback .spread>button{opacity:1;background:#fff;box-shadow:16px 24px 15px #b5b5b5}.book-fallback .spread{width:75%;height:70%}
.book-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin:0 auto 14px;position:relative;z-index:3}.book-controls>button{height:44px;width:44px;border-radius:50%;background:#e7e7e7;color:#555;font-size:22px;border:1px solid #c6c6c6;transition:background .15s}.book-controls>button:hover:not(:disabled){background:#f3f3f3}.book-controls>button:disabled{opacity:.3}.page-progress{display:flex;gap:0;align-items:center;height:44px}.page-progress button{width:22px;height:44px;padding:19px 8px}.page-progress button::after{content:"";display:block;width:5px;height:5px;border-radius:50%;background:#a9a9a9}.page-progress button[aria-current="true"]::after{background:#555}.art-book-page .book-colophon{display:flex;justify-content:flex-end;margin:0 4vw;padding:8px 0 16px;border:0}.book-colophon button{min-width:44px;min-height:44px;color:#777;font-size:18px}
.art-dialog{background:#e6e6e6;color:#444;border:1px solid #bdbdbd;border-radius:8px;padding:24px;box-shadow:20px 30px 60px #9996;max-height:90svh}.art-dialog::backdrop{background:#b5b5b5b3;backdrop-filter:blur(8px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.dialog-heading h2{font-size:18px;font-weight:400;margin:0}.dialog-close{height:44px;width:44px;border:1px solid #bdbdbd;border-radius:50%;font-size:26px;flex-shrink:0}.contents-group h3{font-size:12px;font-weight:400;color:#686868;margin:20px 0 16px}.contents-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.contents-item{padding:0;min-width:0;background:white;border-radius:3px;overflow:hidden}.contents-item img{width:100%;height:190px;object-fit:contain;padding:8px;display:block}.image-dialog{width:min(1260px,calc(100% - 32px));padding:16px}.image-toolbar{display:flex;justify-content:flex-end;align-items:center;gap:20px;margin-bottom:14px}.image-toolbar #zoom-toggle{min-height:44px;font-size:12px}.image-viewport{overflow:auto;max-height:71svh;background:#fff;overscroll-behavior:contain}.image-viewport img{display:block;margin:auto;max-width:100%;max-height:71svh;width:auto;height:auto;object-fit:contain}.image-viewport.zoomed img{max-width:none;max-height:none;width:1500px;height:auto;margin:0}.image-caption{display:flex;justify-content:flex-end;margin-top:8px;font-size:11px;color:#686868}.image-caption a{min-height:36px;display:flex;align-items:center}.noscript{padding:24px}
@media(max-width:699px){.art-book-page .site-header{height:76px;min-height:76px;flex-wrap:nowrap;margin:0 22px;padding:0;gap:14px}.art-book-page .page-links{order:0;flex-basis:auto;gap:25px;font-size:11px}.art-book-page .contents-toggle{order:1}.art-book-page main{min-height:calc(100svh - 76px)}.art-book-page .book-intro{margin:19px 20px 0!important}.chapter-switch{gap:28px}.chapter-switch button{font-size:11px}.book{height:clamp(350px,100vw,510px)}.spread{width:72%;height:65%}.book-controls{gap:10px;margin-bottom:25px}.page-progress button{width:21px;padding-inline:8px}.art-book-page .book-colophon{margin:0 20px}.art-dialog{padding:18px}.contents-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.contents-item img{height:155px}.image-dialog{padding:12px}.image-viewport,.image-viewport img{max-height:68svh}}

/* 2026-10-11 Q弹开合 */
.boing-open{animation:book-boing-open .9s cubic-bezier(.3,1.5,.5,1) both}
.boing-close{animation:book-boing-close .8s cubic-bezier(.3,1.5,.5,1) both}
@keyframes book-boing-open{0%{transform:scale(.92,1.05)}30%{transform:scale(1.06,.95)}55%{transform:scale(.98,1.02)}78%{transform:scale(1.01,.995)}100%{transform:none}}
@keyframes book-boing-close{0%{transform:scale(1.04,.96)}35%{transform:scale(.95,1.04)}65%{transform:scale(1.02,.99)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.boing-open,.boing-close{animation:none}}