/* Isolated preview only. No selectors or assets are loaded by the live pages. */
#ui{max-width:288px;width:288px;z-index:9;background:rgba(10,17,31,.93);padding:14px;font-size:14px}
#ui h1{font-size:18px;line-height:1.5;letter-spacing:0}
.preview-tag{font-size:11px;font-weight:500;border:1px solid #6985b5;border-radius:5px;padding:2px 5px;margin-left:4px;color:#ccddf9}
#scaleNote{font-size:12px;line-height:1.6;margin:6px 0 10px;color:#c4d4ed}
#ui .row{gap:6px;margin-top:6px}
#ui .row button{flex:1;min-height:44px;font-size:14px;padding:7px 8px}
#ui button[aria-pressed=true]{background:#315fa3;border-color:#87b9ff;color:#fff}
#ui label{width:48px;font-size:13px}
#ui input{min-width:0}
#viewOptions{margin-top:7px;border-top:1px solid #30445f;padding-top:5px}
#viewOptions summary{cursor:pointer;font-size:12px;line-height:1.5;min-height:30px;padding:6px 0;color:#c4d4ed}
.model-detail{font-size:12px;line-height:1.65;margin:9px 0 5px;color:#c4d4ed}
.model-source{color:#aad1ff;font-size:12px;display:inline-block;padding:5px 0}
#viewNav{z-index:10}
#viewNav a{font-size:12px;min-height:36px;display:flex;align-items:center;padding:7px 13px;background:rgba(15,24,42,.92);box-shadow:none}
#hint{display:none}
#tourbar{bottom:8px;border-radius:16px;padding:5px;max-width:calc(100vw - 16px)}
#tour{max-width:min(730px,calc(100vw - 118px))}
#tour button.t{min-height:44px;min-width:48px;font-size:14px;padding:7px 14px}
.tnav{width:42px;height:44px}
#caption{bottom:72px}
#panel{max-height:calc(100vh - 185px)}
#planetMarkers{position:absolute;inset:0;pointer-events:none;z-index:4}
.planet-marker{position:absolute;width:48px;height:48px;border:0;background:transparent;transform:translate(-50%,-50%);border-radius:50%;pointer-events:auto;padding:0;transition:none}
.planet-marker::before{content:'';position:absolute;left:20px;top:20px;width:8px;height:8px;border-radius:50%;border:1px solid #d6e7ff;background:#7ea8e8;box-shadow:0 0 7px #5677ad}
.planet-marker span{position:absolute;top:0;left:50%;transform:translateX(-50%);color:#e4eeff;font:13px/1.4 -apple-system,'Yu Gothic',sans-serif;text-shadow:0 1px 4px #000,0 1px 9px #000}
.planet-marker:hover{background:rgba(83,127,199,.22)}
.planet-marker[hidden],#planetMarkers[hidden]{display:none}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #b9dcff;outline-offset:3px}
@media(max-width:640px) and (orientation:portrait){
 #viewNav{top:6px;left:8px;right:8px;flex-direction:row;justify-content:flex-end;gap:5px}
 #viewNav a{font-size:11px;padding:6px 10px;min-height:32px}
 #ui{top:46px;left:8px;right:8px;width:auto;max-width:none;padding:9px 12px;border-radius:12px}
 #ui h1{font-size:16px}
 #scaleNote{font-size:11px;line-height:1.45;margin:3px 0 5px}
 #ui .row{margin-top:5px}
 #ui .row button{font-size:13px;min-height:42px;padding:5px 7px}
 #viewOptions{margin-top:5px;padding-top:2px}
 #viewOptions summary{font-size:11px;min-height:26px;padding:4px 0}
 #panel{bottom:72px;max-height:min(34vh,270px,var(--sl-panel-cap,34vh))}
 #tour button.t{font-size:13px;padding:6px 12px}
 .is-focused #ui{padding:7px 10px}
 .is-focused #ui h1,.is-focused #viewOptions{display:none}
 .is-focused #scaleNote{font-size:10px;margin:0 0 3px}
 .is-focused #scaleNote br{display:none}
 .is-focused #ui .row{display:inline-flex;width:calc(50% - 3px);vertical-align:top}
 .is-focused #ui .row button{font-size:11px;padding:4px;min-height:38px}
}
@media(max-height:500px) and (orientation:landscape){
 #ui{left:8px;top:8px;width:188px;max-width:188px;padding:8px}
 #ui h1{font-size:13px;line-height:1.4}
 .preview-tag{font-size:9px;margin-left:2px;padding:1px 3px}
 #scaleNote{font-size:10px;line-height:1.5;margin:4px 0 5px}
 #ui .row{gap:4px;margin-top:4px}
 #ui .row button{font-size:11px;min-height:36px;padding:4px}
 #viewOptions summary{font-size:10px;min-height:26px;padding:4px 0}
 #viewOptions[open]{max-height:110px;overflow-y:auto}
 #viewNav{top:6px;right:8px;gap:4px}
 #viewNav a{font-size:10px;min-height:28px;padding:4px 8px}
 #panel{bottom:72px;max-height:calc(100vh - 142px);width:32vw}
 #panel h2{font-size:15px}
 #tour button.t{min-height:38px;font-size:12px;padding:5px 10px}
 .tnav{height:38px}
}
@media(max-width:360px) and (orientation:portrait){
 .is-focused #ui .row{display:flex;width:100%}
 .is-focused #ui .row button{min-height:34px;font-size:11px}
}

#viewOptions[open]{max-height:155px;overflow:auto}
#outerBtn{min-height:44px;margin:5px 0;width:100%;font-size:13px}
.distance-sources{font-size:11px;line-height:1.7;margin:5px 0}
.distance-sources a,#credit a{color:#aad1ff}
#credit{display:block;color:#c4d4ed;font-size:10px;line-height:1.6}
@media(max-height:500px) and (orientation:landscape){#viewOptions[open]{max-height:110px}}

#viewNav #siteBack{display:none}
body.is-standalone #viewNav #siteBack{display:inline-flex}