/* Radar & Satellite preview (mock, 2026-10-28): the Radar view in front of the
   existing Satellite viewer. Private under /maps/ until Mike's go. */
.rs-switch{ display:inline-flex; gap:0; margin:22px 0 16px; border:1px solid var(--line); border-radius:999px; overflow:hidden; background:var(--panel); }
.rs-switch button{ font:700 14px/1 Inter,system-ui,sans-serif; letter-spacing:.04em; text-transform:uppercase; padding:12px 22px; min-height:44px; border:0; background:transparent; color:var(--ink-2); cursor:pointer; }
.rs-switch button[aria-selected="true"]{ background:var(--ink); color:var(--bg); }
.rs-stage{ position:relative; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#0d1117; }
.rs-map{ height:min(68vh, 720px); min-height:420px; }
.rs-legend{ position:absolute; left:10px; bottom:30px; background:rgba(13,17,23,.78); color:#e8edf4; padding:8px 10px; border-radius:9px; font:600 11px Inter,sans-serif; width:min(260px, calc(100% - 20px)); box-sizing:border-box; }
.rs-scale{ display:grid; grid-template-columns:38px 1fr; align-items:center; gap:6px; margin:2px 0; }
.rs-bar{ display:flex; height:10px; border-radius:3px; overflow:hidden; }
.rs-bar div{ flex:1; }
.rs-ticks div{ display:flex; justify-content:space-between; color:#b9c3cf; font-weight:500; }
.rs-ticks i{ font-style:normal; }
.rs-status{ position:absolute; top:10px; left:10px; background:rgba(13,17,23,.85); color:#fff; font:600 12px Inter,sans-serif; padding:6px 10px; border-radius:7px; }
.rs-status:empty{ display:none; }
.rs-opts{ display:flex; flex-wrap:wrap; gap:10px 22px; align-items:center; flex-basis:100%; }
.rs-group{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.rs-lab{ white-space:nowrap; font:700 11px Inter,sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); margin-right:4px; }
.rs-group button{ font:600 13px Inter,system-ui,sans-serif; padding:9px 14px; min-height:40px; border-radius:999px; border:1px solid var(--line); background:var(--panel-2); color:var(--ink-2); cursor:pointer; }
.rs-group button[aria-checked="true"], .rs-group button[aria-pressed="true"]{ background:var(--fill-pig); border-color:var(--fill-pig); color:#fff; }
.rs-group button[disabled]{ opacity:.55; cursor:default; }
.rs .maplibregl-ctrl-attrib{ font-size:11px; }
@media (max-width:640px){
  /* The Lower 48's own shape, so it fills the map with little Canada or Mexico, and the legend under the map instead of
     over it (Mike 2026-11-02). Not in the game pop-up, which is fixed on a stadium and keeps its overlay. */
  html:not(.rs-embed) .rs-map{ height:68vw; min-height:200px; }
  html:not(.rs-embed) .rs-legend{ position:static; width:auto; max-width:none; border-radius:0; padding:8px 12px; }
  .rs-switch{ display:flex; }
  .rs-switch button{ flex:1; }
}
@media (pointer:coarse){ .rs-group button{ min-height:44px; } }
/* Regions, Games, My area, Share (mock 2026-10-28, Mike via weatherqb-21: same picker as /hazards/) */
.rs-regions{ margin:0 0 10px; }
.rs-jumps{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin:0 0 12px; }
.rs-jump{ display:flex; align-items:center; gap:8px; }
.rs-jump .hz-region-sel{ min-width:240px; }
.rs-place button, .rs-find button, .rs-share{ font:600 13px Inter,system-ui,sans-serif; min-height:44px; padding:0 14px; border-radius:999px; border:1px solid var(--line); background:var(--panel-2); color:var(--ink); cursor:pointer; }
.rs-place #rsMine{ background:var(--fill-pig); border-color:var(--fill-pig); color:#fff; }
.rs-find{ display:flex; gap:6px; }
.rs-find input{ font:500 14px Inter,sans-serif; min-height:44px; width:150px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--ink); }
.rs-share{ margin-left:auto; }
.rs-card{ position:fixed; inset:0; z-index:50; background:rgba(8,12,18,.6); display:grid; place-items:center; padding:16px; }
.rs-card[hidden]{ display:none; }
.rs-card-box{ background:#fff; border-radius:14px; padding:14px; max-width:min(720px, 100%); max-height:100%; overflow:auto; }
.rs-card-box img{ display:block; width:100%; border-radius:6px; border:1px solid #e3e7ec; }
.rs-card-row{ display:flex; gap:10px; margin-top:12px; }
@media (max-width:640px){ .rs-jump, .rs-jump .hz-region-sel{ flex:1 1 100%; min-width:0; } .rs-share{ margin-left:0; flex:1 1 100%; } .rs-find{ flex:1 1 100%; min-width:0; } .rs-find input{ flex:1; width:auto; min-width:0; } }
/* Mike 10/28: "a gap between Radar & Satellite and the top of the page". The satellite page's 120 px
   top padding put the kicker 120 px under the header (/hazards/: 56) and the lede's bottom margin
   left ~80 px before the switch; the map started 600 px down on a 900 px screen. */
@media (min-width:641px){
  .sat-section{ padding-top:56px !important; }   /* kicker lands where /hazards/ puts it */
  .sat-section .section-lede{ margin-bottom:0; }
  .rs-switch{ margin-top:16px; }
}
/* Satellite tab regions (2026-10-29): the US frames zoom to the same boxes; a region the frame
   doesn't reach (the West view ends near the Plains) is greyed out. */
.sat-regions{ margin:12px 0 10px; }
.hz-region-row button:disabled{ opacity:.4; cursor:default; }
/* Warnings key + note + tap popup (2026-10-29) */
.rs-warnkey{ display:flex; flex-wrap:wrap; gap:3px 10px; margin-top:5px; padding-top:5px; border-top:1px solid rgba(255,255,255,.14); }
.rs-warnkey[hidden]{ display:none; }
.rs-warnkey i{ font-style:normal; display:inline-flex; align-items:center; gap:5px; color:#dfe5ec; }
.rs-warnkey i::before{ content:""; width:14px; height:0; border-top:3px solid var(--c); box-shadow:0 0 0 1px rgba(0,0,0,.4); }
.rs-warnkey i.w::before{ border-top:2px dashed var(--c); box-shadow:none; }
.rs-warnnote{ margin:10px 0 0; font:500 14px/1.45 Inter,sans-serif; color:var(--ink-2); }
.rs-warnnote:empty{ display:none; }
.rs-pop .maplibregl-popup-content{ font:500 13px/1.4 Inter,sans-serif; color:#11202b; padding:10px 28px 10px 12px; border-radius:9px; }
.rs-pop .maplibregl-popup-content span{ color:#4b5f6e; }
.rs-pop hr{ border:0; border-top:1px solid #e3e7ec; margin:7px 0; }
.rs-pop .maplibregl-popup-close-button{ width:32px; height:32px; font-size:20px; }
.rs-ticks i{ min-width:0; }
.rs-scale[hidden]{ display:none; }
#rsRadar .sat-btns button:disabled, #rsScrub:disabled{ opacity:.35; cursor:default; }
.rs-group[hidden]{ display:none; }
.rs-warnnote a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }
.rs-pop .rs-fc a{ display:inline-block; padding:6px 0; font-weight:700; color:#0f6f95; text-decoration:underline; text-underline-offset:2px; }
/* Game radar (scorebug Radar button, mock 2026-10-29; Mike 10/28: "fixed zoomed game radar on scorebugs, no
   pan/zoom"): ?embed=1&at=lat,lon is the map alone, fixed on the stadium, inside app.js's Radar pop-up. */
.rs-embed body{ background:#0d1117; padding:0; }
.rs-embed .nav, .rs-embed .footer, .rs-embed .kicker, .rs-embed .page-title, .rs-embed .section-lede, .rs-embed .rs-switch,
.rs-embed .rs-regions, .rs-embed .rs-jumps, .rs-embed .rs-opts, .rs-embed #rsDesc, .rs-embed #sat, .rs-embed .sat-credit,
.rs-embed .rs-warnnote, .rs-embed .rs-card, .rs-embed .skip-link{ display:none !important; }
.rs-embed main, .rs-embed .sat-section, .rs-embed .wrap{ padding:0 !important; margin:0; max-width:none; }
html.rs-embed main > section.section:first-of-type{ padding:0 !important; }   /* beats the phone rule's 28 px */
.rs-embed .rs-switch + .rs{ margin:0; }
.rs-embed .rs-stage{ border:0; border-radius:0; }
.rs-embed .rs-map{ height:calc(100vh - 58px); min-height:0; }
.rs-embed .rs-bar-ctl{ margin:0; border:0; border-radius:0; padding:7px 12px; gap:10px 14px; flex-wrap:nowrap; height:58px; box-sizing:border-box; background:#0d1117; color:#e8edf4; }
.rs-embed .rs-bar-ctl .sat-stamp b{ color:#fff; }
.rs-embed .rs-bar-ctl .sat-stamp span{ color:#b9c3cf; }
.rs-embed .rs-bar-ctl .sat-time{ flex:1; min-width:0; }
.rs-embed #rsScrub{ display:none; }
.rs-embed .rs-legend{ bottom:24px; width:min(220px, calc(100% - 20px)); }
.rs-embed #rsPrev, .rs-embed #rsNext{ display:none; }   /* a fixed loop: play/pause is enough */
@media (max-width:480px){ .rs-embed .rs-legend .rs-ticks{ display:none; } }
/* Layout pass (Mike 2026-10-29, "do 1-3"): on a phone the map comes right under the title and the Radar/Satellite
   switch; the region, Games, My area and Share controls move under it (they used to push the radar two-thirds of
   the way down the first screen). The lede goes; the long explanation folds under "How to read this map". */
.rs-how{ margin-top:8px; max-width:820px; color:var(--ink-2); font-size:14.5px; }
.rs-how summary{ cursor:pointer; font-weight:600; color:var(--ink); min-height:44px; display:flex; align-items:center; }
.rs-how ul{ margin:4px 0 0; padding-left:20px; }
.rs-how li{ margin:4px 0; }
@media (max-width:640px){
  .sat-section .section-lede{ display:none; }
  .sat-section .page-title{ margin-bottom:8px; }
  .rs-switch{ margin:10px 0 10px; }
  #rsRadar:not([hidden]){ display:flex; flex-direction:column; }
  #rsRadar > .rs-stage{ order:1; }
  #rsRadar > .rs-bar-ctl{ order:2; }
  #rsRadar > .rs-warnnote{ order:3; }
  #rsRadar > .rs-regions{ order:4; margin:14px 0 8px; }
  #rsRadar > .rs-jumps{ order:5; display:grid; grid-template-columns:1fr auto; gap:8px; margin:0; }
  #rsRadar > #rsFcDesc{ order:6; }
  #rsRadar > #rsWvDesc{ order:6; }
  #rsRadar > #rsDesc{ order:7; }
  #rsRadar > .rs-how{ order:8; }
  .rs-jumps .rs-jump{ min-width:0; }
  .rs-jumps #rsGamesWrap{ grid-column:1 / 2; }
  .rs-jumps .rs-share{ grid-column:2 / 3; grid-row:1; margin:0; flex:none; padding:0 14px; }
  .rs-jumps .rs-place{ grid-column:1 / -1; }
  .rs-jumps .rs-share{ white-space:nowrap; }
}
.rs-src{ margin-top:14px; font-size:13px; }
.rs-src summary{ font-weight:600; color:var(--ink-2); font-size:13px; }
.rs-src .sat-credit{ margin-top:4px; }
.rs-embed .rs-how{ display:none !important; }