/* ==========================================================
   BIG ADVENTURES: Space explorer + Wild weather lab
   Layered on learn.css (buttons, talk toggle, g-btn).
   ========================================================== */
.zone-page{background:#f1ead8}
.space-page{background:#e9e6f3}
.zone-hero{max-width:1100px;margin:0 auto;padding:clamp(2rem,5vw,3.5rem) clamp(1rem,4vw,2rem) 1rem;text-align:center}
.zone-hero h1{font-size:clamp(2.1rem,5.2vw,3.8rem);line-height:1.05;margin:.3rem 0 .6rem;color:var(--forest)}
.zone-stage-wrap{max-width:1180px;margin:0 auto;padding:.4rem clamp(.6rem,3vw,1.5rem) 2rem;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);grid-template-areas:"stage card" "picker card";gap:1rem 1.2rem;align-items:start}
.zone-stage{grid-area:stage;position:relative;border-radius:22px;overflow:hidden;box-shadow:0 16px 40px rgba(20,25,50,.3);border:4px solid #fffaf0}
.zone-stage canvas{display:block;width:100%;height:clamp(340px,44vw,560px);touch-action:manipulation}
.stage-note{position:absolute;left:12px;top:10px;padding:.3rem .7rem;border-radius:999px;background:rgba(255,255,255,.14);color:#e8ecff;font:600 .78rem/1.2 var(--display);pointer-events:none}
.stage-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;justify-content:center;padding:.55rem;background:#141d3d}
.weather-page .stage-controls{background:#2e3e52}
.stage-controls .g-btn{flex:0 0 auto;min-height:40px;padding:.4rem .8rem;background:rgba(255,250,236,.92)}
.stage-speed{display:flex;align-items:center;gap:.4rem;padding:.3rem .8rem;border-radius:999px;background:rgba(255,250,236,.92);font-size:1.1rem}
.stage-speed input{width:clamp(90px,16vw,160px);accent-color:var(--clay-yellow)}
.body-picker{grid-area:picker;display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center}
.bp{display:inline-flex;align-items:center;gap:.35rem;min-height:42px;padding:.4rem .8rem;border-radius:999px;border:2px solid #cfc6ea;background:#fff;color:#2c2a54;font:600 .92rem/1 var(--display);cursor:pointer;transition:transform .15s,background .15s}
.bp:hover{transform:translateY(-2px)}
.bp[aria-pressed="true"]{background:#2c2a54;border-color:#2c2a54;color:#ffe9a0}
.space-card{grid-area:card;position:sticky;top:90px;background:#fffdf6;border:2px solid #d9d2ef;border-radius:22px;padding:1.2rem 1.3rem;box-shadow:0 8px 0 #d9d2ef}
.sc-top{display:grid;grid-template-columns:120px 1fr;gap:.9rem;align-items:center}
.sc-size{width:120px;height:auto;background:#f3f1fc;border-radius:14px}
.sc-order{margin:0;font:600 .74rem/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--rust)}
.space-card h2{margin:.2rem 0;font-size:clamp(1.6rem,3vw,2.1rem);color:#2c2a54;line-height:1.05}
.sc-kind{margin:0;color:#6b6690;font-size:.95rem}
.sc-facts{margin:1rem 0 0;padding:0;list-style:none;display:grid;gap:.5rem}
.sc-facts li{position:relative;padding:.55rem .8rem .55rem 2.2rem;background:#f7f5ff;border-radius:12px;font-size:1.02rem;line-height:1.45}
.sc-facts li::before{content:"✨";position:absolute;left:.65rem;top:.5rem}
.sc-nav{display:flex;gap:.45rem;margin-top:1rem;align-items:center}
.sc-nav .g-btn{flex:1}
.sc-nav .read-aloud{margin:0;flex:1.2;justify-content:center}

.quiz{max-width:760px;margin:0 auto 3rem;padding:1.4rem clamp(1rem,4vw,2rem);text-align:center;background:#fffdf6;border:2px solid #e0cfa6;border-radius:22px;box-shadow:0 6px 0 #e7d9b6}
.space-page .quiz{border-color:#d9d2ef;box-shadow:0 6px 0 #d9d2ef}
.quiz h2{margin:.2rem 0 .6rem;font-size:clamp(1.6rem,3.4vw,2.2rem);color:var(--forest)}
.quiz-q{font:600 1.25rem/1.3 var(--display);color:#2c2a54;margin:.4rem 0 .8rem}
.quiz-options{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}
.quiz-opt{flex:0 1 200px}
.quiz-opt.right{background:#dfeec9!important;box-shadow:0 4px 0 #a9c083!important}
.quiz-opt.wrong{background:#f8d9d2!important;box-shadow:0 4px 0 #e3a99c!important}
.quiz-score{margin:.4rem 0 0;font:600 .9rem/1 var(--display);color:#7a6a50}
.quiz .g-msg{text-align:center}

/* ---------- Wild weather lab ---------- */
.storm-picker{max-width:1180px;margin:0 auto;padding:0 clamp(.6rem,3vw,1.5rem) 1rem;display:flex;flex-wrap:wrap;gap:.45rem;justify-content:center}
.sp-btn{display:inline-flex;align-items:center;gap:.35rem;min-height:44px;padding:.45rem .9rem;border-radius:999px;border:2px solid #c9ced6;background:#fff;color:#2e3e52;font:600 .95rem/1 var(--display);cursor:pointer;transition:transform .15s}
.sp-btn:hover{transform:translateY(-2px)}
.sp-btn[aria-pressed="true"]{background:#2e3e52;border-color:#2e3e52;color:#fff}
.weather-wrap{grid-template-areas:"stage card" "ctrl card"}
.weather-ctrl{grid-area:ctrl;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:center;padding:.7rem;border-radius:18px;background:#fffdf6;border:2px solid #d8dde4}
.weather-ctrl .g-btn{flex:0 1 auto}
.wx-slider{display:flex;align-items:center;gap:.5rem;font:600 .95rem/1 var(--display);color:#2e3e52}
.wx-slider input{width:clamp(120px,22vw,220px);accent-color:#4f9fc4;height:32px}
.wx-readout{font:600 1rem/1.2 var(--display);color:var(--rust);min-width:9ch;text-align:center}
.wx-card{grid-area:card;position:sticky;top:90px;background:#fffdf6;border:2px solid #d8dde4;border-radius:22px;padding:1.2rem 1.3rem;box-shadow:0 8px 0 #d8dde4}
.wx-card h2{margin:.1rem 0 .7rem;font-size:clamp(1.6rem,3vw,2.1rem);color:#2e3e52;line-height:1.05}
.wx-block{margin:.6rem 0;padding:.65rem .85rem;border-radius:14px;font-size:1.02rem;line-height:1.45}
.wx-block b{display:block;font:600 .74rem/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;margin-bottom:.2rem}
.wx-what{background:#eef4fb}.wx-what b{color:#2f6f9f}
.wx-why{background:#f3f1fc}.wx-why b{color:#5f52b0}
.wx-safe{background:#fff3d6;border:2px dashed #e8b93a}.wx-safe b{color:#a0680c}
.wx-count{position:absolute;left:50%;top:18%;transform:translateX(-50%);font:700 clamp(2rem,6vw,3.6rem)/1 var(--display);color:#fff;text-shadow:0 3px 14px rgba(0,0,0,.6);pointer-events:none}
.wx-toggles{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}
.sound-toggle2{display:inline-flex;align-items:center;gap:.5rem;min-height:46px;padding:.55rem 1.1rem;border-radius:999px;border:2px solid var(--leaf);background:#eef4dd;color:var(--leaf);font:600 1rem/1 var(--display);cursor:pointer}
.sound-toggle2.on{background:var(--leaf);color:#fff}

@media(max-width:900px){
  .zone-stage-wrap,.weather-wrap{grid-template-columns:1fr;grid-template-areas:"stage" "picker" "card";}
  .weather-wrap{grid-template-areas:"stage" "ctrl" "card"}
  .space-card,.wx-card{position:static}
  .zone-stage canvas{height:clamp(320px,90vw,460px)}
}
@media(max-width:540px){
  .sc-top{grid-template-columns:96px 1fr}.sc-size{width:96px}
  .stage-controls{gap:.3rem;padding:.45rem}.stage-controls .g-btn{min-height:36px;padding:.3rem .6rem;font-size:.85rem}
  .stage-note{font-size:.7rem}
  .sp-btn{font-size:.85rem;padding:.4rem .7rem}
}

/* ==========================================================
   BIG STAGES (v3): full-width scenes about 78% of the screen
   tall, with the info card floating over the right side on
   wide screens and flowing underneath on phones and tablets.
   ========================================================== */
.space-hero{padding:clamp(1.2rem,3vw,2rem) clamp(1rem,4vw,2rem) 1.1rem}
.space-hero h1{font-size:clamp(2.2rem,4.6vw,3.4rem);margin:.1rem 0 .4rem}
.space-hero .nb-lede{margin:0 auto .2rem}
.hero-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem;margin-top:.8rem}
.hero-row .nb-tools{margin:0}
.hero-row .zoom-nav{margin:0}
.zoom-nav{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:1rem}
.zoom-nav a{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:.45rem 1.05rem;border-radius:999px;background:#2c2a54;color:#ffe9a0;text-decoration:none;font:600 1rem/1 var(--display);box-shadow:0 4px 0 #1a1838;transition:transform .15s,box-shadow .15s}
.zoom-nav a:hover,.zoom-nav a:focus-visible{transform:translateY(-2px);box-shadow:0 6px 0 #1a1838}
.big-zone{--stage-h:clamp(560px,calc(100vh - 84px),1080px);--gap:clamp(14px,1.6vw,24px);--card-w:min(410px,31vw);position:relative;margin:0;scroll-margin-top:80px}
.big-stage{position:relative;height:var(--stage-h);overflow:hidden;background:#0b1330;border-block:4px solid #fffaf0;box-shadow:0 18px 44px rgba(20,25,50,.28)}
.big-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:manipulation}
.sky-stage canvas{touch-action:none;cursor:grab}
.sky-stage canvas.dragging{cursor:grabbing}
.stage-top{position:absolute;z-index:2;left:var(--gap);top:var(--gap);display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;max-width:calc(100% - var(--card-w) - 3*var(--gap));pointer-events:none}
.stage-top>*{pointer-events:auto}
.stage-title{margin:0;display:inline-block;padding:.25rem .8rem .35rem;border-radius:14px;background:rgba(22,30,40,.58);font:600 clamp(1.35rem,2.5vw,2.2rem)/1.05 var(--display);color:#fff7df;text-shadow:0 1px 3px rgba(0,0,0,.45)}
.big-stage .stage-note{position:static;background:rgba(10,16,40,.62)}
.big-stage .stage-controls{flex-wrap:wrap;justify-content:flex-start;padding:.35rem;border-radius:22px;background:rgba(10,16,40,.66)}
.big-stage .stage-controls .g-btn[aria-pressed="false"]{opacity:.72}
.big-zone>.body-picker{position:absolute;z-index:2;left:0;right:calc(var(--card-w) + 2*var(--gap));bottom:4px;padding:2.4rem var(--gap) var(--gap);background:linear-gradient(rgba(8,12,34,0),rgba(8,12,34,.72) 55%);display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;pointer-events:none}
.big-zone>.body-picker>*{pointer-events:auto}
.bp .bp-group{display:none}
.bp-sep{flex-basis:100%;height:0}
.big-card{position:absolute;z-index:3;top:calc(4px + var(--gap));right:var(--gap);width:var(--card-w);max-height:calc(var(--stage-h) - 2*var(--gap));overflow:auto;overscroll-behavior:contain;background:#fffdf6;border:2px solid rgba(217,210,239,.95);border-radius:22px;padding:1.2rem 1.3rem;box-shadow:0 18px 40px rgba(5,8,25,.35)}
.big-card h2{margin:.2rem 0;font-size:clamp(1.6rem,2.6vw,2.2rem);color:#2c2a54;line-height:1.05}
.sc-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;margin:1rem 0 0}
.sc-stats:empty{display:none}
.sc-stats>div{padding:.45rem .65rem;border-radius:12px;background:#f3f1fc}
.sc-stats>div.wide{grid-column:1/-1}
.sc-stats dt{font:600 .68rem/1.2 var(--display);letter-spacing:.09em;text-transform:uppercase;color:#6b6690}
.sc-stats dd{margin:.15rem 0 0;font:600 1rem/1.25 var(--display);color:#2c2a54}
.sc-stats .src-tag{margin-left:.25rem}
.gal-counter{position:absolute;z-index:2;left:calc((100% - var(--card-w) - 2*var(--gap))/2);bottom:8%;transform:translateX(-50%);padding:.55rem 1.1rem;border-radius:16px;background:rgba(10,16,40,.72);color:#ffe9a0;font:600 clamp(1rem,1.8vw,1.35rem)/1.25 var(--display);text-align:center;pointer-events:none}
.zoom-out{display:flex;align-items:center;justify-content:center;gap:.9rem;max-width:760px;margin:2rem auto;padding:0 1rem;color:#2c2a54}
.zoom-out p{margin:0;font-size:1.1rem;line-height:1.45}
.zoom-out b{font-family:var(--display);font-weight:600}
.zo-arrow{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#2c2a54;color:#ffe9a0;font-size:1.7rem;animation:zoBob 1.8s ease-in-out infinite}
@keyframes zoBob{50%{transform:translateY(6px)}}
.const-list{max-width:1180px;margin:1.3rem auto 0;padding:0 clamp(14px,1.6vw,24px)}
.const-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem}
.const-head h3{margin:0;font:600 clamp(1.3rem,2.4vw,1.7rem)/1.1 var(--display);color:#2c2a54}
.const-filter{display:flex;flex-wrap:wrap;gap:.35rem}
.cf-btn{min-height:40px;padding:.35rem .85rem;border-radius:999px;border:2px solid #cfc6ea;background:#fff;color:#2c2a54;font:600 .88rem/1 var(--display);cursor:pointer}
.cf-btn[aria-pressed="true"]{background:#2c2a54;border-color:#2c2a54;color:#ffe9a0}
.const-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:.45rem;margin-top:.8rem;max-height:430px;overflow:auto;padding:.2rem .2rem .6rem;overscroll-behavior:contain}
.cg{display:flex;align-items:center;gap:.5rem;min-height:48px;padding:.4rem .6rem;border-radius:14px;border:2px solid #e2dcf3;background:#fff;color:#2c2a54;font:600 .9rem/1.1 var(--display);text-align:left;cursor:pointer;transition:transform .12s,border-color .12s}
.cg:hover{transform:translateY(-1px);border-color:#b9aee3}
.cg small{display:block;margin-top:.15rem;font:400 .74rem/1.2 Andika,sans-serif;color:#6b6690}
.cg .cg-art{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#141d3d;font-size:1rem}
.cg.drawn .cg-art{box-shadow:0 0 0 2px #ffe9a0}
.cg[aria-pressed="true"]{border-color:#2c2a54;background:#2c2a54;color:#ffe9a0}
.cg[aria-pressed="true"] small{color:#d9d4f5}
.quiz-center{margin-top:2.6rem}
.sources-note{max-width:760px;margin:0 auto 2.2rem;padding:0 1rem;text-align:center;font-size:.95rem;color:#5a5670}
.sources-note a{color:#2c2a54;font-weight:700}
@media(max-width:1099px){
  .big-zone{--stage-h:clamp(420px,72vh,660px);--card-w:0px}
  .stage-top{max-width:calc(100% - 2*var(--gap))}
  .big-zone>.body-picker{position:static;right:auto;background:none;padding:.8rem var(--gap) 0;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin}
  .big-zone>.body-picker .bp{flex:none;scroll-snap-align:start}
  .bp-sep{display:none}
  .big-card{position:static;width:auto;max-width:760px;max-height:none;margin:1rem var(--gap) 0;backdrop-filter:none;box-shadow:0 8px 0 #d9d2ef}
  .gal-counter{left:50%}
}
@media(min-width:760px) and (max-width:1099px){.big-card{margin-inline:auto}}
@media(max-width:540px){
  .stage-title{font-size:1.25rem}
  .big-stage .stage-controls{padding:.25rem;gap:.25rem}
  .big-stage .stage-controls .g-btn{min-height:36px;padding:.28rem .55rem;font-size:.8rem}
  .stage-speed{padding:.2rem .5rem}
  .stage-speed input{width:84px}
  .zoom-out p{font-size:1rem}
  .const-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:360px}
}
@media(prefers-reduced-motion:reduce){.zo-arrow{animation:none}}

/* ---------- Where our facts come from (sources.html) ---------- */
.src-page{background:#f1ead8}
.src-notes{max-width:1000px;margin:0 auto 1.6rem;padding:0 clamp(1rem,4vw,2rem);display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.8rem}
.src-note{padding:.9rem 1.1rem;border-radius:18px;background:#fffdf6;border:2px solid #e0cfa6}
.src-note b{display:block;font:600 .74rem/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--rust);margin-bottom:.25rem}
.src-note a{color:var(--forest);font-weight:700;overflow-wrap:anywhere}
.src-list{max-width:1000px;margin:0 auto 3rem;padding:0 clamp(1rem,4vw,2rem);display:grid;gap:1.4rem}
.src-group{padding:1.2rem clamp(1rem,3vw,1.6rem);border-radius:22px;background:#fffdf6;border:2px solid #e0cfa6;box-shadow:0 6px 0 #e7d9b6}
.src-group h2{margin:0 0 .7rem;font-size:clamp(1.3rem,2.6vw,1.7rem);color:var(--forest)}
.src-group h2 small{font:600 .85rem var(--display);color:#8a7a60;margin-left:.4rem}
.src-group ol{margin:0;padding-left:1.4rem;display:grid;gap:.45rem}
.src-group li{line-height:1.4}
.src-group li b{font-family:var(--display);font-weight:600;color:#2c3a22;margin-right:.4rem}
.src-group li a{color:#2f6f9f;font-weight:700;overflow-wrap:anywhere}
.src-group li span{display:block;font-size:.82rem;color:#8a7a60}
.src-group li:target{background:#fff3c4;border-radius:10px;outline:4px solid #fff3c4}

/* ---------- Bigger, clearer info cards (space) ---------- */
.big-zone{--card-w:min(470px,34vw)}
@media(max-width:1099px){.big-zone{--card-w:0px}}
.big-card{background:#fffdf8;padding:1.3rem 1.4rem 1.2rem;color:#26243f}
.big-card .sc-top{grid-template-columns:110px 1fr;gap:1rem}
.big-card .sc-size{width:110px}
.big-card .sc-order{font-size:.8rem}
.big-card h2{font-size:clamp(1.9rem,2.7vw,2.5rem)}
.big-card .sc-kind{font-size:1.06rem;color:#4f4a78;line-height:1.35;margin-top:.15rem}
.sc-h{margin:1.1rem 0 .5rem;font:600 .8rem/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;color:#6b6690}
.sc-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin:1.1rem 0 0}
.sc-stats:empty,.sc-moons:empty{display:none}
.sc-stats .st{display:grid;grid-template-columns:auto 1fr;column-gap:.55rem;align-items:center;padding:.55rem .7rem;border-radius:14px;background:#f3f1fc;border:1px solid #e6e1f7}
.sc-stats .st.wide{grid-column:1/-1}
.sc-stats .ic{grid-row:span 2;font-size:1.45rem;line-height:1}
.sc-stats .k{font:600 .7rem/1.2 var(--display);letter-spacing:.09em;text-transform:uppercase;color:#6b6690}
.sc-stats .v{font:600 1.12rem/1.25 var(--display);color:#1f1d3d}
.sc-stats .st-src{grid-column:1/-1;font-size:.8rem;color:#6b6690;text-align:right}
.sc-moons{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin-top:.7rem}
.sc-moons>b{font:600 .72rem/1 var(--display);letter-spacing:.1em;text-transform:uppercase;color:#6b6690;margin-right:.2rem}
.sc-moons span{padding:.28rem .65rem;border-radius:999px;background:#eef0fb;border:1px solid #d9d2ef;font:600 .9rem/1 var(--display);color:#2c2a54}
.big-card .sc-facts{margin-top:0}
.big-card .sc-facts li{font-size:1.08rem;line-height:1.5;color:#26243f;background:#f7f5ff}
.big-card .sc-nav{position:sticky;bottom:-1.2rem;margin:1rem -1.4rem -1.2rem;padding:.7rem 1.4rem 1rem;background:linear-gradient(rgba(255,253,248,0),#fffdf8 30%)}

/* ---------- Wild weather lab on the big stage (v4) ---------- */
.weather-page .big-stage{background:#5a6a78}
.big-zone>.weather-ctrl{align-items:center;gap:.5rem .7rem}
.big-zone>.weather-ctrl .g-btn{min-height:44px}
.big-zone>.weather-ctrl .wx-slider{padding:.35rem .9rem;border-radius:999px;background:rgba(255,253,246,.95);box-shadow:0 4px 12px rgba(0,0,0,.18)}
.big-zone>.weather-ctrl .wx-readout{padding:.45rem .9rem;border-radius:999px;background:#2e3e52;color:#ffe9a0;min-width:0}
.weather-page .big-card{border-color:#d8dde4}
.weather-page .big-card h2{color:#2e3e52}
.wx-card .wx-block{font-size:1.05rem}
.big-zone .wx-count{left:calc((100% - var(--card-w) - 2*var(--gap))/2)}
@media(max-width:1099px){.big-zone>.weather-ctrl{justify-content:center;flex-wrap:wrap;overflow:visible}.big-zone>.weather-ctrl .wx-slider{flex-wrap:wrap;justify-content:center}.big-zone .wx-count{left:50%}}
.big-zone>.weather-ctrl .wx-src{display:inline-flex}
.big-zone>.weather-ctrl{border:0;border-radius:0;background:linear-gradient(rgba(8,12,34,0),rgba(8,12,34,.6) 55%)}
@media(max-width:1099px){.big-zone>.weather-ctrl{background:none}}

/* laptop-width desktops: compact the picker chips so they take 2 to 3 rows, not 5, and the scene keeps its room */
@media (min-width:1100px) and (max-width:1700px){
  .big-zone>.body-picker{gap:.3rem;padding-top:1.8rem}
  .big-zone>.body-picker .bp{min-height:34px;padding:.28rem .62rem;font-size:.8rem;gap:.28rem}
  .big-zone>.body-picker .bp-sep{display:none}
}

/* ===== illustrated page headers (Space, Weather, Ecosystems), in the spirit of the home welcome ===== */
.zone-hero{position:relative;isolation:isolate}
.zh-art{position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);overflow:hidden;pointer-events:none}
/* space: a clear night over the Space Coast, painted by space-hero.js (the gradient is the fallback before it paints) */
.zh-space{background:linear-gradient(180deg,#0c1230 0%,#18204c 45%,#2c2e66 80%,#463e78 100%)}
.zone-hero.space-hero{padding-bottom:var(--sh-pad,120px)}
.space-hero .zh-pano{top:0;height:100%}
.space-hero .eyebrow{color:#f2c230}.space-hero h1{color:#fff6dc}.space-hero .nb-lede{color:#dfe4ff}
.space-hero .zoom-nav a{box-shadow:0 0 0 1px rgba(255,255,255,.28)}
/* ecosystems: a panorama of US wild places */
.zh-eco{background:linear-gradient(180deg,#cfe6ec 0%,#e9f0de 55%,#f6edda 100%)}
.zh-pano{position:absolute;left:0;bottom:0;width:100%;display:block}
.zone-hero.eco-hero{padding-bottom:var(--eh-pad,170px)}
.eco-hero .zh-pano{top:0;height:100%}

/* weather header: sky gradient behind the painted farm and storm */
.zone-hero.wx-hero{padding-bottom:var(--wx-ground,80px)}
.wx-hero .zh-pano{top:0;height:100%}
.zone-hero.wx-hero::before{content:"";position:absolute;z-index:-2;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:linear-gradient(180deg,#bcdbe9 0%,#d9eaea 55%,#eef0de 100%)}