/* Exactly one photographic master per version. No mask, gradient or repeated background. */
.world{background:#233123}.continuous-master{position:absolute;inset:0;z-index:-1;display:block;width:100%;height:100%;pointer-events:none}.continuous-master img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:none;mask-image:none;-webkit-mask-image:none}.review-note{font-size:10px;max-width:230px}.compare-link{max-width:100px;position:fixed;right:max(18px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));z-index:4;display:inline-flex;align-items:center;min-height:36px;padding:5px 10px;background:#f4efe5f2;color:#34432e;font-size:11px;text-decoration:none}.opening-copy,.ending-copy{text-shadow:0 1px 4px #14200f99}.letter-scroll{color:#263122;background:#f7f1e6f2;padding:24px 18px}.letter-scroll>.eyebrow{color:#414d39}.letter-copy{line-height:1.65}.journey-tools{font-size:11px}.movement-hint{font-size:10px}.opening h1,.ending h2{overflow-wrap:anywhere}.unfold,.again{padding:3px 10px;background:#233123e8;color:#fffaf0}
/* B is one tall photographic environment with a native vertical flow. */
body[data-axis=y]{background:#233123;--portrait-width:min(100vw,560px);--portrait-height:calc(var(--portrait-width)*10)}
body[data-axis=y] .journey{overflow-y:auto;overflow-x:hidden;background:#233123}
body[data-axis=y] .world{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:calc(var(--portrait-height)*.17) calc(var(--portrait-height)*.36) minmax(calc(var(--portrait-height)*.26),auto) calc(var(--portrait-height)*.21);width:var(--portrait-width);height:auto;min-height:var(--portrait-height);margin:0 auto}
body[data-axis=y] .opening,body[data-axis=y] .letter-scene,body[data-axis=y] .ending{position:relative;left:auto;width:100%;height:auto;min-width:0;min-height:0;align-items:center;justify-content:center;padding-left:clamp(28px,7vw,60px);padding-right:clamp(28px,7vw,60px)}
body[data-axis=y] .opening h1{font-size:clamp(50px,13vw,74px)}body[data-axis=y] .opening-copy{padding-bottom:40px;max-width:100%}body[data-axis=y] .opening{padding-top:70px;padding-bottom:80px}body[data-axis=y] .unfold{left:clamp(28px,7vw,60px);bottom:32px}
body[data-axis=y] .photograph-field{position:relative;width:100%;height:100%;margin:0;min-width:0}
body[data-axis=y] .memory-walk{left:6%;top:4%;width:82%}
body[data-axis=y] .memory-baking{left:auto;right:5%;top:28%;width:44%}
body[data-axis=y] .memory-room{left:5%;top:38%;width:44%}
body[data-axis=y] .memory-dog{left:10%;top:57%;width:56%}
body[data-axis=y] .memory-table{left:auto;right:5%;top:74%;width:48%}
body[data-axis=y] .memory-snow{left:6%;top:88%;width:80%}
body[data-axis=y] .letter-scene{padding:58px 28px 66px;align-items:center}
body[data-axis=y] .letter-scroll{overflow:visible;max-height:none;height:auto;min-height:0;padding:24px 12px 22px;background:#f7f1e6e8;scroll-margin-top:70px}
body[data-axis=y] .letter-scroll h2{font-size:clamp(31px,7vw,40px)}body[data-axis=y] .letter-copy{font-size:18px;line-height:1.65}body[data-axis=y] .signature{font-size:38px}
body[data-axis=y] .ending{padding-top:60px;padding-bottom:110px;align-items:center}body[data-axis=y] .ending h2{font-size:clamp(43px,11vw,60px)}body[data-axis=y] .ending-copy{max-width:100%;padding-bottom:0}body[data-axis=y] .again{left:clamp(28px,7vw,60px);bottom:76px}
body[data-axis=y] .journey-tools{left:50%;right:auto;transform:translateX(-50%);width:calc(min(100vw,560px) - 36px)}
@media(max-width:360px){.review-note{font-size:9px;max-width:190px}.compare-link{font-size:10px;right:12px;padding:5px 8px}.letter-scroll{overflow-wrap:anywhere}body[data-axis=y] .letter-scene{padding-left:20px;padding-right:20px}body[data-axis=y] .letter-scroll{padding-left:12px;padding-right:12px}}
@media(max-height:500px){body[data-axis=y]{--portrait-width:min(100vw,460px)}body[data-axis=y] .journey-tools{width:calc(min(100vw,460px) - 36px)}body[data-axis=y] .opening h1{font-size:62px}body[data-axis=y] .ending h2{font-size:52px}.compare-link{top:8px;min-height:30px}.review-note{top:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Enlarged text stays reachable without changing the ordinary composition. */
body[data-axis=x] .opening-copy,body[data-axis=x] .ending-copy{max-height:calc(100% - 320px);overflow-y:auto;scrollbar-width:thin}
body[data-axis=y] .world{grid-template-rows:minmax(calc(var(--portrait-height)*.17),auto) calc(var(--portrait-height)*.36) minmax(calc(var(--portrait-height)*.26),auto) minmax(calc(var(--portrait-height)*.21),auto)}
.journey-tools{flex-wrap:wrap;row-gap:0}.movement-hint{white-space:normal}
@media(max-height:500px){body[data-axis=x] .opening-copy,body[data-axis=x] .ending-copy{max-height:calc(100% - 200px)}}