.collection{background:#e8e4d5;color:#26382b;padding:120px 6vw 110px;overflow:hidden;position:relative;min-height:100svh}.collection-head{max-width:1400px;margin:auto;display:flex;justify-content:space-between;align-items:end;gap:30px}.collection-kicker{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#66735d}.collection-head h2{font:normal clamp(54px,6.6vw,98px)/.95 Georgia,serif;letter-spacing:-.055em;margin:22px 0 0}.collection-head h2 em{color:#788566;font-weight:normal}.collection-head>p{font-size:15px;line-height:1.7;color:#596758;max-width:350px}#areas{display:flex;gap:7px;max-width:1400px;margin:50px auto 0;overflow:auto;padding:4px 1px 12px;scrollbar-width:thin}.area{flex:0 0 auto;border:1px solid #aeb7a4;border-radius:99px;background:transparent;color:#3b4b3a;padding:12px 18px;display:flex;gap:12px;align-items:center;font-size:12px;min-height:46px}.area[aria-pressed=true]{background:#283e2f;color:#f4f1e2;border-color:#283e2f}.area-id{font-weight:bold;letter-spacing:.05em}.area-name{opacity:.8}.shelf-stage{height:490px;max-width:1400px;margin:auto;position:relative;overflow:hidden}.shelf{position:absolute;inset:0;perspective:1200px;touch-action:pan-y;outline-offset:-5px}.volume{position:absolute;left:50%;top:45px;width:235px;height:330px;padding:0;border:0;background:transparent;transform-style:preserve-3d;transform:translateX(calc(-50% + var(--distance) * 150px)) translateZ(calc(var(--abs) * -90px)) rotateY(calc(var(--distance) * -20deg)) translateY(calc(var(--abs) * 10px));transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .65s;filter:brightness(calc(1 - var(--abs) * .12));z-index:calc(10 - var(--abs));box-shadow:0 26px 35px -18px #152619aa}.volume[data-selected=true]{cursor:pointer}.volume-front{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;background:#ebe1c7;color:#263729;border:9px solid #314737;box-shadow:inset 0 0 0 1px #b9a87e,inset 0 0 0 4px #314737;overflow:hidden}.volume-front:after{content:"";position:absolute;inset:7px;border:1px solid #b7a37299;pointer-events:none}.volume-kicker{font:7px Arial,sans-serif;letter-spacing:.18em;margin:19px 10px 9px;z-index:1}.volume-art{display:block;width:78%;height:53%;background-repeat:no-repeat;mix-blend-mode:multiply;filter:saturate(.8) contrast(.98);border:1px solid #a6946f77}.volume-title{font:normal 17px/1.13 Georgia,serif;letter-spacing:-.025em;padding:12px 15px 0;max-height:65px;overflow:hidden}.volume-number{font:8px Arial,sans-serif;letter-spacing:.16em;margin:auto 0 14px}.volume-spine{position:absolute;top:0;bottom:0;left:-13px;width:13px;background:repeating-linear-gradient(0deg,#283b2c 0 55px,#9a875a 57px,#283b2c 59px);transform-origin:right;transform:rotateY(-90deg);box-shadow:inset -3px 0 5px #101c15}.shelf-edge{position:absolute;bottom:80px;left:-5%;right:-5%;height:14px;background:#796744;box-shadow:0 11px 14px #23362838,inset 0 2px #b6a57c;pointer-events:none}.shelf-details{max-width:1200px;margin:-30px auto 0;display:grid;grid-template-columns:220px 1fr;gap:70px;align-items:start}.shelf-controls{display:flex;align-items:center;gap:15px;white-space:nowrap}.shelf-controls button{width:46px;height:46px;border-radius:50%;border:1px solid #aab39e;background:transparent;color:#273a2b;font-size:20px}.shelf-controls button:disabled{opacity:.25;cursor:default}#shelf-count{font-size:10px;letter-spacing:.12em}#shelf-title{font:normal clamp(30px,3.5vw,50px)/1.05 Georgia,serif;letter-spacing:-.04em;margin:14px 0}#shelf-hook{max-width:620px;font-size:15px;line-height:1.65;color:#586758}#shelf-open{margin-top:23px;background:#263d2f;color:#f2f0e3;border:0;padding:16px 19px;min-height:50px;display:flex;gap:44px;align-items:center}.shelf-hint{font-size:11px;color:#687464;margin-top:15px}@media(max-width:700px){.collection{padding:85px 0 75px}.collection-head{display:block;padding:0 25px}.collection-head h2{font-size:62px}.collection-head>p{font-size:13px;margin-top:18px}#areas{margin:30px 0 0;padding:4px 25px 12px}.area{padding:10px 14px;gap:8px}.area-name{font-size:11px}.shelf-stage{height:370px}.volume{width:170px;height:250px;top:37px;transform:translateX(calc(-50% + var(--distance) * 111px)) translateZ(calc(var(--abs) * -90px)) rotateY(calc(var(--distance) * -22deg)) translateY(calc(var(--abs) * 8px))}.volume-front{border-width:7px}.volume-kicker{font-size:6px;margin:15px 8px 7px}.volume-title{font-size:13px;padding:8px 10px 0;max-height:47px}.volume-number{font-size:7px;margin-bottom:10px}.shelf-edge{bottom:70px}.shelf-details{padding:0 25px;display:flex;flex-direction:column;gap:24px;margin:-20px 0 0}.shelf-controls button{width:43px;height:43px}#shelf-title{font-size:37px}#shelf-hook{font-size:13px}.shelf-hint{font-size:10px}}
@media(prefers-reduced-motion:reduce){.volume{transition:none}}
.collection-visible .wordmark{color:#253b2d;text-shadow:none}.collection-visible .film-controls{visibility:hidden;pointer-events:none}
.volume[hidden]{display:none}
.collection-visible .site-header:before{content:"";position:fixed;top:0;left:0;right:0;height:85px;background:linear-gradient(#e8e4d5 65%,#e8e4d500);z-index:-1;pointer-events:none}
.shelf-details{position:relative;z-index:2}
.volume-title.long{font-size:14px}.volume-title.very-long{font-size:11px;line-height:1.08}@media(max-width:700px){.volume-title.long{font-size:11px}.volume-title.very-long{font-size:9px;line-height:1.07}}
.collection-kicker,.shelf-hint{color:#4a5b49}.area-name{opacity:1}
.volume{transform:translateX(calc(-50% + var(--distance) * 150px)) translateZ(calc(var(--abs) * -100px)) rotateY(calc(var(--distance) * -32deg)) translateY(calc(var(--abs) * 10px))}
@media(max-width:700px){.volume{transform:translateX(calc(-50% + var(--distance) * 111px)) translateZ(calc(var(--abs) * -100px)) rotateY(calc(var(--distance) * -32deg)) translateY(calc(var(--abs) * 8px))}}
/* R6: a true spine-first arc; the selected volume rotates its front toward the visitor. */
.shelf-stage{height:490px}.shelf{perspective:1400px;perspective-origin:50% 50%;overflow:visible}.volume{left:50%;top:48%;width:0;height:0;transform-style:preserve-3d;box-shadow:none;filter:none;transition:none;overflow:visible;cursor:pointer}.volume[hidden]{display:none}.volume:focus-visible{outline:none}.volume:focus-visible .volume-spine,.volume:focus-visible .volume-front{outline:3px solid #876e32;outline-offset:5px}.volume-spine,.volume-front{position:absolute;top:calc(var(--book-h) / -2);height:var(--book-h);backface-visibility:hidden;border-radius:2px;overflow:hidden}.volume-spine{display:flex;flex-direction:column;align-items:center;left:calc(var(--book-w) / -2);width:var(--book-w);transform:translateZ(calc(var(--book-d) / 2));background:linear-gradient(90deg,#1b2c20,#405540 35%,#213526 88%,#121f17);border:1px solid #9f8d65;box-shadow:inset 3px 0 5px #0d1b12aa,inset -4px 0 6px #0b1711aa}.volume-spine:after,.volume-front:after{content:"";position:absolute;inset:0;background:#10140e;opacity:var(--shade,0);pointer-events:none;border:0}.spine-art{width:70%;aspect-ratio:1;background-repeat:no-repeat;margin-top:10%;border:1px solid #a69876;flex:none}.spine-title{writing-mode:vertical-rl;max-height:62%;overflow:hidden;margin:12% auto auto;color:#e7ddbd;font:600 clamp(8px,1.1vw,12px)/1.15 Georgia,serif;letter-spacing:.04em;text-align:left}.spine-mark{color:#e1d4ac;font:8px Arial,sans-serif;letter-spacing:.12em;margin-bottom:14%}.volume-front{left:calc(var(--book-d) / -2);width:var(--book-d);transform:rotateY(90deg) translateZ(calc(var(--book-w) / 2));border:7px solid #314737;box-shadow:inset 0 0 0 1px #b9a87e,0 34px 60px -30px #14100a99}.volume-art{height:52%;width:82%}.volume-kicker{font-size:7px;margin:12% 3% 7%}.volume-title{font-size:clamp(11px,1.5vw,19px);max-height:24%;overflow:hidden}.volume-title.long{font-size:clamp(10px,1.2vw,15px)}.volume-title.very-long{font-size:clamp(8px,1vw,12px)}.volume-number{margin:auto 0 9%;font-size:8px}.shelf-edge{height:0;bottom:64px;background:none;box-shadow:none}.shelf-stage:after{content:"";position:absolute;bottom:45px;left:5%;width:90%;height:65px;background:radial-gradient(ellipse,#30281855 0%,#3028181a 44%,transparent 72%);pointer-events:none;z-index:0}.shelf{z-index:2}.shelf-details{position:relative;z-index:3}.shelf-hint{margin-bottom:20px}#shelf-position{position:relative;display:block;width:min(1200px,88%);height:28px;margin:35px auto 0;background:transparent;border:0;touch-action:manipulation}#shelf-position:before{content:"";position:absolute;left:0;right:0;top:13px;height:1px;background:#84917b}#shelf-position:after{content:"";position:absolute;top:9px;left:var(--position,0%);width:9px;height:9px;border-radius:50%;background:#314b38;transform:translateX(-50%)}
@media(max-width:700px){.shelf-stage{height:365px}.shelf{perspective:1400px}.volume{left:50%;top:47%;width:0;height:0;transform-style:preserve-3d;transition:none}.volume-front{border-width:5px}.volume-title{font-size:13px}.volume-title.long{font-size:10px}.volume-title.very-long{font-size:8px}.shelf-stage:after{bottom:52px;height:50px}#shelf-position{width:calc(100% - 50px);margin-top:25px}}
#detail-art{display:none}.shelf-reader[open]{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;border:0;background:#f5f1e6;padding:30px max(6vw,24px);overflow:auto}.shelf-reader #detail-art{display:block;float:right;width:min(38vw,460px);height:min(66vh,570px);background-repeat:no-repeat;border:12px solid #e5decb;margin:25px 0 35px 7vw;box-shadow:0 18px 42px #28382a22}.shelf-reader #sheet{max-width:600px;padding-top:3vh}.shelf-reader #sheet h2{font-size:clamp(40px,5vw,75px)}.shelf-reader #close-reader{position:relative;z-index:3}.shelf-reader>nav{max-width:600px}.shelf-reader>a{display:inline-block;max-width:600px;margin-bottom:30px}@media(max-width:700px){.shelf-reader[open]{padding:18px 24px}.shelf-reader #detail-art{float:none;width:100%;height:30vh;margin:12px 0 26px;border-width:8px}.shelf-reader #sheet{padding:0}.shelf-reader #sheet h2{font-size:38px}}
#shelf-title{overflow:hidden}#shelf-position .topic-tick{position:absolute;top:10px;width:1px;height:7px;background:#687a67}
.shelf-reader #detail-art{background:#e7dfcc;overflow:hidden}.shelf-reader #detail-art svg{display:block;width:100%;height:100%}
.shelf-visible .film-controls{visibility:hidden;pointer-events:none}
/* Subject-colored cloth bindings with a cooler, less sepia illustration treatment. */
.volume-spine{background:linear-gradient(90deg,var(--binding-dark),var(--binding-light) 36%,var(--binding) 82%,var(--binding-dark));border-color:var(--binding-light)}
.volume-front{border-color:var(--binding);background:#eeeae1;color:#26322d;box-shadow:inset 0 0 0 1px #a9a89c,0 34px 60px -30px #14100a99}
.volume-art,.spine-art{position:relative;filter:saturate(.72) brightness(1.07);mix-blend-mode:normal}
.volume-art:before,.spine-art:before{content:"";position:absolute;inset:0;background:var(--art-wash);mix-blend-mode:color;opacity:.32;pointer-events:none}
.shelf-reader #detail-art{position:relative;background:#e8e8e3}.shelf-reader #detail-art svg{filter:saturate(.72) brightness(1.07)}.shelf-reader #detail-art:after{content:"";position:absolute;inset:0;background:var(--art-wash,#b8c4c4);mix-blend-mode:color;opacity:.32;pointer-events:none}
