.scene-sky-control{position:absolute;top:17px;left:8vw;z-index:25}
#local-sky-open{min-height:44px;padding:12px 0;border:0;background:none;color:#8e9ca9;font:400 12px/1.5 Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer;transition:color .15s,opacity .15s}
#local-sky-open:hover,#local-sky-open:focus-visible{color:var(--ink)}
#local-sky-open:focus-visible{outline:2px solid var(--teal);outline-offset:5px}
@media(prefers-reduced-motion:no-preference){.scene-sky-control{animation:sky-control-arrive 900ms 1600ms both cubic-bezier(.2,.8,.25,1)}.scene-sky-control:focus-within{animation:none}@keyframes sky-control-arrive{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}}
#local-sky-open.is-open{opacity:0;pointer-events:none}
.is-playing .scene-sky-control,.is-docking .scene-sky-control,.is-compact .scene-sky-control{visibility:hidden;pointer-events:none}
.local-sky-dialog[hidden],.local-sky-dialog [hidden]{display:none!important}
.local-sky-dialog{position:absolute;inset:0 auto auto 0;width:min(420px,calc(100vw - 48px));max-height:calc(100svh - 36px);padding:0;color:var(--ink);isolation:isolate;font:400 13px/1.5 Inter,system-ui,sans-serif}
.local-sky-surface{position:absolute;inset:0;border:1px solid #f0dcc82b;border-radius:22px;background:linear-gradient(145deg,#4a3a3052,#0d1a3359);backdrop-filter:blur(22px) saturate(1.25);-webkit-backdrop-filter:blur(22px) saturate(1.25);box-shadow:0 12px 38px #0005,inset 0 1px #ffffff12;transform-origin:0 0;z-index:-1;pointer-events:none}
.local-sky-body{padding:10px 18px 17px;max-height:inherit;overflow:auto;overscroll-behavior:contain}
.local-sky-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 -8px 6px 0}
.local-sky-dialog h2{font:500 12px/1.5 Inter,system-ui,sans-serif;margin:0;color:var(--dim)}
.local-sky-dialog button{font:inherit;cursor:pointer}
.local-sky-dialog header button{min-width:44px;min-height:44px;border:0;background:none;color:var(--dim);border-radius:50%}
.local-sky-dialog header button:hover{background:#edf4fc0d;color:var(--ink)}
.local-sky-dialog header svg{display:block;width:16px;height:16px;margin:auto;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.local-sky-choices{display:flex;align-items:center;gap:14px}
#local-sky-location{min-height:44px;flex:1;min-width:0;padding:11px 14px;border:1px solid #e7f2ff3d;border-radius:12px;background:#dceaf01a;color:var(--ink);text-align:left;font-weight:500}
#local-sky-location:hover{background:#dceaf029;border-color:#e7f2ff66}
#local-sky-location:disabled{opacity:.55;cursor:progress}
#local-sky-manual,#local-sky-reset{min-height:44px;padding:10px 0;border:0;background:none;color:var(--dim);font-size:12px;text-underline-offset:4px}
#local-sky-manual:hover,#local-sky-reset:hover{color:var(--ink);text-decoration:underline}
#local-sky-manual{flex:none}
#local-sky-manual-fields{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;margin:0;padding:0;transform-origin:right center}
#local-sky-manual-fields label{display:block;margin-bottom:6px;color:var(--dim);font-size:12px}
#local-sky-city{width:100%;min-height:44px;padding:10px 12px;border:1px solid #e7f2ff36;border-radius:10px;background:#121d28;color:var(--ink);font:inherit}
#local-sky-status{margin:12px 0 0;font-size:13px;color:var(--ink)}
#local-sky-status:empty{display:none}
.local-sky-privacy{margin:13px 0 0;color:var(--dim);font:400 11px/1.55 Inter,system-ui,sans-serif;max-width:40ch}
#local-sky-reset{padding-bottom:0;min-height:36px}
@media(max-width:699px){.scene-sky-control{top:62px;left:25px}#local-sky-open{font-size:11px}.local-sky-dialog{width:calc(100vw - 50px);max-height:calc(100svh - 85px)}.local-sky-body{padding:8px 14px 15px}.local-sky-choices{gap:12px}#local-sky-location{font-size:12px;padding:10px 11px}#local-sky-manual{font-size:11px}}
@media(prefers-reduced-motion:reduce){#local-sky-open{transition:none}}

#local-sky-manual-fields #local-sky-city{flex:1;min-width:0}
#local-sky-manual-cancel{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:none;color:var(--dim)}
#local-sky-manual-cancel:hover{color:var(--ink);background:#edf4fc0d}
#local-sky-manual-cancel svg{width:16px;height:16px}

/* One uninterrupted highlight moves between stable actions; the label/input
   share one slot, so manual entry never pushes a new row into the scene. */
.local-sky-choices{position:relative;isolation:isolate;gap:10px;align-items:stretch}
.local-sky-choice-surface{position:absolute;inset:0 auto 0 0;width:60%;z-index:-1;border:1px solid #e7f2ff3d;border-radius:12px;background:#dceaf01a;pointer-events:none;transition:transform 320ms cubic-bezier(.22,.8,.22,1),width 320ms cubic-bezier(.22,.8,.22,1)}
#local-sky-location{display:flex;align-items:center;gap:9px;background:none;border-color:transparent;padding:11px 12px}
#local-sky-location:hover{background:none;border-color:transparent}
.local-sky-location-icon{width:18px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6}
.local-sky-choices[data-manual=true] #local-sky-location{color:var(--dim)}
#local-sky-manual-slot{position:relative;display:grid;flex:0 0 136px;min-width:0;align-items:stretch}
#local-sky-manual-slot>*{grid-area:1/1}
#local-sky-manual{width:100%;padding:10px 8px;text-align:center}
#local-sky-manual-fields{gap:0;min-height:44px}
#local-sky-manual-fields #local-sky-city{padding:10px 0 10px 10px;background:none;border:0;border-radius:12px;font-size:12px;box-shadow:none}
#local-sky-manual-cancel{flex-basis:36px;width:36px;min-height:44px}
@media(max-width:699px){#local-sky-manual-slot{flex-basis:124px}#local-sky-location{padding:9px 8px;gap:6px}.local-sky-location-icon{width:16px;height:18px}.local-sky-choices{gap:6px}}
/* The entered city needs the row, not a label-sized slot. Keep the location
   control recognizable and named while its text makes room for editing. */
.local-sky-choices[data-manual=true] #local-sky-location{flex:0 0 44px;justify-content:center;padding:9px 0}
.local-sky-choices[data-manual=true] #local-sky-location span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.local-sky-choices[data-manual=true] #local-sky-manual-slot{flex:1}
#local-sky-manual-fields #local-sky-city{font-size:16px}
#local-sky-manual-cancel{flex-basis:44px;width:44px}
@media(prefers-reduced-motion:reduce){.local-sky-choice-surface{transition:none}}

/* Opened from the small header: the same panel hangs under the band and
   stays while the page scrolls. Over project pictures it needs more body. */
.scene-sky-control.is-header{position:fixed;top:calc(var(--site-header-height) + 8px);left:auto;right:6vw;visibility:visible;pointer-events:auto;animation:none}
.scene-sky-control.is-header #local-sky-open{visibility:hidden;pointer-events:none}
.scene-sky-control.is-header .local-sky-dialog{inset:0 0 auto auto;max-height:calc(100svh - var(--site-header-height) - 24px)}
.scene-sky-control.is-header .local-sky-surface{background:linear-gradient(145deg,#2c2730d9,#0d1626e6)}
@media(max-width:699px){.scene-sky-control.is-header{left:25px;right:auto}.scene-sky-control.is-header .local-sky-dialog{inset:0 auto auto 0}}

/* ---- 8 October, pages pass ------------------------------------------------
   The panel is thinner glass, tinted with the sky's own blues, so the stars
   show through it. Opened from the small header it keeps more body, because
   project pictures can be under it, but less than before. */
.local-sky-surface{background:linear-gradient(160deg,#2a3d7430,#0a14303b);border-color:#cfe0ff2e}
.scene-sky-control.is-header .local-sky-surface{background:linear-gradient(160deg,#1c2a50b3,#0a1226c2)}
/* The link offered when this window cannot ask for a location. */
.local-sky-browser{display:inline-flex;align-items:center;min-height:44px;margin-top:2px;color:var(--ink);font-size:14px;text-underline-offset:5px}
/* Phone: readable type in the control and the panel. */
#local-sky-open{font-size:13px}
@media(max-width:699px){
 #local-sky-open{font-size:14px}
 .local-sky-dialog{font-size:14px}
 .local-sky-dialog h2{font-size:14px}
 #local-sky-location{font-size:14px}
 #local-sky-manual,#local-sky-reset{font-size:14px}
 #local-sky-status{font-size:14px}
 .local-sky-privacy{font-size:13px}
}