/* One physical book: a 500 × 680 cover and two 500 × 680 leaves.
   app.js fits this coordinate system into the available space with a uniform scale.
   Keep viewport dimensions out of these surfaces: resizing must not change their shape. */
.book-journey{height:290svh}
.book-journey .stage{height:100svh;min-height:0}
.book-world{perspective:none}
.book-world .book{width:1000px;height:680px;min-height:0;max-height:none;left:0;top:0;transform-origin:0 0;transform-style:flat;will-change:transform}
.book-shadow{display:none}
.book .back-board{left:calc(500px * (1 - var(--open)));top:-7px;width:calc(510px + 490px * var(--open));height:694px;transform:none;border-radius:9px;background:#38271b;z-index:0;box-shadow:2px 7px 0 #21140e,0 28px 60px #0009}
.book .page-block{left:500px;top:5px;width:508px;height:680px;transform:none;z-index:1;border-radius:0 7px 7px 0}
.book .spread{inset:0;width:1000px;height:680px;display:flex;transform:none;transform-style:flat;z-index:2;opacity:var(--spread-opacity,0)}
.book .paper{position:relative;width:500px;height:680px;flex:0 0 500px;padding:28px 34px 20px;transform:none;visibility:visible;color:#2c281e;background-image:radial-gradient(ellipse at 60% 55%,#f5e9ca 0%,#d7c49c 100%)}
.book .paper-left{opacity:var(--left-reveal,0);border-radius:8px 0 0 6px;box-shadow:inset -30px 0 40px -25px #422b19a0,inset 8px 0 20px #7a512b44}
.book .paper-right{position:relative;right:auto;opacity:1;border-radius:0 8px 6px 0;box-shadow:inset 30px 0 40px -25px #422b1980,inset -8px 0 20px #7a512b44}
.book .running-head{font-size:8px;letter-spacing:.08em;gap:12px;padding-bottom:12px}
.book .chapter{font-size:10px;letter-spacing:.21em;margin:23px 0 10px}
.book .chapter b{font-size:16px;margin-left:5px}
.book .paper h2{font-size:58px;line-height:.86;letter-spacing:-.04em;margin:0 0 25px;font-weight:600}
.book .paper h2 em{font-weight:500}
.book .page-video{padding:4px;width:100%;margin:0;flex-shrink:0}
.book .page-video img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.book .play-icon{width:50px;height:50px;top:45%;font-size:15px;border:1px solid #e8dcc69c;background:#161a14c9}
.book .image-caption{font-size:8px;line-height:1.3;letter-spacing:.12em;padding:9px 0 5px}
.book .page-description{font-size:21px;line-height:1.36;margin:25px 0 10px}
.book .page-description em{font-size:18px}
.book .ink-link{font-size:11px;line-height:1.5;letter-spacing:.1em;margin:0;padding:8px 0}
.book .ink-link span{margin-left:15px}
.book .page-number{font-size:12px;padding-top:10px;line-height:1}
.book .cover{left:500px;top:0;width:500px;height:680px;transform-origin:0 50%;transform:perspective(3000px) rotateY(var(--cover-angle,0deg));transform-style:preserve-3d;z-index:var(--cover-layer,5);opacity:var(--cover-opacity,1);pointer-events:none}
.book .cover-front,.book .cover-inside{inset:0;width:500px;height:680px;border-radius:4px 10px 10px 4px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.book .cover-front{transform:translateZ(1px);background-size:100% 100%,1250% auto;background-position:center,52.5% 70%;box-shadow:inset 10px 0 8px #090501,inset -3px 0 9px #d3a66a55,4px 4px 0 #180b06,7px 14px 24px #0007}
.book .cover-frame{width:88%;height:90%;padding:35px 24px;outline-offset:-8px}
.book .cover-kicker{top:45px;font-size:10px;max-width:none;letter-spacing:.18em;line-height:1.5}
.book .cover-emblem{font-size:45px;margin:20px 0 36px}
.book .cover-logo{width:95%;height:auto;max-height:none}
.book .cover-rule{width:65%;margin-top:30px;font-size:25px}
.book .cover-subtitle{font-size:18px;line-height:1.5;letter-spacing:.22em;margin:20px 0 0}
.book .cover-volume{bottom:35px;font-size:9px;letter-spacing:.15em;line-height:1.5}
.book .corner{font-size:49px}
.book .cover-inside{transform:rotateY(180deg) translateZ(1px);padding:28px 34px 20px;background:radial-gradient(ellipse at 60% 55%,#f5e9ca 0%,#d7c49c 100%);border:1px solid #b69e6c;box-shadow:inset -25px 0 40px -25px #422b1960,inset 8px 0 20px #7a512b44}
.book .inside-mark{font-size:100px;margin:24px}
.book .inside-mark span{font-size:70px;margin-left:-24px}
.book .inside-border>span:first-child{font-size:10px}
.book .inside-border p{font-size:30px}
.book .inside-border small{font-size:16px}
.book .ribbon{left:500px;top:650px;width:22px;height:76px;transform:none;z-index:3;opacity:var(--spread-opacity,0)}
.book-caption{top:clamp(65px,8svh,95px);width:auto;max-width:90%;white-space:nowrap}
.book-caption>span{font-size:9px;letter-spacing:.18em}
.book-caption p{font-size:38px;line-height:1.1;margin:10px 0}
.chapter-navigation{display:none}
.book-journey .journey-footer{bottom:24px;left:5%;right:5%}
.reduced-motion .book-journey{height:100svh}
.reduced-motion .book-journey .stage{height:100svh;min-height:0}
.reduced-motion .book-caption{top:125px}
.reduced-motion .book-journey .intro{display:none}
.reduced-motion .book-journey .book{top:0}

/* A tall desktop-site viewport on a phone needs the same readable single-leaf composition. */
@media(max-width:760px),(max-aspect-ratio:3/4){
  .site-header{height:clamp(76px,11svh,110px);padding:14px 6%}
  .brand{width:clamp(94px,24vw,170px)}
  .site-header nav{gap:clamp(20px,5vw,45px);margin-right:0;font-size:clamp(11px,2.6vw,20px)}
  .motion-control{position:fixed;bottom:max(14px,env(safe-area-inset-bottom));right:16px;z-index:30;padding:10px 12px;background:#11170fed;font-size:clamp(10px,2.4vw,18px);box-shadow:0 2px 15px #0008}
  .book-journey{height:290svh}
  .book-journey .stage{min-height:0;height:100svh}
  .book-journey .intro{top:clamp(98px,14svh,165px);left:6%;width:88%;text-align:center}
  .intro .eyebrow{justify-content:center;font-size:clamp(7px,1.9vw,15px);letter-spacing:.13em;margin:0}
  .intro h1{font-size:clamp(50px,14vw,110px);line-height:.86;margin:20px 0 15px}
  .intro-copy{font-size:clamp(11px,2.8vw,21px);line-height:1.65;margin:0}
  .open-book{font-size:clamp(11px,2.8vw,21px);gap:40px;margin:17px auto 0;padding:10px 0}
  .intro-bottom{display:none}
  .room{background-position:50% 50%}
  .room-shade{background:linear-gradient(0deg,#10120f,transparent 24%,#0c100e77 55%,#0b100edc 98%),linear-gradient(90deg,#0d120eb0,#10120f55)}
  .book-world .book{width:1000px;height:680px;left:0;top:0;min-height:0}
  .book .back-board{left:500px;width:510px}
  .book .spread{left:0;right:auto;top:0;width:1000px;height:680px;display:block}
  .book .paper-left{display:none}
  .book .paper-right{position:absolute;left:500px;top:0;width:500px;height:680px;border-radius:7px;box-shadow:inset 12px 0 30px #68482944,inset -6px 0 20px #7a512b33}
  .book-caption{top:clamp(55px,8svh,125px);max-width:96%;width:96%;white-space:normal}
  .book-caption>span:first-child{font-size:clamp(8px,1.8vw,15px)}
  .book-caption>span:nth-of-type(2){display:none}
  .book-caption p{font-size:clamp(29px,7vw,57px);margin:8px 0 15px;line-height:1.1}
  .chapter-navigation{display:flex;justify-content:center;gap:12px;pointer-events:auto}
  .chapter-navigation button{color:#a9a18e;font-size:clamp(9px,2.3vw,18px);line-height:1.4;background:#11170f80;border:1px solid #af9a6b44;padding:8px 10px}
  .chapter-navigation button[aria-pressed=true]{color:#eedfc3;border-color:#b99a62;background:#322b1d99}
  .book-journey .journey-footer{bottom:max(19px,env(safe-area-inset-bottom));left:6%;right:6%}
  .journey-counter{display:none}
  .scroll-cue{font-size:clamp(8px,1.9vw,14px)}
  .reduced-motion .book-caption{top:clamp(95px,13svh,160px)}
  .reduced-motion .book-journey .book{top:0}
  .keeper-section{grid-template-columns:1fr}
  .keeper-image{min-height:0;height:clamp(300px,70vw,600px)}
  .keeper-image:after{background:linear-gradient(0deg,#171914,transparent 35%)}
  .keeper-copy{padding:20px 8% 55px}
}
@media(max-width:760px) and (max-height:700px){
  .book-journey .intro{top:90px}
  .intro h1{font-size:48px;margin:15px 0 12px}
  .intro-copy{font-size:11px;line-height:1.5}
  .open-book{margin-top:12px;padding:8px 0}
  .book-caption{top:35px}
  .book-caption p{font-size:27px;margin-bottom:12px}
  .reduced-motion .book-caption{top:90px}
}
