.world-page { margin:0; height:100vh; height:100dvh; overflow:hidden; background:#a9d9e5; color:#284337; }
.world-page button,.world-page a,.world-page input,.world-page select { touch-action:manipulation; }
#universe { position:relative; width:100%; height:100vh; height:100dvh; overflow:hidden; }
#scene-host { position:absolute; inset:0; }
.park-canvas { width:100%; height:100%; display:block; touch-action:none; cursor:grab; outline:none; }
.park-canvas:active { cursor:grabbing; }
.world-loading { --arrival-ink:#274f4b; --arrival-muted:#526e64; position:absolute; inset:0; z-index:6; display:grid; grid-template-rows:minmax(min-content,1fr) auto; place-items:center; row-gap:12px; padding:36px 36px max(8px,env(safe-area-inset-bottom)); pointer-events:none; overflow:auto; background:radial-gradient(ellipse at 30% 38%,#f7f4e9 0%,#e7efe3 40%,#c8e2da 100%); transition:opacity .24s ease; }
.world-loading[hidden] { display:none; }
.world-loading[data-state=ready] { opacity:0; }
.world-loading-card { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; width:min(880px,100%); gap:24px; color:var(--arrival-ink); }
.loading-planet { position:relative; width:100%; aspect-ratio:1; isolation:isolate; }
.loading-planet-halo { position:absolute; inset:16%; border-radius:50%; background:#b4d9c866; filter:blur(25px); }
.loading-planet-body { position:absolute; inset:18.6% 20% 21.4%; border-radius:50%; background:radial-gradient(circle at 32% 24%,#bddfd0 0%,#75afa3 28%,#397b7a 58%,#285356 83%); box-shadow:inset 5px 5px 18px #e4edc955,inset -12px -10px 25px #143f4d66,0 22px 30px -20px #315a5d88; }
.loading-planet-orbit { position:absolute; inset:28% 7%; border:1px solid #ab8b5066; border-radius:50%; transform:rotate(-24deg); box-shadow:0 1px 0 #fff8e980; z-index:-1; }
#loading-particles { position:absolute; inset:0; width:100%; height:100%; }
.loading-arrival-copy { display:flex; flex-direction:column; align-items:flex-start; gap:16px; padding:16px 0; }
.world-loading .world-eyebrow { margin:0; color:#7b683c; font:11px/1.5 var(--mono); letter-spacing:2.4px; }
.world-loading-card h1 { margin:0; font:400 clamp(46px,6vw,76px)/1.05 var(--serif); letter-spacing:-2px; color:var(--arrival-ink); }
.loading-invitation { margin:0 0 12px; max-width:26ch; font:15px/1.9 var(--sans,sans-serif); color:var(--arrival-muted); text-wrap:balance; }
.world-loading-bar { position:relative; width:min(260px,100%); height:3px; overflow:hidden; border-radius:99px; background:#9ebca85c; }
.world-loading-bar span { display:block; width:100%; height:100%; transform-origin:left center; transform:scaleX(0); background:linear-gradient(90deg,#467f77,#ae8b49); transition:transform .16s linear; }
.world-loading-bar.indeterminate span { width:38%; transform:none; animation:world-loading-drift 2.8s ease-in-out infinite; }
#world-loading-stage { margin:0; max-width:38ch; font:12px/1.7 var(--sans,sans-serif); font-weight:400; color:var(--arrival-muted); }
.world-loading-detail { margin:0; font:11px/1.6 var(--mono); color:var(--arrival-muted); }
.world-loading-detail:empty,.world-loading-actions:not(:has(button:not([hidden]))) { display:none; }
.world-loading-actions { display:flex; flex-wrap:wrap; gap:8px; }
.world-loading-actions button { pointer-events:auto; min-height:44px; background:#f7f4e9; }
.world-loading-actions button:focus-visible { outline:3px solid #376f6a; outline-offset:4px; }
.loading-registration { margin:0; text-align:center; font:11px/1.5 var(--sans,sans-serif); }
.loading-registration a { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:44px; padding:0 6px; border-radius:4px; color:#81988d; text-decoration:none; white-space:nowrap; pointer-events:auto; }
.loading-registration img { width:14px; height:15px; opacity:.65; }
.loading-registration a:hover,.loading-registration a:focus-visible { color:var(--arrival-ink); }
.loading-registration a:focus-visible { outline:2px solid #376f6a; outline-offset:2px; }
.world-loading[data-state=ready] .loading-registration { visibility:hidden; }
.world-loading[data-state=error] .world-loading-bar { display:none; }
#universe[data-loading=true] .welcome-panel { visibility:hidden; }
@keyframes world-loading-drift { 0% { transform:translateX(-110%); } 50% { transform:translateX(270%); } 100% { transform:translateX(-110%); } }
@media(max-width:600px) {
 .world-loading { padding:20px 30px max(8px,env(safe-area-inset-bottom)); }
 .world-loading-card { grid-template-columns:1fr; gap:0; width:min(370px,100%); }
 .loading-planet { width:min(280px,100%); justify-self:center; }
 .loading-arrival-copy { align-items:center; text-align:center; gap:14px; padding:0 0 24px; }
 .world-loading-card h1 { font-size:54px; }
 .loading-invitation { margin-bottom:8px; font-size:14px; }
 .world-loading-actions { justify-content:center; }
 .world-loading[data-state=error] .loading-planet { width:160px; }
}
@media(max-height:500px) and (min-width:601px) {
 .world-loading { padding:18px 36px max(8px,env(safe-area-inset-bottom)); }
 .world-loading-card { width:min(760px,100%); gap:12px; }
 .loading-planet { max-height:330px; }
 .loading-arrival-copy { gap:12px; }
}
.you-are-here { position:absolute; z-index:2; display:flex; flex-direction:column; align-items:center; gap:2px; transform:translate(-50%,-50%); pointer-events:none; }
.you-are-here[hidden] { display:none; }
.you-are-here-dot { width:14px; height:14px; border-radius:50%; background:#c2713f; border:2px solid #fff8e9; box-shadow:0 0 0 1px #35544288; }
.you-are-here[data-mode=arrow] .you-are-here-dot { width:0; height:0; border-radius:0; background:transparent; box-shadow:none; border-style:solid; border-width:7px 0 7px 12px; border-color:transparent transparent transparent #c2713f; }
.you-are-here-label { font:600 11px/1.2 var(--sans,sans-serif); color:#24483a; background:#fff8e9ee; border-radius:8px; padding:2px 6px; white-space:nowrap; }
header.world-header { position:absolute; z-index:7; inset:22px auto auto 22px; right:auto; display:flex; width:max-content; max-width:calc(100% - 24px); gap:2px; align-items:center; pointer-events:none; }
.world-wordmark { display:flex; align-items:center; height:52px; font-size:26px; font-weight:800; letter-spacing:-1px; line-height:1; padding:0 13px; border:0; border-radius:12px 6px 6px 12px; background:#fff8e9f5; pointer-events:auto; }
.world-wordmark span { color:#c2713f; }
.place-heading { padding:9px 16px; border-left:1px solid #35544240; background:#fff8e9e8; border-radius:0 10px 10px 0; }
.place-heading>span { display:block; font-size:9px; text-transform:uppercase; letter-spacing:1.7px; }
.place-heading strong { font:400 21px/1.4 var(--serif); }
.oxygen-tank { display:flex; align-items:center; gap:8px; min-height:48px; background:#fff8e9f5; padding:8px 15px; border-radius:24px; border:1px solid #b6cdb1; color:#355846; }
.oxygen-tank strong { font:600 22px var(--mono); }
.oxygen-tank>span:last-child { font-size:15px; }
.oxygen-orb { width:20px; height:20px; border-radius:50%; background:#a5d4b3; border:3px solid #d2e7c5; box-shadow:inset -3px -3px 0 #70a183; }
nav.world-actions { display:flex; align-items:center; min-width:0; gap:0; pointer-events:auto; }
#open-help { min-width:44px; font-size:18px; }
#language-toggle { font-size:12px; }
.welcome-panel { position:absolute; z-index:2; left:32px; bottom:132px; width:355px; background:#fff8e9f2; border:1px solid #d7dfc6; border-radius:15px; padding:25px; box-shadow:0 5px 25px #28433714; }
.welcome-short { display:none; }
.world-eyebrow { font-size:10px; letter-spacing:1.2px; font-family:var(--mono); color:#846833; text-transform:uppercase; line-height:1.8; }
.welcome-panel h1 { font:400 37px/1.15 var(--serif); letter-spacing:-.8px; margin:14px 0; }
.welcome-panel>p:not(.world-eyebrow):not(.visit-note) { font-size:14px; line-height:1.8; color:#526553; }
.welcome-move { margin:16px 0 0; font-size:14px; line-height:1.6; color:#355442; }
.welcome-panel .primary-button { margin-top:12px; font-size:13px; width:100%; }
.visit-note { font-size:11px; line-height:1.8; color:#657360; margin-top:17px; }
.crosshair { position:absolute; width:5px; height:5px; border-radius:50%; background:#fff5ddaa; border:1px solid #31594870; top:50%; left:50%; pointer-events:none; }
.world-bottom { position:absolute; z-index:2; left:28px; right:28px; bottom:23px; display:flex; justify-content:center; align-items:flex-end; gap:25px; pointer-events:none; }
.walking-note { background:#fff8e9e8; padding:11px 15px; border-radius:9px; justify-self:start; max-width:350px; }
.walking-note p { font-size:11px; line-height:1.8; }
.walking-note span { font-size:10px; color:#6c785d; }
.interaction { display:flex; flex-direction:column; align-items:center; gap:7px; pointer-events:auto; }
.interaction>span { font-size:12px; background:#fff8e9ed; padding:5px 12px; border-radius:20px; max-width:260px; text-align:center; }
#world-interact { min-width:170px; min-height:46px; box-shadow:0 3px 0 #66392235; }
.space-shortcut { justify-self:end; background:#fff8e9ed; font-size:12px; border-color:#d7dcc6; pointer-events:auto; }
.world-move-pad { position:absolute; left:28px; bottom:135px; display:none; grid-template-columns:repeat(3,48px); grid-template-rows:repeat(2,48px); gap:5px; z-index:3; }
#universe[data-looking=away] .world-move-pad { display:none; }
.world-move-pad button,.world-look-pad button { background:#fff8e9dd; border:1px solid #cdd9c3; border-radius:10px; padding:3px; font-size:24px; min-height:48px; width:48px; user-select:none; touch-action:manipulation; }
.world-move-pad [data-walk=forward] { grid-column:2; }.world-move-pad [data-walk=left] { grid-column:1; grid-row:2; }.world-move-pad [data-walk=back] { grid-column:2; grid-row:2; }.world-move-pad [data-walk=right] { grid-column:3; grid-row:2; }
.world-look-pad { position:absolute; right:27px; bottom:161px; display:none; gap:8px; z-index:3; }
.world-notice { position:absolute; top:104px; left:50%; transform:translateX(-50%); border-radius:9px; background:#fff8e9f0; color:#436143; padding:10px 17px; font-size:13px; z-index:4; max-width:90%; text-align:center; }
.world-notice:empty { display:none; }
#scene-fallback { position:absolute; inset:0; display:grid; align-content:center; justify-items:center; gap:20px; background:#c6dec1; padding:30px; text-align:center; }
#scene-fallback[data-realm=moon] { background:#243450; color:#f0e8d2; }#scene-fallback[data-realm=mars] { background:#794d43; color:#f0e8d2; }#scene-fallback[data-realm=orbit] { background:#152039; color:#f0e8d2; }
.fallback-planet { width:180px; height:180px; border-radius:50%; background:#8eb28a; box-shadow:inset -30px -15px 0 #436f5e55,0 0 0 20px #b4d1a155; }
#scene-fallback[data-realm=moon] .fallback-planet { background:#b6bfd0; }#scene-fallback[data-realm=mars] .fallback-planet { background:#c3845d; }#scene-fallback[data-realm=orbit] .fallback-planet { background:#709caf; }
#scene-fallback p { max-width:390px; font-size:15px; }
.world-page dialog { border:1px solid #d7dcc9; border-radius:18px; padding:28px; color:var(--ink); background:#faf8ef; width:min(1050px,calc(100% - 44px)); max-height:90vh; max-height:90dvh; overflow:auto; box-shadow:0 25px 80px #182d3040; }
.world-page dialog::backdrop { background:#152c3b65; }
.dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:14px; }
.dialog-heading h2 { font:400 32px/1.3 var(--serif); letter-spacing:-.6px; }
.dialog-heading>button { min-width:44px; font-size:22px; background:transparent; padding:5px; flex-shrink:0; }
.dialog-tools { display:flex; gap:7px; flex-shrink:0; }.dialog-tools button { background:transparent; padding:7px 10px; font-size:12px; }.dialog-tools [data-close] { font-size:22px; min-width:44px; padding:5px; }
.dialog-intro { font-size:14px; color:var(--muted); max-width:700px; margin:0 0 22px; }
.map-layout { display:grid; grid-template-columns:1.25fr 1fr; gap:25px; align-items:start; }
.map-layout h3,.station-index h3 { font-size:14px; margin-bottom:15px; }
.park-travel-map { height:390px; position:relative; background:#d2e6e3; border-radius:14px; overflow:hidden; }
.park-travel-map svg { width:100%; height:100%; position:absolute; inset:0; }
.park-map-place { position:absolute; transform:translate(-50%,-50%); display:flex; gap:7px; align-items:center; background:#fff8e9f2; font-size:11px; padding:8px 11px; min-height:44px; max-width:150px; line-height:1.4; text-align:left; box-shadow:0 2px 4px #214e3920; border-color:#c5d2b4; }
.park-map-place i { display:inline-block; width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.map-layout .tiny { margin:13px 0 0; font-size:11px; }
.flight-option { display:grid; grid-template-columns:44px 1fr; gap:5px 12px; border-bottom:1px solid #dbe0cf; padding:0 0 16px; margin-bottom:16px; }
.flight-option h4 { font-size:15px; margin-bottom:6px; }
.flight-option p { font-size:12px; line-height:1.7; color:#5d6d5b; }
.flight-orb { width:40px; height:40px; border-radius:50%; background:#9faec0; box-shadow:inset -10px -5px 0 #536a8650; margin-top:4px; }
.flight-mars .flight-orb { background:#c3865d; }.flight-orbit .flight-orb { background:#7d96b8; box-shadow:inset -10px -5px 0 #44516f50; }
.flight-option button { grid-column:2; margin-top:9px; justify-self:start; padding:8px 12px; font-size:12px; background:#edf0e3; }
.flight-option button:disabled { opacity:.65; }
.return-earth { font-size:13px; background:#dce8ce; }
.station-index { margin-top:23px; border-top:1px solid #dbe0cf; padding-top:20px; }
#puzzle-stations { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
#puzzle-stations button { display:flex; align-items:center; gap:8px; font-size:12px; text-align:left; min-height:44px; background:#fffdf6; padding:9px 12px; }
#puzzle-stations i { width:6px; height:6px; border-radius:50%; background:var(--family); flex-shrink:0; }
#puzzle-stations small { font:10px var(--mono); margin-left:auto; color:var(--muted); }
#map-message { color:#a54e2c; font-size:13px; margin-top:13px; }
#help-dialog { max-width:530px; }
#help-dialog>p { font-size:14px; line-height:1.9; margin-bottom:18px; }
#help-dialog>a { display:inline-block; font-size:13px; text-decoration:underline; margin:12px 0 0 15px; }
.puzzle-heading { display:flex; justify-content:space-between; align-items:end; gap:15px; margin:20px 0; }
.puzzle-heading .level-picker { width:min(380px,80%); }
.puzzle-heading select { display:block; width:100%; margin-top:5px; font-size:16px; }
#world-game { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(220px,1fr); gap:26px; }
.park-workbench { min-width:0; }
.park-workbench>h3 { font-size:21px; }
#park-task { margin:12px 0 20px; font-size:14px; line-height:1.8; }
#park-stage,#park-controls { max-width:460px; margin:0 auto; }
#park-controls { margin-top:18px; }
.park-puzzle-notes { background:#eef1e3; padding:22px; border-radius:12px; align-self:start; }
.park-puzzle-notes .rule-box { margin-top:24px; }
#park-message { font-size:13px; margin:15px 0; line-height:1.7; }
.park-win { display:grid; grid-template-columns:58px 1fr; gap:13px; align-items:start; margin-top:20px; padding:18px; border-radius:12px; border:1px solid #c9d9b5; background:#e4ecd4; }
.oxygen-prize { width:50px; height:50px; background:#b2d7b5; border-radius:50%; display:grid; place-items:center; color:#41624d; font:500 20px var(--serif); border:4px solid #cfdfb8; }
.park-win h3 { font:400 24px/1.35 var(--serif); }.park-win p { font-size:12px; line-height:1.8; margin-top:7px; }
.park-win .win-actions { grid-column:1 / 3; }
.world-page input,.world-page select,.world-page textarea { font-size:16px; }
@media(pointer:coarse) { .world-move-pad { display:grid; }.world-look-pad { display:flex; }.walking-note { display:none; } }
@media(max-width:800px) { .place-heading { display:none; }.walking-note { display:none; }.space-shortcut { max-width:160px; font-size:11px; } }
@media(max-width:600px) {
 .oxygen-tank { gap:5px; padding:8px 10px; min-height:43px; }
 .oxygen-tank strong { font-size:19px; }.oxygen-tank>span:last-child { font-size:12px; }.oxygen-orb { width:16px; height:16px; border-width:2px; }
 .world-actions button { padding:7px 9px; font-size:11px; min-height:44px; }#open-help { display:none; }#language-toggle { font-size:10px; }
 .welcome-panel { left:14px; bottom:185px; width:min(300px,calc(100% - 28px)); padding:20px; }
 .welcome-panel h1 { font-size:31px; }.welcome-panel>p:not(.world-eyebrow):not(.visit-note) { font-size:13px; }.welcome-panel .visit-note { display:none; }
 .welcome-panel .world-eyebrow { font-size:9px; }
 .welcome-panel .primary-button { margin-top:16px; }
 .world-bottom { left:14px; right:14px; bottom:calc(16px + env(safe-area-inset-bottom)); gap:10px; }
 .interaction>span { font-size:10px; max-width:210px; }.interaction { gap:6px; }
 #world-interact { min-width:145px; min-height:46px; font-size:12px; }
 .space-shortcut { max-width:115px; min-height:44px; font-size:10px; padding:8px; }
 .world-move-pad { left:14px; bottom:105px; grid-template-columns:repeat(3,44px); grid-template-rows:repeat(2,44px); gap:4px; }
 .world-move-pad { display:grid; }.world-look-pad { display:flex; }
 .world-move-pad button,.world-look-pad button { width:44px; min-height:44px; font-size:23px; }
 .world-look-pad { right:14px; bottom:123px; }
 .world-notice { top:74px; font-size:12px; padding:8px 13px; width:max-content; }
 .world-page dialog { width:calc(100% - 20px); max-height:94vh; max-height:94dvh; padding:18px 14px; border-radius:13px; }
 .dialog-heading { gap:12px; }.dialog-heading h2 { font-size:26px; }.dialog-heading>button { font-size:22px; }
 .dialog-intro { font-size:13px; margin-bottom:17px; }.world-eyebrow { font-size:9px; }
 .map-layout { grid-template-columns:1fr; gap:20px; }
 .park-travel-map { height:auto; min-height:230px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); padding:15px; gap:9px; align-content:center; }
 .park-travel-map svg { opacity:.55; }.park-map-place { position:relative; left:auto!important; top:auto!important; transform:none; max-width:none; font-size:11px; min-height:45px; padding:7px; }
 .flight-option { grid-template-columns:38px 1fr; }.flight-orb { width:34px; height:34px; }
 #puzzle-stations { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }#puzzle-stations button { font-size:11px; padding:8px; gap:6px; }
 #world-game { grid-template-columns:1fr; gap:18px; }.park-workbench>h3 { font-size:19px; }
 #park-task { font-size:13px; margin:11px 0 18px; }
 .puzzle-heading { margin:16px 0; }.puzzle-heading .level-picker { font-size:12px; }.puzzle-heading select { padding:11px 8px; }
 .park-puzzle-notes { padding:18px; }.park-win { padding:14px; gap:10px; grid-template-columns:45px 1fr; }
 .oxygen-prize { width:43px; height:43px; font-size:17px; }.park-win h3 { font-size:21px; }
 #help-dialog>p { font-size:13px; }
}
@media(max-height:540px) { .welcome-panel { top:84px; bottom:auto; padding:15px; }.welcome-panel h1 { font-size:27px; margin:8px 0; }.welcome-panel .visit-note { display:none; }.welcome-panel .primary-button { margin-top:10px; }.world-move-pad { bottom:95px; }.world-look-pad { bottom:115px; } }
.welcoming .world-move-pad,.welcoming .world-look-pad { display:none; }
@media(prefers-reduced-motion:reduce) { .world-page * { scroll-behavior:auto; } }
@media(prefers-reduced-motion:reduce) { .world-loading,.world-loading-bar span { transition:none; } .world-loading-bar.indeterminate span { animation:none; transform:translateX(31%); } }

/* The map screen replaces the travel card. Heading is last in the DOM so Close stays last in the tab order. */
#map-dialog[open]{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"head head" "stage panel" "status status";width:calc(100vw - 16px);height:calc(100dvh - 16px);max-width:none;max-height:none;padding:0;overflow:hidden;border:3px solid #e4d6b6;border-radius:18px;background:var(--game-paper,#fbf3e1);color:var(--game-deep,#294f4a)}
#map-dialog .map-screen{display:contents}
#map-dialog .dialog-heading{grid-area:head;margin:0;padding:14px 18px;background:var(--game-teal,#376f6a);color:var(--game-cream,#fff5df);border-bottom:4px solid #c8b58a}
#map-dialog .dialog-heading h2,#map-dialog .dialog-heading .world-eyebrow,#map-dialog .dialog-intro{color:inherit}
#map-dialog .dialog-intro{margin:6px 0 0;max-width:760px;font-size:13px;line-height:1.55}
#map-dialog .dialog-tools button{background:#f9edce;color:var(--game-deep,#294f4a)}
#map-surface{grid-area:stage;width:100%;height:100%;display:block;touch-action:none;cursor:grab;background:#d5e7e1}
#map-surface:active{cursor:grabbing}
#map-surface:focus-visible{outline:3px solid #326a87;outline-offset:-6px}
.map-toolbar{grid-area:stage;justify-self:start;align-self:start;z-index:1;display:flex;gap:6px;align-items:center;margin:12px;padding:6px;border-radius:12px;background:#fff8e9ee}
.map-toolbar button{min-width:44px;min-height:44px;padding:8px 12px}
.map-compass{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#376f6a;color:#fff5df;font:700 16px var(--sans);position:relative}
.map-compass-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.map-panel{grid-area:panel;overflow:auto;min-height:0;padding:14px 14px 18px;border-left:2px solid #e4d6b6;background:#fffaf0}
#map-dialog #peer-parks,#map-dialog #park-lands,#map-dialog #puzzle-stations,#map-dialog #scenic-places{display:grid;grid-template-columns:1fr;gap:8px}
#map-dialog #peer-parks button,#map-dialog #park-lands button,#map-dialog #scenic-places button{display:flex;align-items:center;gap:8px;text-align:left;min-height:44px}
#map-dialog #peer-parks i,#map-dialog #park-lands i{width:10px;height:10px;border-radius:50%;flex-shrink:0}
#map-dialog #peer-parks button{border-radius:10px;padding:9px 12px;background:#f1f4e8}
#map-dialog #peer-parks button:focus-visible{outline:3px solid #326a87;outline-offset:2px}
#map-dialog #parks-section{padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid #e4d6b6}
#map-dialog #scenic-places{background:transparent;border:0}
#map-dialog #scenic-places button{border-radius:11px;min-height:64px;padding:10px 12px}
#map-dialog .planet-exploration{margin:16px 0;padding-top:14px}
#map-dialog .station-index{margin-top:8px;padding-top:8px}
.map-status{grid-area:status;margin:0;padding:8px 16px;background:#efe6cf;color:#294f4a;font-size:13px;line-height:1.45}
@media(max-width:800px){
 #map-dialog[open]{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(180px,1fr) minmax(34%,46%) auto;grid-template-areas:"head" "stage" "panel" "status";width:100%;height:100dvh;border-radius:0;border-width:0}
 .map-panel{border-left:0;border-top:3px solid #c8b58a}
}

/* The world remains the main surface; views and flight are small instruments. */
.camera-switch { position:absolute; z-index:3; top:91px; right:26px; display:flex; gap:4px; padding:4px; background:#fff8e9ed; border-radius:12px; }
.camera-switch button { min-height:44px; background:transparent; border-color:transparent; padding:8px 13px; font-size:12px; }
.camera-switch button[aria-pressed=true] { background:#3b7376; color:#fff9e7; }
.world-look-pad { display:grid; grid-template-columns:repeat(2,48px); gap:5px; }
#npc-dialog { max-width:650px; }
.npc-introduction { display:grid; grid-template-columns:190px 1fr; gap:25px; align-items:center; margin:8px 0 24px; }
#npc-portrait { min-height:190px; display:grid; place-items:center; background:#e8eddb; border-radius:50%; }
#npc-portrait canvas { width:100%; max-width:220px; height:auto; display:block; }
#npc-greeting { font:400 20px/1.6 var(--serif); margin-bottom:14px; }
#npc-puzzle-name { font-size:12px; letter-spacing:.4px; color:#55716b; }
#npc-dialog>h3 { font-size:14px; margin-bottom:12px; }
#npc-levels { display:grid; gap:8px; }
#npc-levels button { display:flex; gap:15px; align-items:center; text-align:left; background:#fffdf6; min-height:64px; padding:10px 14px; }
.npc-level-number { width:33px; height:33px; display:grid; place-items:center; border-radius:50%; background:#dce8cd; color:#3e6150; flex-shrink:0; font:500 15px var(--mono); }
#npc-levels strong { display:block; font-size:14px; font-weight:500; }#npc-levels small { display:block; font-size:11px; color:#657965; margin-top:4px; }
#puzzle-stations .friend-puzzle { display:block; margin:4px 0 0; font:10px var(--sans); }
@media(pointer:fine) and (min-width:601px) { .world-look-pad { display:none; } }
@media(max-width:600px) {
 .camera-switch { top:calc(72px + env(safe-area-inset-top)); right:12px; }
 .camera-switch button { font-size:11px; padding:7px 10px; }
 .world-look-pad { grid-template-columns:repeat(2,44px); right:14px; bottom:105px; gap:4px; display:grid; }
 .npc-introduction { grid-template-columns:100px 1fr; gap:15px; margin-bottom:20px; }
 #npc-portrait { min-height:100px; }#npc-greeting { font-size:17px; }#npc-levels strong { font-size:13px; }
 .world-notice { top:126px; }
}

/* First-load instructions must leave the flying player visible on small screens. */
@media(max-width:600px) {
 .welcome-panel { top:calc(135px + env(safe-area-inset-top)); bottom:auto; width:calc(100% - 28px); padding:10px; }
 .welcome-panel .world-eyebrow { display:none; }
 .welcome-panel h1 { font-size:22px; line-height:1.2; margin:0 0 6px; letter-spacing:-.4px; }
 .welcome-panel .welcome-full { display:none; }.welcome-panel .welcome-short { display:inline; }
 .welcome-panel>p:not(.world-eyebrow):not(.visit-note) { font-size:12px; line-height:1.6; }
 .welcome-panel .primary-button { margin-top:6px; min-height:44px; }
}
@media(max-height:600px) {
 .welcome-panel { top:88px; bottom:auto; width:260px; padding:12px; }
 .welcome-panel .world-eyebrow,.welcome-panel>p:not(.visit-note) { display:none; }
 .welcome-panel h1 { font-size:21px; line-height:1.15; margin:0 0 8px; }
 .welcome-panel .primary-button { margin-top:0; }
}

@media(max-width:600px) and (max-height:600px) {
 .welcome-panel { top:calc(135px + env(safe-area-inset-top)); width:calc(100% - 28px); }
}
@media(max-width:600px) and (max-height:700px) {
 .welcome-panel>p:not(.visit-note) { display:none; }
 .welcome-panel { padding:8px; }
 .welcome-panel h1 { display:none; }
 .welcome-panel .primary-button { margin-top:0; }
}
@media(max-width:600px) and (max-height:600px) {
 .welcome-panel h1 { display:none; }
 .welcome-panel .primary-button { margin-top:0; }
}

/* Zoom gestures belong to the scene; page/UI zoom remains unrestricted. */
.park-canvas,.bird-map-labels { touch-action:none; }
.scene-zoom { position:absolute; z-index:3; top:149px; right:26px; display:flex; gap:4px; align-items:center; padding:4px; border-radius:10px; background:#fff8e9ed; }
.scene-zoom button { width:44px; min-height:44px; padding:4px; font-size:21px; background:transparent; border-color:transparent; }
.scene-zoom output { min-width:48px; font:11px var(--mono); text-align:center; color:#587170; }
#camera-guide { display:none; }
.bird-map-labels { position:absolute; inset:0; pointer-events:none; z-index:1; }
.bird-label { position:absolute; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; gap:5px; pointer-events:auto; touch-action:none; padding:4px; border:0; border-radius:8px; color:#294d44; }
.bird-npc { width:44px; height:44px; min-height:44px; background:transparent; }
.bird-symbol { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; border:2px solid #fff9e8; background:#4d8782; color:#fff9e8; box-shadow:0 2px 5px #23493830; font:600 12px var(--mono); flex-shrink:0; }
.bird-npc .bird-title { position:absolute; left:50%; top:39px; transform:translateX(-50%); width:max-content; max-width:128px; font-size:10px; line-height:1.5; background:#fff9e9f2; padding:3px 7px; border-radius:5px; display:none; pointer-events:none; }
.bird-npc:hover .bird-title,.bird-npc:focus-visible .bird-title { display:block; }
.bird-npc .bird-symbol { position:relative; width:32px; height:32px; background:#fff4dc; border-color:#fff9e8; }
.bird-symbol canvas { width:100%; height:100%; border-radius:50%; }
.bird-number { position:absolute; bottom:-5px; right:-5px; min-width:14px; padding:1px 2px; border-radius:5px; background:#326c68; color:#fff8e8; font:8px var(--mono); border:1px solid #fff8e8; }
.bird-building { width:112px; min-height:44px; background:#fff8e9ee; font-size:10px; line-height:1.4; box-shadow:0 2px 5px #23493818; }
.bird-building .bird-symbol { border-radius:6px; width:22px; height:22px; background:#be8f47; font-size:11px; }
.bird-region { width:110px; min-height:25px; padding:0; color:#294f39; background:transparent; pointer-events:none; font-size:12px; font-weight:600; text-shadow:0 1px 2px #f4f5de,0 -1px 2px #f4f5de; }
.bird-region .bird-symbol { display:none; }
.bird-player { width:24px; height:24px; padding:0; background:transparent; pointer-events:none; }
.bird-player .bird-symbol { width:18px; height:18px; color:#326c68; background:transparent; font-size:14px; border:0; box-shadow:none; text-shadow:0 1px 1px #fff8e9,0 -1px 1px #fff8e9; }
.bird-player .bird-title { display:none; }
@media(max-width:600px) {
 .scene-zoom { top:calc(132px + env(safe-area-inset-top)); right:12px; }
 .scene-zoom button { width:36px; min-height:44px; }
 #camera-guide { left:12px; top:calc(132px + env(safe-area-inset-top)); max-width:190px; padding:7px 10px; font-size:10px; }
 #universe[data-camera=follow] .scene-zoom { top:calc(132px + env(safe-area-inset-top)); bottom:auto; }
 #universe.welcoming .scene-zoom { display:none; }
 .world-notice { top:190px; }
 #universe[data-camera=locked] .world-notice { top:auto; bottom:62px; max-width:calc(100% - 28px); padding:4px 9px; font-size:11px; }
 #universe[data-camera=locked] .interaction>span { display:none; }
 .bird-building { font-size:9px; }
}

/* A local map for friends and a globe for quiet sightseeing. */
.bird-scenic,.bird-park { width:112px; min-height:44px; background:#fff8e9ee; font-size:10px; line-height:1.4; box-shadow:0 2px 5px #23493818; }
.bird-scenic .bird-symbol { width:23px; height:23px; background:#6d9295; }.bird-park .bird-symbol { width:23px; height:23px; background:#bf8d47; }
.route-controls { position:absolute; z-index:4; bottom:112px; left:50%; transform:translateX(-50%); display:flex; align-items:center; justify-content:center; gap:8px; max-width:calc(100% - 28px); }
#tour-progress { color:#385d50; background:#fff8e9ed; border-radius:7px; padding:7px 10px; font-size:11px; }
.planet-exploration { margin:30px 0; padding-top:25px; border-top:1px solid #d7dfcd; }
.planet-exploration>p { margin-top:9px; font-size:13px; color:#587164; line-height:1.8; }
.planet-statistics { font-family:var(--mono); }
.planet-map-actions { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 20px; }
#scenic-places { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:#d8dfcd; border:1px solid #d8dfcd; }
#scenic-places button { display:flex; align-items:center; gap:10px; text-align:left; border:0; border-radius:0; background:#f8f6ea; padding:14px; min-height:82px; }
#scenic-places i { width:10px; height:28px; border-radius:8px; flex-shrink:0; }
#scenic-places strong { display:block; font-size:12px; font-weight:600; }#scenic-places small { display:block; font-size:10px; line-height:1.7; color:#658074; }#scenic-places button>small { flex-shrink:0; margin-left:auto; }
#trail-dialog { width:min(690px,calc(100% - 28px)); }#trail-location { color:#718371; font:12px var(--mono); margin:14px 0; }
#trail-branches { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:18px 0; }
#trail-branches button { text-align:left; padding:16px; }#trail-branches strong { display:block; font-size:14px; font-weight:500; }#trail-branches small { display:block; color:#687c66; margin-top:6px; font-size:11px; }
@media(max-width:600px) {
 .camera-switch button { padding:7px 8px; font-size:10px; }
 .route-controls { bottom:104px; flex-wrap:wrap; width:max-content; }
 #tour-progress { flex-basis:100%; text-align:center; }
 #scenic-places { grid-template-columns:1fr; }
 #scenic-places button { min-height:66px; padding:12px; }
 .bird-scenic,.bird-park { font-size:9px; }
}

@media(max-width:600px) { #camera-guide { max-width:calc(100% - 174px); } }

.scene-zoom { display:none; grid-template-columns:44px 58px 44px; }
#scene-zoom-range { grid-column:1 / -1; width:100%; min-height:32px; margin:0; accent-color:#3b7376; touch-action:pan-x; }
@media(max-width:600px) { .scene-zoom { display:none; grid-template-columns:36px 58px 36px; } #camera-guide { display:none; top:calc(226px + env(safe-area-inset-top)); left:auto; right:12px; max-width:180px; } }

/* Quiet map typography: anchored labels, one scale at a time, no leader lines. */
.bird-label{gap:6px;border-radius:4px;background:transparent;box-shadow:none;color:#294d44;text-shadow:0 1px 2px #fff8e9,0 -1px 2px #fff8e9;font-weight:500}
.bird-npc{width:44px;height:44px;padding:4px}
.bird-npc .bird-symbol{width:34px;height:34px;border:2px solid #fff8e9;box-shadow:0 1px 3px #23493826}
.bird-npc:is(:hover,:focus-visible){z-index:5}
.bird-npc .bird-title{max-width:180px;top:42px;padding:5px 8px;font-size:11px;text-shadow:none}
.bird-building,.bird-scenic,.bird-park,.bird-planet{width:max-content;max-width:160px;min-height:32px;padding:4px 6px;font-size:12px;line-height:1.4;background:transparent;box-shadow:none}
.bird-building .bird-symbol,.bird-scenic .bird-symbol,.bird-park .bird-symbol,.bird-planet .bird-symbol{width:7px;height:7px;border:1px solid #fff8e9;border-radius:50%;background:#53776c;box-shadow:none;font-size:0}
.bird-region{width:max-content;max-width:140px;min-height:28px;font-size:12px;line-height:1.4;font-weight:500;color:#48614d;letter-spacing:.02em}
.bird-planet{color:#f2f0df;text-shadow:0 1px 3px #081523}
.bird-label:is(button):hover{background:#fff8e9ed;text-shadow:none}
.bird-planet:hover{color:#294d44}
.bird-target{width:44px;height:44px;min-height:44px;padding:0;background:transparent;font-size:0;text-shadow:none;z-index:2}
.bird-target .bird-symbol{width:32px;height:32px;border:0;border-radius:0;background:transparent;color:#376f6a;box-shadow:none;font-size:0;line-height:0;text-shadow:none}
.bird-flag{width:32px;height:32px;filter:drop-shadow(0 2px 2px #173d3650)}
.bird-target .bird-cancel{position:absolute;top:1px;right:1px;display:grid;place-items:center;width:18px;height:18px;border:2px solid #fff8e9;border-radius:50%;background:#a84435;color:#fff8e9;box-shadow:0 1px 4px #173d3655;font:700 13px/1 var(--sans)}
.bird-target:is(button):hover{background:transparent}
.bird-target:focus-visible{outline:3px solid #b77835;outline-offset:1px;border-radius:50%}

/* The home link and menu arrow form one compact header; account lives in the menu. */
.world-options { position:static; margin-left:0; flex-shrink:0; }
#world-options-toggle { display:grid; place-items:center; width:52px; height:52px; min-width:44px; padding:8px; border:0; border-radius:6px 12px 12px 6px; background:#fff8e9f5; }
#world-options-toggle[aria-expanded=true] svg { transform:rotate(180deg); }
.world-options-panel { position:absolute; z-index:8; top:calc(100% + 8px); left:0; right:auto; width:220px; max-width:calc(100vw - 24px); max-height:calc(100dvh - 92px); overflow:auto; padding:8px; display:grid; gap:5px; border:1px solid #c5cbb6; border-radius:12px; background:#fff8e9fa; box-shadow:0 8px 28px #163c3430; }
.world-options-panel[hidden] { display:none; }
.world-options-panel #account-slot { display:block; width:100%; min-width:0; }
.world-options-panel #account-slot .account-entry { position:static; display:block; width:100%; max-width:none; min-width:0; min-height:44px; text-align:left; }
.world-options-panel>button { width:100%; text-align:left; }
.world-options-panel #open-help { display:block; font-size:13px; }
.world-options-panel #language-toggle { font-size:13px; }
.world-options-panel .camera-switch { position:static; display:grid; gap:4px; padding:6px 0 0; border-top:1px solid #c9cebc; background:transparent; border-radius:0; }
.world-options-panel .camera-switch[hidden] { display:none; }
.world-options-panel .camera-switch button { width:100%; text-align:left; font-size:13px; }
.world-options-panel .performance-toggle { width:100%; text-align:left; }
.world-options :focus-visible { outline:3px solid #b77835; outline-offset:2px; }
.world-performance { position:absolute; z-index:5; right:calc(26px + env(safe-area-inset-right)); bottom:calc(22px + env(safe-area-inset-bottom)); display:grid; gap:2px; min-width:188px; max-width:calc(100% - 28px); padding:8px 11px; border:1px solid #c8b58a; border-radius:8px; background:#294f4ae8; color:#fff8e9; box-shadow:0 3px 12px #173d3626; pointer-events:none; text-align:left; }
.world-performance[hidden] { display:none; }
.world-performance-primary { font:600 12px/1.35 var(--mono); white-space:nowrap; }
.world-performance-secondary { font:10px/1.45 var(--mono); color:#d8e8d8; white-space:nowrap; }
.world-map-hud { position:absolute; z-index:7; top:22px; right:26px; display:grid; justify-items:end; gap:8px; pointer-events:none; }
#open-map { display:block; width:168px; height:132px; padding:0; overflow:hidden; border:2px solid #d4c79f; border-radius:14px; background:#d5e7e1; box-shadow:0 4px 16px #173d3626; pointer-events:auto; }
#open-map canvas { display:block; width:100%; height:100%; }
#open-map:focus-visible { outline:3px solid #b77835; outline-offset:3px; }
.world-map-hud .oxygen-tank { pointer-events:auto; }
#universe[data-loading=true] .world-map-hud,
#universe[data-clean-screen=true] .world-header,
#universe[data-clean-screen=true] .world-map-hud,
#universe[data-clean-screen=true] .world-performance,
#universe[data-clean-screen=true] .whitebox-study { visibility:hidden; pointer-events:none; }
@media(max-width:600px) {
 header.world-header { left:12px; right:auto; top:calc(12px + env(safe-area-inset-top)); max-width:calc(100% - 24px); }
 .world-wordmark { height:44px; font-size:20px; padding:0 10px; }
 #world-options-toggle { width:44px; height:44px; min-width:44px; padding:0; }
 .world-performance { right:14px; bottom:calc(178px + env(safe-area-inset-bottom)); min-width:0; padding:7px 9px; }
 .world-performance-primary { font-size:11px; }.world-performance-secondary { font-size:9px; }
 .world-map-hud { top:calc(76px + env(safe-area-inset-top)); right:12px; gap:5px; }
 #open-map { width:112px; height:112px; border-radius:12px; }
 .world-map-hud .oxygen-tank { gap:4px; min-height:38px; padding:6px 8px; }
 .world-map-hud .oxygen-tank strong { font-size:17px; }
}
@media(max-width:600px) and (max-height:540px) { .world-performance { bottom:calc(158px + env(safe-area-inset-bottom)); } }
