#publicRainfall { margin:24px 0; scroll-margin-top:100px; }
#publicRainfall .public-rain-card { margin:16px 0; padding:14px; border:1px solid var(--border,#cbd5e1); border-radius:12px; background:var(--card,#fff); }
#publicRainfall .public-rain-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
#publicRainfall h3 { margin:0; font-size:16px; }
#publicRainfall .public-rain-map { height:auto; min-height:400px; border-radius:8px; overflow:hidden; }
#publicRainfall .rainfall-tools { overflow:visible; max-height:none; flex-shrink:0; }
#publicRainDialog { box-sizing:border-box; width:96vw; max-width:1500px; height:92vh; height:92dvh; max-height:96dvh; padding:14px; border:0; border-radius:12px; color:#163a50; background:#f5f9fc; }
#publicRainDialog[open] { display:flex; flex-direction:column; }
#publicRainDialog::backdrop { background:#0b2545d9; }
#publicRainDialog header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 0 12px; background:none; color:inherit; }
#publicRainDialog .public-rain-dialog-stage { flex:1; min-height:0; }
#publicRainDialog .public-rain-map { height:100%; }
@media(max-width:700px) {
  #publicRainfall .public-rain-map { height:auto; min-height:360px; }
  #publicRainfall .rainfall-canvas { flex:none; height:360px; }
  #publicRainfall .public-rain-heading { flex-wrap:wrap; }
  #publicRainDialog { width:98vw; padding:8px; }
  #publicRainDialog .rainfall-tools { max-height:42dvh; }
}