/* SphereShift Labs — Observer Shell v1.
   Full-viewport scenes, glass overlays and consistent discoverable controls.
   Scoped to science viewers; thesis and verification remain documents. */
:root{--sphere-shell:#09070fdb;--sphere-line:#ffbd7c55;--sphere-text:#f1eadf;--sphere-accent:#ffc17e}
.sphere-observer{position:absolute;z-index:42;left:18px;bottom:86px;display:flex;align-items:center;gap:6px;max-width:calc(100% - 36px);padding:7px 8px;border:1px solid var(--sphere-line);border-radius:13px;background:var(--sphere-shell);backdrop-filter:blur(16px);box-shadow:0 12px 35px #0008;font:12px/1.3 "IBM Plex Sans",system-ui,sans-serif;color:var(--sphere-text)}
.sphere-observer button{font:inherit;min-height:38px;white-space:nowrap;padding:7px 10px;border:1px solid #ffffff26;border-radius:7px;background:#ffffff08;color:inherit;cursor:pointer}
.sphere-observer button:hover,.sphere-observer button:focus-visible{border-color:var(--sphere-accent);color:#ffe3c1}
.sphere-observer button:focus-visible,.sphere-help:focus-visible{outline:2px solid var(--sphere-accent);outline-offset:2px}
.sphere-observer button[aria-pressed=true]{background:#ffc17e22;border-color:var(--sphere-accent);color:#ffe3bc}
.sphere-observer .sphere-label{font:10px "IBM Plex Mono",monospace;letter-spacing:.13em;color:var(--sphere-accent);margin:0 8px 0 5px;text-transform:uppercase}
.sphere-observer button[disabled]{display:none}
.sphere-observer .sphere-help-trigger{min-width:38px;padding:7px}
.sphere-help{position:absolute;z-index:43;left:18px;bottom:150px;max-width:min(365px,calc(100% - 36px));background:#0d0b14f5;color:var(--sphere-text);border:1px solid var(--sphere-line);border-radius:12px;padding:17px;box-shadow:0 10px 35px #000b;font:13px/1.55 "IBM Plex Sans",system-ui}
.sphere-help[hidden]{display:none!important}.sphere-help h3{margin:0 0 7px;color:var(--sphere-accent);font:400 25px "Instrument Serif",Georgia,serif}.sphere-help p{margin:0 0 9px;color:#d9cdbc}.sphere-help kbd{font:11px "IBM Plex Mono",monospace;padding:2px 5px;border:1px solid #ffffff36;border-radius:4px}
.sphere-help button{background:#19131c;border:1px solid var(--sphere-line);border-radius:7px;color:var(--sphere-text);padding:8px 12px;cursor:pointer}
.sphere-observer-frame{position:relative;isolation:isolate}
.probe-dialog .probe-window,.stellar-dialog .stellar-window{position:relative;width:100vw;height:100dvh;max-height:100dvh;overflow:hidden}
/* Probe: the actual canvas, not the application frame, is the viewport. */
.probe-dialog .probe-layout{position:absolute!important;inset:0!important;display:block!important;height:100%!important;min-height:0!important;overflow:hidden}
.probe-dialog .probe-stage{position:absolute!important;inset:0!important;display:block!important;height:100%!important;min-height:0!important;padding:0!important;background:none}
.probe-dialog .probe-plot-wrap{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;border:0!important;border-radius:0!important;overflow:hidden}
.probe-dialog .probe-live-scene{border-radius:0}
.probe-dialog header{position:absolute!important;top:0;left:0;right:0;z-index:35!important;min-height:70px;padding:13px 18px!important;gap:12px!important;border:0!important;display:flex!important;align-items:center!important;background:linear-gradient(180deg,#05040adf 0%,#05040a99 68%,transparent)!important;pointer-events:none}
.probe-dialog header>*{pointer-events:auto}.probe-dialog header h2{font-size:clamp(22px,2.2vw,30px)!important}.probe-dialog header .probe-intro{font-size:11px}
.probe-dialog .probe-lessons{position:absolute;top:99px;left:18px;z-index:20;max-width:calc(100% - 380px);padding:0;overflow-x:auto;flex-wrap:nowrap}
.probe-dialog .probe-lessons button{white-space:nowrap;flex:none;background:#0c0a11dc;min-height:36px}
.probe-dialog .probe-takeaway{position:absolute;z-index:18;left:18px;top:150px;width:min(440px,calc(100% - 390px));padding:8px 13px;border:1px solid #ffffff18;border-left:2px solid var(--sphere-accent);border-radius:8px;background:#07060cbb;backdrop-filter:blur(6px)}
.probe-dialog .probe-takeaway h3{font-size:23px}.probe-dialog .probe-takeaway p{font-size:11px}
.probe-dialog .probe-view-switch{position:absolute;z-index:25;left:18px;bottom:170px;gap:7px;justify-content:flex-start;background:#090710c9;border:1px solid #ffffff1b;border-radius:10px;padding:5px}
.probe-dialog .probe-help{position:absolute;z-index:18;left:20px;bottom:139px;max-width:min(520px,calc(100% - 365px));margin:0;background:#07060baf;padding:4px 7px;border-radius:5px}
.probe-dialog .probe-time-label{display:none!important}
.probe-dialog .probe-transport{position:absolute;z-index:25;left:18px;bottom:17px;width:min(760px,calc(100% - 375px));min-height:52px;padding:8px 11px;gap:8px;border:1px solid var(--sphere-line);border-radius:12px;background:var(--sphere-shell);backdrop-filter:blur(14px);flex-wrap:nowrap}
.probe-dialog .probe-sidebar{position:absolute!important;top:89px!important;right:16px!important;bottom:16px!important;left:auto!important;z-index:29!important;width:322px!important;min-height:0;overflow:auto!important;background:#0d0a13e9!important;border:1px solid #ffffff2b!important;border-radius:13px!important;box-shadow:0 14px 42px #000a;backdrop-filter:blur(14px)}
.probe-dialog .probe-map-label{top:94px;right:18px;left:auto;text-align:right;max-width:300px}
.probe-dialog .probe-scene-note{top:268px;left:20px;right:auto;max-width:310px;background:#07060b80;padding:4px}
.probe-dialog .probe-scene-trials{bottom:239px}
.probe-dialog.sphere-panel-hidden .probe-sidebar{display:none!important}
.probe-dialog.controls-collapsed .sphere-observer,.probe-dialog.controls-collapsed .sphere-help{display:none!important}
.probe-dialog.controls-collapsed .probe-sidebar{display:none!important}
.probe-dialog.controls-collapsed .probe-window-actions{pointer-events:auto}
.probe-dialog.controls-collapsed .probe-stage>.probe-plot-wrap{display:block!important}
/* Star Encounters — identical stage geometry and dock conventions. */
.stellar-dialog .stellar-layout,.stellar-dialog.inspector-open .stellar-layout{position:absolute!important;inset:0!important;display:block!important;min-height:0!important;height:100%!important;overflow:hidden}
.stellar-dialog .stellar-stage{position:absolute!important;inset:0!important;padding:0!important;display:block!important;height:100%!important;min-height:0!important}
.stellar-dialog .stellar-viewport{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;border:0!important;border-radius:0!important}
.stellar-dialog header{position:absolute!important;left:0;right:0;top:0;z-index:35!important;border:0!important;padding:13px 18px!important;background:linear-gradient(180deg,#05040adf,#05040a91 70%,transparent)!important;pointer-events:none}
.stellar-dialog header>*{pointer-events:auto}.stellar-dialog h2{font-size:clamp(22px,2.2vw,30px)!important}
.stellar-dialog .stellar-toolbar{position:absolute!important;top:100px;left:18px;right:auto;max-width:calc(100% - 365px);z-index:24;border:1px solid #ffffff24!important;border-radius:11px;background:#100d15df!important;backdrop-filter:blur(14px);gap:6px}
.stellar-dialog .stellar-takeaway{position:absolute;top:165px;left:18px;max-width:min(500px,calc(100% - 375px));padding:9px 12px;background:#08070dc9;border-radius:8px;z-index:22}
.stellar-dialog .stellar-clock{position:absolute;top:243px;left:20px;z-index:22;max-width:calc(100% - 390px);padding:6px 9px;border-radius:7px;background:#08070da8}
.stellar-dialog .stellar-moments{position:absolute;left:18px;bottom:151px;max-width:calc(100% - 375px);z-index:22}
.stellar-dialog .stellar-moments button{background:#0b0912dd}
.stellar-dialog .stellar-transport{position:absolute;left:18px;bottom:17px;min-height:52px;width:min(740px,calc(100% - 375px));z-index:24;background:var(--sphere-shell);border:1px solid var(--sphere-line);padding:9px;border-radius:12px;backdrop-filter:blur(14px)}
.stellar-dialog .stellar-view-note{position:absolute;left:20px;bottom:132px;max-width:calc(100% - 400px);z-index:16;background:#0907108c;padding:3px 7px}
.stellar-dialog .stellar-controls{position:absolute!important;z-index:29!important;top:90px!important;right:16px!important;bottom:16px!important;left:auto!important;width:320px!important;border:1px solid #ffffff2b!important;border-radius:13px!important;background:#0d0a13e9!important;box-shadow:0 14px 42px #000a;backdrop-filter:blur(15px)}
.stellar-dialog:not(.inspector-open) .stellar-controls,.stellar-dialog.sphere-panel-hidden .stellar-controls{display:none!important}
.stellar-dialog .stellar-trials{bottom:207px;left:18px;right:360px;max-width:calc(100% - 390px);scrollbar-width:thin}
.stellar-dialog.controls-collapsed .sphere-observer,.stellar-dialog.controls-collapsed .sphere-help{display:none!important}
.stellar-dialog.controls-collapsed .stellar-controls{display:none!important}
/* Full-viewport science experiences already using an edge-to-edge canvas. */
body.sphere-immersive-view > .sphere-observer{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:13}
body.sphere-immersive-view > .sphere-help{position:fixed;left:50%;bottom:86px;transform:translateX(-50%);z-index:14}
body.sphere-immersive-view.immersive > .sphere-observer,body.sphere-immersive-view.immersive > .sphere-help,body.sphere-immersive-view.clean > .sphere-observer,body.sphere-immersive-view.clean > .sphere-help{display:none!important}
body.sphere-immersive-view.sphere-panel-hidden :is(.panel,.controls,.last-panel){display:none!important}
body.sphere-immersive-view.sphere-panel-hidden .last-transport{right:24px}
@media(min-width:861px){.probe-dialog .probe-mobile-dock{display:none!important}}
@media(max-width:860px){
 .sphere-observer{left:9px;right:9px;bottom:73px;max-width:none;justify-content:space-around;gap:3px;padding:5px}
 .sphere-observer .sphere-label{display:none}.sphere-observer button{flex:1;min-width:0;white-space:normal;font-size:10px;padding:7px 4px;min-height:43px}
 .probe-dialog .sphere-observer [data-action=fit],.probe-dialog .sphere-observer [data-action=hide],.stellar-dialog .sphere-observer [data-action=restart],.stellar-dialog .sphere-observer [data-action=hide]{display:none}
 .probe-dialog .sphere-observer [data-action=tools],.stellar-dialog .sphere-observer [data-action=tools]{font-size:10px}
 .probe-dialog .sphere-observer [data-action=help],.stellar-dialog .sphere-observer [data-action=help]{flex:0 0 38px}
 .sphere-help{left:10px;right:10px;bottom:138px;max-width:none}
 .probe-dialog header,.stellar-dialog header{padding:10px 12px!important;min-height:62px}
 .probe-dialog header h2,.stellar-dialog header h2{font-size:21px!important}
 .probe-dialog .probe-intro,.stellar-dialog #stellarIntro{display:none}
 .probe-dialog .probe-window-actions,.stellar-dialog .stellar-window-actions{width:auto;flex:none;justify-content:flex-end}
 .probe-dialog .probe-window-actions button,.stellar-dialog .stellar-window-actions button{min-height:38px}
 .probe-dialog .probe-window-actions #probeFull,.stellar-dialog .stellar-window-actions #stellarFull{display:none}
 .probe-dialog .probe-lessons{top:73px;left:9px;right:9px;max-width:none}
 .probe-dialog .probe-takeaway{top:120px;left:9px;max-width:calc(100% - 18px);width:calc(100% - 18px);padding:5px 9px}
 .probe-dialog .probe-takeaway h3{font-size:19px}.probe-dialog .probe-takeaway p{display:none}
 .probe-dialog .probe-view-switch{bottom:167px;left:9px;right:9px;justify-content:center}
 .probe-dialog .probe-help,.probe-dialog .probe-scene-note{display:none}
 .probe-dialog .probe-map-label{top:174px;left:10px;right:auto;font-size:9px}
 .probe-dialog .probe-transport{left:9px;right:9px;bottom:9px;width:auto;gap:4px;min-height:54px;padding:6px}
 .probe-dialog .probe-transport button{min-height:41px}
 .probe-dialog .probe-mobile-dock{display:none!important}
 .probe-dialog .probe-sidebar{top:auto!important;left:7px!important;right:7px!important;bottom:73px!important;width:auto!important;max-height:min(67dvh,550px);height:auto;z-index:39!important}
 .probe-dialog .probe-scene-trials{bottom:231px;max-width:90%}
 .stellar-dialog .stellar-toolbar{top:74px;left:9px;right:9px;max-width:none;flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start}
 .stellar-dialog .stellar-toolbar button{white-space:nowrap;flex:none}
 .stellar-dialog .stellar-takeaway{top:126px;left:9px;max-width:calc(100% - 18px);padding:6px 10px}
 .stellar-dialog .stellar-takeaway h3{font-size:19px}.stellar-dialog .stellar-takeaway p{display:none}
 .stellar-dialog .stellar-clock{top:177px;left:10px;max-width:calc(100% - 20px)}
 .stellar-dialog .stellar-controls{top:auto!important;left:7px!important;right:7px!important;bottom:73px!important;width:auto!important;max-height:min(67dvh,550px)!important}
 .stellar-dialog.inspector-open .stellar-stage{visibility:visible!important}
 .stellar-dialog .stellar-moments{left:9px;right:9px;bottom:159px;max-width:none}
 .stellar-dialog .stellar-transport{left:9px;right:9px;bottom:9px;width:auto;min-height:54px;padding:6px}
 .stellar-dialog .stellar-view-note{display:none}
 .stellar-dialog .stellar-trials{left:9px;right:9px;max-width:none;bottom:211px}
 body.sphere-immersive-view > .sphere-observer{left:9px;right:9px;bottom:72px;transform:none;max-width:none}
 body.sphere-immersive-view > .sphere-help{left:9px;right:9px;bottom:139px;transform:none}
 /* The far-future journey is a viewer on phones too, never a scrolling document. */
 body.sphere-last-view{display:block!important;overflow:hidden!important;height:100dvh}
 body.sphere-last-view .last-nav{height:44px}
 body.sphere-last-view .last-brand{top:75px;left:16px}
 body.sphere-last-view .last-scene-caption{position:fixed!important;bottom:185px!important;left:15px!important;right:15px!important;max-width:calc(100% - 30px)!important;min-height:0!important;margin:0!important;padding:0!important}
 body.sphere-last-view .last-transport{position:fixed!important;left:8px!important;right:8px!important;bottom:8px!important;margin:0!important}
 body.sphere-last-view .last-panel{position:fixed!important;left:8px!important;right:8px!important;top:auto!important;bottom:80px!important;width:auto!important;max-height:65dvh!important;overflow:auto!important;margin:0!important;z-index:25!important;display:none}
 body.sphere-last-view.sphere-panel-open .last-panel{display:block!important}
 body.sphere-last-view.sphere-panel-hidden .last-panel{display:none!important}
}
@media(max-height:640px){.probe-dialog .probe-takeaway p,.stellar-dialog .stellar-takeaway p{display:none}.probe-dialog .probe-lesson button{min-height:30px}}
@media(prefers-reduced-motion:reduce){.sphere-observer,.sphere-help{scroll-behavior:auto!important}}

/* Hide only the legacy chrome while preserving the Observer escape hatch. */
body.sphere-clean .bar,body.sphere-clean .hud,body.sphere-clean .controls{visibility:hidden!important;opacity:0!important;pointer-events:none!important}
body.sphere-clean > .sphere-observer,body.sphere-clean > .sphere-help{visibility:visible!important;opacity:1!important;pointer-events:auto!important}

/* Replay timelines keep their own lower lane; Observer sits above them. */
body.sphere-replay-view > .sphere-observer{left:18px;bottom:94px;transform:none}
body.sphere-replay-view > .sphere-help{left:18px;bottom:160px;transform:none}
body.sphere-last-view > .sphere-observer{left:18px;bottom:170px;transform:none}
body.sphere-last-view > .sphere-help{left:18px;bottom:234px;transform:none}
@media(max-width:860px){
 body.sphere-replay-view > .sphere-observer{left:8px;right:8px;bottom:92px;transform:none}
 body.sphere-replay-view > .sphere-help{left:8px;right:8px;bottom:158px;transform:none}
 body.sphere-last-view > .sphere-observer{left:8px;right:8px;bottom:130px;transform:none}
 body.sphere-last-view > .sphere-help{left:8px;right:8px;bottom:197px;transform:none}
}

/* One operation per control: the Observer dock replaces duplicate view switchers. */
.probe-dialog:has(.sphere-observer) .probe-view-switch,.stellar-dialog:has(.sphere-observer) .stellar-views,.stellar-dialog:has(.sphere-observer) #stellarInspect{display:none!important}
.probe-dialog .sphere-observer [data-action=play],.stellar-dialog .sphere-observer [data-action=play],body.sphere-last-view > .sphere-observer [data-action=play],body.sphere-last-view > .sphere-observer [data-action=restart]{display:none!important}
@media(max-width:860px){.probe-dialog .sphere-observer [data-action=place]{display:block}.probe-dialog .sphere-scene-trials{bottom:180px}}
