/* Loaded only for phones and short touch screens. Desktop styles/controllers
   remain byte-identical. Retain the original sticky reveals and transitions. */
html{-webkit-text-size-adjust:100%;scroll-padding-top:78px}
body{overflow-wrap:break-word}
.site-header,.road-header{padding:16px max(6vw,env(safe-area-inset-right)) 16px max(6vw,env(safe-area-inset-left));gap:18px}
.site-header>a,.road-header>a{flex-shrink:0;min-height:44px;display:flex;align-items:center}
.site-header nav,.road-header nav{gap:18px;font-size:11px;min-width:0;justify-content:flex-end}
.site-header nav a:not(.nav-archive),.road-header nav a{min-height:44px;display:inline-flex;align-items:center;line-height:1.5}
.site-header .private-label{display:none}
.site-header nav a span{margin-left:6px}
.section-kicker,.eyebrow{line-height:1.7}
/* Stable small-viewport stages prevent browser chrome resizing the scroll story. */
.hero-sticky,.reel-stage,.story-hero-stage,.mantalai-page .story-hero-stage,.khopra-page .story-hero-stage,.ebc-page .story-hero-stage,.hero-stage,.light-stage,.is-enhanced .weather-stage,.is-enhanced .sunrise-stage{height:100svh;min-height:0}
.hero{min-height:0}
.chapter-step{min-height:0}
.hero-eyebrow{top:104px;font-size:10px}
.hero-caption{font-size:12px;line-height:1.7}
.scroll-cue{min-height:44px;bottom:65px;font-size:10px}
.study-note{font-size:9px;bottom:24px;line-height:1.6}
.opening-bottom>p{font-size:14px;line-height:1.85}
.opening-bottom .text-link{font-size:12px;min-height:44px;display:inline-flex;align-items:center}
/* The six-stage reel retains every image, chapter, rail and scroll transition. */
.chapter-topline{top:100px;font-size:10px;line-height:1.5}
.chapter-topline>span:last-child{max-width:145px}
.chapter-copy{top:29%;width:86%}
.chapter-name{font-size:10px;margin-bottom:20px}
.chapter-copy h2{font-size:clamp(43px,11.8vw,72px);line-height:.97}
.chapter-summary{font-size:13px;line-height:1.75;max-width:32ch;margin-top:21px}
.chapter-open{min-height:44px;margin-top:18px;font-size:12px}
.chapter-open .round-arrow{width:44px;height:44px}
.chapter-rail{bottom:67px}
.chapter-rail a{min-width:40px;min-height:44px;padding:12px 0;font-size:10px}
.chapter-rail i{width:13px}.chapter-rail a.is-active i{width:22px}
.chapter-rail .rail-title{display:none}
.chapter-bottomline{font-size:9px;bottom:max(22px,env(safe-area-inset-bottom))}
.chapter-bottomline .art-label{font-size:8px;max-width:88px}
/* Editorial space and crops stay personal; text and controls become legible. */
#in-the-frame .media-intro>p,.home-moment figcaption>p{font-size:14px;line-height:1.85}
#in-the-frame .moment-road figcaption{flex-wrap:wrap;font-size:10px;gap:6px}
#in-the-frame .moment-road figcaption>span:last-child{font-size:9px}
#in-the-frame .motion-footnote{font-size:10px;line-height:1.8}
.home-moment-date{font-size:10px;line-height:1.7}
.moment-cup{grid-template-columns:1fr 1.1fr;gap:18px}
.moment-cup h3{font-size:28px}
.moment-forest .home-photo-link{aspect-ratio:4/3}
.home-expand{width:36px;height:36px}
.motion-controls,.scene-controls{flex-wrap:wrap;gap:8px}
.motion-controls button,.scene-controls button,.film-controls button{min-height:44px;font-size:11px;padding:10px 12px;line-height:1.5}
.motion-controls{left:12px;right:12px;bottom:12px}
.motion-controls .full-moment{font-size:10px}
.motion-label,.film-label{font-size:9px;max-width:85%;line-height:1.5}
.motion-stage,.film-window{min-height:230px}
.motion-stage>img,.motion-stage>video{object-fit:contain}
.motion-scene figcaption,.panorama-film>figcaption{flex-wrap:wrap;gap:8px}
.motion-scene figcaption>.caption-text,.panorama-film figcaption>.caption-text{flex-basis:100%;font-size:11px;line-height:1.8}
.motion-scene figcaption>span:last-child{font-size:9px;max-width:none;text-align:left}
.filters{flex-wrap:wrap;justify-content:flex-start;gap:5px}
.filters button,.collection-filters button{min-height:44px;font-size:11px;padding:10px 13px}
.filters button>span{font-size:9px}
.archive-top{padding:0}.archive-top>p{font-size:12px;line-height:1.8}
.sort-button{min-height:44px;font-size:11px}
.trip-card-meta{font-size:10px;line-height:1.7;gap:15px;align-items:start}
.trip-card-meta>span:last-child{text-align:right}
.trip-card-caption{font-size:12px}
.trip-card .card-arrow{width:40px;height:40px}
.closing-meta,.site-footer p{font-size:10px;line-height:1.8}
.site-footer{gap:20px;padding-bottom:28px}
/* Journey text is never reduced to a desktop layout scaled down. */
.intro-columns p,.m-intro-copy p,.k-intro-copy,.e-intro-copy,.k-prose,.ebc-page .k-prose,.people-copy>p:not(.section-kicker),.return-copy p{font-size:14px;line-height:1.9}
.camp-copy>p:last-child,.wilderness-head>p:last-child,.split-heading>p,.camp-heading>p:last-child,.arrival-wide>p,.k-closing-copy,.frames-heading>p{font-size:13px;line-height:1.85}
.story-figure figcaption>.caption-text{font-size:11px;line-height:1.85}
.story-figure figcaption{gap:12px;align-items:start}
.story-figure figcaption>.caption-text+span{font-size:9px;max-width:9ch}
.story-index a,.chapter-contents a,.k-closing-links a,.back-to-archive,.back-to-archive a{min-height:44px;font-size:11px;line-height:1.6;display:inline-flex;align-items:center}
.story-hero-bottom{bottom:max(28px,env(safe-area-inset-bottom))}
.story-hero-bottom a{min-height:44px;font-size:11px;line-height:1.7}
.story-hero-bottom>span{font-size:9px;line-height:1.7}
.story-eyebrow,.khopra-page .story-eyebrow,.mantalai-page .story-eyebrow{top:108px;font-size:10px}
.e-chapter-nav,.road-nav{font-size:11px;gap:24px;padding:7px 6vw;scroll-padding-inline:6vw;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.e-chapter-nav a,.road-nav a{min-height:44px;display:flex;align-items:center;flex-shrink:0}
.e-chapter-nav::after,.road-nav::after{content:'→';position:sticky;right:-6vw;padding:0 10px 0 16px;display:flex;align-items:center;background:linear-gradient(90deg,transparent,#102836 30%);pointer-events:none;color:#dbbd9f}
.road-nav::after{background:linear-gradient(90deg,transparent,#151819 30%);color:#fa743a}
.photo-tile-label,.khopra-page .photo-tile-label,.mantalai-page .photo-tile-label{font-size:10px;line-height:1.7}
.film-card-title{font-size:13px;line-height:1.5}
.film-card-detail,.film-quality,.film-card-caption{font-size:10px;line-height:1.8}
.film-play{width:44px;height:44px}
.meadow-navigation button,.sunrise-footer button{width:44px;height:44px;flex-shrink:0}
.meadow-slide figcaption,.meadow-slide figcaption button{font-size:10px;line-height:1.8}
.meadow-slide figcaption button{min-height:44px}
.meadow-slide figcaption>.caption-text{display:block}
.meadow-slide figcaption button{display:inline-flex;align-items:center;gap:12px;margin-top:10px}
.light-choices button,.weather-choices button{min-height:44px;font-size:11px;padding:10px 16px}
.light-bottom{gap:14px;bottom:max(24px,env(safe-area-inset-bottom))}
.light-bottom>p{font-size:11px;line-height:1.8}
.weather-controls p,#weather-caption,.weather-title>p:last-child{font-size:11px;line-height:1.8}
.weather-controls a{font-size:11px;min-height:44px;display:inline-flex;align-items:center}
.is-enhanced .weather-controls{bottom:max(24px,env(safe-area-inset-bottom))}
/* Keep the complete dawn compositions, with a larger photo and clear controls. */
.is-enhanced .sunrise-heading{top:7%;left:7vw;max-width:86%}
.is-enhanced .sunrise-heading h2{font-size:11.5vw}
.is-enhanced .sunrise-heading p:last-child{font-size:10px;line-height:1.7}
.is-enhanced .sunrise-images{inset:24% 0 30%}
.is-enhanced .sunrise-controls{left:6vw;right:6vw;bottom:max(16px,env(safe-area-inset-bottom))}
.sunrise-topline{margin-bottom:9px}.sunrise-topline p{font-size:11px;line-height:1.65;min-height:3.3em}
.sunrise-topline a{font-size:11px;min-height:40px;align-content:center;margin-top:0}
.sunrise-steps{gap:2px}.sunrise-steps button{min-height:44px;padding:7px 0 3px;text-align:center}
.sunrise-steps button span{font-size:11px}.sunrise-steps button small{font-size:8px}
.sunrise-footer{font-size:9px;gap:12px;margin-top:10px}
/* Route stops remain real anchors; the preview stays paired with its caption. */
.route-stop{min-height:88px;grid-template-columns:17px 1fr 10px;gap:6px}
.route-stop strong{font-size:13px}.route-stop small{font-size:10px;line-height:1.7}
.route-sheet{padding:16px}.route-stops{gap:0 12px}
.route-sheet-meta,.route-key{font-size:9px;line-height:1.7}
.route-preview>a{grid-template-columns:1fr;gap:0}
.route-preview-image{height:auto;aspect-ratio:4/3}
.route-preview-copy{padding:23px 0}
.route-preview h3{font-size:34px;margin-top:12px}
.route-preview-copy .eyebrow,.route-enter,.route-preview-hint{font-size:11px;line-height:1.7}
.route-enter{min-height:44px;margin-top:15px}
.route-preview-copy>p:not(.eyebrow){font-size:18px;line-height:1.6}
.road-hero .hero-stage{height:100svh}
.road-hero .hero-title{top:27%}
.road-hero .hero-caption{font-size:11px;max-width:88%;bottom:88px}
.road-hero .hero-open{min-height:44px;bottom:max(25px,env(safe-area-inset-bottom));font-size:11px}
.road-hero .hero-index{font-size:10px;top:110px}
.triptych{grid-template-columns:1fr 1fr;gap:20px}
.triptych .road-photo:last-child{grid-column:1/-1;width:82%;margin:15px auto 0}
.pair figcaption,.road-photo figcaption{font-size:12px;line-height:1.8}
.film-controls{padding:30px 12px 12px}
.film-stage{min-height:220px}
.film-grid{gap:28px 16px}
.film-grid .film-play{width:auto;height:auto}
.chapter-heading{grid-template-columns:1fr;gap:25px}
.intro-copy{grid-template-columns:1fr;gap:24px}
/* Dialogs use the currently visible height. Captions and close/next controls stay
   reachable with Safari toolbars and notches; existing swipe handling remains. */
:is(.photo-dialog,#photo-dialog),:is(.film-dialog,#film-dialog),.media-dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;inset:0;margin:0;overflow:auto}
.photo-dialog-top,.media-dialog-top,.dialog-top{padding:12px 5vw;gap:12px;min-height:76px}
.photo-dialog-top h2,.media-dialog-top h2{font-size:11px;line-height:1.6;max-width:48%}
.photo-dialog-top>button,.media-dialog-top>button,.dialog-top>button{min-width:44px;min-height:44px;padding:4px;font-size:11px;flex-shrink:0}
:is(.photo-dialog,#photo-dialog) .photo-viewer,.khopra-page :is(.photo-dialog,#photo-dialog) .photo-viewer{display:block;height:calc(100dvh - 200px);min-height:160px;padding:12px 5vw 0}
:is(.photo-dialog,#photo-dialog) .photo-viewer figure{display:grid;height:100%;grid-template-rows:minmax(0,1fr) auto;overflow:visible}
:is(.photo-dialog,#photo-dialog) .photo-viewer img{min-height:0;height:100%;max-height:100%;touch-action:pan-y pinch-zoom}
:is(.photo-dialog,#photo-dialog) .photo-viewer figcaption,.photo-viewer #viewer-caption{font-size:11px;line-height:1.75;max-width:100%;padding-top:14px}
:is(.photo-dialog,#photo-dialog) .photo-viewer>button{position:fixed;bottom:calc(42px + env(safe-area-inset-bottom));width:44px;height:44px;font-size:23px}
:is(.photo-dialog,#photo-dialog) :is(.photo-previous,#photo-previous){left:6vw}:is(.photo-dialog,#photo-dialog) :is(.photo-next,#photo-next){right:6vw}
.photo-dialog-bottom{position:fixed;bottom:env(safe-area-inset-bottom);font-size:10px;padding:12px 6vw;line-height:1.5;left:0;right:0;max-width:100%;justify-content:center}
.photo-dialog-bottom>span{display:none}
.full-film-view,.mantalai-page .full-film-view{width:100%;height:auto;min-height:calc(100dvh - 100px);padding:18px 5vw calc(22px + env(safe-area-inset-bottom));margin:0;gap:16px}
.full-film-view video,.mantalai-page .full-film-view video{width:100%;height:auto;max-height:60dvh;object-fit:contain}
.full-film-view p,.full-film-view .full-film-note{font-size:11px;line-height:1.8;max-width:100%}
.media-full-photo{height:calc(100dvh - 265px);min-height:150px;object-fit:contain}
.media-view{min-height:0;padding-bottom:calc(30px + env(safe-area-inset-bottom))}
.media-view figcaption{font-size:11px;line-height:1.8;max-width:100%}
.media-full-video{max-height:60dvh}
@media(max-width:380px){
 .hero h1{font-size:clamp(70px,21vw,89px)}
 .chapter-copy{top:27%}.chapter-copy h2{font-size:11.3vw}.chapter-summary{font-size:12px}
 .chapter-rail a{min-width:36px;gap:5px}.chapter-rail a.is-active i{width:18px}
 .moment-cup{grid-template-columns:1fr;gap:22px}.moment-cup .home-photo-link{width:70%;margin:auto}
 .filters button{font-size:10px;padding-inline:10px}
 .route-stop strong{font-size:12px}.route-stop small{font-size:9px}
}
@media(max-height:650px){
 .hero-eyebrow,.story-eyebrow,.khopra-page .story-eyebrow,.mantalai-page .story-eyebrow{top:92px}
 .hero h1{top:32%;font-size:clamp(65px,17vw,96px)}.hero-caption{top:65%;font-size:11px}
 .scroll-cue{bottom:48px}.study-note{bottom:16px;font-size:8px}
 .chapter-topline{top:82px;font-size:9px}.chapter-copy{top:25%}.chapter-copy h2{font-size:clamp(34px,9.5vw,54px)}
 .chapter-name{margin-bottom:12px;font-size:9px}.chapter-summary{font-size:12px;line-height:1.6;margin-top:14px}.chapter-open{margin-top:10px}
 .chapter-rail{bottom:48px}.chapter-bottomline{bottom:16px}
 .story-hero-bottom{bottom:20px}.story-hero-bottom>span{font-size:8px}
 .ebc-page .e-hero-copy{top:93px}.e-hero-copy h1{font-size:14vw;margin-top:12px}.e-hero-line{margin-top:12px}.e-enter{margin-top:6px}
 .ebc-page .e-hero-photo{height:33%;bottom:7%}
 .is-enhanced .sunrise-heading{top:6%}.is-enhanced .sunrise-heading h2{font-size:9vw;margin-top:12px}.is-enhanced .sunrise-heading p:last-child{display:none}
 .is-enhanced .sunrise-images{inset:24% 0 36%}
 .sunrise-topline p{font-size:10px;min-height:0}.sunrise-footer{margin-top:4px}
 .weather-title h2,.light-title h2{font-size:9vw}
}
@media(orientation:landscape) and (max-height:500px){
 .site-header,.road-header{padding-block:5px}.site-header .wordmark,.road-header .wordmark{font-size:26px}
 .hero h1{font-size:21svh;top:25%}.hero-eyebrow{top:68px;font-size:9px}.hero-caption{top:auto;bottom:75px}
 .study-note{font-size:8px}.hero-window{clip-path:inset(calc(10% * (1 - var(--open))) calc(7% * (1 - var(--open))))}
 .chapter-topline{top:70px}.chapter-copy{top:28%;max-width:75%}.chapter-copy h2{font-size:10svh}.chapter-summary{max-width:50ch;font-size:11px;margin-top:10px}.chapter-name{margin-bottom:10px}.chapter-open{position:absolute;right:-18%;bottom:0}
 .chapter-rail{left:auto;right:5vw;top:95px;bottom:50px;flex-direction:column;gap:0}.chapter-rail a{min-height:30px}
 .story-title,.mantalai-page .story-title{top:33%;font-size:18svh}.story-subtitle{top:auto;bottom:100px;font-size:24px}
 .story-hero-bottom{display:flex}.story-eyebrow,.khopra-page .story-eyebrow,.mantalai-page .story-eyebrow{top:75px;font-size:9px}
 .ebc-page .e-hero-copy{top:75px;left:6vw;width:43%}.e-hero-copy h1{font-size:14svh}.e-hero-line{font-size:10px}.ebc-page .e-hero-photo{left:53%;right:5%;top:22%;height:auto;bottom:13%}
 .ebc-page .e-hero-index{font-size:7px}
 .is-enhanced .sunrise-heading{left:5vw;max-width:40%;top:10%}.is-enhanced .sunrise-heading h2{font-size:9svh}.is-enhanced .sunrise-images{inset:8% 3% 34% 43%}
 .sunrise-topline{display:flex;gap:20px;margin:0}.sunrise-topline p{max-width:70%;font-size:10px}.sunrise-footer{margin-top:0}.sunrise-steps button{min-height:38px}
 .photo-dialog-top{min-height:58px;padding-block:7px}:is(.photo-dialog,#photo-dialog) .photo-viewer,.khopra-page :is(.photo-dialog,#photo-dialog) .photo-viewer{height:calc(100dvh - 135px);padding-inline:12vw}
 :is(.photo-dialog,#photo-dialog) .photo-viewer>button{bottom:45%;}:is(.photo-dialog,#photo-dialog) .photo-viewer figcaption{font-size:10px;padding-top:8px}
}
@media(prefers-reduced-motion:reduce){
 .hero-sticky,.story-hero-stage,.light-stage,.is-enhanced .weather-stage,.is-enhanced .sunrise-stage{height:auto;min-height:100svh}
 .hero-sticky,.story-hero-stage{height:100svh}
 .is-enhanced .weather-stage,.is-enhanced .sunrise-stage{min-height:0}
 .is-enhanced .sunrise-images{inset:auto}
}

#photo-dialog .dialog-bottom{position:fixed;bottom:env(safe-area-inset-bottom);left:0;right:0;font-size:10px;padding:12px 6vw;line-height:1.5}
