@font-face{font-family:Fell;src:url('assets/world-v2/fell.ttf') format('truetype');font-display:swap}
[hidden]{display:none!important}
.spread{opacity:var(--open)}
:root{color-scheme:dark;--ink:#35241c;--red:#742b28;--cream:#eedaa7;--open:0;--smile:0;--turn:0deg;--zoom:1;--pan:0px;--lift:0px;--px:0px;--py:0px}
*{box-sizing:border-box}html{background:#170f0c;scrollbar-color:#72563b #170f0c}body{margin:0;font-family:Fell,Georgia,serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #f5de9a;outline-offset:5px}button:disabled{opacity:.3;cursor:default}#journey{height:620svh}.stage{position:fixed;inset:0;overflow:hidden;background:#170f0c}.camera{position:absolute;inset:0;transform:translate(var(--pan),var(--lift)) scale(var(--zoom));transform-origin:50% 68%;will-change:transform}.world{position:absolute;width:max(100vw,177.683vh);height:max(100vh,56.28vw);left:50%;top:50%;transform:translate(-50%,-50%)}.room{position:absolute;inset:0;transform:translate(calc(var(--px)*.15),calc(var(--py)*.15))}.room img{width:100%;height:100%;display:block}.host{position:absolute;left:31%;top:9%;width:38%;aspect-ratio:1;transform:translate(calc(var(--px)*.6),calc(var(--py)*.6))}.host img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.smile{opacity:var(--smile)}.rest{opacity:calc(1 - var(--smile))}.book-anchor{position:absolute;left:50%;top:43%;width:52%;aspect-ratio:1513/1040;transform:translateX(-50%) translate(var(--px),var(--py));perspective:2200px}.book{position:relative;width:100%;height:100%;transform:rotateX(12deg);transform-style:preserve-3d}.spread{position:absolute;inset:0;background:url('assets/world-v2/book-spread.webp') center/100% 100% no-repeat;filter:drop-shadow(0 14px 15px #0008)}.page{position:absolute;top:12%;height:73%;width:36.8%;color:var(--ink);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3.2%;container-type:inline-size}.left-page{left:9%}.right-page{right:9%}.tale-number{font-size:4.4cqw;letter-spacing:.2em;text-transform:uppercase;margin:0}.page h1,.page h2{font-weight:400;font-size:15cqw;line-height:.95;margin:0;color:var(--red);max-width:95%;text-wrap:balance}.page .description{font-size:6.9cqw;line-height:1.35;margin:3% 3% 0;text-wrap:pretty}.page .tagline{font-size:6cqw;line-height:1.2;font-style:italic;max-width:90%;margin:auto 0 3%}.story-etching{width:53%;height:22%;object-fit:cover;object-position:left;mix-blend-mode:multiply;opacity:.8;filter:sepia(1) contrast(1.25);margin-top:3%;mask-image:radial-gradient(ellipse,#000 45%,transparent 73%)}.thumbnail{width:100%;aspect-ratio:16/9;object-fit:contain;display:block;filter:sepia(.12);box-shadow:0 2px 5px #37201150}.watch{display:flex;flex-direction:column;align-items:center;background:none;border:0;padding:0;width:100%;color:var(--red);gap:3%;font-size:5cqw}.watch .medallion{width:32%;aspect-ratio:1;object-fit:contain;transition:transform .2s;filter:drop-shadow(0 3px 2px #34200b70)}.watch:hover .medallion{transform:scale(1.08)}.watch span{margin-top:-3%;letter-spacing:.08em}.review-label{font-size:4.8cqw;text-transform:uppercase;letter-spacing:.05em;color:#793a29}.turning-leaf{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center;transform:rotateY(var(--turn));transform-style:preserve-3d;pointer-events:none;visibility:hidden}.turning-leaf.active{visibility:visible}.leaf-face{position:absolute;inset:0;backface-visibility:hidden;background-image:url('assets/world-v2/book-spread.webp');background-size:200% 100%;background-position:right;transform:translateZ(.6px)}.leaf-face .page{width:73.6%;right:18%}.leaf-face.back{transform:rotateY(180deg);background-position:left}.leaf-face.back .page{left:18%}.cover{position:absolute;left:50%;top:-.1%;width:49.5%;height:100%;transform-origin:left center;transform:rotateY(calc(-180deg * var(--open)));transform-style:preserve-3d;filter:drop-shadow(4px 9px 9px #0008);pointer-events:none}.cover img{width:100%;height:100%;object-fit:fill}.cover.hidden{visibility:hidden}.foreground{position:absolute;bottom:-10%;left:-4%;width:108%;height:auto;pointer-events:none;transform:translate(calc(var(--px)*1.5),calc(var(--py)*1.5))}.invitation{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);text-align:center;white-space:nowrap;text-shadow:0 2px 8px #000}.invitation p{font-size:clamp(19px,2vw,30px);margin:0 0 12px}.invitation button,.ending button{border:0;border-bottom:1px solid #b59756;background:#1c100cc9;color:var(--cream);padding:12px 25px;font-size:20px}.invitation span{display:block;font-size:12px;letter-spacing:.18em;text-transform:uppercase;margin-top:14px;color:#dfcea9}.chapters{position:absolute;right:16px;top:48%;display:flex;flex-direction:column;gap:6px}.chapters button{width:44px;height:46px;color:#eddbb2;background:#43291de8;border:1px solid #b48b4e;font-size:20px}.chapters button[aria-current=true]{background:#762c27}.atmosphere{position:absolute;bottom:15px;right:20px;display:flex;gap:10px}.atmosphere button{color:#ead8b3;background:#211710bb;border:1px solid #9b794c70;padding:9px 12px;min-height:44px;font-size:13px}.reading-controls{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;align-items:center;gap:18px;white-space:nowrap}.reading-controls button{min-height:44px;padding:8px 13px;border:0;background:#24170fe8;color:#efdbac;font-size:16px}.reading-controls span{color:#f0dcb5;font-size:15px;text-shadow:0 2px 5px #000}.ending{position:absolute;left:50%;top:66%;transform:translateX(-50%);text-align:center;min-width:280px;text-shadow:0 2px 10px #000}.ending p{font-size:28px}.ending a{display:block;color:var(--cream);margin-top:24px}.screening{width:min(1000px,94vw);padding:20px;background:#1a1412;color:#e8d9b8;border:1px solid #a98448}.screening::backdrop{background:#070706ed}.screening-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.screening h2{font-weight:400;font-size:26px;margin:0 0 16px}.screening button{background:#512b23;color:#f8e8c5;border:1px solid #977344;padding:10px 16px;min-height:44px}.screening iframe{display:block;width:100%;aspect-ratio:16/9;border:0}.screening a{color:#e8c578}.no-script{position:fixed;bottom:0;background:#28170f;padding:20px}.no-script a{color:#edc580}
@media(max-aspect-ratio:3/4){.world{width:max(100vw,46.258vh);height:max(100vh,216.178vw)}.host{left:9%;top:28%;width:82%}.book-anchor{top:53%;width:94%}.book{transform:rotateX(6deg)}.foreground{width:135%;left:-19%;bottom:0}.camera{transform-origin:50% 70%}.invitation{bottom:5%}.chapters{right:5px;top:39%}.atmosphere{bottom:10px;right:12px}.atmosphere button{font-size:12px;padding:8px}.reading-controls{bottom:65px;gap:8px}.reading-controls button{font-size:15px}.reading-controls span{font-size:13px}.ending{top:74%}.ending p{font-size:22px}.screening{padding:12px}.screening h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}.room,.host,.foreground,.book-anchor{will-change:auto}}
/* Keep the desktop desk below the page text, with the host beneath the sign. */
@media(aspect-ratio > 3/4){.host{left:35%;top:23%;width:30%}.book-anchor{top:43%;width:47%}.foreground{bottom:-28%}}
.book-anchor{transform:translateX(calc(-75% + 25% * var(--open))) translate(var(--px),var(--py))}
@font-face{font-family:Rye;src:url('assets/world-v2/rye.ttf') format('truetype');font-display:swap}
.page h1,.page h2{font-family:Rye,Fell,Georgia,serif;font-size:12.5cqw;line-height:1.12;text-transform:uppercase}
.story-etching{width:85%;height:25%;object-fit:contain;mix-blend-mode:normal;opacity:1;filter:none;mask-image:none}
.camera{will-change:auto}
.book{width:1513px;height:1040px;transform-origin:top left;transform:scale(var(--book-scale)) rotateX(6deg)}
@media(max-aspect-ratio:3/4){.foreground{bottom:8%}.chapters{top:23%;right:8px}}
.stage{overflow:clip}
html{scrollbar-width:none}html::-webkit-scrollbar{display:none}
@media(max-aspect-ratio:3/4){.host{left:4%;top:25.6%;width:92%}.book-anchor{top:48%;width:110%}.foreground{left:-7.5%;width:115%;bottom:9%}}
@media(aspect-ratio > 3/4){.book-anchor{top:38%;width:min(47%,90vh)}}
.foreground{aspect-ratio:1672/941}.foreground img{display:block;width:100%;height:100%}
@media(max-aspect-ratio:3/4){.foreground{left:0;width:100%;height:100%;aspect-ratio:auto;bottom:-5%}}
@media(max-aspect-ratio:3/4) and (min-width:700px) and (pointer:coarse){.chapters button{width:11.3vw;height:12vw;font-size:5vw}.reading-controls{bottom:16.6vw;gap:2vw}.reading-controls button{font-size:4vw;min-height:11.3vw;padding:2vw 3vw}.reading-controls span{font-size:3.3vw}.atmosphere{bottom:2.5vw;right:3vw;gap:2vw}.atmosphere button{font-size:3.3vw;min-height:11.3vw;padding:2vw}.invitation p{font-size:5vw}.invitation button{font-size:5vw}}
.page{gap:2%}.page .description{font-size:6.4cqw;line-height:1.3}.story-etching{height:20%}.page .tagline{margin:1% 0 3%}
@media(aspect-ratio > 3/4){.host{left:37%;top:18%;width:26%}.foreground{bottom:-12%}}
.room{transform:translate(calc(var(--px)*.15),calc(var(--py)*.15)) scale(var(--room-bleed,1))}
/* Revision 2: one original brand mark; native-size, two-sided book geometry. */
.room > picture{display:block;width:100%;height:100%}
.room .library-logo{position:absolute;left:37%;top:9.2%;width:26%;height:19%;object-fit:contain;mix-blend-mode:screen}
.book-anchor{perspective:none}
.book{transform:scale(var(--book-scale));perspective:3200px;perspective-origin:50% 50%;transform-style:preserve-3d}
.book-rig{position:absolute;inset:0;transform:rotateX(3deg);transform-origin:50% 50%;transform-style:preserve-3d}
.spread{opacity:1;clip-path:inset(0 0 0 var(--spread-left,50%))}
.turning-leaf{transform:translateZ(18px) rotateY(var(--turn));transform-origin:0 50%;will-change:transform}
.leaf-face{filter:brightness(var(--leaf-shade,1));-webkit-backface-visibility:hidden;backface-visibility:hidden}
.leaf-face.front{clip-path:polygon(0 9%,85% 1%,92% 1%,94% 4%,97% 89%,94% 91%,78% 90%,0 94%);transform:translateZ(3px)}
.leaf-face.back{clip-path:polygon(100% 9%,15% 1%,8% 1%,6% 4%,3% 89%,6% 91%,22% 90%,100% 94%);transform:rotateY(180deg) translateZ(3px)}
.cover{width:50%;top:0;filter:none;transform:translateZ(36px) rotateY(calc(-180deg * var(--open)))}
.cover-front,.cover-back{position:absolute;inset:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.cover-front{transform:translateZ(6px)}
.cover-front img{display:block;width:100%;height:100%;object-fit:fill}
.cover-back{transform:rotateY(180deg) translateZ(6px);background:url('assets/world-v2/book-spread.webp') left center/200% 100% no-repeat}
.cover-back .page{left:18%;right:auto;width:73.6%}
@media(max-aspect-ratio:3/4){.room .library-logo{left:26%;top:11.5%;width:48%;height:9.8%}}
@media(aspect-ratio > 3/4){.room .library-logo{top:9.5%;height:10.5%}}
/* Decorative depth planes must not intercept the projected page's hit areas. */
.room,.host{pointer-events:none}
.book-anchor,.book,.book-rig{pointer-events:none}
#spread{pointer-events:auto}
/* Squarer portrait screens use the wide room, preserving the sign and book. */
@media(aspect-ratio > 13/20) and (max-aspect-ratio:3/4){
 .world{width:max(100vw,177.683vh);height:max(100vh,56.28vw)}
 .host{left:37%;top:18%;width:26%}
 .book-anchor{top:38%;width:min(47%,90vh)}
 .room .library-logo{left:37%;top:9%;width:26%;height:9%}
 .foreground{left:-4%;bottom:-12%;width:108%;height:auto;aspect-ratio:1672/941}
}

/* Homepage depth pass. Independent 3D planes share a perspective camera. */
/* Additional room depth: nearby shelving moves faster than the distant window.
   Feathered boundaries blend over the complete original room underneath. */
.room > .background-plane{position:absolute;inset:0;pointer-events:none;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.room-core{mask-image:linear-gradient(to right,transparent 24%,#000 27%,#000 73%,transparent 76%)}
.background-left{z-index:2;mask-image:linear-gradient(to right,#000 0%,#000 26%,transparent 28%);transform-origin:0 55%;transform:translate3d(calc(var(--px)*.2),calc(var(--background-travel,0px)*-.72),24px) scale(var(--background-near-scale,1))}
.background-right{z-index:3;mask-image:linear-gradient(to left,#000 0%,#000 26%,transparent 28%);transform-origin:100% 55%;transform:translate3d(calc(var(--px)*.35),calc(var(--background-travel,0px)*-1.05),48px) scale(var(--background-near-scale,1))}
.background-window{z-index:1;mask-image:radial-gradient(ellipse 8% 20% at 50% 54%,#000 15%,transparent 100%);transform-origin:50% 52%;transform:translate3d(calc(var(--px)*-.2),calc(var(--background-travel,0px)*.3),-48px) scale(var(--background-far-scale,1))}
.room-atmosphere{z-index:2}.room .library-logo{z-index:3}
@media(max-aspect-ratio:13/20){
 .room-core{mask-image:linear-gradient(to right,transparent 22%,#000 25%,#000 75%,transparent 78%)}
 .background-left{mask-image:linear-gradient(to right,#000 0%,#000 24%,transparent 26%)}
 .background-right{mask-image:linear-gradient(to left,#000 0%,#000 24%,transparent 26%)}
 .background-window{mask-image:radial-gradient(ellipse 17% 22% at 50% 43%,#000 15%,transparent 100%);transform-origin:50% 43%}
}
@media(prefers-reduced-motion:reduce){.room > .background-plane{display:none}.room-core{mask-image:none}}
.room-atmosphere{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4;transform:translateZ(72px);mix-blend-mode:screen}.room .library-logo{z-index:5;transform:translateZ(96px)}
.book{position:absolute;left:0;top:0}
.world{perspective:1800px;perspective-origin:50% 60%;transform-style:preserve-3d}
.world{transform-style:flat}.room{z-index:0}.host{z-index:1}.book-anchor{z-index:2;transform-style:flat}.foreground{z-index:3}
.room{isolation:isolate;transform-style:flat;transform:translate3d(calc(var(--px)*.15),calc(var(--py)*.15 + var(--depth-y,0px)*-.12),-220px) scale(calc(var(--room-bleed,1)*1.130557))}
.host{isolation:isolate;transform-style:flat;transform:translate3d(calc(var(--px)*.6),calc(var(--py)*.6 - var(--depth-y,0px)*.3),-40px) scale(1.033708)}
.host .rest{z-index:0}.host .smile{z-index:1}
.book-anchor{transform:translateX(calc(-75% + 25% * var(--open))) translate3d(var(--px),var(--py),90px) scale(.968839);transform-style:preserve-3d}
.foreground{transform:translate3d(calc(var(--px)*1.5),calc(var(--py)*1.5 + var(--depth-y,0px)*1.35),calc(230px + var(--depth-z,0px))) scale(.920821);transform-origin:50% 100%}
@media(prefers-reduced-motion:reduce){.world{perspective:none}.room{transform:scale(var(--room-bleed,1))}.host,.foreground{transform:none}.book-anchor{transform:translateX(calc(-75% + 25% * var(--open)))}}
/* Touch devices retain parallax with one composited scenery texture.
   Only the book itself owns a 3D context; no masks or blend layers surround it. */
.mobile-scenery{display:none}
.touch-layout .world{perspective:none;transform-style:flat}
.touch-layout .room{transform:translate(calc(var(--px)*.15),calc(var(--py)*.15 - var(--depth-y,0px)*.12)) scale(calc(var(--room-bleed,1)*1.0074))}
.touch-layout .host{transform:translate(0,calc(var(--depth-y,0px)*-.3))}
.touch-layout .book-anchor{transform:translateX(calc(-75% + 25% * var(--open))) translate(var(--px),var(--py));transform-style:preserve-3d;isolation:auto}
.touch-layout .book-rig{transform:rotateX(0deg)}
.touch-layout .foreground{transform:translate(0,calc(var(--depth-y,0px)*1.35));transform-style:flat}
.mobile-composite .mobile-scenery{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.mobile-composite .room,.mobile-composite .host{display:none}
.touch-layout .spread{filter:none}
.touch-layout .leaf-face,.touch-layout .cover-front,.touch-layout .cover-back{backface-visibility:visible;-webkit-backface-visibility:visible}
.touch-layout .turning-leaf[data-face="front"] .back,.touch-layout .turning-leaf[data-face="back"] .front,.touch-layout .cover[data-face="front"] .cover-back,.touch-layout .cover[data-face="back"] .cover-front{visibility:hidden}
@media(prefers-reduced-motion:reduce){.touch-layout .foreground{transform:none}}