/* Shared place/time shell. Existing clock widgets retain their state and gestures. */
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock){display:grid!important;grid-template-columns:minmax(116px,.95fr) minmax(94px,1.2fr) 44px!important;grid-template-rows:44px 44px!important;gap:5px!important;padding:7px!important;border-radius:var(--control-radius,11px)!important;background:#10203066!important;border:1px solid #d7e0f126!important;backdrop-filter:blur(4px)!important;-webkit-backdrop-filter:blur(4px)!important;box-sizing:border-box!important;max-width:calc(100vw - 24px)!important;min-width:0!important;width:min(760px,calc(100vw - 32px))!important}
body.unified-navigation .navigation-fields{grid-column:1;grid-row:1/3;min-width:0;display:grid;grid-template-rows:44px 44px;gap:5px}
body.unified-navigation .navigation-fields .context-widget,body.unified-navigation .navigation-fields .navigation-date{position:relative!important;inset:auto!important;transform:none!important;max-width:none!important;width:100%!important;min-height:44px!important;height:44px!important;display:flex!important;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;margin:0!important;padding:3px 5px 3px 28px!important;background:var(--control-glass,#10203038)!important;border:1px solid #d7e0f12e!important;border-radius:var(--control-radius,11px)!important;gap:1px;overflow:hidden;white-space:nowrap;color:var(--text)!important;cursor:pointer;box-sizing:border-box;font-size:11px!important}
body.unified-navigation .navigation-fields .navigation-place>span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis}
body.unified-navigation .navigation-fields .navigation-place>small{display:none!important}
body.unified-navigation .navigation-fields .navigation-place::before,body.unified-navigation .navigation-fields .navigation-date::before{content:'';position:absolute;left:7px;top:14px;width:15px;height:15px;background:currentColor;opacity:.8;mask:center/contain no-repeat;-webkit-mask:center/contain no-repeat;pointer-events:none}
body.unified-navigation .navigation-fields .navigation-place::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='7'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M12 1v5m0 12v5M1 12h5m12 0h5'/%3E%3C/g%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='7'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M12 1v5m0 12v5M1 12h5m12 0h5'/%3E%3C/g%3E%3C/svg%3E")}
body.unified-navigation .navigation-fields .navigation-date::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/g%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/g%3E%3C/svg%3E")}
body.unified-navigation .navigation-date button,body.unified-navigation .navigation-date .utc{padding:0!important;min-height:0!important;font-size:11px!important;background:none!important;border:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;line-height:1.4}
body.unified-navigation .navigation-date #date{display:none!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.time-wheel{grid-column:2!important;grid-row:1!important;width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;align-self:stretch}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.speed-wheel{grid-column:2!important;grid-row:2!important;width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;align-self:stretch}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .wheel-caption,body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .wheel-scales,body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .speed-wheel>span,body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>#clockOptions,body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.clock-domain-switch{display:none!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .wheel-drum,body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .speed-wheel>[role=slider]{height:44px!important;min-height:44px!important;border:1px solid #d7e0f12e!important;border-radius:var(--control-radius,11px)!important;background:var(--control-glass)!important;box-sizing:border-box}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .speed-wheel>[role=slider] strong{font-size:12px!important;padding-right:12px}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .speed-wheel>[role=slider]::after{content:'⌄';position:absolute;right:6px;top:12px;font-size:13px;color:var(--accent);pointer-events:none}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.time-controls{grid-column:3!important;grid-row:1/3!important;display:flex!important;align-items:center!important;justify-content:center;min-width:0!important;width:44px!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.navigation-play{grid-column:3!important;grid-row:1/3!important;align-self:center}
body.unified-navigation .navigation-play{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;padding:10px!important}
body.unified-navigation .navigation-readout{position:fixed;z-index:7;display:flex;flex-direction:column;gap:3px;pointer-events:none;padding:5px 7px;background:#10203030;border:0;border-radius:var(--control-radius);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);color:#dce5ef;text-shadow:0 1px 3px #000b;font:12px/1.4 var(--ui-font);overflow-wrap:anywhere}
body.unified-navigation .navigation-readout small{font-size:11px;color:#ccd6e2}
body.unified-navigation .navigation-readout[hidden]{display:none!important}
body.unified-navigation.hud-idle:not(.desktop-hover-clock) .unified-navigation-dock{opacity:0!important;pointer-events:none!important}
body.unified-navigation #viewCluster [data-responsive-hidden]{display:none!important}
body.unified-navigation.tool-rail-layout #appToolbar #viewCluster>#contextTools>button[data-responsive-hidden],body.unified-navigation.tool-rail-layout #appToolbar #viewCluster>button[data-responsive-hidden]{display:none!important}
body.unified-navigation .navigation-fields .context-widget[hidden]{display:none!important}
body.unified-navigation.tool-rail-layout #appToolbar #viewCluster>#shareView{order:20!important}
body.unified-navigation.tool-rail-layout #appToolbar #viewCluster>#captureScene{order:21!important}
body.unified-navigation.tool-rail-layout #appToolbar #viewCluster>#contextTools{order:10!important}
body.unified-navigation #viewCluster{overflow:visible!important}
body.unified-navigation :is(button,input,[role=slider],[role=spinbutton],a,summary):focus-visible{outline:2px solid var(--accent)!important;outline-offset:3px!important}
.moment-domain-tabs{display:flex;gap:5px;padding:5px;background:#ffffff05;border:1px solid var(--line);border-radius:var(--control-radius);margin:12px 0}
.moment-domain-tabs button{flex:1;min-height:44px!important}
.moment-domain-tabs button[aria-pressed=true]{border-color:#eac08b70!important;color:var(--accent)!important;background:#eac08b14!important}
.moment-picker .moment-done{position:sticky;bottom:0;display:flex;gap:8px;justify-content:flex-end;background:#101b28f5;padding:12px 0 0;margin-top:12px;border-top:1px solid var(--line);z-index:2}
.moment-picker .moment-done button{min-height:44px}
body.unified-navigation dialog.settings-surface.moment-picker>.moment-done>button{width:auto;flex:1;min-width:0;padding:9px 7px;font-size:12px}
body.unified-navigation dialog.settings-surface :is(button,input,select,summary,.wheel-drum):focus-visible{outline:2px solid var(--accent)!important;outline-offset:2px!important}
.moment-speed-settings{display:grid;gap:8px;margin:18px 0}
.moment-speed-settings label{display:grid;grid-template-columns:minmax(0,1fr) minmax(100px,.7fr);gap:8px;align-items:center}
.moment-speed-settings input{min-width:0;width:100%;min-height:44px;padding:8px;border:1px solid var(--line);border-radius:var(--control-radius);background:#10203080;color:var(--text)}
.moment-speed-settings small{color:var(--muted);line-height:1.5}
.observer-place-picker .observer-world-button{width:100%;margin:16px 0;text-align:left}
.observer-world-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:16px;max-height:220px;overflow:auto}
.observer-coordinate-map{display:block;width:100%;aspect-ratio:2;touch-action:manipulation;cursor:crosshair;border:1px solid #b8cce333;border-radius:11px}
.observer-coordinate-map .map-grid{fill:none;stroke:#b8cce3;stroke-opacity:.2;stroke-width:1}
.observer-coordinate-map .map-equator{fill:none;stroke:#b8cce3;stroke-opacity:.45;stroke-width:1.5}
.observer-coordinate-map text{fill:#b8cce3;font-size:14px;font-family:var(--ui-font)}
.observer-coordinate-map .observer-map-marker{fill:none;stroke:var(--accent);stroke-width:2}
.observer-map-note{font-size:11px;color:var(--muted);line-height:1.5}
.observer-coordinate-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}
.observer-coordinate-fields label{display:grid;gap:6px;font-size:12px;min-width:0}
.observer-coordinate-fields input{min-width:0;width:100%;min-height:44px;padding:8px;background:#10203080;border:1px solid var(--line);border-radius:11px;color:var(--text)}
.observer-place-picker .moment-done{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
.observer-place-error{color:#f0baad;font-size:13px}
@media(max-width:360px){body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock){grid-template-columns:minmax(108px,.95fr) minmax(88px,1.2fr) 44px!important;gap:4px!important;padding:5px!important}.moment-picker .moment-done{flex-wrap:wrap}.moment-picker .moment-done button{flex:1;font-size:12px;padding:8px}}
@media(prefers-reduced-motion:reduce){body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock),body.unified-navigation .navigation-readout{transition:none!important}}
/* Scale readout shares the dock's quiet glass, on the opposite side. */
body.unified-navigation #scaleContext{position:fixed!important;left:auto!important;right:12px!important;bottom:calc(122px + env(safe-area-inset-bottom))!important;max-width:230px!important;min-height:44px!important}
body.unified-navigation .scale-idle-readout{position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));max-width:40vw;padding:5px 7px;border-radius:var(--control-radius);background:#10203030;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);text-shadow:0 1px 3px #000b;font:11px/1.5 var(--ui-font);color:#ccd6e2;pointer-events:none;text-align:right;z-index:7}
body.unified-navigation .scale-idle-readout[hidden]{display:none!important}
@media(max-width:800px){body.unified-navigation #scaleContext{bottom:calc(122px + env(safe-area-inset-bottom))!important}body.unified-navigation .scale-idle-readout{font-size:10px;max-width:42vw}}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.navigation-fields{position:static!important;grid-column:1!important;grid-row:1/3!important;width:auto!important;display:grid!important;grid-template-rows:44px 44px!important;transform:none!important}
body.unified-navigation #app .navigation-fields :is(#orbitContext,#skyContext,#stellarContext,#galaxyContext){position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;grid-row:1!important;width:100%!important;max-width:100%!important;min-width:0!important}
body.unified-navigation #app .navigation-fields>.navigation-date{grid-row:2!important}

body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock){height:106px!important;min-height:106px!important;bottom:calc(8px + env(safe-area-inset-bottom))!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .speed-wheel>[role=slider]{position:relative!important;overflow:hidden!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.timeline-right{display:none!important}
.moment-speed-settings label{grid-template-columns:minmax(54px,.45fr) minmax(0,1fr)}
.moment-speed-settings select{min-width:0;width:100%}

.scale-idle-readout{white-space:pre-line}.scale-endpoints{display:block;width:100%;color:var(--muted);font-size:11px}.scale-percentage{font-size:12px;white-space:nowrap}
/* Scale settings: two full-width native sliders, with labels outside the track. */
#scaleExplanation{width:520px;max-width:calc(100vw - 24px)!important;padding:24px!important;border:1px solid #d7e0f126;border-radius:var(--control-radius,11px);background:#101b28f5;font-family:var(--ui-font);overflow-x:hidden!important}
#scaleExplanation h2{margin:0 0 20px;font-size:20px;font-weight:500;line-height:1.3}
#scaleExplanation .scale-presets{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 24px}
#scaleExplanation .scale-presets button{font-size:12px;padding:10px;line-height:1.4;min-width:0}
#scaleExplanation .scale-controls{display:grid;gap:24px;margin:0 0 22px}
#scaleExplanation .scale-control{min-width:0;padding:16px;background:#ffffff04;border:1px solid var(--line);border-radius:var(--control-radius,11px)}
#scaleExplanation .scale-control-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:4px}
#scaleExplanation .scale-control-heading label{font-size:14px;color:var(--text);font-weight:500;min-width:0}
#scaleExplanation .scale-control-heading output{font-size:12px;color:var(--accent);text-align:right;font-variant-numeric:tabular-nums;min-width:0}
#scaleExplanation .scale-controls input[type=range]{display:block;position:relative;width:100%!important;max-width:none!important;min-width:0!important;height:44px;min-height:44px;margin:0;padding:0;appearance:none;-webkit-appearance:none;background:transparent;border:0;touch-action:pan-y;cursor:ew-resize;accent-color:var(--accent);pointer-events:auto}
#scaleExplanation input[type=range]::-webkit-slider-runnable-track{height:4px;background:linear-gradient(90deg,#eac08b99,#a6c8df66);border-radius:4px}
#scaleExplanation input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin-top:-10px;background:var(--accent);border:3px solid #152230;border-radius:50%;box-shadow:0 0 0 1px #eac08b66}
#scaleExplanation input[type=range]::-moz-range-track{height:4px;background:linear-gradient(90deg,#eac08b99,#a6c8df66);border-radius:4px}
#scaleExplanation input[type=range]::-moz-range-thumb{width:18px;height:18px;background:var(--accent);border:3px solid #152230;border-radius:50%;box-shadow:0 0 0 1px #eac08b66}
#scaleExplanation input[type=range]:focus-visible{outline:2px solid var(--accent)!important;outline-offset:2px;border-radius:6px}
#scaleExplanation .scale-endpoints{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:11px;line-height:1.4}
#scaleExplanation details{padding:12px 0;margin-top:12px;border-top:1px solid var(--line)}
#scaleExplanation>button:last-child{display:block;margin:16px 0 0 auto;min-width:100px}
@media(max-width:400px){#scaleExplanation{padding:18px!important}#scaleExplanation .scale-control{padding:12px}#scaleExplanation .scale-control-heading{gap:8px}#scaleExplanation .scale-control-heading label{font-size:13px}#scaleExplanation .scale-control-heading output{font-size:11px}}

/* Date/location editors share spacing, outlined icons and quiet action hierarchy. */
.navigation-button-icon{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.moment-picker .moment-done button,.observer-place-picker .moment-done button,.observer-world-button{display:flex;align-items:center;justify-content:center;gap:8px}
body.unified-navigation dialog.settings-surface.moment-picker{--surface-pad:20px;width:540px;max-width:calc(100vw - 24px);padding:0!important;box-sizing:border-box}
.moment-picker .console-head{gap:12px;margin:0 0 16px;padding:0!important}
.moment-picker .console-head h2{margin:0;line-height:1.3}
.moment-picker .console-head>button{display:grid;place-items:center;flex:0 0 36px;width:36px;min-height:36px;padding:8px!important}
.moment-picker .console-note{margin:12px 0 16px;line-height:1.55}
.moment-picker .inline-date{margin:0!important;padding:16px!important;border:1px solid #d7e0f11c;border-radius:12px}
.moment-picker .date-wheel-pair{gap:16px!important}
.moment-picker .date-shortcuts{gap:8px;margin:16px 0 0}
.moment-picker .date-shortcuts button{border:1px solid #d7e0f12e;background:#ffffff05;border-radius:10px}
.moment-picker .moment-domain-tabs{margin:0 0 18px;gap:6px;padding:4px}
body.unified-navigation .moment-picker .moment-done{position:static;margin:0;padding:16px var(--surface-pad);gap:8px;background:transparent;display:grid;grid-template-columns:auto 1fr 1.25fr}
body.unified-navigation .moment-picker .moment-done button{min-height:44px;padding:10px!important;border-radius:10px;border:1px solid #d7e0f12e;background:#ffffff05;line-height:1.25}
body.unified-navigation .moment-picker .moment-done .moment-play,.observer-place-picker [data-apply]{border-color:#eac08b70;background:#eac08b18;color:var(--accent)}
body.unified-navigation .navigation-fields .navigation-date{padding-top:5px!important;padding-bottom:5px!important;gap:2px;line-height:1.25}
body.unified-navigation .navigation-fields .navigation-place{font-size:12px!important}
body.unified-navigation .navigation-fields :is(.navigation-date,.navigation-place):hover{border-color:#eac08b66!important;background:#21344888!important}
.observer-place-picker{box-sizing:border-box;width:540px;max-width:calc(100vw - 24px);padding:24px!important}
.observer-coordinate-fields input{box-sizing:border-box}
.observer-world-button{justify-content:flex-start;padding:12px;gap:10px;min-height:48px;border:1px solid #d7e0f12e;border-radius:10px;background:#ffffff05}
.observer-world-list[hidden]{display:none!important}
@media(min-width:700px){body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock){grid-template-columns:minmax(220px,1fr) minmax(240px,1.2fr) 52px!important;padding:7px 12px!important;gap:8px!important}body.unified-navigation .navigation-fields :is(.navigation-date,.navigation-place){padding-left:36px!important;font-size:13px!important}body.unified-navigation .navigation-fields :is(.navigation-date,.navigation-place)::before{left:11px}body.unified-navigation .navigation-date button,body.unified-navigation .navigation-date .utc{font-size:12px!important}}
@media(max-width:400px){body.unified-navigation dialog.settings-surface.moment-picker{--surface-pad:16px;padding:0!important}.observer-place-picker{padding:18px!important}.moment-picker .inline-date{padding:12px!important}body.unified-navigation .moment-picker .moment-done{grid-template-columns:1fr 1fr}.moment-picker .moment-done .moment-play{grid-column:1/-1}.moment-picker .moment-done button{font-size:12px!important}}

body.unified-navigation dialog.settings-surface.moment-picker>.console-head{padding:16px var(--surface-pad) 12px!important}
body.unified-navigation dialog.settings-surface.moment-picker>.moment-domain-tabs{flex:none;margin:0 var(--surface-pad) 16px}
body.unified-navigation dialog.settings-surface.moment-picker>.widget-content{padding:0 var(--surface-pad) 20px}
body.unified-navigation dialog.settings-surface.moment-picker .moment-done>button{color:var(--text)!important;background:#ffffff05!important;border-color:#d7e0f12e!important}
body.unified-navigation dialog.settings-surface.moment-picker .moment-done>.moment-play{background:#eac08b18!important;border-color:#eac08b70!important;color:var(--accent)!important}
body.unified-navigation dialog.settings-surface.moment-picker .date-shortcuts button{display:flex;align-items:center;justify-content:center;gap:8px}
@media(max-width:359px){body.unified-navigation dialog.settings-surface.moment-picker .date-wheel{grid-template-columns:108px minmax(0,1fr);gap:8px}body.unified-navigation dialog.settings-surface.moment-picker .typed-date input{padding:8px 4px}}

/* Compact scale key: orbital extent and body diameter, explained on activation. */
body.unified-navigation #scaleContext{width:auto!important;max-width:148px!important;padding:8px 12px!important;gap:5px!important;border-radius:11px!important;text-align:right!important;background:#10203066!important;border:1px solid #d7e0f126!important}
body.unified-navigation #scaleContext>span,body.unified-navigation #scaleContext>small{display:flex!important;align-items:center;justify-content:flex-end;gap:9px;font:12px/1.3 var(--ui-font)!important;font-variant-numeric:tabular-nums;color:#ccd6e2}
body.unified-navigation #scaleContext>span::before,body.unified-navigation #scaleContext>small::before{content:'';display:block;width:16px;height:10px;box-sizing:border-box;border:1.3px solid currentColor;border-radius:50%;opacity:.8}
body.unified-navigation #scaleContext>small::before{width:12px;height:12px;margin:0 2px}
@media(orientation:landscape){body.unified-navigation :is(.side-dock.settings-with-done,#skyRenderSettings,.stellar-settings.side-dock,.sky-settings){position:fixed!important;inset:0 0 0 auto!important;margin:0!important;width:min(420px,calc(100vw - 80px))!important;max-width:420px!important;height:100dvh!important;max-height:100dvh!important;border-radius:14px 0 0 14px!important}body.unified-navigation .side-dock .settings-scroll{padding-top:max(16px,env(safe-area-inset-top));padding-bottom:16px}}

/* One glass cartouche: preset switch and the scale-detail button are siblings. */
body.unified-navigation #scaleDock{position:fixed;right:12px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:12;display:flex;align-items:center;gap:6px;padding:6px;border:1px solid #d7e0f126;border-radius:12px;background:#10203055;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
body.unified-navigation #scaleDock[hidden]{display:none!important}
body.unified-navigation #scaleDock #scaleContext{position:static!important;inset:auto!important;transform:none!important;margin:0!important;padding:4px 7px!important;background:transparent!important;border:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;min-height:44px!important}
body.unified-navigation #scaleDock #scaleToggle{position:static!important;display:flex!important;align-items:center;gap:2px;width:auto!important;height:44px!important;min-height:44px!important;padding:3px!important;margin:0!important;border:1px solid #d7e0f126;border-radius:9px;background:#ffffff04;color:var(--muted)}
body.unified-navigation #scaleDock #scaleToggle span{padding:9px 8px;font:12px/1.2 var(--ui-font);border-radius:6px;white-space:nowrap}
body.unified-navigation #scaleToggle[aria-pressed=true] .scale-mode-real,body.unified-navigation #scaleToggle[aria-pressed=false] .scale-mode-preset{background:#eac08b20;color:var(--accent);box-shadow:inset 0 0 0 1px #eac08b40}
body.unified-navigation.hud-idle:not(.desktop-hover-clock) #scaleDock{opacity:0;pointer-events:none}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock){background:#10203055!important;backdrop-filter:blur(6px)!important;-webkit-backdrop-filter:blur(6px)!important}
body.unified-navigation .navigation-date>div{align-items:flex-start!important;width:100%}
body.unified-navigation .navigation-date :is(#orbitDateReadout,.utc){align-self:flex-start!important;text-align:left!important;width:auto!important;margin:0!important}
@media(max-width:1240px){body.unified-navigation #scaleDock{bottom:calc(122px + env(safe-area-inset-bottom))}}
/* The legacy date wrapper owns its horizontal inset; reserve the icon gutter. */
body.unified-navigation #app .navigation-date>div{position:static!important;transform:none!important;box-sizing:border-box!important;padding:0 0 0 26px!important;margin:0!important;min-width:0!important}

/* Quiet scene information; all scale editing lives in global settings. */
body.unified-navigation .navigation-readout,body.unified-navigation .navigation-readout small,body.unified-navigation .scale-idle-readout{color:#9cabbab8!important;text-shadow:0 1px 3px #0006;background:#10203020;font-weight:400}
body.unified-navigation #app .navigation-fields :is(.navigation-place,.navigation-date){padding:6px 10px 6px 32px!important;justify-content:center!important;align-items:flex-start!important;border-radius:10px!important;border:1px solid #d7e0f126!important;background:#10203030!important;line-height:1.3!important}
body.unified-navigation #app .navigation-fields :is(.navigation-place,.navigation-date)::before{left:9px!important;top:14px!important;opacity:.65}
body.unified-navigation #app .navigation-date>div{position:static!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;width:100%!important;inset:auto!important;padding:0!important;margin:0!important;transform:none!important}
body.unified-navigation #app .navigation-date :is(#orbitDateReadout,.utc){position:static!important;inset:auto!important;transform:none!important;margin:0!important;padding:0!important;min-height:0!important;align-self:flex-start!important;text-align:left!important;width:auto!important;line-height:1.3!important}
body.unified-navigation .scale-settings .scale-presets{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 16px}
body.unified-navigation .scale-settings .scale-presets button{min-height:44px;padding:8px 12px;border:1px solid #d7e0f12e;border-radius:10px;background:#ffffff05;color:var(--text)}
body.unified-navigation #scaleToggle[aria-pressed=true]{color:var(--accent)!important;border-color:#eac08b70!important;background:#eac08b12!important}


/* Five controls, one glass treatment and equal gutters. */
body.unified-navigation{--control-radius:11px;--control-glass:#10203038;--control-outline:1px solid #d7e0f126}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock){grid-template-columns:minmax(104px,.75fr) minmax(104px,1.4fr) 44px!important;gap:6px!important;padding:7px!important;grid-template-rows:44px 44px!important}
body.unified-navigation .navigation-fields{gap:6px}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.time-controls{align-self:stretch!important;align-items:stretch!important}
body.unified-navigation #app .navigation-play{align-self:stretch!important;height:100%!important;min-height:44px!important;border-radius:var(--control-radius)!important;border:var(--control-outline)!important;background:var(--control-glass)!important;margin:0!important}
body.unified-navigation #app :is(.navigation-place,.navigation-date,.wheel-drum,.speed-wheel>[role=slider]){border-radius:var(--control-radius)!important;border:var(--control-outline)!important;background:var(--control-glass)!important;backdrop-filter:blur(6px)!important;-webkit-backdrop-filter:blur(6px)!important}
.body-layer-details{border-top:1px solid #d7e0f126;padding:8px 0}
.body-layer-details summary{display:flex;align-items:center;gap:10px;cursor:pointer;min-height:44px}
.body-layer-details summary::after{content:'⌄';margin-left:auto}
.body-layer-details[open] summary::after{transform:rotate(180deg)}
.body-layer-details>label{display:flex;align-items:center;gap:10px;min-height:44px;padding-left:26px}
.body-layer-details input{width:18px;height:18px;accent-color:var(--accent)}

body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.time-controls{height:94px!important;max-height:none!important;padding:0!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .navigation-play{height:94px!important;max-height:none!important;align-self:stretch!important}
body #sceneReadoutDock>.navigation-readout{position:relative!important;inset:auto!important;transform:none!important;order:30;width:100%!important;max-width:none!important;pointer-events:none!important;opacity:.85!important}
body #sceneReadoutDock>#measurementPanel{order:20}
body #sceneReadoutDock>.journey-strip{order:10}
body #sceneReadoutDock>.navigation-readout[hidden]{display:none!important}

/* Quiet labels remain legible over bright skies without a glass rectangle. */
body.unified-navigation .navigation-readout,
body.unified-navigation .navigation-readout :is(span,small),
body.unified-navigation .scale-idle-readout,
body.unified-navigation #sceneReadoutDock>.navigation-readout{
 background:none!important;border:0!important;box-shadow:none!important;
 backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
 text-shadow:0 1px 2px #000b,0 0 1px #0009!important;
}

body.unified-navigation #catalogClose:focus{outline:none!important;box-shadow:none!important}

.time-wheel .wheel-drum>b{display:none!important}

/* A complete date remains readable at the 375 px phone width. */
@media(max-width:420px){
 body.unified-navigation .moment-picker .date-wheel{grid-template-columns:minmax(132px,1.15fr) minmax(76px,1fr);gap:8px}
 body.unified-navigation .moment-picker .inline-date{padding:10px!important}
 body.unified-navigation .moment-picker .typed-date input{font-size:16px!important;letter-spacing:0;min-width:0;width:100%;padding:4px!important}
 body.unified-navigation #app .navigation-fields :is(.navigation-place,.navigation-date){padding-left:28px!important;padding-right:5px!important;font-size:11px!important}
 body.unified-navigation #app .navigation-fields :is(.navigation-place,.navigation-date)::before{width:13px;height:13px;left:8px!important;top:15px!important}
 body.unified-navigation #app .navigation-date :is(button,.utc){font-size:10px!important;letter-spacing:0!important;white-space:nowrap}
}

/* Playback docks beside speed; the time wheel uses the entire upper row. */
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>.time-wheel{grid-column:2/4!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock)>:is(.time-controls,.navigation-play){grid-column:3!important;grid-row:2!important;height:44px!important;align-self:stretch!important}
body.unified-navigation #app :is(#timeline,.sky-time-dock,.exploration-clock) .navigation-play{height:44px!important}

body.unified-navigation #app #compactClockReadout{position:relative!important;min-width:0!important;padding:5px 5px 5px 28px!important}
body.unified-navigation #app #compactClockReadout #clockReadout{font-size:12px!important;line-height:1.3!important;font-weight:400;letter-spacing:0;position:static!important;margin:0!important;padding:0!important}
body.unified-navigation #app #compactClockReadout #compactClockDate{font-size:9px!important;line-height:1.3!important;letter-spacing:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* The shared stack replaces legacy film offsets, including idle mode. */
body.documentary-playing #sceneReadoutDock>#measurementPanel{inset:auto!important;transform:none!important;opacity:1!important}
body.documentary-playing #sceneReadoutDock>.navigation-readout{opacity:.85!important}

/* Shared settings hierarchy: a disclosure is distinct from its visibility switch. */
body :is(.settings-scroll,.organized-settings,.cosmic-settings) .body-layer-details{
 display:block!important;padding:0!important;margin:6px 0!important;border:1px solid #c9d7e51b;border-radius:11px;background:#c7dfff03;overflow:hidden;
}
body :is(.settings-scroll,.organized-settings,.cosmic-settings) .body-layer-details>summary{
 display:flex!important;align-items:center;gap:10px;min-height:46px;padding:8px 12px!important;list-style:none!important;color:#d8e3eb;box-sizing:border-box;
}
body .body-layer-details>summary::-webkit-details-marker{display:none}
body :is(.settings-scroll,.organized-settings,.cosmic-settings) .body-layer-details>summary::before{content:none!important}
body .body-layer-details>summary::after{content:'›';font-size:20px;line-height:1;transform:none;flex:none;margin-left:auto;opacity:.65}
body .body-layer-details[open]>summary::after{transform:rotate(90deg)}
body .body-layer-details .layer-group-title{flex:1;min-width:0}
body .body-layer-details .layer-group-count{font-size:11px!important;font-variant-numeric:tabular-nums;color:#96a8b8;white-space:nowrap}
body :is(.settings-scroll,.organized-settings,.cosmic-settings) .body-layer-details>label{
 display:flex!important;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin:0!important;padding:7px 12px 7px 40px!important;width:100%;box-sizing:border-box;border-top:1px solid #c9d7e50b;
}
body .body-layer-details>label>input{order:2;margin:0;flex:none}
body .body-layer-details input[type=checkbox]{appearance:auto;width:18px;height:18px;min-width:18px;margin:0;accent-color:var(--accent)}
body .body-layer-details>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
body .notable-settings{grid-column:1/-1;width:100%}
body .settings-scroll .settings-group{padding-top:18px;margin-top:18px}
body .settings-scroll .settings-group:first-child{margin-top:0;border-top:0}
body #viewSettingsDock .settings-scroll .scale-settings label:has(input[type=range]){
 display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center;gap:6px 12px!important;padding:10px 0!important;
}
body #viewSettingsDock .settings-scroll .scale-settings label:has(input[type=range]) input[type=range]{grid-column:1/-1!important;grid-row:2!important;width:100%!important;max-width:none!important;min-width:0;margin:0}
body #viewSettingsDock .settings-scroll .scale-settings .settings-label{grid-column:1!important;grid-row:1!important;min-width:0}
body #viewSettingsDock .settings-scroll .scale-settings output{grid-column:2!important;grid-row:1!important;min-width:56px;text-align:right;font-variant-numeric:tabular-nums;color:#d9c19d}
body #viewSettingsDock .settings-scroll .scale-settings .settings-explain-trigger{text-decoration:none}
body .magnification-stops{display:flex;justify-content:space-between;align-items:center;color:#98aabb;font-size:11px;gap:12px;margin:-4px 0 8px}
body .magnification-reset{min-height:36px;min-width:58px;padding:4px 12px;border:1px solid #dbbf8d50;border-radius:9px;background:#eac08b08;color:#e4c69b;font-variant-numeric:tabular-nums}
body input.magnification-slider{background-image:linear-gradient(90deg,transparent calc(50% - 1px),#dfc39b80 calc(50% - 1px),#dfc39b80 calc(50% + 1px),transparent calc(50% + 1px));background-size:100% 8px;background-position:center;background-repeat:no-repeat}
body :is(#viewSettingsDock,#skyRenderSettings,.cosmic-settings) .settings-scroll{overflow-anchor:none;scrollbar-gutter:stable;padding-bottom:20px}
@media(orientation:landscape){body :is(#viewSettingsDock,#skyRenderSettings,.cosmic-settings).side-dock{width:min(420px,48vw)!important;height:100dvh!important;max-height:100dvh!important}}


/* Quiet, structured location readout: coordinates never orphan their direction. */
body.sky-view #sceneReadoutDock>.navigation-readout{opacity:1!important;color:#bcc6d2b8!important;text-shadow:0 1px 2px #0009!important;gap:2px}
body.sky-view #sceneReadoutDock>.navigation-readout :is(span,small){color:inherit!important;opacity:1!important;text-shadow:inherit!important;line-height:1.4;font-weight:400}
body.sky-view #sceneReadoutDock>.navigation-readout>.readout-place{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.sky-view #sceneReadoutDock>.navigation-readout>.readout-coordinates{font-size:10.5px;white-space:nowrap;font-variant-numeric:tabular-nums}
body.sky-view #sceneReadoutDock>.navigation-readout>.readout-date{font-size:10.5px;font-variant-numeric:tabular-nums}

/* Place and scale labels occupy the same inset at opposite ends of the clock.
   Keep the place label out of the moving stack while the controls fade. */
body.unified-navigation{--quiet-readout-ink:#bcc6d2b8}
body.unified-navigation:not(.documentary-playing) #sceneReadoutDock>.navigation-readout{
 position:fixed!important;left:var(--readout-left,16px)!important;right:auto!important;
 bottom:calc(12px + env(safe-area-inset-bottom))!important;top:auto!important;
 width:auto!important;max-width:min(350px,calc((100vw - 32px)*.62))!important;
 padding:5px 7px!important;pointer-events:none!important;
}
body.unified-navigation .scale-idle-readout{
 right:max(16px,calc((100vw - 760px)/2));padding:5px 7px;
 white-space:pre-line;font:11px/1.4 var(--ui-font);
}
body.unified-navigation #sceneReadoutDock>.navigation-readout,
body.unified-navigation #sceneReadoutDock>.navigation-readout :is(span,small),
body.unified-navigation .scale-idle-readout{
 color:var(--quiet-readout-ink)!important;opacity:1!important;
 text-shadow:0 1px 2px #0009!important;font-weight:400;
}
/* A single parent fade owns both fields, including desktop hover reveal. */
body.unified-navigation.hud-idle #app .navigation-fields .navigation-place{
 opacity:1!important;transition:none!important;pointer-events:inherit!important;
}
@keyframes quiet-readout-reveal{from{visibility:hidden;opacity:0}to{visibility:visible;opacity:1}}
body.unified-navigation.hud-idle:not(.desktop-hover-clock):not(.documentary-playing) #sceneReadoutDock>.navigation-readout,
body.unified-navigation.hud-idle:not(.desktop-hover-clock):not(.documentary-playing) .scale-idle-readout{
 animation:quiet-readout-reveal .15s ease .65s both;
}
@media(prefers-reduced-motion:reduce){
 body.unified-navigation #sceneReadoutDock>.navigation-readout,
 body.unified-navigation .scale-idle-readout{animation:none!important}
}
@media(any-pointer:fine){
 body.unified-navigation.hud-idle.desktop-hover-clock #app :is(#timeline,.sky-time-dock,.exploration-clock){opacity:1!important;pointer-events:auto!important;transition:opacity .15s ease!important}
}