/* Keep the desk image continuous across the whole available viewport. */
#desk-view{overflow:hidden;align-items:flex-start;padding-top:88px}
#desk-view:before{display:none}
#desk-view .desk-model{width:max(100vw,calc((100svh - 88px)*1.333333));aspect-ratio:4/3;margin:0;max-width:none}
#reader.study-open>.reader-bar{display:none}
#reader.study-open #reader-body{height:100svh}
.study-frame{display:block;width:100%;height:100%;border:0;background:#fbfaf7}
/* Solid books with separate front, back, spine, fore-edge and top faces. */
.single-shelf{width:min(1040px,94vw);height:min(395px,58svh);min-width:0;margin:auto;perspective:1400px}
.all-books{left:45px;right:45px;bottom:21px;height:85%;gap:clamp(20px,4vw,52px);align-items:flex-end;perspective:1400px}
.all-books .volume-book{width:clamp(90px,12vw,144px);flex:0 1 144px;max-width:144px;min-width:0;height:var(--book-height);transform:none;transition:transform .4s;perspective:1200px}
.all-books .volume-book:is(:hover,:focus-visible){flex:0 1 144px;transform:translateY(-17px);z-index:5}
.book-solid{display:block;position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(7deg) rotateY(-24deg);transition:transform .5s cubic-bezier(.2,.7,.2,1);--depth:30px}
.volume-book:is(:hover,:focus-visible) .book-solid{transform:rotateX(2deg) rotateY(-10deg) translateZ(28px)}
.book-solid>span{position:absolute;display:block;backface-visibility:hidden}
.volume-cover,.volume-back{inset:0;background:var(--book-color);border-radius:2px 5px 5px 2px;border:1px solid #ffffff40}
.volume-cover{transform:translateZ(15px);background-image:linear-gradient(90deg,#0002 0,transparent 5%,#fff4 7%,#0001 9%,transparent 11%),repeating-linear-gradient(0deg,#ffffff06 0 1px,#00000003 1px 2px);box-shadow:inset -1px 0 1px #0002,inset 0 1px 1px #fff8;display:flex!important;flex-direction:column;align-items:center;justify-content:space-between;padding:22px 10px 18px;color:#354854}
.volume-cover:after{content:'';position:absolute;inset:12px 9px 11px 15px;border:1px solid #ffffff35;pointer-events:none}
.volume-back{transform:translateZ(-15px) rotateY(180deg);box-shadow:12px 10px 16px #3d3c3828}
.volume-pages{width:26px;top:3px;bottom:3px;right:-13px;transform:rotateY(90deg);background:repeating-linear-gradient(90deg,#e9e4d9 0 1px,#fffaf0 1px 3px);border:1px solid #cbc5b8;border-radius:0 2px 2px 0}
.volume-top{height:26px;top:-10px;left:3px;right:2px;transform:rotateX(90deg);background:repeating-linear-gradient(0deg,#eee9df 0 1px,#fffaf1 1px 3px);border:1px solid #d0c9bc}
.volume-spine{width:30px;left:-15px;top:0;bottom:0;transform:rotateY(-90deg);background:linear-gradient(90deg,#0002,#fff2 25%,transparent 75%,#0002),var(--book-color);border-radius:3px;display:flex!important;align-items:center;justify-content:center}
.volume-spine>span{writing-mode:vertical-rl;font:12px 'Songti SC',serif;color:#344654;letter-spacing:.1em}
.volume-number,.volume-imprint{font:8px/1.5 Georgia,serif;letter-spacing:.14em;opacity:.7;text-align:center}
.volume-title{writing-mode:vertical-rl;font:clamp(15px,1.6vw,21px)/1.6 'Songti SC',serif;letter-spacing:.14em;text-shadow:0 1px #fff5}
@media(max-width:700px){
 #desk-view{padding-top:85px}#desk-view .desk-model{width:max(100vw,calc((100svh - 85px)*1.333333))}
 .shelf-scroll{width:100%;overflow-x:auto;padding:0 20px 40px}.single-shelf{width:680px;height:330px;margin:0;min-width:680px}.all-books{left:34px;right:34px;gap:25px}.all-books .volume-book{width:100px;flex:0 0 100px;min-width:100px}.all-books .volume-book:is(:hover,:focus-visible){flex:0 0 100px}.volume-title{font-size:17px}.volume-number,.volume-imprint{font-size:7px}
}
/* Extend the wall's actual edge colours; keep the whole desk in frame. */
#desk-view .desk-model{width:min(100vw,calc((100svh - 88px)*1.333333))}
#desk-view .desk-model:before,#desk-view .desk-model:after{content:'';position:absolute;top:0;bottom:0;width:max(0px,calc((100vw - 100%)/2 + 1px));background-image:url('assets/desk-detail.png?v=18');background-repeat:no-repeat;background-size:100000% 100%;pointer-events:none}
#desk-view .desk-model:before{right:calc(100% - 1px);background-position:left top}
#desk-view .desk-model:after{left:calc(100% - 1px);background-position:right top}
@media(max-width:700px){#desk-view{align-items:center;background:#e3e3e2}#desk-view .desk-model{width:100vw}#desk-view .desk-model:before,#desk-view .desk-model:after{display:none}}
#desk-view .desk-model:before{right:96%;width:max(0px,calc((100vw - 100%)/2 + 4%));background-position:4% top}
#desk-view .desk-model>img{mask-image:linear-gradient(to right,transparent 0 2.5%,#000 4%);-webkit-mask-image:linear-gradient(to right,transparent 0 2.5%,#000 4%)}
@media(max-width:700px){#desk-view .desk-model>img{mask-image:none;-webkit-mask-image:none}}
/* A book comes off its shelf before the reading surface opens. */
.all-books .volume-book.book-selected{transform:translateY(-32px) scale(1.09);z-index:25}.volume-book.book-selected .book-solid{transform:rotateX(0) rotateY(0) translateZ(95px)}
.leaf-reader{height:100%;display:flex;flex-direction:column;background:radial-gradient(ellipse at center,#fff 10%,#eeece7 100%);overflow:hidden}.leaf-mount{flex:1;min-height:0;margin:10px 3vw 0;position:relative}.leaf-controls{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap;padding:10px 20px 4px;z-index:2}.leaf-controls button{font-size:12px;padding:8px 12px;border:1px solid #c5cbc5;border-radius:20px;background:#ffffffb0}.leaf-controls button:disabled{opacity:.35;cursor:default}.leaf-controls input{width:45px;border:0;border-bottom:1px solid #919c92;background:transparent;text-align:center;color:inherit;font:inherit}.leaf-controls label{font-size:12px}.leaf-hint{text-align:center;color:#798179;font-size:10px;margin:6px 0 14px}.leaf-mount [data-leafthrough]{outline-offset:-3px}.leaf-controls button[aria-pressed=true]{background:#48554e;color:white}
.object-feedback.lit{filter:brightness(1.12) drop-shadow(0 3px 4px #96afc15c);transform:translateY(-2px);transition:opacity .22s,transform .22s}.object-area:active{transform:translateY(1px)}.about-turn{background-image:linear-gradient(90deg,transparent 60%,#0000000c 85%,#fff6);border-radius:0 0 8px 0}.door-interior{background-position:center;transition:transform 1.1s}.opening .door-interior{transform:scale(1.08)}
@media(max-width:700px){.leaf-controls{gap:8px;padding:6px 8px}.leaf-controls button{padding:7px 9px;font-size:11px}.leaf-hint{font-size:9px}.leaf-mount{margin:0 1vw}}
@media(prefers-reduced-motion:reduce){.book-solid,.volume-book,.object-feedback,.about-turn,.door-interior{transition:none!important;animation:none!important}}
/* Show the spine at rest; reveal the front cover on hover or keyboard focus. */
.shelf-scroll{max-width:100%;overflow:visible}
.all-books{gap:clamp(14px,3.4vw,40px);justify-content:center;--cover-width:144px}
.all-books .volume-book{width:clamp(42px,5.5vw,64px);min-width:0;max-width:none;flex:0 0 clamp(42px,5.5vw,64px);transition:flex-basis .48s cubic-bezier(.22,.7,.18,1),transform .4s}
.all-books .volume-book:is(:hover,:focus-visible),.all-books .volume-book.book-selected{flex-basis:var(--cover-width);max-width:none;z-index:25;transform:translateY(-12px)}
.all-books .book-solid{left:50%;right:auto;width:var(--cover-width);transform:translateX(-50%) rotateX(0) rotateY(90deg);transform-origin:center center;transition:transform .55s cubic-bezier(.22,.7,.18,1)}
.all-books .volume-book:is(:hover,:focus-visible) .book-solid{transform:translateX(-50%) rotateX(2deg) rotateY(0deg) translateZ(28px)}
.all-books .volume-book.book-selected .book-solid{transform:translateX(-50%) rotateX(0) rotateY(0) translateZ(90px)}
.volume-spine>span{font-size:15px;letter-spacing:.12em;line-height:1.7;text-shadow:0 1px #fff5}
@media(max-width:700px){.shelf-scroll{padding:0;width:100%;overflow:visible}.single-shelf{width:94vw;min-width:0;height:min(395px,56svh);margin:auto}.all-books{left:5%;right:5%;gap:14px;--cover-width:96px}.all-books .volume-book{width:36px;min-width:0;flex:0 0 36px}.all-books .volume-book:is(:hover,:focus-visible),.all-books .volume-book.book-selected{flex-basis:96px}.volume-spine>span{font-size:13px}.volume-title{font-size:16px}.volume-cover{padding:18px 6px 15px}.volume-number,.volume-imprint{font-size:6px}}
@media(prefers-reduced-motion:reduce){.all-books .volume-book,.all-books .book-solid{transition:none!important}}
.volume-book{user-select:none;-webkit-user-select:none}
.volume-spine>span{font-size:13px}
.volume-cover:has(.volume-image){padding:0;overflow:hidden}
.volume-cover:has(.volume-image):after{display:none}
.volume-image{display:block;width:100%;height:100%;object-fit:cover}
#spatial-view .spatial-carousel{position:absolute;inset:125px 0 0;width:100%;height:auto;max-width:none}
@media(max-width:700px){.volume-spine>span{font-size:11px}#spatial-view .spatial-carousel{top:142px}}
#spatial-view .spatial-carousel{margin:0}
.spatial-carousel>.design-gallery{width:100%}
