header .brand .original-logo{width:180px;height:100px}
/* Keep content flexible across phones, tablets, and desktop screens. */
main,header,footer,.panel,.weather-grid>*,.below>*,.cards>*,.camera-workspace>*,.contact-grid>*,.intro>div{min-width:0}
img,video,iframe{max-width:100%}
input,select,textarea{min-width:0}
select:focus-visible,textarea:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.camera-row span{min-width:0}.camera-row b,.embed-caption h2,.source-note,.fineprint{overflow-wrap:anywhere}
.camera-list{overscroll-behavior:contain}.forecastdays{overscroll-behavior-x:contain}
@media(max-width:1100px){
 header{flex-wrap:wrap;gap:14px;padding:16px 0}
 header .brand{margin-right:auto}header .contact{display:inline-flex;align-items:center;min-height:44px}
 header nav{order:3;width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;font-size:14px;overflow:visible;white-space:normal;text-align:center}
 nav a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 6px}
 .intro{gap:24px;flex-wrap:wrap}.intro>div{flex:1 1 330px}.intro .location{max-width:100%;width:auto}
 .weather-grid{grid-template-columns:1fr 1fr}.camera-workspace{grid-template-columns:minmax(220px,.8fr) minmax(0,1.5fr)}
 .cards{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
 .quicklinks{gap:10px}.quicklinks>a{gap:10px;padding:14px}.quickicon{padding:4px}
 .radar-controls{flex-wrap:wrap;gap:10px}.radar-controls .segmented{max-width:100%}
 input,select,textarea,.team-contact input,.team-contact textarea{font-size:16px}
 button,.button,.contact,.segmented button,.tabs button,summary{min-height:44px}
 .location button{min-width:44px}.segmented button{font-size:13px;padding:10px 12px}
 .camera-row{min-height:60px}.camera-row b{font-size:14px}.camera-row small{font-size:12px}
 .camera-filters label{font-size:14px}.muted,.content-card p,.page-head .muted{font-size:14px}
 .discussion summary{font-size:14px}.discussion pre{font-size:14px;line-height:1.65}
 .station-credit{flex-wrap:wrap;font-size:11px}.station-credit a{padding:8px 0}
 .forecastday .desc{font-size:12px}.forecastday .day{font-size:14px}
 .source-note{font-size:12px}.back{min-height:44px;display:inline-flex;align-items:center}
}
@media(max-width:900px){
 .weather-grid,.below,.camera-workspace,.contact-grid{grid-template-columns:minmax(0,1fr)}
 .camera-list{max-height:320px}.camera-frame{height:620px}
 .station-frame{height:460px}.weather-grid .radar .radar-map{height:400px}
 .weather-grid .radar .radar-map.satellite-mode{height:540px}
 .quicklinks{grid-template-columns:1fr}.quicklinks>a{padding:18px}.quicklinks b{font-size:14px}
 .quicklinks small{font-size:12px}.resource-strip{gap:24px}
 .forecastdays{overflow-x:auto;grid-template-columns:repeat(5,minmax(116px,1fr))}
 footer>div{margin-left:0;flex-wrap:wrap}footer>div a{min-height:44px;display:inline-flex;align-items:center}
}
@media(max-width:600px){
 header,main{margin-left:16px;margin-right:16px}
 header .brand .original-logo{width:132px;height:98px}header .contact{font-size:13px;padding:10px 12px}
 header nav{font-size:12px;gap:4px}nav a{padding:10px 2px}
 .intro{padding-top:26px}.intro .location{margin-top:24px}
 h1{font-size:clamp(38px,11vw,52px)}.page-head h1{font-size:clamp(34px,10vw,44px);overflow-wrap:break-word}
 .cards,.staff-grid,.shelters{grid-template-columns:minmax(0,1fr)}
 .alertbar{padding:12px 16px;gap:12px;align-items:center}.alertbar>div{gap:8px;min-width:0}.status-dot{flex-shrink:0}.alertbar>a span{margin-left:4px}.alertbar b{font-size:12px}
 .camera-filters{gap:14px}.camera-filters .tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.camera-filters .tabs button:last-child{grid-column:1/-1}.tabs button{padding:12px 8px;font-size:14px}
 .camera-filters label{width:100%;justify-content:space-between}.camera-filters select{flex:1;margin-left:14px;max-width:70%}.camera-filters .shelter-search{min-width:0;width:100%;flex-basis:100%}
 .camera-list{max-height:280px}.camera-frame{height:560px}.embed-caption{padding:18px}
 .cyclone-frame{height:80svh;min-height:560px}.weather-grid .radar .radar-map{height:320px}.weather-grid .radar .radar-map.satellite-mode{height:480px}
 .radar .section-top{padding:18px}.radar-tools .tag{display:none}.radar-tools button{min-width:44px}
 .radar-controls{padding:12px}.segmented{max-width:100%}.forecast{padding-left:14px;padding-right:14px}
 .forecastfoot{flex-wrap:wrap;font-size:11px}.station-panel .section-top{padding:0 18px}.station-panel h2{font-size:18px}.station-credit{padding:12px 18px}
 .team-contact .button{width:100%}.content-card{padding:18px}
 footer{padding:28px 16px calc(85px + env(safe-area-inset-bottom));gap:18px}footer .fineprint{font-size:11px;line-height:1.7}
 .botlaunch{right:12px;bottom:calc(12px + env(safe-area-inset-bottom));min-height:44px}
 #bot{right:12px;left:12px;width:auto;bottom:calc(72px + env(safe-area-inset-bottom));max-height:calc(100dvh - 100px);overflow-y:auto}
 #botmessages{max-height:35dvh}#botinput{font-size:16px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
/* Keep the face in view in the team portrait and home-page avatar. */
.staff-card img[src*="Resized_20250202_172620"],.avatars img[src*="Resized_20250202_172620"]{object-position:100% 20%}

.radar-controls .segmented{display:flex;flex-wrap:wrap;gap:4px}
@media(max-width:600px){.radar-controls .segmented{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.radar-controls .segmented button{white-space:normal}}
/* Leave room below footer content for the fixed robot and its invitation. */
body footer{padding-bottom:220px}
footer .footer-socials{display:flex;flex-wrap:wrap;gap:10px}
footer .footer-socials a{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:8px 12px;border:1px solid #38526b;border-radius:8px;background:#142638;color:#edf6ff;font-size:13px}
footer .footer-socials a:hover,footer .footer-socials a:focus-visible{background:#213e56;border-color:#78c9f5}
footer .footer-socials svg{width:22px;height:22px;flex:none}
footer .footer-credits{flex-basis:100%;width:100%;color:#aabccb;font-size:12px;line-height:1.8;border-top:1px solid #2b4054;padding-top:18px}
footer .footer-credits>span:last-child{display:block}
.quicklinks .quick-picture{width:48px;height:48px;object-fit:contain;flex:0 0 48px;border-radius:8px}
.shelter-page-picture{display:block;width:220px;max-width:100%;height:auto;border-radius:12px;margin:0 0 24px}
.zello-page-heading{display:flex;align-items:center;gap:22px}
.zello-page-heading>img{width:56px;height:56px;object-fit:contain;flex:0 0 56px;margin:14px}
.zello-page-heading .page-head{min-width:0}
@media(max-width:600px){.shelter-page-picture{width:160px;margin-bottom:20px}.zello-page-heading{gap:10px}.zello-page-heading>img{width:44px;height:44px;flex-basis:44px;margin:11px}#detail .zello-page-heading{font-size:30px}}
@media(max-width:600px){body footer{padding-bottom:calc(180px + env(safe-area-inset-bottom))}}

/* Keep a clear lane beside the anchored mascot, including while links scroll past. */
body footer{padding-right:max(185px,5vw);padding-bottom:60px}
footer .footer-socials{margin-left:0;flex-basis:100%;gap:10px}
@media(max-width:600px){body footer{padding-right:112px;padding-bottom:calc(40px + env(safe-area-inset-bottom));gap:20px}footer .footer-socials{gap:8px}footer .footer-socials a{padding:8px 10px}}

.quicklinks .quick-picture{object-fit:cover;border-radius:8px;padding:0}

.forecastday .sky:has(img){display:flex;align-items:center;justify-content:center;height:88px;margin:10px 0}
.forecastday .sky img{width:88px;height:88px;max-width:100%;object-fit:contain}
@media(max-width:600px){.forecastday .sky:has(img){height:72px}.forecastday .sky img{width:72px;height:72px}}
/* Approved footer: compact social row with clear space for the persistent bot. */
body footer{display:grid;grid-template-columns:85px minmax(190px,280px) auto;align-items:start;align-content:start;column-gap:24px;row-gap:0;padding:40px max(5vw,28px);padding-right:320px;min-height:300px}
footer>.brand{grid-column:1;grid-row:1}footer .original-logo{width:80px;height:80px;object-fit:contain}footer>p{grid-column:2;grid-row:1;font-size:14px;line-height:1.7;margin:12px 0;color:#a9bbca}
footer .footer-socials{grid-column:3;grid-row:1;display:flex;align-items:center;justify-content:center;gap:18px;margin:0;flex-wrap:nowrap;align-self:center}
footer .footer-socials a{padding:12px 0;gap:7px;white-space:nowrap;background:none;border:0;border-radius:0;font-size:13px}footer .footer-socials a:hover,footer .footer-socials a:focus-visible{background:none;color:#8ed7ff;text-decoration:underline}
footer .footer-credits{grid-column:1/-1;margin-top:32px;padding-top:20px;font-size:11px;line-height:1.9;color:#859bad}
@media(max-width:1100px){body footer{grid-template-columns:75px 1fr;padding-right:310px}footer .footer-socials{grid-column:1/-1;grid-row:2;justify-content:flex-start}footer .footer-credits{grid-row:3}}
@media(max-width:600px){body footer{padding:28px 24px calc(200px + env(safe-area-inset-bottom));grid-template-columns:65px 1fr;column-gap:18px;row-gap:12px}footer .original-logo{width:65px;height:65px}footer .footer-socials{gap:16px;flex-wrap:wrap}footer .footer-socials a{padding:10px 0}footer .footer-credits{margin-top:12px}}

/* Geographic camera browsing */
.camera-map-frame{display:block;width:100%;height:720px;border:0;background:#e7eef4;border-radius:0 0 12px 12px}
.camera-map-back{margin:20px 24px 0;padding:12px 18px;background:#7abfff;color:#071422;border:0;border-radius:6px;font-weight:700;cursor:pointer}
.camera-viewer .embed-caption a{display:inline-block;margin-top:12px}
@media(max-width:760px){.camera-workspace:has(.camera-map-frame){display:flex;flex-direction:column}.camera-workspace:has(.camera-map-frame) .camera-viewer{order:-1;width:100%}.camera-workspace:has(.camera-map-frame) .camera-list{width:100%}.camera-map-frame{height:600px}}
.camera-workspace:has(.camera-map-frame){display:flex;flex-direction:column}.camera-workspace:has(.camera-map-frame) .camera-viewer{order:-1;width:100%}.camera-workspace:has(.camera-map-frame) .camera-list{width:100%;max-height:260px}

.camera-map-shell{max-width:100%;overflow:auto;border-radius:0 0 12px 12px}.camera-map-frame.missouri-map{min-width:900px}
.network-camera-map{height:540px;width:100%;isolation:isolate;background:#e6edf0;color:#162638;border-radius:0 0 12px 12px}
.camera-workspace:has(.network-camera-map){display:flex;flex-direction:column}.camera-workspace:has(.network-camera-map) .camera-viewer{order:-1;width:100%}.camera-workspace:has(.network-camera-map) .camera-list{width:100%;max-height:300px}
.camera-map-reset{background:#7abfff;color:#071422;padding:10px 16px;border:0;border-radius:6px;font-weight:700;cursor:pointer;margin-top:12px}
.network-camera-pin{background:#0c5c93;border:2px solid white;border-radius:50%;color:white;box-shadow:0 2px 5px #0007;display:grid;place-items:center;font-size:20px;font-weight:700}.network-camera-pin:focus{outline:3px solid #f6cd62;outline-offset:3px}
.map-camera-choices{display:grid;gap:8px}.map-camera-choices button{background:#0c5c93;color:white;padding:10px;border:0;border-radius:5px;cursor:pointer}.map-loading{padding:24px}.network-camera-map .leaflet-control a{color:#172b3d}.network-camera-map .leaflet-tooltip{color:#172b3d;font-weight:700}.network-camera-map .leaflet-control-attribution{font-size:10px}
#network-map-status:empty{display:none}
@media(max-width:600px){.network-camera-map{height:420px}}

/* Home resource cards beneath the weathercast and team panels. */
.resources{margin:32px 0}.resource-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}.resource-card{display:flex;align-items:center;gap:12px;padding:14px 16px;min-height:78px;border:1px solid #293d50;border-radius:9px;background:#121f2e;transition:.2s}.resource-card:hover{border-color:#7abfff;background:#17283b}.resource-card .art{width:44px;height:44px;flex:0 0 44px;color:#7abfff;background:#20364c;border-radius:10px;padding:9px}.resource-card:nth-child(2) .art{color:#a9d4aa;background:#233a33}.resource-card:nth-child(3) .art{background:#342b29;padding:12px}.resource-card .art img,.resource-card .art svg{width:100%;height:100%}.resource-card b{display:block;font-size:12px;font-weight:600;line-height:1.3}.resource-card small{display:block;color:#a8b9ca;font-size:10px;line-height:1.4;margin-top:5px}.resource-card i{font-style:normal;color:#7abfff;margin-left:auto}.resources h2{font-size:25px}
@media(max-width:760px){.resource-cards{grid-template-columns:1fr}.resource-card{min-height:78px}.resource-card b{font-size:14px}.resource-card small{font-size:12px}}

.resource-card .art:has(.forecast-card-sun){padding:0;background:transparent}.resource-card .forecast-card-sun{object-fit:contain}

.resource-card .art:has(.drought-card-icon){padding:5px;background:#382e22}.resource-card .drought-card-icon{object-fit:contain}
.drought-panel{padding:24px;margin-bottom:24px}.drought-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.drought-heading h2{margin:5px 0 8px}.drought-actions{display:flex;gap:8px;flex-wrap:wrap}.drought-actions button{padding:10px 14px;border:1px solid #3b515e;border-radius:8px;background:#162d3b;color:#fff;cursor:pointer}.drought-select{display:flex;align-items:center;gap:12px;margin:18px 0}.drought-select select{max-width:100%;padding:10px;border-radius:7px;background:#162d3b;color:white;border:1px solid #3b515e}#drought-map{height:540px;border-radius:12px;background:#dde5e8;isolation:isolate;z-index:0}.drought-county-label{white-space:nowrap;color:#14232e;font-family:Arial,sans-serif;font-weight:600;text-shadow:-1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff;pointer-events:none}.drought-county-label span{position:absolute;transform:translate(-50%,-50%);line-height:1.1}.drought-legend{display:flex;flex-wrap:wrap;gap:12px 20px;margin:18px 0;font-size:12px}.drought-legend span{display:flex;align-items:center;gap:6px}.drought-legend i{width:16px;height:13px;display:inline-block;border:1px solid #8b9396;border-radius:2px}.drought-credit{display:block;color:#9baeb9;font-size:11px;line-height:1.6}#drought-date{font-size:12px}@media(max-width:650px){.drought-panel{padding:14px}.drought-heading{display:block}.drought-actions{margin-top:12px}.drought-select{display:block}.drought-select label{display:block;margin-bottom:7px}#drought-map{height:460px}.drought-legend{gap:9px 14px;font-size:11px}}
