/* COSMIC EXPLORER — instrument-grade visual layer */
#cosmicExplorer{position:fixed;inset:0;z-index:60;pointer-events:auto}.cx-hero{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;justify-content:center;padding:10vh 8vw;background:radial-gradient(circle at 70% 42%,rgba(55,110,180,.12),transparent 32%),linear-gradient(180deg,rgba(1,5,14,.72),rgba(1,3,10,.35) 55%,rgba(1,3,10,.76));backdrop-filter:blur(2px);pointer-events:auto;touch-action:manipulation;transition:opacity .7s,transform .7s}.cx-hero.cx-dismiss{opacity:0;transform:scale(1.04);pointer-events:none}.cx-hero-kicker,.cx-guide-kicker,.cx-inspector-kicker{font:600 9px/1.2 system-ui,sans-serif;letter-spacing:.28em;color:#7ee7ff;text-transform:uppercase}.cx-hero-title{margin-top:18px;font:300 clamp(46px,8vw,110px)/.88 system-ui,sans-serif;letter-spacing:-.065em;color:#eef7ff}.cx-hero-title span{color:rgba(126,231,255,.65)}.cx-hero-copy{max-width:570px;margin-top:25px;font:300 14px/1.65 system-ui,sans-serif;color:rgba(220,232,250,.58)}.cx-hero-actions{display:flex;gap:10px;margin-top:30px}.cx-primary,.cx-secondary,#cxCloseGuide{padding:12px 16px;border-radius:9px;cursor:pointer;font:600 9px system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase}.cx-primary{border:1px solid rgba(126,231,255,.38);background:rgba(126,231,255,.1);color:#dff8ff;position:relative;z-index:2;pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.cx-secondary,#cxCloseGuide{border:1px solid rgba(220,235,255,.12);background:rgba(255,255,255,.035);color:rgba(230,240,255,.6)}
#cxInstrument{position:fixed;right:22px;top:92px;z-index:35;width:min(335px,calc(100vw - 44px));padding:17px;border:1px solid rgba(145,200,255,.18);border-radius:20px;background:linear-gradient(145deg,rgba(3,12,28,.86),rgba(2,6,17,.68));backdrop-filter:blur(22px);box-shadow:0 25px 90px rgba(0,0,0,.42);opacity:0;transform:translateY(-12px);transition:.55s}#cxInstrument.open{opacity:1;transform:none}#cxInstrument:not(.open){pointer-events:none}.cx-instrument-top{display:flex;justify-content:space-between;font:600 8px system-ui,sans-serif;letter-spacing:.2em;color:rgba(190,215,255,.42)}.cx-instrument-top b{color:#7ee7ff}.cx-object{margin-top:16px;font:300 25px/1 system-ui,sans-serif;letter-spacing:-.04em;color:#f3f8ff}.cx-object-sub{margin-top:6px;font:600 8px system-ui,sans-serif;letter-spacing:.17em;color:rgba(126,231,255,.62)}.cx-metrics{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:17px}.cx-metrics>div{padding:10px;border:1px solid rgba(150,190,255,.09);border-radius:11px;background:rgba(255,255,255,.025)}.cx-metrics span,.cx-meter>span{display:block;font:600 7px system-ui,sans-serif;letter-spacing:.15em;color:rgba(190,215,255,.38)}.cx-metrics strong{display:block;margin-top:5px;font:500 11px system-ui,sans-serif;color:rgba(240,247,255,.9);font-variant-numeric:tabular-nums}.cx-meter{margin-top:12px}.cx-meter i{display:block;height:2px;margin-top:7px;background:rgba(180,210,255,.1);overflow:hidden}.cx-meter em{display:block;width:0;height:100%;background:#7ee7ff;box-shadow:0 0 12px #7ee7ff;transition:width .5s}.cx-inspect{width:100%;margin-top:14px;padding:11px;border:1px solid rgba(126,231,255,.16);border-radius:10px;background:rgba(126,231,255,.05);color:rgba(225,245,255,.72);font:600 8px system-ui,sans-serif;letter-spacing:.14em;cursor:pointer}
#cosmicDock{position:fixed;left:50%;bottom:20px;z-index:40;transform:translateX(-50%);display:flex;gap:5px;padding:7px;border:1px solid rgba(150,190,255,.18);border-radius:16px;background:rgba(2,7,18,.76);backdrop-filter:blur(20px);box-shadow:0 16px 65px rgba(0,0,0,.42)}.cx-mode{border:0;background:transparent;color:rgba(225,235,255,.5);padding:10px 13px;border-radius:10px;font:600 9px/1 system-ui,sans-serif;letter-spacing:.12em;cursor:pointer}.cx-mode:hover,.cx-mode.active{color:#fff;background:rgba(126,231,255,.11);box-shadow:inset 0 0 0 1px rgba(126,231,255,.16)}
#cxTimeline{position:fixed;left:50%;bottom:82px;z-index:31;width:min(570px,70vw);transform:translateX(-50%) translateY(8px);opacity:0;pointer-events:none;transition:.4s}.cx-timeline-head{display:flex;justify-content:space-between;font:600 8px system-ui,sans-serif;letter-spacing:.17em;color:rgba(200,220,245,.45)}.cx-timeline-head b{color:#7ee7ff}.cx-track{position:relative;height:18px;margin:10px 0;border-top:1px solid rgba(126,231,255,.28)}.cx-track i{position:absolute;top:-2px;left:0;width:100%;height:2px;background:linear-gradient(90deg,rgba(126,231,255,.1),#7ee7ff,rgba(126,231,255,.1));box-shadow:0 0 13px rgba(126,231,255,.4)}.cx-track span{position:absolute;top:7px;font:600 7px system-ui,sans-serif;letter-spacing:.13em;color:rgba(200,220,245,.32)}.cx-track span:first-of-type{left:0}.cx-track span:last-of-type{right:0}.cx-timeline-note{font:300 9px/1.45 system-ui,sans-serif;text-align:center;color:rgba(215,230,250,.42)}#cxTimeline.show{opacity:1;transform:translateX(-50%)}
#cxInspector{position:fixed;left:50%;top:50%;z-index:55;width:min(510px,calc(100vw - 30px));transform:translate(-50%,-50%);padding:24px;border:1px solid rgba(145,205,255,.22);border-radius:22px;background:rgba(2,8,20,.93);backdrop-filter:blur(28px);box-shadow:0 30px 120px rgba(0,0,0,.65)}#cxInspector.hidden,#cxGuidePanel.hidden{display:none!important}.cx-close{position:absolute;right:14px;top:12px;border:0;background:none;color:rgba(230,240,255,.5);font-size:23px;cursor:pointer}.cx-inspector h2{margin:12px 0 3px;font:300 30px system-ui,sans-serif;color:#f2f8ff}.cx-inspector-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:20px}.cx-inspector-grid div{padding:11px;border-radius:10px;background:rgba(255,255,255,.035);border:1px solid rgba(150,190,255,.09)}.cx-inspector-grid span{display:block;font:600 7px system-ui,sans-serif;letter-spacing:.14em;color:rgba(190,215,255,.36)}.cx-inspector-grid b{display:block;margin-top:5px;font:500 11px system-ui,sans-serif;color:#e7f3ff}.cx-provenance{margin-top:13px;padding-top:13px;border-top:1px solid rgba(150,190,255,.09);font:300 9px/1.55 system-ui,sans-serif;color:rgba(210,225,245,.48)}
#cxGuidePanel{position:fixed;right:22px;top:50%;transform:translateY(-50%);z-index:58;width:min(390px,calc(100vw - 44px));padding:25px;border:1px solid rgba(145,205,255,.18);border-radius:20px;background:rgba(2,8,20,.94);backdrop-filter:blur(25px);box-shadow:0 30px 100px rgba(0,0,0,.55)}.cx-guide h2{font:300 35px/.94 system-ui,sans-serif;letter-spacing:-.04em;color:#eef7ff;margin:15px 0}.cx-guide p{font:300 12px/1.6 system-ui,sans-serif;color:rgba(215,230,250,.52)}.cx-legend{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0}.cx-legend span{padding:7px 8px;border-radius:7px;background:rgba(255,255,255,.035);font:600 7px system-ui,sans-serif;letter-spacing:.12em}.cx-legend .measured{color:#38bdf8}.cx-legend .modelled{color:#fbbf24}.cx-legend .hypothesis{color:#a78bfa}.cx-legend .notScience{color:#fb7185}
body.cx-warp #scene{filter:saturate(1.22) brightness(1.08)}body.cx-time #scene{filter:saturate(.68) sepia(.1) brightness(.94)}body.cx-map #scene{filter:hue-rotate(18deg) saturate(1.22)}body.cx-physics #scene{filter:contrast(1.08) brightness(1.04)}
@media(max-width:760px){#cxInstrument{top:auto;bottom:74px;right:10px;width:calc(100vw - 20px)}#cosmicDock{left:10px;right:10px;bottom:10px;transform:none;justify-content:space-between;overflow:auto}.cx-mode{padding:9px 8px;font-size:8px}#cxTimeline{bottom:126px;width:calc(100vw - 35px)}.cx-hero{padding:10vh 7vw}.cx-hero-title{font-size:48px}.cx-inspector-grid{grid-template-columns:1fr}.cx-guide{right:10px!important;width:calc(100vw - 20px)!important}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* One opening, not two. The hero is centred now because it carries the title
   card that used to sit on a separate full-screen layer above it. */
.cx-hero{align-items:center;justify-content:center;text-align:center;padding:8vh 6vw}
.cx-hero-inner{display:flex;flex-direction:column;align-items:center;width:min(760px,88vw)}
.cx-hero .ci-title{margin:0}
.cx-hero .cx-hero-copy{max-width:540px;margin-top:1.1rem;text-align:center}
.cx-hero .cx-hero-actions{justify-content:center;margin-top:2.3rem}
@media(max-width:760px){.cx-hero{padding:7vh 5vw}.cx-hero .cx-hero-actions{margin-top:1.7rem}}
body.cx-intro #infoPanel{opacity:0;pointer-events:none}
@media(max-width:760px){.cx-hero .ci-scale{gap:.45rem;white-space:nowrap}.cx-hero .ci-scale::before,.cx-hero .ci-scale::after{display:none}.cx-hero .ci-from,.cx-hero .ci-to{font-size:.58rem}}