:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#deebf4;background:#040811}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a,input{touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;border:1px solid #60708066;background:#132030b8;border-radius:5px;padding:10px 16px}button:hover,button:focus-visible{background:#29465c;outline:1px solid #c9ae77}canvas{display:block;width:100vw;height:100vh;touch-action:none}header{position:absolute;top:30px;left:36px;right:36px;display:flex;justify-content:space-between;pointer-events:none}header>*{pointer-events:auto}#brand{font-size:18px;letter-spacing:.23em;text-decoration:none;color:#eff8ff}#brand span{display:block;font-size:8px;letter-spacing:.25em;color:#94a9bc;margin-top:9px}.top{display:flex;gap:8px}#intro{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding-left:9vw;background:linear-gradient(90deg,#040811f5,#040811d0 42%,#04081122 85%)}#intro h1{font-size:clamp(36px,5vw,74px);line-height:1.03;font-weight:400;letter-spacing:-.04em;margin:25px 0}#intro p{max-width:480px;font-size:17px;color:#aabccc;line-height:1.65}.eyebrow{color:#d9b87e;letter-spacing:.18em;font-size:10px}#begin{background:#d7bf90;color:#101824;border:0;border-radius:3px;padding:17px 22px;font-weight:bold;margin:15px 0 18px;min-width:255px;display:flex;justify-content:space-between;gap:40px}#begin:disabled{opacity:.5}small{color:#7e94a9;font-size:11px;line-height:1.8}#intro .premise{font-size:10px;margin-top:24px;color:#7e94a9}#loading{font-size:11px;color:#d9b87e}#captionBox{position:absolute;bottom:110px;left:50%;transform:translateX(-50%);text-align:center;width:min(720px,88vw);pointer-events:none;background:linear-gradient(90deg,transparent,#040811de 12%,#040811de 88%,transparent);padding:18px 25px}#cueTitle{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#d9b87e}#caption{font-size:19px;line-height:1.5;margin:13px 0}#hint{font-size:10px;letter-spacing:.14em;color:#83cbdf}#transport{position:absolute;bottom:0;width:100%;background:linear-gradient(transparent,#050a12);padding:18px 36px 20px}.progress{height:2px;background:#263647;margin-bottom:16px}#progress{height:100%;background:#d9b87e;width:0}.controls{display:flex;align-items:center;gap:10px}.controls button{font-size:12px;padding:7px 12px}.controls label{font-size:11px;color:#9db1c3;margin-left:12px}#counter{margin-left:auto;font-size:11px;color:#94a9bc}#chapters{position:absolute;right:24px;top:88px;bottom:95px;width:340px;background:#0a1422f5;z-index:4;border:1px solid #40576a;overflow-y:auto;padding:22px;border-radius:8px}h2{font-size:18px;font-weight:400}ol{padding-left:26px;color:#d9b87e}li button{text-align:left;width:100%;margin-bottom:5px;background:transparent;border:0;font-size:12px}.active{color:#e2c184;background:#24384c!important}#error{position:absolute;top:100px;left:5%;right:5%;padding:20px;background:#681f30;z-index:20}#VRButton{bottom:82px!important;right:26px!important;left:auto!important;font-size:11px!important;width:auto!important;padding:10px 18px!important}body.xr header,body.xr footer,body.xr #captionBox,body.xr #chapters{display:none!important}[hidden]{display:none!important}@media(max-width:700px){header{left:18px;right:18px;top:18px}#brand{font-size:13px}.top button{padding:7px;font-size:11px}#intro{padding:28px}#intro p{max-width:350px;font-size:15px}#transport{padding:14px}.controls{gap:4px;flex-wrap:wrap}.controls label{margin-left:6px}#counter{display:none}#caption{font-size:16px}#captionBox{bottom:135px}#VRButton{bottom:104px!important}.controls button{padding:7px}#chapters{width:90vw;right:5vw}}

header{z-index:3}#chapters{z-index:5}

.voice-status{font-size:12px;line-height:1.5;color:#aabccc}#voicePreview,#voiceRestore{margin:6px 0;width:100%;font-size:12px}

/* Keep only the desktop headset-entry action available while waiting. */
body.vr-countdown header,body.vr-countdown footer,body.vr-countdown #captionBox,body.vr-countdown #chapters,body.vr-countdown #intro,body.vr-countdown #VRButton:not(.countdown-entry),body.vr-countdown.xr #VRButton{display:none!important}

.language-choice{display:flex;align-items:center;gap:14px;color:#d9b87e;font-size:14px;margin-top:12px}.language-choice select{font:inherit;color:#eff8ff;background:#132030;border:1px solid #607080;border-radius:4px;padding:9px 12px}
/* Chapter transitions also fade desktop captions; the same veil covers both XR eyes. */
#captionBox { opacity: var(--chapter-visibility, 1); }

/* Keep narration above the tabletop instead of covering the train and figures. */
body.train-scene #captionBox{top:18%;bottom:auto;}
@media(max-width:700px){body.train-scene #captionBox{top:100px;padding:10px 16px;}body.train-scene #caption{font-size:14px;}}

body.newton-scene #captionBox{top:95px;bottom:auto;}
@media(max-width:700px){body.newton-scene #captionBox{top:85px;padding:8px 16px;}body.newton-scene #caption{font-size:14px;}}

#creditsLink{color:#dbc18f;text-decoration:none;padding:10px 12px;align-self:center}body.vr-countdown #creditsLink{visibility:hidden}

@media(max-width:700px){header{flex-wrap:wrap;gap:8px}.top{width:100%;justify-content:flex-end;gap:6px}#creditsLink{font-size:12px;padding:6px}#motionToggle{font-size:11px}#chapters{top:105px}}

/* Let the uncovered home-page model receive pointer/touch gestures. */
#intro{pointer-events:none}#intro button,#intro select,#intro a{pointer-events:auto}

#loading{width:min(380px,82vw);margin-top:10px;font-size:11px;color:#d9b87e}#loadProgress{display:block;width:100%;height:5px;margin:7px 0;border:0;border-radius:3px;overflow:hidden;background:#263647;accent-color:#d9b87e}#loadProgress::-webkit-progress-bar{background:#263647}#loadProgress::-webkit-progress-value{background:#d9b87e;transition:width .2s ease}#loadProgress::-moz-progress-bar{background:#d9b87e}#loadDetail{font-size:10px;line-height:1.4;color:#94a9bc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.load-ready #loadProgress{accent-color:#97bcac}.load-ready #loadProgress::-webkit-progress-value{background:#97bcac}.load-failed #loadLabel{color:#f1a1a1}

/* Engagement and chapter seeking */
#intro a{color:inherit;text-underline-offset:3px}.top{flex-wrap:wrap}.seek-row{display:flex;align-items:center;gap:12px;padding:8px 0;font-size:12px}.seek-row input{flex:1;min-width:60px;accent-color:#dbc18f}.seek-row output{font-variant-numeric:tabular-nums;white-space:nowrap}#privacy{font-size:10px;padding:5px}.controls{flex-wrap:wrap}
#analyticsConsent{position:fixed;z-index:1000;bottom:18px;right:18px;max-width:420px;padding:18px;background:#101c2a;border:1px solid #dbc18f;border-radius:12px;color:#e5edf5;font:14px/1.5 system-ui;box-shadow:0 8px 40px #0009}#analyticsConsent button{margin:6px 8px 0 0}#engagementStatus{position:fixed;z-index:1001;top:85px;left:50%;transform:translateX(-50%);max-width:85vw;background:#101c2a;color:#fff;border-radius:8px;padding:12px;pointer-events:none}#engagementStatus:empty{display:none}dialog{background:#101c2a;color:#fff;border:1px solid #dbc18f;border-radius:12px;max-width:85vw}dialog input{width:70vw;max-width:500px}body.xr #analyticsConsent,body.vr-countdown #analyticsConsent{display:none}
@media(max-width:700px){.seek-row{gap:6px}.seek-row label{display:none}.top button{padding:6px;font-size:11px}#analyticsConsent{left:12px;right:12px;bottom:12px}header .top{justify-content:flex-start}}

#captionBox{bottom:calc(var(--transport-height,120px) + 12px)}#VRButton{bottom:calc(var(--transport-height,100px) + 10px)!important}body.newton-scene #captionBox{bottom:auto}

/* Quiet playback: edge movement reveals chrome, subtitles and timeline together. */
body.experience-playing header,body.experience-playing #transport,body.experience-playing #VRButton{transition:opacity .4s ease}
body.experience-playing:not(.ui-revealed):not(.ui-keyboard):not(.vr-countdown) header,body.experience-playing:not(.ui-revealed):not(.ui-keyboard):not(.vr-countdown) #transport,body.experience-playing:not(.ui-revealed):not(.ui-keyboard):not(.vr-countdown) #VRButton{opacity:0;pointer-events:none}
body.experience-playing:not(.ui-revealed):not(.ui-keyboard):not(.vr-countdown) header *,body.experience-playing:not(.ui-revealed):not(.ui-keyboard):not(.vr-countdown) #transport *{pointer-events:none}
body.ui-revealed header,body.ui-revealed #transport,body.ui-revealed #VRButton{opacity:1}
@media(prefers-reduced-motion:reduce){body.experience-playing header,body.experience-playing #transport,body.experience-playing #VRButton{transition:none}}

body.void-empty #cueTitle,body.void-empty #hint{display:none}body.void-empty #captionBox{background:none}

/* Mobile landing page: one navigation row and optional instructions. */
#mobileMenu{display:none}#introHelp{display:contents}#introHelp summary{display:none}
#introHelp:not([open])>small{display:block}
@media(max-width:700px){
 canvas{height:100dvh}
 header{top:calc(14px + env(safe-area-inset-top));left:20px;right:20px;align-items:center;flex-wrap:nowrap;gap:12px}
 #brand{font-size:12px;letter-spacing:.16em}#brand span{font-size:7px;letter-spacing:.12em;margin-top:6px}
 #mobileMenu{display:block;min-height:44px;padding:8px 14px;font-size:13px}
 header .top{display:none;position:absolute;top:54px;left:0;right:0;width:auto;padding:12px;background:#101c2af5;border:1px solid #40576a;border-radius:8px;box-shadow:0 8px 28px #0008;gap:8px}
 body.mobile-menu-open header .top{display:flex}
 header .top button,header .top a{min-height:44px;font-size:13px;padding:10px 12px;flex:1 1 40%;text-align:center}
 #intro{inset:calc(80px + env(safe-area-inset-top)) 0 0;justify-content:flex-start;padding:12px 24px calc(24px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;background:linear-gradient(90deg,#040811ec,#040811ad 55%,#04081130);gap:0}
 #intro>*{flex-shrink:0;pointer-events:auto}
 #intro .eyebrow{font-size:9px;letter-spacing:.1em}
 #intro h1{font-size:clamp(29px,8vw,40px);line-height:1.08;margin:16px 0 12px}
 #intro p{font-size:14px;line-height:1.5;margin:0 0 16px;max-width:330px}
 .language-choice{font-size:12px;gap:10px;margin-top:0}.language-choice select{padding:10px;min-height:44px}
 #begin{min-width:0;width:min(100%,330px);min-height:48px;padding:14px 16px;margin:14px 0;font-size:14px;gap:12px}
 #introHelp{display:block;max-width:330px;margin-bottom:12px;pointer-events:auto}
 #introHelp summary{display:list-item;cursor:pointer;color:#b6c6d3;font-size:12px;padding:6px 0}
 #introHelp:not([open])>small{display:none}#introHelp small{display:block;margin:8px 0;font-size:11px}
 #intro .premise{font-size:10px;margin:0 0 10px}
 #intro>small{font-size:10px;line-height:1.5;max-width:300px}
 #loading{width:min(100%,330px);margin-top:12px}#loadDetail{white-space:normal;font-size:10px}
 #chapters{top:calc(78px + env(safe-area-inset-top));bottom:100px}
 #transport{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
}
