/* Reading 06: weather is the hero; the instrument retains its own scale. */
#detailed .opening{display:block;padding-top:35px}
#detailed .opening-text{display:grid;grid-template-columns:1fr 1fr;column-gap:70px;align-items:start;padding:0 0 36px}
#detailed .opening-heading{grid-column:1;grid-row:1/4}
#detailed .lead-source{font-size:12px;margin-top:18px;color:#666656}
#detailed h1{grid-column:1;grid-row:2/4;font-size:clamp(46px,5.1vw,72px);margin:16px 0 22px;max-width:640px}
#detailed .opening .lead{grid-column:2;grid-row:1/4;font-size:19px;max-width:620px}
#detailed .opening-heading>.text-link{grid-row:4;grid-column:1;justify-self:start;align-self:start}
#detailed .opening-heading>.equinox-link{grid-column:2;margin-left:18px}
#detailed .opening-specimens{grid-column:1;grid-row:5;max-width:430px;margin-top:20px;gap:25px}
#detailed .opening-specimens img{height:120px}
#detailed .reading-nav{grid-column:2;grid-row:4;align-self:start}
#detailed .solar{width:100%;margin:0}
#detailed .solar-top{padding:0 0 18px;align-items:center}
#detailed .solar-top output{font-size:64px;display:inline-block;margin:0 17px 0 0}
#detailed .solar-top .eyebrow{margin-bottom:9px}
#detailed .clock-state{font-size:12px;color:#666656;display:inline-block}
#detailed .solar-top p{font-size:15px}
#detailed .sky-stage{margin:0;position:relative;background:#64747b;border-radius:3px;overflow:hidden}
#detailed #weatherCanvas,#detailed .weather-fallback{width:100%;height:clamp(360px,43vw,580px);display:block}
#detailed #weatherCanvas[hidden]{display:none}
#detailed .sky-caption{position:absolute;left:25px;right:25px;top:20px;display:flex;justify-content:space-between;font-size:11px;color:#fff9e5dd;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 1px 8px #13222d;pointer-events:none}
#detailed .sky-compass{position:absolute;bottom:8px;left:12px;right:12px;display:flex;justify-content:space-between;color:#f1eedccc;font-size:11px;letter-spacing:.1em;text-shadow:0 1px 5px #13222d;pointer-events:none}
#detailed #rendererStatus{position:absolute;left:20px;bottom:25px;color:#fff;font-size:12px}
#detailed #solarCanvas{height:165px;margin:0;border-radius:0;box-shadow:none}
#detailed .solar-instrument{position:relative}
#detailed .weather-selected{padding-top:3px;margin:0 0 18px;display:flex;justify-content:center;gap:20px;font-size:17px}
#detailed .weather-selected strong{font-size:29px}
#detailed #solarTime{margin-top:-12px}
#detailed .solar-actions{gap:25px;margin:20px 0}
#detailed .solar-actions button{font-size:14px;padding:6px 0}
#detailed #playDay{border:1px solid #65756555;border-radius:30px;padding:6px 18px;margin-top:-1px}
#detailed #resetTime{color:#3a654b;font-weight:600}
#detailed .solar-actions button:disabled{opacity:.5;cursor:default}
#detailed .weather-phases{max-width:850px;margin:24px auto 15px}
#detailed .weather-summary{max-width:850px;margin:0 auto 12px;text-align:center}
#detailed .hour-details{max-width:680px;margin:20px auto 0}
#detailed .hour-details dl{font-size:14px;row-gap:8px}
.detailed.embed #detailed .opening{display:block}.detailed.embed #detailed .sky-stage{margin:0}
.detailed.embed #detailed #weatherCanvas{height:55dvh}.detailed.embed #detailed #solarCanvas{height:160px}
.detailed.notext #detailed .sky-stage{position:fixed;inset:0;border-radius:0;margin:0}
.detailed.notext #detailed #weatherCanvas,.detailed.notext #detailed .weather-fallback{width:100vw;height:100dvh}
.detailed.notext #detailed .solar-instrument,.detailed.notext #detailed .sky-caption,.detailed.notext #detailed .sky-compass{display:none}
@media(max-width:900px){
 #detailed .opening{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding-top:24px}
 #detailed .opening-text{display:contents}
 #detailed .opening-heading{display:contents}
 #detailed .opening-heading>.eyebrow{grid-column:1/-1;grid-row:1}
 #detailed h1{grid-column:1/-1;grid-row:2;font-size:43px;margin:0 0 15px}
 #detailed .opening .solar{grid-column:1/-1;grid-row:3}
 #detailed .opening .lead{grid-column:1/-1;grid-row:4;font-size:20px}
 #detailed .opening-heading>.text-link{grid-row:5;grid-column:1;font-size:12px}
 #detailed .opening-heading>.equinox-link{grid-column:2;margin:0}
 #detailed .opening-specimens{grid-column:1/-1;grid-row:6;margin-top:20px}
 #detailed .opening-specimens img{height:82px}
 #detailed .reading-nav{grid-column:1/-1;grid-row:7}
 #detailed .solar-top output{font-size:45px;display:block}
 #detailed .solar-top p{font-size:12px;max-width:55%}
 #detailed .clock-state{font-size:11px}
 #detailed .sky-stage{margin:0 -14px}
 #detailed #weatherCanvas,#detailed .weather-fallback{height:370px}
 #detailed .sky-caption{font-size:8px;left:14px;right:14px;letter-spacing:.08em}
 #detailed #solarCanvas{height:150px}
 #detailed .weather-selected{gap:10px;flex-wrap:wrap;font-size:14px}
 #detailed .weather-selected strong{font-size:25px}
 #detailed .solar-actions{gap:18px;margin:14px 0}
 #detailed .solar-actions button{font-size:12px}
 #detailed .hour-details dl{font-size:12px}
 #detailed .weather-phases{margin-top:20px}
}
@media print{#detailed #weatherCanvas{height:350px}#detailed .solar-actions{display:none}}

@media(min-width:701px) and (max-height:900px){
 #detailed #weatherCanvas,#detailed .weather-fallback{height:clamp(245px,43dvh,375px)}
 #detailed #solarCanvas{height:135px}
 #detailed .solar-top output{font-size:50px}
 #detailed .solar-top{padding-bottom:12px}
 #detailed .weather-selected{margin-bottom:8px}
 #detailed .solar-actions{margin:12px 0}
 .detailed.notext #detailed #weatherCanvas,.detailed.notext #detailed .weather-fallback{height:100dvh}
}