html, body { margin: 0; height: 100%; font-family: system-ui, sans-serif; }
#map { position: absolute; inset: 0; }
#panel {
  position: absolute; z-index: 1000; left: 12px; bottom: 24px; right: 12px; max-width: 420px;
  background: rgba(255,255,255,.94); padding: 12px 14px; border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,.3);
}
h1 { font-size: 1.05rem; margin: 0 0 4px; }
#stats { margin: 0 0 8px; font-size: .9rem; color: #444; }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; font-size: .85rem; }
#slider { width: 100%; }
#label { font-weight: 600; margin: 2px 0 6px; }
small { color: #666; }
button { padding: 4px 10px; cursor: pointer; }
#rawStatus { font-size: .8rem; color: #a33; min-height: 1em; margin-bottom: 4px; }
#hourSlider { width: 100%; }
#hourLabel { font-weight: 600; }
#hourNote { font-size: .8rem; color: #444; min-height: 1em; margin-bottom: 6px; }
.home { font-size: .8rem; color: #2a78d6; text-decoration: none; }