/* The guide emerges from the same blue space as the journey-guideion. */
:root{--journey-guide-orange:#ffa866;--journey-guide-night:#111e32;--journey-guide-mist:#dfe7ef}
.journey-guide{position:relative;isolation:isolate;width:min(100%,680px);max-width:680px;margin:0 auto 46px;padding:0;border:0;text-align:center;color:#edf1f7;grid-column:1/-1;min-width:0;pointer-events:auto}
.journey-guide-stage{position:relative;width:100%;overflow:visible}
/* An oval falloff reaches transparency inside every frame edge, including
   the cropped hairline. No horizontal or vertical video boundary survives. */
.journey-guide video{display:block;width:100%;aspect-ratio:1088/704;object-fit:contain;background:transparent;mask-image:radial-gradient(ellipse 49% 49% at 50% 49%,#000 40%,#000e 58%,#0008 76%,#0002 91%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 49% 49% at 50% 49%,#000 40%,#000e 58%,#0008 76%,#0002 91%,transparent 100%);mask-composite:add;-webkit-mask-composite:source-over}
.journey-guide-caption{min-height:3.7em;max-width:42ch;margin:-12px auto 0;position:relative;color:var(--journey-guide-orange);font:500 clamp(17px,1.65vw,22px)/1.6 'DM Sans',sans-serif;text-wrap:balance;padding:0 16px}
.journey-guide-controls{display:flex;gap:15px;justify-content:center;align-items:center;flex-wrap:wrap;font-size:12px;min-height:44px}
.journey-guide button,.journey-guide-sound{font:500 12px/1.4 'DM Sans',sans-serif;color:#e5edf6;background:transparent;border:1px solid #a7b6cc60;border-radius:24px;min-height:44px;padding:10px 18px;cursor:pointer}
.journey-guide-status{color:#a7b6cc}.journey-guide-transcript{font:13px/1.8 'DM Sans',sans-serif;max-width:56ch;margin:8px auto;color:#a7b6cc;text-align:left}.journey-guide-transcript summary{text-align:center;cursor:pointer}.journey-guide-transcript p{padding:10px 18px}
.journey-guide-sound{position:fixed;bottom:20px;right:20px;z-index:90;background:#111e3aef;box-shadow:0 4px 20px #0004;backdrop-filter:blur(12px)}
.journey-guide button:focus-visible,.journey-guide-sound:focus-visible,.journey-guide-transcript summary:focus-visible,.journey-guide-arrival button:focus-visible{outline:3px solid var(--journey-guide-orange);outline-offset:4px}
.journey-guide-arrival{background:#111e32;color:#e5edf6;border:1px solid #647b9860;padding:clamp(24px,5vw,56px);width:min(540px,calc(100% - 36px));box-sizing:border-box;max-height:90vh;border-radius:8px;box-shadow:0 30px 100px #0009}
.journey-guide-arrival::backdrop{background:#081322ce;backdrop-filter:blur(9px)}.arrival-brand{color:var(--journey-guide-orange);font:14px 'DM Sans',sans-serif}.journey-guide-arrival h2{font:400 clamp(32px,5vw,46px)/1.15 Georgia,serif;margin:25px 0}.journey-guide-arrival>p:not(.arrival-brand){font:16px/1.8 'DM Sans',sans-serif;color:#c2cedd}.journey-guide-arrival small{display:block;color:#a7b6cc;font:12px/1.7 'DM Sans',sans-serif;margin-top:25px}.arrival-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.arrival-actions button{flex:1;min-height:48px;border:1px solid #a7b6cc70;background:transparent;color:#edf1f7;border-radius:4px;padding:12px 18px;font:500 14px 'DM Sans',sans-serif;cursor:pointer}.arrival-actions button:first-child{background:#ffa866;color:#111e32;border-color:#ffa866}
.hero{flex-wrap:wrap}.hero>.journey-guide{flex:0 0 100%;z-index:2;margin-top:35px}.section>.journey-guide,.closing>.journey-guide,.history-teaser>.journey-guide{grid-column:1/-1;position:relative;z-index:2}.history-teaser>.journey-guide{width:min(100%,600px)}
.h-hero{grid-template-columns:1fr!important;text-align:center}.h-hero>.journey-guide{grid-row:1;margin-bottom:5px}.h-intro{max-width:760px;margin:auto}.h-actions{justify-content:center}.h-hero .h-intro h1{font-size:clamp(42px,5vw,68px)}
.h-journey{background:var(--journey-guide-night);color:#edf1f7}.h-journey .h-section-head .eyebrow{color:#a7b6cc}.act-nav{border-color:#a7b6cc40}.act-nav a,.act-nav small{color:#a7b6cc}.act-nav a[aria-current]{color:#ffa866;border-color:#ffa866}
.story-panel{padding:65px 0 90px;border-bottom:1px solid #a7b6cc30;gap:25px 70px;scroll-margin-top:10px}.story-panel>.journey-guide{grid-column:1/-1}.story-copy>p:not(.eyebrow){color:#c2cedd}.story-copy h3{color:#edf1f7}.story-art{opacity:.85}.story-panel .eyebrow,.story-panel .narrator-aside,.story-panel .diagram-label{color:#a7b6cc}.story-panel .takeaway{color:#edf1f7;border-color:#ffa866}.story-panel .story-turn a{color:#ffa866}.story-panel .journey-guide-caption{color:#ffa866}.story-panel .journey-guide{margin-top:0}
@media(max-width:700px){.journey-guide{margin-bottom:24px}.journey-guide-caption{font-size:17px;min-height:4.8em}.journey-guide-sound{bottom:12px;right:12px}.story-panel{padding:32px 0 55px;gap:18px}.h-hero{padding-top:15px}.hero>.journey-guide{margin-top:10px}.arrival-actions{flex-direction:column}.journey-guide-transcript{padding:0 10px}}
#story .journey-guide{color:#1c2a3d}#story .journey-guide-caption{color:#a34200}#story .journey-guide button{color:#1c2a3d;border-color:#405a7880}#story .journey-guide-transcript,#story .journey-guide-status{color:#405a78}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}}


/* Keep the introduction above the original hero composition in normal flow. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 32px;min-height:0;align-items:center}
.hero>.journey-guide{grid-column:1/-1;grid-row:1;margin:0 auto 36px}
.hero>.hero-copy{grid-column:1;grid-row:2;width:100%;min-width:0}
.hero>.hero-art{position:relative;inset:auto;grid-column:2;grid-row:2;width:100%;height:auto;aspect-ratio:840/750;opacity:1;min-width:0}
.hero>.anatomy-tools{position:relative;inset:auto;transform:none;grid-column:2;grid-row:3;justify-self:center;max-width:100%;flex-wrap:wrap;justify-content:center}
.hero>.art-caption{position:static;transform:none;grid-column:2;grid-row:4;text-align:center;white-space:normal}
.hero .hero-actions{flex-wrap:wrap}
.journey-guide .journey-guide-caption{margin:8px auto 0;max-width:42ch;color:var(--journey-guide-orange)}
#story .journey-guide-caption{color:#a34200}
.skip:not(:focus){clip-path:inset(50%);width:1px;height:1px;padding:0;overflow:hidden;white-space:nowrap}
.skip:focus{clip-path:none;width:auto;height:auto;z-index:9999}
@media(max-width:1000px){
 .hero{grid-template-columns:minmax(0,1fr);padding-bottom:45px}
 .hero>.hero-copy{grid-column:1;grid-row:2}
 .hero>.hero-art{grid-column:1;grid-row:3;width:min(100%,680px);justify-self:center}
 .hero>.anatomy-tools{grid-column:1;grid-row:4}
 .hero>.art-caption{grid-column:1;grid-row:5}
 .hero>.journey-guide{margin-bottom:24px}
}
/* Compact guides stay beside the exhibit instead of occupying a full screen. */
.journey-guide{width:min(100%,280px);max-width:280px;margin:0 auto 22px}
.hero>.journey-guide,.h-hero>.journey-guide{width:min(100%,440px);max-width:440px;margin-bottom:18px}
.journey-guide .journey-guide-caption{font-size:16px;line-height:1.5;min-height:3em;padding:0 4px;margin-top:4px}
.journey-guide-controls{gap:6px}.journey-guide button{padding:8px 13px}.journey-guide-transcript{font-size:12px;line-height:1.6}.journey-guide-transcript p{padding:8px 4px}
.story-panel{grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr);gap:20px 48px;padding:40px 0 55px;align-items:start}
.story-panel>.journey-guide{grid-column:1;grid-row:1;margin:0 auto}
.story-panel>.story-copy{grid-column:2;grid-row:1/span 2;max-width:none;padding-top:8px}
.story-panel>.story-art{grid-column:1;grid-row:2;padding-top:0}
.story-panel .scene{max-height:220px}.story-panel .narrator-aside{font-size:23px;margin-bottom:16px}
#story{gap:22px 48px;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr)}
#story>.journey-guide{grid-column:1;grid-row:1;margin:0 auto}
#story>.story-intro{grid-column:1;grid-row:2}
#story>:not(.journey-guide):not(.story-intro){grid-column:2;grid-row:1/span 2}
#story .author{margin-top:24px}
.compact-guide-section{display:grid;grid-template-columns:280px minmax(0,1fr);gap:22px 40px;align-items:start}
.compact-guide-section>.journey-guide{grid-column:1;grid-row:1;margin:0 auto}
.compact-guide-section>.compact-section-heading{grid-column:2;grid-row:1;min-width:0}
.compact-guide-section>:not(.journey-guide):not(.compact-section-heading){grid-column:1/-1}
#demonstration .section-top{display:block;margin-bottom:0}#demonstration .section-top>p{max-width:550px;margin-top:20px}
#next .compact-section-heading h2{font-size:clamp(40px,5vw,76px);margin-top:18px}
#principles{grid-template-columns:280px minmax(0,1fr);gap:20px 40px}
#principles>.journey-guide{grid-column:1;grid-row:1;margin:0 auto}
#principles>div:not(.standards){grid-column:2;grid-row:1}
#principles>.standards{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.history-teaser>.journey-guide{width:min(100%,220px);max-width:220px;margin-bottom:12px}
.history-teaser{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px 24px}
.history-teaser>.journey-guide{grid-column:1;grid-row:1/span 2}
.history-teaser>.history-teaser-head{grid-column:2;grid-row:1;flex-wrap:wrap}
.history-teaser>.history-lead{grid-column:2;grid-row:2;display:block;padding-top:0}
.history-teaser .teaser-proof{display:none}
.history-teaser>:not(.journey-guide):not(.history-teaser-head):not(.history-lead){grid-column:1/-1}
@media(max-width:1100px){.history-teaser{grid-template-columns:1fr}.history-teaser>.journey-guide,.history-teaser>.history-teaser-head,.history-teaser>.history-lead{grid-column:1;grid-row:auto}}
@media(max-width:800px){
 .hero>.journey-guide,.h-hero>.journey-guide{width:min(100%,360px);max-width:360px}
 .journey-guide{width:min(100%,240px);max-width:240px}
 .story-panel,#story,.compact-guide-section,#principles{grid-template-columns:minmax(0,1fr);gap:18px}
 .story-panel>.journey-guide,.story-panel>.story-copy,.story-panel>.story-art,#story>.journey-guide,#story>.story-intro,#story>:not(.journey-guide):not(.story-intro),.compact-guide-section>.journey-guide,.compact-guide-section>.compact-section-heading,#principles>.journey-guide,#principles>div:not(.standards){grid-column:1;grid-row:auto}
 .story-panel>.journey-guide{order:0}.story-panel>.story-copy{order:1}.story-panel>.story-art{order:2}
 #principles>.standards{display:block}
 .story-panel .narrator-aside{font-size:20px}
 .compact-guide-section>.journey-guide{margin-bottom:4px}
}
.story-panel .takeaway p{color:#edf1f7}.story-panel .takeaway small,.story-panel .story-source,.story-panel .story-turn>span{color:#a7b6cc}.story-panel .story-copy>p{max-width:68ch}

html:has(dialog[open]){overflow:hidden;scrollbar-gutter:stable}

.device-volume-reminder{padding:16px;border:1px solid #ffa866;border-radius:12px;color:#ffa866!important;font-weight:500}
@media(max-width:1000px),(pointer:coarse){html{scroll-behavior:auto!important}.demo-console,.handoff,.journey-guide{overflow-anchor:none}.handoff.handoff-reserved[hidden]{display:block!important;visibility:hidden;pointer-events:none;box-sizing:border-box}.demo-console{height:820px;max-height:88svh;min-height:610px}}
@media(max-width:1000px),(pointer:coarse){.journey-guide-caption{height:7.2em;min-height:7.2em;overflow-y:auto}}

@media(max-width:1000px),(pointer:coarse){
 .journey-guide-stage{aspect-ratio:1088/704;overflow:hidden}
 .journey-guide-stage video{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
 .journey-guide-controls{display:grid;grid-template-columns:1fr;grid-template-rows:44px 54px;gap:8px;min-height:106px;align-items:start;justify-items:center}
 .journey-guide-controls button{height:44px;min-width:155px;white-space:nowrap}
 .journey-guide-status{display:block;height:54px;max-height:54px;overflow:auto;width:100%;line-height:18px}
}
