/* One authored motion: a spine becomes the book in your hands. */
main{max-width:1640px;padding:18px 3.5% 26px}
.stage{padding:16px 8px 20px}.book-rig{height:min(74dvh,640px);min-height:300px}
.book-switcher{margin-bottom:9px}.book-switcher select[hidden]{display:none}
.reader-bottom,.contact-strip{max-width:1120px}
#return-shelf{font-size:12px;padding:7px 0;color:#59492f}
.on-bookshelf .app-layout{opacity:0;pointer-events:none}
#bookshelf{position:absolute;top:78px;left:0;width:100%;min-height:calc(100dvh - 78px);padding:7vh 8% 50px;z-index:5;background:var(--desk)}
.shelf-heading{max-width:1100px;margin:0 auto 7vh}.shelf-heading p{font-size:11px;color:#6a583c;margin-bottom:15px}.shelf-heading h1{font:400 clamp(27px,3vw,42px)/1.6 var(--serif);color:#403729;letter-spacing:.05em;margin:0 0 12px}.shelf-heading>span{font-size:12px;color:#716047}
.cabinet{max-width:1100px;margin:auto;position:relative;padding:0 38px;background:linear-gradient(90deg,#98826120,transparent 12%,transparent 90%,#98826120)}
.shelf-books{min-height:390px;display:flex;align-items:flex-end;gap:5px;padding:35px 7% 0;overflow-x:auto;overflow-y:hidden;perspective:1100px;scrollbar-width:thin;scrollbar-color:#8d7758 transparent}
.shelf-volume{position:relative;display:flex;flex-direction:column;align-items:center;flex:0 0 82px;width:82px;height:var(--book-height);padding:25px 12px 23px;background:var(--binding);color:#302a21;border:0;border-radius:3px 3px 1px 1px;box-shadow:inset 4px 0 7px #f7e7c72b,inset -5px 0 7px #3d30232e,7px 5px 7px #48382126;transform-origin:bottom center;transition:transform 230ms ease-out,filter 230ms ease-out;cursor:pointer}
.shelf-volume::after{content:'';position:absolute;inset:0 5px;border-inline:1px solid #60503d17;pointer-events:none}
.spine-top{font-size:10px;letter-spacing:.12em;opacity:.8}.spine-title{writing-mode:vertical-rl;text-orientation:upright;font:400 23px/1.65 var(--serif);letter-spacing:.16em;margin:30px 0 15px;max-height:215px;overflow:hidden;overflow-wrap:anywhere}.spine-number{margin-top:auto;font:12px Georgia,serif}
.shelf-volume:hover{transform:translateY(-12px) translateZ(18px) rotate(-2deg);filter:brightness(1.045)}.shelf-volume:focus-visible{outline:2px solid #54432b;outline-offset:5px;transform:translateY(-10px)}.shelf-volume.taken{visibility:hidden}
.shelf-board{height:18px;background:#9e8868;border-top:2px solid #bba686;box-shadow:0 14px 20px #56422730;position:relative;margin:0 -38px}.shelf-board::after{content:'';position:absolute;left:0;right:0;top:18px;height:7px;background:#796449}
.cabinet-foot{display:flex;justify-content:space-between;padding:34px 0 0;font-size:11px;color:#756044}
.travelling-book{position:fixed;z-index:1000;pointer-events:none;background:#a69b85;color:#383329;box-shadow:inset 7px 0 9px #463b2324,5px 6px 0 #998b73,18px 26px 32px #44321d38;border-radius:2px;display:flex;flex-direction:column;padding:16% 13% 10% 16%;padding:0;transform-origin:center;backface-visibility:hidden;will-change:transform}
.travel-title{font:400 clamp(24px,3vw,36px)/1.9 var(--serif);letter-spacing:.13em;margin:27% 13% 0 16%;overflow-wrap:anywhere}.travel-imprint{display:flex;justify-content:space-between;margin:auto 13% 10% 16%;font-size:10px}
.shelf-transition{overflow:hidden}.shelf-transition .app-layout{opacity:0;pointer-events:none}.shelf-transition .shelf-volume{pointer-events:none}
@media(min-width:1600px){.book-rig{height:640px}.stage{padding-top:14px}}
@media(max-width:700px){main{padding:14px 12px 22px}.book-rig{height:min(70dvh,640px);min-height:260px}.stage{padding:10px 0 17px}.book-switcher{gap:6px}#return-shelf{font-size:11px}#edition-note{display:none}#bookshelf{top:68px;min-height:calc(100dvh - 68px);padding:6vh 24px 35px}.shelf-heading{margin-bottom:5vh}.cabinet{padding:0 15px}.shelf-books{padding-inline:18px;min-height:355px}.shelf-volume{flex-basis:70px;width:70px;height:calc(var(--book-height) * .88)}.shelf-board{margin-inline:-15px}.cabinet-foot span:last-child{display:none}.reader-heading h1{font-size:20px}.spine-title{font-size:21px}.travel-title{font-size:27px}}
@media(max-height:650px) and (min-width:701px){.book-rig{height:max(260px,calc(100dvh - 205px));min-height:260px}#bookshelf{top:62px;padding-top:25px}.shelf-heading{margin-bottom:12px}.shelf-books{min-height:250px}.shelf-volume{height:240px}.spine-title{margin:18px 0;font-size:20px}}
@media(prefers-reduced-motion:reduce){.shelf-volume{transition:none}.shelf-volume:hover{transform:none}}
/* Refined cabinet: recessed back, restrained joinery, and a visible empty slot. */
.cabinet{background:linear-gradient(180deg,#77634813,transparent 65%);border-inline:9px solid #b6a384;padding-inline:29px;box-shadow:inset 9px 0 20px #624c2910,inset -9px 0 20px #624c2910}
.cabinet::before{content:'';position:absolute;left:-9px;right:-9px;top:0;height:7px;background:#b6a384;box-shadow:0 9px 14px #67533612}
.shelf-books{gap:3px;padding-top:48px;background:linear-gradient(0deg,#6c523118,transparent 45%)}
.shelf-volume{transition:transform 260ms cubic-bezier(.2,.75,.2,1),filter 260ms;box-shadow:inset 3px 0 5px #efe3ca24,inset -4px 0 6px #3e352928,5px 4px 8px #3e352926}
.shelf-volume:hover{transform:translateY(-5px) translateZ(12px);filter:brightness(1.035)}
.shelf-volume:focus-visible{transform:translateY(-5px)}
.shelf-board{margin-inline:-38px;height:14px;border-top:3px solid #c1ae8c;box-shadow:0 12px 18px #56422726}
.shelf-board::after{top:14px;height:5px}
.cabinet-foot{background:var(--desk);margin:0 -38px;padding:32px 38px 0}
.travelling-book.cover{display:block;container-type:inline-size;transform-style:preserve-3d;border-radius:1px 3px 3px 1px;box-shadow:2px 2px 0 #bdae91,5px 5px 0 #8e8168,15px 22px 25px #44321d30}
.travelling-book>.page-inner{position:relative;width:100%;height:100%;display:flex;flex-direction:column}
.travelling-spine{position:fixed;z-index:1001;pointer-events:none!important;margin:0;transform-origin:center;will-change:transform,opacity}
.travelling-spine:hover{transform:none;filter:none}
.closing-snapshot{position:fixed;z-index:1002;pointer-events:none;transform-origin:center;will-change:transform,opacity}
.shelf-transition.shelf-reveal .app-layout{opacity:1}
@media(max-width:700px){.cabinet{border-inline-width:6px;padding-inline:9px}.cabinet::before{left:-6px;right:-6px}.shelf-board{margin-inline:-15px}.cabinet-foot{margin-inline:-15px;padding-inline:15px}.shelf-books{padding-top:35px}}
@media(prefers-reduced-motion:reduce){.shelf-volume:hover,.shelf-volume:focus-visible{transform:none}}
/* Solid binding. No opacity/filter on this preserve-3d parent: either would flatten it. */
.shelf-volume{flex-basis:52px;width:52px;padding-inline:5px}
.travelling-book{display:block;transform-style:preserve-3d;background:none;box-shadow:none;border-radius:0;backface-visibility:visible;isolation:auto;will-change:transform}
.travelling-book>div{position:absolute;backface-visibility:hidden}
.volume-front{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden;transform:translateZ(0px);box-shadow:inset 5px 0 8px #44321d24,1px 1px 0 #8e8168}
.volume-front>.page-inner{position:relative;width:100%;height:100%;display:flex;flex-direction:column}
.volume-back{inset:0;background:#928670;transform:translateZ(calc(-1 * var(--depth))) rotateY(180deg);box-shadow:0 12px 26px #44321d30}
.volume-spine{left:0;top:0;width:var(--depth);height:100%;transform-origin:left center;transform:rotateY(-90deg) translateX(-100%);display:flex;flex-direction:column;align-items:center;background:linear-gradient(90deg,#8e8168,#a69b85 12%,#a69b85 85%,#8e8168);color:#302a21;border-radius:2px;box-shadow:inset 0 0 0 1px #bdae91}
.volume-spine .spine-title{font-size:var(--spine-title-size);margin:var(--spine-gap) 0 0;max-height:68%;line-height:1.65}
.volume-spine .spine-top{font-size:var(--spine-small-size)}
.volume-spine .spine-number{font-size:var(--spine-number-size)}
.volume-foreedge{left:calc(100% - 3px);top:4px;width:calc(var(--depth) - 8px);height:calc(100% - 8px);transform-origin:left center;transform:rotateY(90deg) translateX(4px);background:repeating-linear-gradient(90deg,#d9c7a4 0px,#efe3ca 1px,#e2d0ad 3px);box-shadow:inset 0 8px 12px #71614b26}
.volume-top,.volume-bottom{left:3px;width:calc(100% - 6px);height:calc(var(--depth) - 8px);background:repeating-linear-gradient(0deg,#d9c7a4 0px,#efe3ca 1px,#e2d0ad 3px)}
.volume-top{top:3px;transform-origin:top center;transform:rotateX(90deg) translateY(calc(-100% - 4px))}
.volume-bottom{top:calc(100% - 3px);transform-origin:top center;transform:rotateX(-90deg) translateY(4px);background-color:#c9b791}
@media(max-width:700px){.shelf-volume{flex-basis:46px;width:46px}}