/* Near and far fabric cross the field at different speeds; scroll remains native. */
.dream-veil{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;opacity:var(--veil-opacity,0);will-change:transform,opacity}
.dream-veil img{height:100%;width:100%;object-fit:cover;object-position:left center;filter:brightness(.68);transform:none;transform-origin:left center}
.veil-near{right:auto;width:48%;transform:translate3d(var(--veil-near-x,0%),0,0) scale(var(--veil-near-scale,1));transform-origin:left center;mask-image:linear-gradient(90deg,#000 60%,transparent)}
.veil-near img{width:100%;max-width:100%}
.veil-far{left:auto;width:25%;transform:translate3d(var(--veil-far-x,0%),0,0);mask-image:linear-gradient(90deg,transparent,#000 50%)}
.veil-far img{width:100%;max-width:100%;object-position:left center}
/* The night is a broad map, not another left-hand illustration. */
.night-panorama .scroll-layout{display:block;max-width:1100px}
.night-panorama .chapter-visual{width:100%;margin:0 auto 48px;top:76px;background:var(--bg);z-index:3;padding:12px 30px;display:grid;grid-template-columns:1fr 1.6fr;column-gap:40px}
.night-panorama .stage-diagram{grid-column:2;grid-row:1/5;min-height:150px;max-height:210px;padding:0}
.night-panorama .stage-diagram .diagram{max-height:190px}
.night-panorama .stage-caption{font-size:14px;min-height:4em;margin:0}
.night-panorama .scene-kicker{margin-bottom:8px}.night-panorama .scene-track{margin-top:10px}
.night-panorama .stage-notice{display:none}.night-panorama .explore-link{font-size:12px;padding:2px}
.night-panorama .chapter-reading{max-width:720px;margin:auto}
/* Give memory a human-scale pause. The chair remains; only illumination changes. */
.memory-chapter .scroll-layout{display:block;width:100%;max-width:none}
.memory-chapter .chapter-visual{position:relative;top:auto;width:min(760px,calc(100% - 48px));margin:0 auto 60px;padding:0;display:block;background:transparent;min-height:0;border:0}
.memory-chapter .stage-caption{min-height:0}.memory-chapter .chapter-reading{width:100%;max-width:none}
.memory-chapter .chapter-reading>.prose{max-width:680px;width:calc(100% - 48px);margin-inline:auto}
.memory-focus{position:relative;isolation:isolate;min-height:90svh;display:flex;align-items:center;margin:80px 0;overflow:hidden}
.memory-image{position:absolute;inset:0;z-index:-2;margin:0;background:#181318}
.memory-image img{width:100%;height:100%;object-fit:cover;object-position:30% center;filter:none;transform:none;opacity:1}
.memory-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 24%,#181318b8 55%,#181318f2),linear-gradient(0deg,#1c181c,transparent 20%,transparent 85%,#1c181c)}
.memory-focus:after{content:'';position:absolute;inset:0;background:#181318;opacity:var(--memory-shade,.48);z-index:-1;pointer-events:none;will-change:opacity}
.memory-focus-copy{width:min(520px,43%);margin-inline:8vw auto;padding-block:80px;text-shadow:0 2px 18px #000}
.memory-focus-copy p{font-size:20px;line-height:1.9;margin:0}
.memory-focus-copy strong{display:block;font-family:ThmanyahDisplay;font-size:clamp(30px,3.1vw,45px);line-height:1.85;margin-top:24px;font-weight:400}
.memory-image figcaption{position:absolute;bottom:20px;left:30px;z-index:2;max-width:40%;font-size:11px;color:#d9cfc0;text-shadow:0 2px 10px #000}
.chapter-7 .scroll-layout{direction:rtl}
/* The same window, lamp and bedding reappear before the closing reflection. */
.dawn-return{height:180svh;position:relative}
.dawn-return-stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate;display:flex;align-items:center}
.return-night,.dawn-return .dawn-sticky{position:absolute;inset:0;height:100%;width:100%;margin:0;mask-image:none;z-index:-3}
.return-night img,.dawn-return .dawn-sticky img{width:100%;height:100%;object-fit:cover;object-position:center;transform:none!important;filter:none;opacity:1!important}
.dawn-return .dawn-sticky{z-index:-2;opacity:var(--return-daylight,0)!important;will-change:opacity}
.dawn-return-stage:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 18%,#1c1d2373 45%,#1c1d23e0 80%),linear-gradient(0deg,#1c1d23,transparent 20%,transparent 85%,#1c1d23)}
.return-copy{width:min(560px,44%);margin-inline:7vw auto;text-shadow:0 2px 20px #111}
.return-copy .chapter-heading{width:100%;margin:0 0 32px;padding:0}.return-copy h2{font-size:clamp(36px,4vw,60px);line-height:1.55}
.return-copy p{font-size:clamp(19px,1.7vw,24px);line-height:1.9;margin:0 0 18px}
.scroll-ending>.prose{padding-top:70px;padding-bottom:60px}
/* The actual window dissolves from its opening outward, before the next title. */
#sky-threshold{height:235svh}
#sky-threshold .portal-room{mask-image:radial-gradient(ellipse 10% 26% at 23% 38%,transparent 65%,#000 100%)!important;-webkit-mask-image:radial-gradient(ellipse 10% 26% at 23% 38%,transparent 65%,#000 100%)!important;mask-composite:add;-webkit-mask-composite:source-over;transform:scale(var(--portal-zoom,1));transform-origin:23% 38%;will-change:transform,opacity}
#sky-threshold .portal-room img{filter:brightness(.62) saturate(.8);transform-origin:23% 38%}
#sky-threshold .portal-note{font-size:clamp(34px,4.5vw,65px);max-width:48%}
@media(max-width:850px){
 .veil-near{width:60%}.veil-far{width:20%}
 .night-panorama .scroll-layout{width:calc(100% - 44px)}
 .night-panorama .chapter-visual{display:block;top:67px;width:calc(100% + 44px);margin:0 -22px 24px;padding:10px 22px;max-height:none}
 .night-panorama .stage-diagram{max-height:15svh;min-height:60px}.night-panorama .stage-diagram .diagram{max-height:15svh}
 .night-panorama .stage-caption{font-size:12px;min-height:3.4em;line-height:1.65}
 .memory-chapter .chapter-visual{margin:0 auto 45px;width:calc(100% - 44px)}
 .memory-chapter .stage-diagram{display:flex}.memory-chapter .stage-diagram .diagram{height:130px;max-height:130px}
 .memory-focus{min-height:110svh;align-items:flex-start;margin:56px 0}
 .memory-image img{object-position:27% center}
 .memory-image:after{background:linear-gradient(0deg,#1c181c,transparent 23%,#18131833 55%,#181318e8 90%)}
 .memory-focus-copy{width:calc(100% - 48px);margin:0 24px;padding:50px 0 0}
 .memory-focus-copy p{font-size:17px}.memory-focus-copy strong{font-size:29px;line-height:1.8;margin-top:14px}
 .memory-image figcaption{left:24px;right:24px;max-width:none;bottom:22px;font-size:10px}
 .dawn-return{height:170svh}.return-copy{width:calc(100% - 48px);margin:0 24px;align-self:flex-start;padding-top:95px}
 .return-copy h2{font-size:35px;line-height:1.55}.return-copy p{font-size:18px;line-height:1.85;margin-bottom:12px}
 .return-night img,.dawn-return .dawn-sticky img{object-position:27% center}
 .dawn-return-stage:after{background:linear-gradient(0deg,#1c1d23,transparent 30%,#1c1d2350 55%,#1c1d23dc 85%)}
 #sky-threshold{height:215svh}
 #sky-threshold .portal-note{max-width:none;font-size:39px}
}
@media(max-height:600px){
 .night-panorama .chapter-visual{position:relative;top:auto}
 .return-copy{align-self:center;padding-top:50px;width:60%;margin-inline:6vw auto}
 .return-copy h2{font-size:26px;margin:0}.return-copy p{font-size:15px;line-height:1.6;margin-bottom:8px}
 .memory-focus{min-height:130svh}.memory-focus-copy{width:60%;padding:40px 0}.memory-focus-copy strong{font-size:27px}
}
.motion-off .dream-veil{display:none}.motion-off .dawn-return{height:auto}
.motion-off .dawn-return-stage{position:relative;min-height:100svh}
.motion-off .dawn-return .dawn-sticky{opacity:1!important}
.motion-off #sky-threshold{height:auto}.motion-off .memory-focus:after{opacity:.2}
@media(prefers-reduced-motion:reduce){.dream-veil{display:none}.night-panorama .chapter-visual{position:relative;top:auto}}
@media print{.memory-image,.return-night,.dawn-sticky{display:none}.memory-focus,.dawn-return,.dawn-return-stage{height:auto;min-height:0;display:block}.memory-focus-copy,.return-copy{width:100%;margin:0;padding:0;color:black}}
/* Truly transparent at every scroll position, including hover and keyboard focus. */
.site-header,.site-header.is-reading,.site-header.dream-entered,.site-header.dream-entered.is-reading,.site-header:hover,.site-header:has(button:focus-visible){background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border:0;box-shadow:none}
.site-header a:focus-visible,.site-header button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
/* A single lightweight image, with living stars above it, not another bedroom. */
.portal-scene{background:#050505}
.portal-sky-image{position:absolute;inset:0;z-index:-3;margin:0;pointer-events:none}
.portal-sky-image img{width:100%;height:100%;object-fit:cover;object-position:30% center;opacity:.82}
.portal-sky-image:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0505050a,#0505054d 40%,#050505ed 76%),linear-gradient(0deg,#050505,transparent 25%,transparent 80%,#05050580)}
.portal-sky-image figcaption{position:absolute;bottom:24px;left:28px;z-index:1;font-size:11px;color:#cec5b8;text-shadow:0 1px 5px #000}
#portal-stars{background:transparent}
#sky-threshold .portal-room img{transform:none;filter:none}
.portal-scene .next-journey{align-items:flex-start;text-align:right;padding-inline:7vw;width:60%;margin-inline:0 auto;text-shadow:0 2px 16px #050505}
.portal-scene .next-journey .prose{max-width:600px}
.nathar-bridge-title{font:400 clamp(28px,3vw,40px)/1.65 ThmanyahDisplay;color:var(--ink);margin:0 0 22px}
/* Use compositor opacity/transform, not a changing full-screen filter. */
.opening-inview:not(.motion-off) .opening-stage:after{animation:none}
.opening .room,.opening-dream,.dream-veil{background:#070a10}
.opening .room img{filter:none;opacity:.9}
.opening-dream img{filter:none;opacity:.66}
.dream-veil img{filter:none;opacity:.68}
.wide-scene .cinema-visual .stage-photo img{filter:none;will-change:transform;transform:translateZ(0) scale(var(--wide-scale,1.02))}
@media(max-width:850px){.portal-scene .next-journey{width:100%;padding:74px 24px 55px;justify-content:flex-end}.portal-sky-image img{object-position:35% center}.portal-sky-image:after{background:linear-gradient(0deg,#050505f5, #050505b8 45%,#05050510 85%)}.portal-sky-image figcaption{bottom:15px;left:24px;font-size:10px}.portal-scene .next-journey .next-link{font-size:clamp(88px,24vw,125px)}.portal-scene .next-journey .prose{font-size:17px;line-height:1.8}}
@media(max-height:600px){.portal-scene .next-journey{justify-content:center;width:68%;padding:55px 30px 20px}.portal-scene .next-journey .next-link{font-size:72px;line-height:1.15}.portal-scene .next-journey .next-link span{margin-bottom:10px}.portal-scene .next-journey .prose{font-size:14px;line-height:1.6}.portal-sky-image figcaption{font-size:9px}}
.motion-off .portal-scene .next-journey{position:relative;min-height:100svh;opacity:1;visibility:visible;transform:none;pointer-events:auto}
/* Image-led grading: one low-chroma warm shadow, not a new hue per chapter.
   Static feathering follows the image borders; scroll changes light, not tint. */
:root{--scene-base:#16130f;--scene-rgb:22,19,15;--bg:var(--scene-base);--surface:#211d17}
body{background:#050505}
.introduction,.chapter,.chapter-1,.chapter-2,.chapter-3,.chapter-4,.chapter-5,.chapter-6,.chapter-7,.chapter-8,.chapter-9,.chapter-10,.chapter-11,.chapter-12{--bg:var(--scene-base);background:var(--scene-base)}
.opening,.opening .room,.opening-dream,.dream-veil{background:var(--scene-base)}
.opening .room-shade{background:linear-gradient(0deg,var(--scene-base),transparent 28%,rgba(var(--scene-rgb),.12) 75%,rgba(var(--scene-rgb),.3))}
.opening-dream:after{background:linear-gradient(0deg,var(--scene-base),transparent 35%,rgba(var(--scene-rgb),.08)),linear-gradient(90deg,transparent,rgba(var(--scene-rgb),.18))}
.opening-stage:before{background:#0c0b09}
.wide-scene .cinema-visual{background:var(--scene-base)}
.wide-scene.chapter-6 .cinema-visual:after{background:linear-gradient(90deg,rgba(var(--scene-rgb),.95),rgba(var(--scene-rgb),.78) 43%,rgba(var(--scene-rgb),.06) 76%),linear-gradient(0deg,var(--scene-base),transparent 20%,transparent 80%,var(--scene-base))}
.memory-image{background:var(--scene-base)}
.memory-image:after{background:linear-gradient(90deg,transparent 24%,rgba(var(--scene-rgb),.65) 55%,rgba(var(--scene-rgb),.92)),linear-gradient(0deg,var(--scene-base),transparent 22%,transparent 78%,var(--scene-base))}
.memory-focus:after{background:var(--scene-base)}
.scroll-ending{background:linear-gradient(180deg,var(--scene-base) calc(100% - 240px),#050505)}
.dawn-return-stage:after{background:linear-gradient(90deg,transparent 18%,rgba(var(--scene-rgb),.4) 45%,rgba(var(--scene-rgb),.83) 80%),linear-gradient(0deg,var(--scene-base),transparent 22%,transparent 78%,var(--scene-base))}
#sky-threshold .portal-room:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#050505,transparent 24%,transparent 76%,#050505)}
.nathar-ending{--bg:#050505;background:rgba(14,12,9,.06)}
.chapter-compass{inset:auto 28px 24px auto;max-width:min(420px,calc(100% - 56px));padding:11px 15px 12px;font-size:inherit;background:#050505e8;box-shadow:0 10px 35px #0006}
@media(max-width:850px){.chapter-compass{inset:auto 16px 18px auto;width:fit-content;max-width:calc(100% - 32px);padding:10px 13px 11px}}
@media(max-width:850px){
 .wide-scene.chapter-6 .cinema-visual:after{background:linear-gradient(0deg,var(--scene-base),transparent 20%,transparent 80%,var(--scene-base)),linear-gradient(90deg,rgba(var(--scene-rgb),.82),rgba(var(--scene-rgb),.59))}
 .memory-image:after{background:linear-gradient(0deg,var(--scene-base),transparent 24%,rgba(var(--scene-rgb),.15) 55%,rgba(var(--scene-rgb),.9) 90%)}
 .dawn-return-stage:after{background:linear-gradient(0deg,var(--scene-base),transparent 28%,rgba(var(--scene-rgb),.27) 55%,rgba(var(--scene-rgb),.83) 85%)}
}
@media print{body,.introduction,.chapter,.scroll-ending{background:white;color:black}.scroll-ending>.prose:last-child{background:white}}
/* Keep the transparent mobile header quiet over reading text. All hidden
   controls remain available from the chapters dialog. */
@media(max-width:767px){
 .site-header{transition:height .24s ease,padding .24s ease,gap .24s ease,transform .22s ease}
 .site-header.is-reading{height:54px;padding-inline:16px;gap:10px}
 .site-header.is-reading .work-name,
 .site-header.is-reading nav>a,
 .site-header.is-reading #motion{position:absolute;opacity:0;visibility:hidden;pointer-events:none}
 .site-header.is-reading nav{margin-inline-start:auto;gap:0}
 .site-header.is-reading #menu-open{min-height:44px;padding:8px 2px;font-size:13px}
 .site-header.is-reading .brand img{width:28px;height:28px}
 .site-header.is-reading.is-scrolling-down{transform:translateY(-100%);pointer-events:none}
 .site-header.is-reading.is-scrolling-down:focus-within{transform:none;pointer-events:auto}
}
/* The opening itself blinks: the room closes, the unseen line holds, then the dream returns. */
.site-header{opacity:var(--opening-chrome-opacity,1);will-change:opacity}.sleep-lids{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none}
.sleep-lid{position:absolute;inset-inline:0;height:53%;display:block;background:#090806;will-change:transform;backface-visibility:hidden}
.sleep-lid-top{top:0;transform:translate3d(0,var(--lid-top-y,-104%),0);border-radius:0 0 50% 50%/0 0 8% 8%;box-shadow:0 10px 34px #0008}
.sleep-lid-bottom{bottom:0;transform:translate3d(0,var(--lid-bottom-y,104%),0);border-radius:50% 50% 0 0/8% 8% 0 0;box-shadow:0 -10px 34px #0008}
.sleep-whisper{position:absolute;z-index:5;inset:50% 24px auto;transform:translateY(calc(-50% + var(--whisper-y,12px)));margin:0;text-align:center;font:400 clamp(31px,4.2vw,58px)/1.7 ThmanyahDisplay,ThmanyahSans,sans-serif;color:#f2ebdd;opacity:var(--whisper-opacity,0);filter:blur(var(--whisper-blur,5px));text-shadow:0 5px 34px #000;pointer-events:none;will-change:opacity,transform,filter}
.opening-inview:not(.motion-off)[data-phase="awake"] .room img{animation:room-breathe 8s var(--ease) infinite alternate;transform-origin:42% 62%}
.opening-inview:not(.motion-off)[data-phase="awake"] .opening-stage:after{animation:lamp-breathe 7s ease-in-out infinite alternate}
@keyframes room-breathe{from{transform:scale(1)}to{transform:scale(1.007)}}
@keyframes lamp-breathe{from{filter:opacity(.78)}to{filter:opacity(1)}}
.motion-off .sleep-lids,.motion-off .sleep-whisper{display:none}
@media(prefers-reduced-motion:reduce){.site-header{opacity:1!important}.sleep-lids,.sleep-whisper{display:none}.opening-inview .room img,.opening-inview .opening-stage:after{animation:none!important}}
@media(max-width:850px){.sleep-whisper{font-size:32px;inset-inline:28px}.sleep-lid{height:52%}}
