.observatory-introduction,.observatory-stage,.observatory-controls,.observatory-note{max-width:980px;margin-inline:auto}
.observatory-introduction{display:grid;grid-template-columns:1.2fr 1fr;gap:8%;align-items:start}
.observatory-introduction h2{font-size:clamp(32px,3.3vw,45px);line-height:1.15}
.observatory-introduction>p{font-size:20px;line-height:1.6;max-width:28ch;justify-self:end}
.observatory-stage{margin:28px auto 16px;position:relative;overflow:hidden}
.observatory-fallback{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.observatory-canvas{display:none;width:100%;height:clamp(280px,32vw,380px);touch-action:pan-y;cursor:default;outline-offset:-5px}
.observatory-experience.is-ready .observatory-canvas{display:block}
.observatory-experience.is-ready .observatory-fallback{display:none}
.observatory-canvas.is-over-telescope{cursor:pointer}
.observatory-canvas.is-dragging{cursor:grabbing}
.observatory-experience.is-eyepiece .observatory-canvas{touch-action:none;cursor:grab}
.observatory-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.observatory-canvas:focus-visible,.observatory-eyepiece:focus-visible{outline:2px solid var(--blue);outline-offset:5px}
.observatory-controls{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:35px;flex-wrap:wrap}
.observatory-eyepiece{appearance:none;border:0;border-bottom:1px solid var(--blue);background:transparent;color:var(--blue);font:400 19px/1.4 var(--sans);padding:10px 0;cursor:pointer;min-height:44px;text-align:left}
.observatory-eyepiece:hover{border-bottom-width:2px;padding-bottom:9px}
.observatory-note{font-size:18px;line-height:1.5;margin-top:20px;max-width:980px}
@media(max-width:700px){
 .observatory-introduction{grid-template-columns:1fr;gap:20px}
 .observatory-introduction h2{font-size:33px}
 .observatory-introduction>p{max-width:none;justify-self:start}
 .observatory-stage{margin:24px -12px 15px}
 .observatory-canvas{height:310px}
 .observatory-controls{gap:12px;justify-content:center}
 .observatory-eyepiece{font-size:19px}
 .observatory-note{margin-top:18px}
}

.observatory-introduction>p{font-size:var(--reading-size);line-height:var(--reading-leading)}
.observatory-eyepiece{font-size:var(--action-size);line-height:1.5}
.observatory-eyepiece:hover{border-bottom-width:1px;padding-bottom:10px}
.observatory-note{font-size:var(--caption-size);color:var(--soft)}
