/* Page hierarchy: live view, useful data, then optional background reading. */
:root {
  --surface:#fbfcf7;
  --surface-soft:#edf1e7
}
.site-header { padding:23px 0 }
.section-nav-links { gap:2px 17px; padding:5px 0 }
.section-nav-links a { font-size:11px; padding:9px 7px }
.section-nav-links a[aria-current="location"] { background:#e5ebde }
.intro { padding:36px 0 30px; gap:28px }
.intro h1 { font-size:60px; letter-spacing:-2.8px; line-height:1.03 }
.intro .eyebrow { margin-bottom:14px }
.intro-note { max-width:31ch; font-size:13px; line-height:1.7 }
.camera { border-radius:12px; border-color:#bcc8b7; box-shadow:none }
.camera-toolbar { padding:14px 20px; background:var(--surface) }
.camera .camera-caption { padding:22px; background:var(--surface) }
.camera .camera-orientation { gap:15px }
.camera .orientation-copy .orientation-key { max-width:32ch }
.camera .metar-sock { padding-left:24px; gap:18px }
.camera .metar-sock-copy { font-size:12px }
.camera .metar-sock-copy .metar-sock-title { font-size:10px }
.camera .metar-sock-note { font-size:11px }
.camera .sock-dispatch { padding:19px 23px 22px; background:#e9eee2 }
.camera .sock-dispatch-line { max-width:64ch; font-size:22px; line-height:1.45 }
.camera .sock-dispatch-state { padding:3px 8px; border-radius:3px; background:#dfe7d7 }
.below-camera { margin-top:12px }
.camera-actions { margin-top:17px }
.section-surface {
  margin-top:38px;
  padding:30px;
  border:1px solid #d5ddce;
  border-radius:12px;
  background:var(--surface)
}
.section-surface h2 { font-size:29px; letter-spacing:-.8px; font-weight:500 }
.section-surface .eyebrow { font-size:10px; letter-spacing:1.3px; color:var(--muted) }
.section-surface .heading-dot { color:var(--orange) }
.night-flying .night-location { font-size:11px; line-height:1.8 }
.night-flying .night-day-label { margin-top:23px }
.night-flying .night-solar-cards { gap:16px }
.night-flying .night-solar-card { padding:19px 22px; background:#f3f4e9; border-color:#dce0cf; border-radius:8px }
.night-flying .night-solar-card:first-child { background:#f8f0df; border-color:#e9dec8 }
.night-flying .night-solar-card:last-child { background:#f5eae2; border-color:#e8d9cd }
.night-flying .night-solar-time { font-size:32px }
.night-flying .night-solar-card h3 { color:#65715f }
.night-flying .night-solar-detail { font:11px/1.6 var(--sans) }
.night-flying .night-timeline-heading { margin-top:27px; padding-top:23px; border-top:1px solid var(--line) }
.night-flying .night-timeline-heading h3 { font-size:18px; letter-spacing:-.3px }
.night-flying .night-timeline-heading p { font-size:11px }
.night-flying .night-glare-key { font:12px/1.6 var(--sans); gap:6px 18px }
.night-flying .night-glare-basis { font:11px/1.7 var(--sans); margin-top:6px }
.night-flying .night-inspector {
  padding:16px 18px;
  margin-top:20px;
  border:1px solid #d9e1d2;
  border-radius:8px;
  background:var(--surface-soft);
  row-gap:11px
}
.night-flying .night-inspector label { color:var(--ink); font-size:11px }
.night-flying .night-inspector output { min-height:0; color:var(--ink); font:12px/1.7 var(--sans) }
.night-flying .night-inspection-details { grid-column:1/-1; margin-top:2px; background:#f6f8f0; border-color:#d4ddcc }
.night-flying .night-glare-inspection { font:12px/1.7 var(--sans) }
.night-flying .night-glare-context { padding-top:8px; border-top:1px solid var(--line) }
.night-flying .night-live-status { display:inline-block; border:0; margin:15px 0 0; padding:0; background:none; font:11px/1.8 var(--mono) }
.night-flying .night-live-status:before { content:""; display:inline-block; width:6px; height:6px; margin-right:8px; border-radius:50%; background:#638664 }
.night-chart-note { margin:7px 0 0; color:var(--muted); font:12px/1.7 var(--sans) }
.info-disclosure {
  margin-top:17px;
  border:1px solid var(--line);
  border-radius:7px;
  background:#f6f7f0
}
.info-disclosure>summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  min-height:46px;
  padding:12px 15px;
  list-style:none;
  color:var(--ink);
  font:13px/1.5 var(--sans);
  cursor:pointer
}
.info-disclosure>summary::-webkit-details-marker { display:none }
.info-disclosure>summary::marker { content:"" }
.info-disclosure>summary:after { content:"+"; color:var(--orange); font:18px var(--mono); flex:none }
.info-disclosure[open]>summary:after { content:"−" }
.info-disclosure>summary:hover { background:#eaf0e2; border-radius:6px }
.info-disclosure>summary:focus-visible { outline:2px solid var(--orange); outline-offset:3px }
.info-body { padding:3px 15px 17px }
.info-body>p { margin-top:12px }
.night-notes .night-timeline-note,.night-notes .night-glare-method,.night-notes .night-calculation-note { font:12px/1.75 var(--sans) }
.night-notes .night-definitions { grid-template-columns:1fr 1fr; gap:14px 25px; margin-top:19px; padding-top:17px }
.night-notes .night-definitions p { font-size:12px; line-height:1.75 }
.night-notes .night-definitions p:last-child { grid-column:1/-1 }
.camera-location .location-figure { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:24px; align-items:start; margin-top:23px }
.camera-location .location-map { border-radius:7px }
.camera-location .location-caption { display:block; margin:0; font-size:12px }
.location-facts { display:grid; gap:14px }
.location-facts>div { padding:12px 0 13px; border-bottom:1px solid var(--line) }
.location-facts span { display:block; color:var(--muted); font:11px/1.7 var(--sans) }
.location-facts span:first-child { margin-bottom:5px; font:10px/1.6 var(--mono); text-transform:uppercase; letter-spacing:.6px }
.location-facts strong { display:block; margin-bottom:4px; font:500 30px/1.1 var(--sans); letter-spacing:-.8px }
.location-facts small { font:12px var(--mono); color:var(--muted); letter-spacing:0 }
.camera-location .location-wind-note { margin-top:17px; padding:12px; font-size:12px; line-height:1.75; background:#edf1e7; border-left-color:#bac9af }
.camera-location .location-reference { margin-top:15px }
.camera-location .location-reference summary { font-size:12px; padding:11px 12px }
.camera-location .location-source { font-size:12px; line-height:1.8 }
.camera-location .location-fullsize { padding:7px 10px; border:1px solid var(--line); border-radius:4px; text-decoration:none; font-size:11px }
.why { display:grid; grid-template-columns:1fr 2fr; gap:35px; margin-top:45px; padding-top:30px }
.why-heading .eyebrow { font-size:10px; color:var(--muted) }
.why h2 { font-size:34px; letter-spacing:-1px }
.why .why-copy { margin:0; font-size:14px; line-height:1.8 }
.why .why-copy .why-punchline { color:var(--ink); font-size:23px; line-height:1.4; letter-spacing:-.4px }
.why .why-copy>p { margin-bottom:13px }
.why .why-copy>p:last-of-type { margin-bottom:0 }
.why .why-copy .why-long-story { margin-top:0; color:var(--muted); font-size:14px; line-height:1.8 }
.site-footer { margin-top:37px; font-size:12px }
@media(max-width:1100px) {
  .camera .camera-caption { padding:19px }
  .camera .metar-sock { padding-left:0 }
  .section-surface { padding:25px }
  .camera-location .location-figure { grid-template-columns:minmax(0,1fr) 220px; gap:20px }
}
@media(max-width:760px) {
  .site-header { padding:20px 0 }
  .intro { padding:30px 0 25px; gap:15px }
  .intro h1 { font-size:45px; letter-spacing:-2px }
  .intro-note { max-width:38ch; font-size:12px; line-height:1.65 }
  .camera .camera-caption { padding:16px }
  .camera .camera-orientation { gap:13px }
  .camera .camera-compass { width:66px; height:66px }
  .camera .orientation-copy .orientation-facing { margin-top:3px }
  .camera .orientation-copy .orientation-sides { display:none }
  .camera .orientation-copy .orientation-key { font-size:10px; margin-top:3px; max-width:none }
  .camera .metar-sock { gap:13px; padding-top:16px; margin-top:3px }
  .camera .metar-sock-copy { font-size:12px }
  .camera .sock-dispatch { padding:17px 17px 20px }
  .camera .sock-dispatch-line { font-size:20px; min-height:0 }
  .camera .sock-dispatch-heading { gap:7px }
  .section-surface { margin-top:27px; padding:21px; border-radius:10px }
  .section-surface h2 { font-size:27px; letter-spacing:-.7px }
  .night-flying .night-location { font-size:10px }
  .night-flying .night-solar-cards { gap:10px }
  .night-flying .night-solar-card { padding:16px 13px; gap:12px }
  .night-flying .night-solar-time { font-size:25px }
  .night-flying .night-solar-detail { font-size:11px }
  .night-flying .night-timeline-heading { margin-top:22px; padding-top:19px }
  .night-flying .night-timeline-heading h3 { font-size:17px }
  .night-flying .night-timeline-heading p { font-size:10px }
  .night-flying .night-inspector { padding:13px; grid-template-columns:1fr; gap:7px }
  .night-flying .night-inspector label,.night-flying .night-inspector input,.night-flying .night-inspector output { grid-column:1 }
  .night-flying .night-inspector output { font-size:12px }
  .night-flying .night-glare-key { gap:6px 12px; font-size:11px }
  .night-flying .night-glare-key strong { flex-basis:100% }
  .night-flying .night-glare-inspection { font-size:12px }
  .night-flying .night-chart-note { font-size:12px }
  .night-notes .night-definitions { grid-template-columns:1fr; gap:12px }
  .info-disclosure>summary { min-height:46px; padding:11px 13px; font-size:12px }
  .info-body { padding:2px 13px 15px }
  .camera-location .location-figure { grid-template-columns:1fr; gap:17px; margin-top:18px }
  .camera-location .location-facts { grid-template-columns:1fr 1fr; gap:13px }
  .camera-location .location-facts strong { font-size:27px }
  .camera-location .location-wind-note { margin-top:14px }
  .why { grid-template-columns:1fr; gap:18px; margin-top:30px; padding-top:26px }
  .why h2 { font-size:29px }
  .why-heading .eyebrow { margin-bottom:10px }
  .why .why-punchline { font-size:22px }
  .site-footer { margin-top:30px }
}
@media(max-width:480px) {
  .section-surface { padding:16px }
  .night-flying { --night-label-width:98px; --night-lane-gap:10px }
  .night-flying .night-solar-card { padding:14px 10px }
  .night-flying .night-solar-time { font-size:21px }
  .night-flying .night-solar-detail { font-size:10px }
  .night-flying .night-lane-label>span:not(.night-duration) { font-size:9px }
  .night-flying .night-date-picker input { font-size:16px }
  .night-flying .night-glare-basis { font-size:11px; line-height:1.65 }
  .camera-location .location-facts strong { font-size:25px }
  .camera-location .location-facts span { font-size:10px }
}
@media(max-width:360px) {
  .section-surface { padding:13px }
  .night-flying .night-solar-time { font-size:18px }
  .night-flying .night-solar-card { padding:13px 8px }
}