.bookshelf-page{--oak:url("/assets/bookshelf/white-oak-horizontal.jpg");--oak-upright:url("/assets/bookshelf/white-oak.jpg");--oak-wash:oklch(90% .055 78 / .38);--cabinet-edge:18px;margin-top:3.5rem}.bookshelf-intro{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:2rem}.bookshelf-intro h1{font-size:clamp(2.6rem,6vw,3.6rem);font-weight:800;letter-spacing:-.055em;line-height:1.05;margin:0 0 .65rem}.bookshelf-intro h1 span{color:var(--color-highlight)}.bookshelf-deck{max-width:48ch;font-size:1rem;line-height:1.55}.bookshelf-deck p{margin:0}.bookshelf-tools{display:flex;flex-direction:column;align-items:end;gap:.55rem}.bookshelf-setting{display:flex;align-items:center;gap:.2rem;font-size:.75rem;white-space:nowrap}.bookshelf-setting[hidden]{display:none}.bookshelf-setting>span{margin-right:.5rem}.bookshelf-setting button{padding:.35rem .65rem;min-height:36px;cursor:pointer;border:1px solid transparent;border-radius:3px}.bookshelf-setting button[aria-pressed=true]{color:var(--color-highlight);border-color:color-mix(in srgb,var(--color-highlight) 45%,transparent);background:color-mix(in srgb,var(--color-highlight) 7%,transparent)}.bookshelf-setting button:hover{color:var(--color-highlight)}.bookshelf-setting button:focus-visible{outline:2px solid var(--color-highlight);outline-offset:3px}.bookcase{position:relative;isolation:isolate;container-type:inline-size;padding:var(--cabinet-edge)var(--cabinet-edge)0;background:linear-gradient(90deg,oklch(14% .03 145/.6),transparent 5%,transparent 95%,oklch(14% .03 145/.65)),var(--color-bg);box-shadow:12px 18px 32px oklch(12% .025 135/.28),2px 4px 4px oklch(12% .025 135/.4)}.bookcase-upright{position:absolute;top:0;bottom:0;width:var(--cabinet-edge);z-index:4;background-image:linear-gradient(var(--oak-wash),var(--oak-wash)),var(--oak-upright);background-size:auto,120px 720px;box-shadow:inset 1px 0 oklch(98% .025 78/.45),inset -2px 0 2px oklch(35% .06 65/.4)}.bookcase-upright-left{left:0;background-position:0 0,38% 0}.bookcase-upright-right{right:0;background-position:0 0,72% -120px}.bookcase-upright-left::after,.bookcase-upright-right::after{content:"";position:absolute;inset:var(--cabinet-edge)-7px 0 auto;width:7px;background:linear-gradient(90deg,oklch(53% .07 70),oklch(67% .075 76));box-shadow:3px 0 5px oklch(12% .03 145/.22)}.bookcase-upright-right::after{left:-7px;right:auto;background:linear-gradient(90deg,oklch(61% .07 72),oklch(46% .055 65))}.bookcase-crown{position:absolute;inset:0 var(--cabinet-edge)auto;height:var(--cabinet-edge);z-index:4;background-image:linear-gradient(var(--oak-wash),var(--oak-wash)),var(--oak);background-size:auto,840px 200px;box-shadow:inset 0 1px oklch(97% .025 78/.6),inset 0 -2px 2px oklch(32% .05 65/.4),0 8px 15px oklch(12% .03 145/.25)}.shelf-grid{--book-height:clamp(170px, 30cqi, 290px);--headroom:clamp(38px, 5cqi, 52px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(14px,2.8cqi,28px);padding:0 clamp(17px,2.7cqi,28px)}.book-slot{order:var(--desktop-order);height:calc(var(--book-height) + var(--headroom));display:flex;align-items:end;justify-content:center;min-width:0;padding-bottom:6px;position:relative;z-index:2}.book-slot:has(.is-lifted),.book-slot:focus-within{z-index:5}.book-object{position:relative;width:min(100%,calc(var(--book-height) * var(--cover-ratio)));aspect-ratio:var(--cover-ratio)}.book-cover{position:absolute;inset:0;display:block;cursor:pointer;border-radius:1px 3px 3px 1px}.book-cover:focus-visible{outline:2px solid var(--color-highlight);outline-offset:7px}.book-cover.is-pointer-return:focus-visible{outline:none}.book-motion{display:block;position:absolute;inset:0;transform-origin:var(--book-pivot);transition:translate 340ms cubic-bezier(.4,0,.2,1),scale 320ms cubic-bezier(.4,0,.2,1),rotate 300ms cubic-bezier(.4,0,.2,1)90ms}.book-jacket{position:absolute;inset:0;display:block;overflow:hidden;border-radius:1px 3px 3px 1px;background:oklch(39% .09 var(--book-hue));box-shadow:1px 0 oklch(93% .03 78/.6),3px 1px oklch(64% .03 78),4px 2px 1px oklch(13% .02 135/.65)}.book-jacket::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,oklch(10% .02 70/.3),oklch(97% .025 78/.23) 1.7%,oklch(10% .02 70/.17) 3%,transparent 5%,oklch(10% .02 70/.15) 6%,transparent 8%,transparent 96%,oklch(97% .025 78/.18) 99%,oklch(10% .02 70/.3));box-shadow:inset 0 1px oklch(97% .025 78/.25),inset 0 -1px oklch(12% .025 70/.3)}.book-jacket img{width:100%;height:100%;object-fit:fill;position:relative}.book-jacket img[hidden]{display:none}.book-rest-shadow,.book-lift-shadow{position:absolute;inset:0;pointer-events:none}.book-rest-shadow{box-shadow:0 1px 1px oklch(10% .02 135/var(--rest-contact-opacity,.6)),3px -2px 10px oklch(10% .02 135/var(--rest-wall-opacity,.35));transition:opacity 220ms ease-out 180ms}.book-lift-shadow{inset:12% 5% -1%;background:oklch(10% .02 135/.6);filter:blur(14px);opacity:0;transition:opacity 260ms ease-in,transform 340ms ease-out}.book-object.is-lifted .book-motion{translate:0 -12%;rotate:var(--book-tilt);scale:1.04;transition:rotate 380ms cubic-bezier(.3,0,.2,1),translate 460ms cubic-bezier(.22,1,.36,1)70ms,scale 460ms cubic-bezier(.22,1,.36,1)70ms}.book-object.is-lifted .book-rest-shadow{opacity:0;transition-delay:0ms}.book-object.is-lifted .book-lift-shadow{opacity:1;transform:translateY(-4%)scale(1.03);transition:opacity 380ms ease-out 60ms,transform 460ms cubic-bezier(.22,1,.36,1)}.book-object.is-selected .book-motion,.book-object.is-selected .book-rest-shadow,.book-object.is-selected .book-lift-shadow{visibility:hidden}.book-fallback{display:flex;position:absolute;inset:0;padding:10%;flex-direction:column;justify-content:space-between;color:oklch(94% .025 78);font-size:.7rem;line-height:1.3}.book-fallback strong{font-size:clamp(1rem,2.2cqi,1.5rem);line-height:1.1}.shelf-board{order:var(--shelf-order);grid-column:1/-1;position:relative;height:25px;margin:0 calc(-1 * clamp(17px,2.7cqi,28px));z-index:1;background-image:linear-gradient(180deg,oklch(92% .055 78/.45),oklch(85% .065 76/.26) 65%,oklch(45% .06 68/.26)),var(--oak);background-size:auto,920px 220px;background-position:0 0,0 42%;box-shadow:inset 0 1px oklch(97% .03 78/.55),inset 0 -1px oklch(40% .065 65/.6),0 3px 2px oklch(10% .03 135/.2),0 13px 17px oklch(10% .03 135/.35)}.shelf-board:nth-of-type(2n){background-position:0 0,-110px 72%}.shelf-surface{position:absolute;inset:-12px 0 auto;height:12px;z-index:-1;background-image:linear-gradient(180deg,oklch(60% .065 74/.55),oklch(93% .06 78/.5)),var(--oak);background-size:auto,920px 160px;box-shadow:inset 0 1px oklch(40% .055 70/.4)}.shelf-board-mobile{display:none}.decor-object{position:relative;height:calc(var(--book-height) * var(--decor-height));aspect-ratio:var(--decor-aspect);max-width:100%}.decor-object img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(4px 0 7px oklch(10% .02 135/var(--decor-shadow-opacity,.4)));user-select:none;pointer-events:none}.decor-contact{position:absolute;bottom:-4px;left:var(--decor-base-start);right:var(--decor-base-end);height:9px;border-radius:50%;background:radial-gradient(ellipse,oklch(10% .02 135/.7),transparent 72%)}.book-jacket.book-worn{isolation:isolate;-webkit-mask-image:var(--wear-mask);mask-image:var(--wear-mask);-webkit-mask-size:100% 100%;mask-size:100% 100%}.book-worn[data-wear=light]>img{filter:saturate(.95)}.book-worn[data-wear=heavy]>img{filter:saturate(.75)}.book-wear-layer{position:absolute;inset:0;pointer-events:none;z-index:1;background:var(--wear-overlay)50%/100% 100%;opacity:.3}[data-wear=heavy]>.book-wear-layer{opacity:1}.book-flyer-tilt:has(.book-worn){filter:drop-shadow(10px 18px 24px oklch(8% .02 135/.5))}.bookcase[data-style=oak] :is(.bookcase-backs,.bookcase-mid,.bookcase-plinth){display:none}.bookcase[data-style=billy]{--front:oklch(97% .006 85);--edge:oklch(87% .01 85);--top-back:oklch(92% .012 85);--top-front:oklch(96% .008 85);--back:oklch(91% .012 85);--wall-in:oklch(86% .016 85);--hole:oklch(30% .02 75 / .5);--rest-contact-opacity:.25;--rest-wall-opacity:.12;--decor-shadow-opacity:.12;padding-bottom:48px;background:var(--front)}.bookcase[data-style=billy][data-finish=brown]{--front:oklch(33% .016 60);--edge:oklch(24% .014 60);--top-back:oklch(27% .014 60);--top-front:oklch(31% .016 60);--back:oklch(23% .012 60);--wall-in:oklch(28% .014 60);--hole:oklch(12% .012 60 / .8);--rest-contact-opacity:.6;--rest-wall-opacity:.35;--decor-shadow-opacity:.4}@media(prefers-color-scheme:dark){.bookcase[data-style=billy][data-finish=auto]{--front:oklch(33% .016 60);--edge:oklch(24% .014 60);--top-back:oklch(27% .014 60);--top-front:oklch(31% .016 60);--back:oklch(23% .012 60);--wall-in:oklch(28% .014 60);--hole:oklch(12% .012 60 / .8);--rest-contact-opacity:.6;--rest-wall-opacity:.35;--decor-shadow-opacity:.4}}.bookcase-backs{position:absolute;inset:var(--cabinet-edge)var(--cabinet-edge)48px;display:grid;grid-template-columns:1fr 1fr;gap:calc(2 * var(--cabinet-edge));pointer-events:none}.bookcase-bay{position:relative;background:var(--back);box-shadow:inset 0 12px 20px -8px oklch(15% .02 75/.25)}.bookcase-bay::before,.bookcase-bay::after{content:"";position:absolute;top:0;bottom:0;width:7px;background:radial-gradient(circle at 50% 50%,var(--hole) 0 1.2px,transparent 1.8px)0 6px/7px 34px repeat-y,var(--wall-in)}.bookcase-bay::before{left:0;box-shadow:2px 0 4px oklch(15% .02 75/.1)}.bookcase-bay::after{right:0}.bookcase-mid{position:absolute;top:0;bottom:0;left:calc(50% - var(--cabinet-edge));width:calc(2 * var(--cabinet-edge));z-index:4;background:linear-gradient(90deg,transparent calc(50% - 1px),var(--edge) 50%,transparent calc(50% + 1px)),var(--front)}.bookcase-plinth{position:absolute;bottom:0;left:10px;right:10px;height:48px;background:linear-gradient(oklch(15% .02 75/.18),transparent 60%),var(--front)}.bookcase[data-style=billy] .bookcase-upright,.bookcase[data-style=billy] .bookcase-crown{background:var(--front);box-shadow:inset 1px 0 var(--top-front),inset -1px 0 var(--edge)}.bookcase[data-style=billy] .bookcase-upright::after{display:none}.bookcase[data-style=billy] .shelf-grid{column-gap:clamp(28px,5cqi,48px);--headroom:64px}.bookcase[data-style=billy] .shelf-board{background:linear-gradient(var(--top-front),var(--front) 2px,var(--front) calc(100% - 2px),var(--edge));box-shadow:inset 0 1px var(--top-front),0 8px 12px -6px oklch(15% .02 75/.25)}.bookcase[data-style=billy] .shelf-surface{background:linear-gradient(var(--top-back),var(--top-front));box-shadow:inset 0 1px oklch(15% .02 75/.1)}@media(max-width:640px){.bookcase-backs{grid-template-columns:1fr}.bookcase-mid,.bookcase-bay-second{display:none}.bookcase[data-style=billy] .shelf-grid{column-gap:clamp(18px,5cqi,28px);--headroom:54px}}.bookshelf-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1rem;margin:1.7rem 0 0;font-size:.72rem;line-height:1.5}.bookshelf-footer a{color:inherit;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--color-text) 40%,transparent)}.bookshelf-footer a:hover{color:var(--color-highlight)}.book-detail{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;border:0;margin:0;padding:0;overflow:auto;overscroll-behavior:contain;background:0 0;color:var(--color-text)}.book-detail::backdrop{background:oklch(15% .025 140/0);transition:background 380ms ease-out}.book-detail.is-visible::backdrop{background:oklch(15% .025 140/.96)}.book-detail-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,8vw,8rem);align-items:center;width:min(100% - 6rem,1000px);min-height:100%;margin:0 auto;padding:6rem 0}.book-detail-visual{display:flex;flex-direction:column;align-items:center;gap:2rem}.book-detail-cover-slot{height:min(58dvh,460px);aspect-ratio:var(--cover-ratio,.66);max-width:100%}.book-detail-content,.book-detail-navigation,.book-detail-close{opacity:0;transition:opacity 180ms ease-out}.book-detail.is-visible .book-detail-content,.book-detail.is-visible .book-detail-navigation,.book-detail.is-visible .book-detail-close{opacity:1;transition:opacity 320ms ease-out 180ms}.book-detail.is-switching .book-detail-content{opacity:0;transition:opacity 140ms ease-in}.book-detail-label{font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--color-highlight);margin-bottom:1.2rem}.book-detail-content h2{font-size:clamp(2rem,4vw,3.3rem);font-weight:700;line-height:1.08;letter-spacing:-.035em;margin:0 0 .9rem;overflow-wrap:break-word}.book-detail-author{font-size:.95rem;margin-bottom:2rem}.book-detail-summary{font-size:1.05rem;line-height:1.75;margin-bottom:1.5rem;max-width:42ch}.book-detail-note{font-size:.9rem;line-height:1.6;color:var(--color-highlight);margin-bottom:1.5rem}.book-detail-link{font-size:.85rem;text-decoration:underline;text-underline-offset:5px}.book-detail-link>span[aria-hidden]{margin-left:.3rem}.book-detail-close{position:fixed;top:1.5rem;right:2rem;z-index:5;display:flex;align-items:center;gap:.5rem;min-height:44px;padding:.5rem;font-size:.8rem;cursor:pointer}.book-detail-navigation{display:flex;align-items:center;justify-content:center;gap:1.2rem}.book-detail-navigation button{width:44px;height:44px;font-size:1.5rem;cursor:pointer;border:1px solid color-mix(in srgb,var(--color-text) 35%,transparent);border-radius:50%;transition:color .2s,border-color .2s}.book-detail-position{font-size:.75rem;min-width:3rem;text-align:center;font-variant-numeric:tabular-nums}.book-detail button:hover{color:var(--color-highlight);border-color:var(--color-highlight)}.book-detail button:focus-visible,.book-detail a:focus-visible{outline:2px solid var(--color-highlight);outline-offset:4px}.book-detail button:disabled{opacity:.25;cursor:default}.book-flyer{position:fixed;top:0;left:0;pointer-events:none;z-index:2;transform-origin:center;perspective:1200px}.book-flyer-tilt{position:absolute;inset:0;transform-style:preserve-3d}.book-flyer .book-jacket{box-shadow:2px 1px oklch(83% .04 78),5px 3px oklch(55% .035 78),10px 18px 35px oklch(8% .02 135/.5)}@media(max-width:640px){.bookshelf-page{--cabinet-edge:12px;margin-top:2.5rem}.bookshelf-intro{display:block;margin-bottom:1.5rem}.bookshelf-tools{align-items:start;margin-top:.8rem;gap:.35rem}.bookshelf-setting button{min-height:44px}.shelf-grid{--book-height:clamp(155px, 57cqi, 310px);--headroom:40px;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(18px,5cqi,28px);padding:0 18px}.book-slot{order:var(--mobile-order)}.shelf-board{height:21px;margin-left:-18px;margin-right:-18px}.shelf-board-mobile{display:block}.decor-desktop-only,.shelf-board-desktop-only{display:none}.bookcase-upright-left::after,.bookcase-upright-right::after{width:4px}.bookcase-upright-left::after{right:-4px}.bookcase-upright-right::after{left:-4px}.book-detail-layout{grid-template-columns:1fr;align-content:start;gap:1.7rem;width:min(100% - 3rem,440px);padding:5rem 0 3rem}.book-detail-visual{gap:1.1rem}.book-detail-cover-slot{height:min(39dvh,320px)}.book-detail-close{top:.7rem;right:1rem}.book-detail-content h2{font-size:2rem}.book-detail-label{display:none}.book-detail-author{margin-bottom:1rem}.book-detail-summary{font-size:1rem;line-height:1.65}}@media(prefers-reduced-motion:reduce){.book-motion,.book-rest-shadow,.book-lift-shadow,.book-detail::backdrop,.book-detail-content,.book-detail-navigation,.book-detail-close{transition:none !important}.book-object.is-lifted .book-motion{translate:none;rotate:none;scale:none}}