@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500&family=Manrope:wght@400;500;600&display=swap');
:root{color-scheme:dark;--ink:#f2eadc;--muted:#b7b6ae;--gold:#d7b783;--border:#fff2dc25}*{box-sizing:border-box}body{margin:0;background:#111923;color:var(--ink);font:13px Manrope,system-ui,sans-serif;overflow:hidden}button,input{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:disabled{cursor:wait;opacity:.55}button{touch-action:manipulation}#world{display:block;width:100vw;height:100dvh;touch-action:none;cursor:grab}#world:active{cursor:grabbing}.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 43%,transparent 38%,#080d1470 100%),linear-gradient(transparent 62%,#080d1460)}header{position:absolute;top:33px;left:38px;right:38px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}header>*{pointer-events:auto}.brand{display:flex;gap:13px;align-items:center;letter-spacing:6px;font-size:19px;font-weight:500;text-shadow:0 2px 15px #000}.brand svg{width:41px;fill:none;stroke:var(--gold);stroke-width:1.2}.brand span{display:block;font-size:8px;letter-spacing:2.1px;margin-top:5px;color:#d8d2c7}.quiet-button{display:flex;gap:10px;align-items:center;background:#10172065;border:1px solid var(--border);border-radius:40px;padding:11px 16px;backdrop-filter:blur(16px);font-size:11px}.quiet-button svg{width:17px;fill:none;stroke:currentColor;stroke-width:1.3}.glass{background:#141a22c7;border:1px solid var(--border);backdrop-filter:blur(22px);box-shadow:0 8px 40px #0002}#sound-panel{position:absolute;right:38px;top:90px;width:300px;border-radius:14px;padding:20px;z-index:5}#sound-panel[hidden]{display:none}.panel-heading{font-size:12px;display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.panel-heading button{border:0;background:none;font-size:22px;color:var(--muted)}.sound-enable{width:100%;padding:9px;border:1px solid var(--border);border-radius:6px;background:#ffffff08;margin-bottom:16px}#sound-panel label{display:block;font-size:11px;color:var(--muted);margin:14px 0 7px}output{float:right}#sound-panel p{font-size:10px;color:var(--muted);margin:18px 0 0}.arrival{position:absolute;left:6vw;bottom:240px;max-width:320px;transition:opacity 1.4s,transform 1.4s;text-shadow:0 2px 25px #000;pointer-events:auto}.arrival.departed{opacity:0;transform:translateY(12px);pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2.5px;color:var(--gold);margin-bottom:15px}h1{font:400 clamp(38px,4vw,62px)/1.02 'Cormorant Garamond',Georgia,serif;letter-spacing:-1.8px;margin:0 0 18px}.arrival-copy{font-size:12px;line-height:1.9;color:#d0ccc4;margin-bottom:26px}#begin{background:var(--ink);border:0;border-radius:4px;color:#242a2a;padding:13px 21px;font-size:11px;min-width:130px;text-shadow:none}#begin span{padding-left:23px;font-size:16px}.text-button{background:none;border:0;display:block;font-size:10px;color:#c8c4b9;padding:14px 0}#view-note{position:absolute;left:38px;bottom:198px;display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.4px;opacity:0;transition:opacity 1.5s}body.entered #view-note{opacity:1}.small-line{width:20px;height:1px;background:var(--gold)}.hint{color:#bdc0bb7d;margin-left:8px}footer{position:absolute;bottom:55px;left:50%;transform:translateX(-50%);display:flex;gap:16px;align-items:center;width:min(780px,calc(100% - 76px))}.time-card{padding:18px 24px 17px;border-radius:12px;flex:1;min-width:0}.time-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.time-readout{display:flex;gap:17px;align-items:center}#phase{font:400 22px 'Cormorant Garamond',Georgia,serif}#clock{font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:1px}.playback{display:flex;gap:10px;align-items:center}.playback button{border:0;background:none;font-size:11px;color:#d2ccc0;min-width:27px;min-height:26px}#play-icon{font-family:system-ui;font-size:13px}input[type=range]{width:100%;margin:0;height:18px;appearance:none;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:2px;background:#b5b0a44d;border-radius:3px}input[type=range]::-webkit-slider-thumb{appearance:none;height:10px;width:10px;border-radius:100%;background:var(--gold);margin-top:-4px;box-shadow:0 0 12px #e6b97070}#time::-webkit-slider-runnable-track{background:linear-gradient(90deg,#495974,#dfa978 25%,#eee3b9 50%,#b57669 75%,#495974)}.time-marks{display:flex;justify-content:space-between;font-size:8px;color:#a8a9a5;margin-top:4px;letter-spacing:.5px}.flight-button{display:flex;align-items:center;justify-content:center;gap:14px;white-space:nowrap;border:1px solid #ead5aa69;border-radius:8px;background:#d5bc8e;padding:17px 23px;color:#292d2e;font-size:12px;box-shadow:0 6px 30px #0003;transition:background .3s}.flight-button:hover{background:#eddbb5}.flight-button svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.3}.bottom-caption{position:absolute;bottom:23px;left:38px;right:38px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.5px;color:#d1ccc36e;pointer-events:none}.bottom-caption span:first-child{font:italic 13px Georgia,serif;letter-spacing:0;color:#cbc4b493}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#111923;z-index:10;font:italic 21px Georgia,serif;transition:opacity 1s}#loading.done{opacity:0;pointer-events:none}#error{position:absolute;top:40%;left:10%;right:10%;padding:25px;z-index:20}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:700px){header{left:20px;right:20px;top:23px}.brand{font-size:15px;letter-spacing:4px}.brand span{font-size:6px;letter-spacing:1.2px}.brand svg{width:29px}.quiet-button{padding:9px}.quiet-button span{display:none}footer{width:calc(100% - 32px);bottom:52px;gap:10px;flex-wrap:wrap}.time-card{padding:12px 17px;width:100%;flex-basis:100%}.flight-button{padding:12px 20px;margin-left:auto;font-size:11px}#view-note{left:20px;bottom:252px;display:block}#view-note .hint{display:block;margin:7px 0;font-size:9px}.small-line{display:none}.arrival{left:24px;bottom:265px}.arrival-copy{font-size:11px}h1{font-size:39px}.bottom-caption{left:20px;right:20px;bottom:18px}.bottom-caption span:last-child{display:none}#sound-panel{right:16px;top:75px}.time-marks{font-size:7px}.vignette{background:linear-gradient(transparent 45%,#080d1490)}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.inside-look{border:1px solid #dfc59a40;background:#10182088;border-radius:20px;padding:8px 13px;color:#d9c6a6;font-size:10px;backdrop-filter:blur(12px)}.inside-look[hidden]{display:none}@media(max-width:700px){.inside-look{margin-top:5px}}

#view-note{pointer-events:none}body.entered #view-note{pointer-events:auto}

#landscape-info{pointer-events:auto;border:0;background:none;color:inherit;font:inherit;letter-spacing:inherit;cursor:pointer;padding:0}#landscape-dialog{max-width:550px;max-height:85vh;overflow:auto;background:#17232c;color:#e5e7df;border:1px solid #dfc59a55;border-radius:15px;padding:32px;box-shadow:0 12px 80px #0007}#landscape-dialog::backdrop{background:#09131bcc;backdrop-filter:blur(8px)}#landscape-dialog h2,#landscape-dialog h3{font-family:Georgia,serif;font-weight:400}#landscape-dialog p{font:12px/1.8 Arial,sans-serif;color:#c8ced0}#landscape-dialog a{color:#dcc79f}#close-landscape{position:absolute;right:12px;top:8px;font-size:26px;background:none;border:0;color:#e5e7df;cursor:pointer}

/* Keep the scene and overlays in the same viewport as mobile browser chrome changes. */
#experience{position:relative;width:100%;height:100dvh;overflow:hidden}
#world{width:100%;height:100%}
#distance-controls{display:none}
@media(max-width:700px),(max-height:500px) and (max-width:1000px){
 header{top:calc(12px + env(safe-area-inset-top));left:calc(16px + env(safe-area-inset-left));right:calc(16px + env(safe-area-inset-right))}
 .quiet-button,.playback button,.inside-look,.flight-button,#begin,#silent,.sound-enable,.panel-heading button,#close-landscape{min-width:44px;min-height:44px}
 .quiet-button{justify-content:center;padding:11px}.quiet-button span{display:none}
 .brand{font-size:15px;letter-spacing:4px}.brand svg{width:29px}.brand span{font-size:7px;letter-spacing:1px}
 footer{left:calc(16px + env(safe-area-inset-left));right:calc(16px + env(safe-area-inset-right));width:auto;transform:none;bottom:calc(44px + env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr auto;gap:8px}
 .time-card{grid-column:1/-1;width:100%;padding:8px 14px 12px;border-radius:12px}
 .time-top{margin-bottom:0}.time-readout{gap:8px}#phase{font-size:19px}#clock{font-size:11px;letter-spacing:0}.playback{gap:0}.playback button{font-size:13px}
 input[type=range]{height:44px}input[type=range]::-webkit-slider-thumb{width:16px;height:16px;margin-top:-7px}
 input[type=range]::-moz-range-track{height:2px;background:#b5b0a4}
 input[type=range]::-moz-range-thumb{width:16px;height:16px;background:var(--gold);border:0;border-radius:50%}
 .time-marks{font-size:8px;margin-top:-3px}
 .flight-button{grid-column:2;margin:0;padding:10px 12px;font-size:11px;gap:8px}.flight-button svg{width:16px}
 #distance-controls:not([hidden]){display:flex;align-self:center;gap:4px}#distance-controls button{width:44px;height:44px;border:1px solid var(--border);border-radius:8px;background:#141a22d9;color:var(--ink);font-size:22px}
 #view-note{left:calc(16px + env(safe-area-inset-left));right:calc(16px + env(safe-area-inset-right));bottom:calc(232px + env(safe-area-inset-bottom));display:flex;justify-content:space-between;gap:8px;min-height:44px;font-size:10px}
 #view-note .hint,.small-line{display:none}.inside-look{margin:0;padding:8px 10px;font-size:10px}
 .bottom-caption{left:calc(16px + env(safe-area-inset-left));right:calc(16px + env(safe-area-inset-right));bottom:env(safe-area-inset-bottom);height:44px;align-items:center}
 .bottom-caption>span{display:none}#landscape-info{min-height:44px;font-size:8px;margin-left:auto;letter-spacing:1px}
 body:not(.entered) footer,body:not(.entered) .bottom-caption{visibility:hidden;pointer-events:none}
 .arrival{left:24px;right:24px;bottom:calc(30px + env(safe-area-inset-bottom));max-width:none;max-height:calc(100dvh - 120px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto}
 h1{font-size:42px}.arrival-copy{font-size:12px}.arrival .text-button{padding:12px 0}
 #sound-panel{top:calc(66px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right));width:min(320px,calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-height:calc(100dvh - 82px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;padding:16px}
 .panel-heading{margin-bottom:8px}#sound-panel label{font-size:12px;margin:8px 0 0}#sound-panel p{font-size:11px;margin-top:8px}
 #landscape-dialog{width:calc(100% - 32px);max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:24px}#landscape-dialog h2{padding-right:20px}
}
@media(max-width:350px){#phase{font-size:17px}.time-card{padding-left:10px;padding-right:10px}.time-readout{gap:5px}.brand span{max-width:160px}}
@media(max-height:500px) and (max-width:1000px){
 footer{bottom:calc(10px + env(safe-area-inset-bottom));grid-template-columns:minmax(0,1fr) auto auto;align-items:center}
 .time-card{grid-column:1;padding:4px 12px}.time-marks{display:none}.flight-button{grid-column:3}#distance-controls{grid-column:2}
 #view-note{bottom:calc(110px + env(safe-area-inset-bottom))}.bottom-caption{display:none}
 .arrival{bottom:calc(14px + env(safe-area-inset-bottom));max-width:420px}h1{font-size:34px;margin-bottom:8px}.eyebrow{margin-bottom:8px}.arrival-copy{margin-bottom:8px}.arrival .text-button{display:inline-block;margin-left:12px}
}

@media(max-height:500px) and (max-width:1000px){.time-readout{flex-direction:column;align-items:flex-start;gap:0}#phase{font-size:17px}}

#view-note{visibility:hidden}body.entered #view-note{visibility:visible}
