*{box-sizing:border-box}html,body{margin:0;overflow:hidden;width:100%;height:100%;background:#131b20;color:#faf6ed;font-family:Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #ffffff28;background:#14212a70;border-radius:100px;padding:13px 22px;backdrop-filter:blur(18px)}button:focus-visible,a:focus-visible{outline:2px solid #e7bb80;outline-offset:4px}button:hover{background:#33434ba8}button:disabled{opacity:.55;cursor:wait}[hidden]{display:none!important}canvas{display:block;touch-action:none;width:100%;height:100%;outline:0}.shade{pointer-events:none;position:fixed;inset:0;background:linear-gradient(#050b103d,transparent 22%,transparent 65%,#03090f87)}header{position:fixed;top:max(24px,env(safe-area-inset-top));left:32px;right:32px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}header img{width:235px;height:auto}header>div{display:flex;gap:20px;align-items:center}header button{pointer-events:auto;font-size:12px}#clock{font-size:12px;letter-spacing:3px;font-variant-numeric:tabular-nums}#welcome{position:fixed;left:8vw;top:23vh;text-shadow:0 2px 24px #0008;max-width:620px}h1{font-weight:400;letter-spacing:-4px;line-height:1.05;font-size:clamp(48px,7vw,94px);margin:22px 0}#welcome p{line-height:1.7;color:#e2ddd5;font-size:17px}#welcome button{background:#f3ede1;color:#263238;margin-top:20px;border:0;padding:18px 28px;font-weight:bold}#welcome small{display:block;margin-top:18px;color:#ddd;font-size:11px}.eyebrow,#chapterLabel{font-size:10px;letter-spacing:2.8px;line-height:1.8;color:#f4cf9f}#caption{position:fixed;left:40px;bottom:98px;max-width:350px;pointer-events:none;text-shadow:0 2px 12px #000;transition:opacity .2s}#caption h2{font-weight:400;font-size:30px;line-height:1.12;letter-spacing:-1px;margin:9px 0}#caption p{font-size:13px;line-height:1.6;color:#eee2d4;margin:0;max-width:300px}#controls{position:fixed;bottom:max(22px,env(safe-area-inset-bottom));left:40px;display:flex;gap:17px;align-items:center}#controls button{width:40px;height:40px;padding:0;font-size:25px}#instruction{font-size:10px;letter-spacing:.5px;color:#ded9d0}#menu{position:fixed;right:28px;top:85px;width:310px;max-height:calc(100dvh - 110px);overflow:auto;padding:18px;background:#11202ce8;border:1px solid #ffffff28;border-radius:22px;backdrop-filter:blur(24px)}#menu>button{display:block;text-align:left;width:100%;border:0;background:transparent;border-radius:8px;padding:11px;font-size:12px}#menu>button:hover{background:#ffffff15}hr{border:0;border-top:1px solid #ffffff20;margin:12px 0}details{font-size:11px;padding:12px;line-height:1.6;color:#b9c5cd}details a{color:inherit}#error{position:fixed;inset:30% 15%;background:#15232e;padding:35px;border-radius:20px}body[data-started="false"] .shade{background:linear-gradient(90deg,#061018d9,transparent)}@media(max-width:700px){header{left:20px;right:20px;top:max(18px,env(safe-area-inset-top))}header img{width:156px}header>div{gap:10px}header button{font-size:10px;padding:11px 13px}#clock{font-size:9px;letter-spacing:1px}#welcome{left:24px;right:24px;top:24vh}h1{font-size:57px;letter-spacing:-2.8px}#welcome p{font-size:14px}#welcome .eyebrow{font-size:8px;letter-spacing:1.8px}#caption{left:23px;right:23px;bottom:105px;max-width:300px}#caption h2{font-size:25px}#caption p{font-size:12px;max-width:280px}#chapterLabel{font-size:9px}#controls{left:20px;right:20px;justify-content:space-between;bottom:max(24px,env(safe-area-inset-bottom))}#instruction{font-size:9px}#menu{left:18px;right:18px;width:auto;top:76px}}@media(max-height:500px){#welcome{top:15vh}h1{font-size:45px;margin:10px 0}#welcome p{margin:8px 0}#welcome button{margin-top:8px;padding:12px 20px}#caption{bottom:70px}#caption h2{font-size:22px}#caption p{display:none}#controls{bottom:12px}}
header img{filter:brightness(0) invert(1)}
#actions{position:fixed;right:32px;bottom:86px;width:315px;padding:20px;border-radius:20px;background:#10202ce6;border:1px solid #ffffff30;backdrop-filter:blur(20px);box-shadow:0 15px 50px #0003}#actions h3{font-size:14px;font-weight:500;margin:0 0 14px}#actionButtons{display:flex;flex-wrap:wrap;gap:8px}#actionButtons button,#actionButtons a{padding:10px 13px;border-radius:10px;font-size:12px;color:#fff;text-decoration:none;border:1px solid #ffffff30;background:#ffffff0b;min-height:40px}#actionButtons [aria-pressed=true]{background:#f2dfbd;color:#17262c;border-color:#f2dfbd}#actionButtons button:disabled{opacity:.45;cursor:default}#actionButtons input{width:100%;accent-color:#ead3a8;margin-top:8px}#actionStatus{color:#c5cdd2;font-size:10px;line-height:1.5;margin:12px 0 0}#menu{max-height:calc(100dvh - 110px)}@media(max-width:700px){#actions{left:20px;right:20px;bottom:max(84px,calc(env(safe-area-inset-bottom) + 70px));width:auto;padding:15px}body:not([data-action=none]) #caption{top:86px;bottom:auto;max-width:300px}body:not([data-action=none]) #caption h2{font-size:22px}body:not([data-action=none]) #caption p{display:none}#actionButtons button,#actionButtons a{font-size:11px;padding:9px 11px}#actionStatus{font-size:9px}#welcome .eyebrow{letter-spacing:1.2px}}@media(max-height:500px){#actions{width:285px;bottom:62px;right:20px;padding:12px}#actionStatus{margin:7px 0 0}#actions h3{margin-bottom:8px}body:not([data-action=none]) #caption{top:auto;bottom:80px;left:20px;max-width:260px}#caption p{display:none}#welcome h1{font-size:40px}}
/* UI/UX control pass: preserve the scene, give controls stable, reachable space. */
:root{--ui-bg:#13232ef2;--ui-border:#ffffff38;--ui-accent:#f2dfbd;--safe-bottom:max(12px,env(safe-area-inset-bottom));--safe-top:max(18px,env(safe-area-inset-top))}
button{min-width:44px;min-height:44px;touch-action:manipulation;transition:background-color .16s,border-color .16s;backdrop-filter:none}
button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--ui-accent);outline-offset:3px}
#world:focus-visible{outline:2px solid #f2dfbd88;outline-offset:-3px}#world{cursor:grab}#world[data-dragging=true]{cursor:grabbing}
.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
header{z-index:10;left:max(24px,env(safe-area-inset-left));right:max(24px,env(safe-area-inset-right));top:var(--safe-top)}header button{background:var(--ui-bg)}
#centerView{position:fixed;z-index:15;left:50%;top:var(--safe-top);transform:translateX(-50%);padding:10px 18px;font-size:12px;white-space:nowrap;background:var(--ui-bg);border-color:var(--ui-border);box-shadow:0 4px 18px #0003}
#centerView span{margin-right:5px;font-size:18px;vertical-align:-1px}
#controls{z-index:20;left:max(28px,env(safe-area-inset-left));bottom:var(--safe-bottom);gap:12px;padding:8px;border:1px solid var(--ui-border);border-radius:22px;background:var(--ui-bg);box-shadow:0 6px 24px #0003;max-width:calc(100vw - 32px)}
#controls>#back,#controls>#next{width:48px;height:48px;min-width:48px;border-radius:15px;background:#ffffff0c;font-size:22px}
.controlMiddle{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0}.controlModes{display:flex;gap:8px;justify-content:center}#controls .controlModes button{width:auto;height:auto;min-height:44px;padding:8px 14px;font-size:12px;border-radius:12px;background:#ffffff08}
#lookMode[aria-pressed=true],#menu [aria-pressed=true]{background:var(--ui-accent);color:#17262c;border-color:var(--ui-accent)}#pauseTour{background:#54333a}
#instruction{font-size:11px;line-height:1.4;text-align:center;color:#eee5d8;letter-spacing:0}
#caption{bottom:126px}
#actions,body[data-action=tv] #actions{z-index:20;right:max(28px,env(safe-area-inset-right));bottom:var(--safe-bottom);width:320px;max-width:320px;max-height:calc(100dvh - 100px - env(safe-area-inset-top));overflow:auto;overscroll-behavior:contain;padding:16px;border-radius:22px;background:var(--ui-bg);border-color:var(--ui-border);backdrop-filter:blur(8px);scrollbar-width:thin;scroll-padding:8px}
.actionHeading{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:8px}#actions h3{font-size:14px;line-height:1.4;margin:0}#actionsToggle{padding:8px 10px;font-size:12px;border-radius:10px;background:#ffffff08;flex-shrink:0}
#actionButtons{gap:8px}#actionButtons button,#actionButtons a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font-size:12px;padding:10px 12px;line-height:1.3}#actionButtons input{height:44px;min-height:44px;margin:0;touch-action:pan-x}#actionStatus{font-size:12px;line-height:1.5;color:#d7dfe4;margin:10px 0 0}
body[data-action=tv] #actionButtons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}body[data-action=tv] #actionButtons button:first-child{grid-column:1/-1;background:#75323a}
#menu{z-index:40;right:max(24px,env(safe-area-inset-right));top:calc(var(--safe-top) + 56px);width:340px;max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 68px);background:#14232cf7;backdrop-filter:none;overscroll-behavior:contain;scroll-padding:10px;scrollbar-width:thin}
.menuHeading{display:flex;align-items:center;justify-content:space-between;gap:12px}.menuHeading h2{font-size:17px;margin:0;font-weight:500}.menuHeading button{font-size:12px;padding:8px 12px;border-radius:12px}.menuHint{font-size:12px;color:#d3dbe1;line-height:1.5;margin:8px 0 12px}
#menu>button{min-height:44px;font-size:13px;line-height:1.3;margin:4px 0}#menu [aria-current=step]{border-left:3px solid var(--ui-accent);background:#ffffff0c}
#menu details{font-size:12px;padding:8px 4px}summary{cursor:pointer;min-height:44px;padding:12px 4px;line-height:1.5}.lookPad{display:flex;gap:8px;justify-content:center}.lookPad button{padding:8px;width:48px;height:48px}
@media(max-width:760px){
 header{left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));top:var(--safe-top)}header img{width:144px}header>div{gap:8px}header button{font-size:12px;padding:10px 12px}#clock{font-size:11px;letter-spacing:1px}
 #centerView{top:calc(var(--safe-top) + 54px)}
 #controls{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));max-width:none;gap:8px;padding:8px;justify-content:space-between}#controls .controlMiddle{flex:1}#instruction{font-size:11px;max-width:230px}#controls .controlModes button{font-size:12px;padding:8px 10px}
 #actions,body[data-action=tv] #actions{left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:calc(var(--safe-bottom) + 106px);width:auto;max-width:none;max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 292px);padding:12px;border-radius:18px}
 #actionButtons button,#actionButtons a{flex:1 1 auto;font-size:12px}body[data-action=tv] #actionButtons{grid-template-columns:repeat(3,minmax(0,1fr))}body[data-action=tv] #actionButtons button{font-size:12px;padding:8px 5px}body[data-action=tv] #actionButtons button:first-child{grid-column:auto}
 #caption,body:not([data-action=none]) #caption{top:calc(var(--safe-top) + 110px);bottom:auto;left:20px;right:20px;max-width:290px}#caption h2,body:not([data-action=none]) #caption h2{font-size:22px;margin:5px 0}#caption p{display:none}#chapterLabel{font-size:9px}
 #menu{top:calc(var(--safe-top) + 54px);left:12px;right:12px;width:auto;max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 66px)}
}
@media(max-width:360px){header img{width:124px}header>div{gap:6px}#clock{letter-spacing:0}.controlModes{gap:4px}#controls .controlModes button{padding:8px;font-size:11px}#controls{gap:6px}#controls>#back,#controls>#next{width:44px;min-width:44px}#instruction{font-size:10px}}
@media(max-height:560px) and (orientation:landscape){
 header img{width:150px}#centerView{top:var(--safe-top)}#caption,body:not([data-action=none]) #caption{top:78px;left:24px;right:auto;max-width:40vw;bottom:auto}#caption h2,body:not([data-action=none]) #caption h2{font-size:19px}#caption p{display:none}
 #controls{left:max(16px,env(safe-area-inset-left));right:auto;max-width:calc(100vw - 330px);bottom:var(--safe-bottom)}#instruction{max-width:230px}
 #actions,body[data-action=tv] #actions{left:auto;right:max(16px,env(safe-area-inset-right));bottom:var(--safe-bottom);width:280px;max-width:280px;max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 66px)}
 #menu{left:auto;right:max(16px,env(safe-area-inset-right));width:340px;top:calc(var(--safe-top) + 54px);max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 66px)}
}
@media(prefers-reduced-motion:reduce){button,#caption{transition:none}}
@media(prefers-reduced-transparency:reduce){#actions{backdrop-filter:none;background:#13232e}}
@media(hover:hover){button:not(:disabled):hover{background:#354650}#lookMode[aria-pressed=true]:hover{background:#e5d0aa}#world[data-dragging=true]{cursor:grabbing}}
/* Final message remains part of the last approved scene, with its TV controls available. */
#caption[data-closing=true]{padding:16px 18px;border:1px solid #ffffff38;border-left:3px solid #f2dfbd;border-radius:18px;background:#13232ef2;max-width:390px;text-shadow:none}
#caption[data-closing=true] h2{font-size:30px;letter-spacing:-.8px;color:#faf6ed}
body #caption[data-closing=true] p{display:block;font-size:14px;color:#eee2d4;max-width:none}
@media(max-width:760px) and (orientation:portrait){
 body #caption[data-closing=true]{left:12px;right:12px;max-width:none;padding:8px 12px}
 body #caption[data-closing=true] h2{font-size:22px;margin:5px 0}
 body #caption[data-closing=true] #chapterLabel{font-size:9px;letter-spacing:1.6px}
 body #caption[data-closing=true] p{font-size:12px;line-height:1.5}
 body[data-closing=true] #actions{max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 320px)}
}
@media(max-height:560px) and (orientation:landscape){
 body #caption[data-closing=true]{max-width:40vw;padding:10px 12px}
 body #caption[data-closing=true] h2{font-size:22px}
 body #caption[data-closing=true] p{font-size:12px}
}

/* Keep the physical screen legible in the optional close-up. */
body[data-reading-sports=true] #caption,body[data-reading-sports=true] #centerView{visibility:hidden}
body[data-reading-sports=true] #actions{max-height:none}
@media(max-width:760px) and (orientation:portrait){
 body[data-reading-sports=true] #controls{visibility:hidden}
 body[data-reading-sports=true] #actions{bottom:var(--safe-bottom);padding:8px 12px}
 body[data-reading-sports=true] #actions .actionHeading{display:none}
 body[data-reading-sports=true] #actions #actionContent{display:block}
}

/* Leave the center of the two office screens clear on short landscape displays. */
@media(max-height:560px) and (orientation:landscape){
 body[data-action=web] #actions,body:has(#world[data-scene=workradio]) #actions{width:clamp(154px,23vw,244px);max-height:calc(100dvh - 82px);padding:10px}
 body[data-action=web] #caption,body:has(#world[data-scene=workradio]) #caption{max-width:20vw}
}

.officeEdition{box-sizing:border-box;width:min(40rem,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:0;border:0;border-radius:10px;color:#231e1d;background:#fff;overflow-y:auto;overscroll-behavior:contain;box-shadow:0 8px 40px #0005}
.officeEdition::backdrop{background:#101820ba}
.officeEdition>header{position:sticky;top:0;left:auto;right:auto;z-index:1;pointer-events:auto;padding:8px clamp(18px,5vw,36px);background:#ab0c20;color:white}
.officeEdition>header span{font:28px Georgia,serif}.officeEdition>header button{background:#8a101c;padding:8px 16px}
.officeEdition article{padding:24px clamp(18px,5vw,36px) 32px;overflow-wrap:anywhere}
.officeEdition small{font-weight:bold;color:#951827}.officeEdition h2,.officeEdition h3{font-family:Georgia,serif;line-height:1.14;margin:.45em 0}
.officeEdition h2{font-size:clamp(26px,5vw,40px)}.officeEdition h3{font-size:clamp(22px,4vw,30px)}
.officeEdition b{font-size:14px;color:#534c48}.officeEdition p{font:18px/1.5 Georgia,serif;margin:14px 0}.officeEdition hr{border-color:#d8d0cb;margin:24px 0}

#welcome .liteLink{color:#f3ede1;display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;font-size:13px;text-underline-offset:4px}
body[data-light=true]{overflow:auto;overscroll-behavior-y:contain;touch-action:pan-y;background:#15222b;color:#faf6ed}
body[data-light=true]>:not(.liteRoute):not(script){display:none!important}
.liteRoute{max-width:54rem;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom));min-width:0}
.liteTop,.liteNav,.liteStations{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.liteTop,.liteNav{justify-content:space-between}.liteTop img{width:min(38vw,165px);filter:brightness(0) invert(1)}.liteTop a{padding:12px 4px;color:#fff}
.liteIntro{margin:clamp(24px,5vh,48px) 0 22px}.liteRoute small{color:#edc99b;font-size:12px;letter-spacing:1px}.liteIntro h1{font-size:clamp(30px,5vw,53px);letter-spacing:-1.5px;margin:10px 0 18px}
.liteIntro select{font:inherit;background:#243744;color:#fff;border:1px solid #74828a;border-radius:8px;min-height:44px;padding:6px 12px;max-width:100%}
.litePane{padding:clamp(14px,4vw,28px);background:#1b2d38;border:1px solid #42515c;border-radius:16px}
.litePane h2{font-size:clamp(22px,4vw,32px);margin:8px 0}.litePane p{line-height:1.55}.liteStations button,.liteNav button{border-color:#8d9ba2;font-size:14px;padding:10px 16px}.liteStations button[aria-pressed=true]{color:#182831;background:#f2dfbd}.liteStage{display:grid;gap:12px;justify-items:center;margin:18px 0 0}.liteStage img,.liteStage video{width:100%;max-height:min(51dvh,26rem);object-fit:contain;background:#10191e}.liteStage audio{width:100%;min-height:48px}.liteNav{padding-top:15px}

#menu .liteMenu{display:inline-flex;align-items:center;min-height:44px;padding:9px;color:#f2dfbd;font-size:13px}
