html, body, #map { height: 100%; margin: 0; }
body { font-family: Arial, sans-serif; color: #222; }
.panel { position: fixed; z-index: 1000; background: rgba(255,255,255,.96); border-radius: 14px; box-shadow: 0 3px 14px rgba(0,0,0,.20); }
.map-title { top: 14px; left: 52px; padding: 13px 16px; max-width: 560px; }
.map-title h1 { font-size: 18px; margin: 0 0 4px; }
.map-title p { font-size: 12px; color: #444; margin: 0; }
.filter-panel { left: 12px; top: 122px; width: 330px; padding: 13px 14px; max-height: calc(100vh - 145px); overflow: auto; }
.overview-panel { right: 18px; top: 78px; width: min(790px, calc(100vw - 395px)); padding: 14px; max-height: calc(100vh - 105px); overflow: auto; }
h2 { font-size: 15px; margin: 0 0 8px; }
h3 { font-size: 12px; margin: 12px 0 4px; color: #444; }
.drag-handle { cursor: move; user-select: none; }
.drag-handle span { float: right; font-size: 10px; color: #777; font-weight: 400; margin-top: 2px; }
.search { box-sizing: border-box; width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 8px; margin: 6px 0 10px; }
details { border-top: 1px solid #eee; padding-top: 8px; margin-top: 8px; }
summary { cursor: pointer; font-weight: 700; font-size: 13px; }
.segmented { display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; }
.segmented label { border:1px solid #ccc; background:#f7f7f7; border-radius:999px; padding:5px 8px; font-size:11px; cursor:pointer; }
.filter-list { margin-top: 6px; }
.filter-row, .overview-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-top: 1px solid #f0f0f0; font-size: 12px; gap: 8px; }
.filter-row { cursor: pointer; user-select: none; }
.filter-row span, .overview-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dot { display:inline-block; width:11px; height:11px; border-radius:50%; border:1px solid #333; margin-right:7px; vertical-align:-1px; }
.actions { display: flex; gap: 7px; margin: 8px 0 3px; }
.actions button { flex: 1; border: 1px solid #ccc; background:#f7f7f7; border-radius:8px; padding:6px 7px; font-size:11px; cursor:pointer; }
.actions button:hover, .download-btn:hover { background: #eee; }
.stats { display:grid; grid-template-columns: repeat(4, 1fr); gap:10px; margin-bottom:10px; }
.stats div { background:#f5f5f5; border-radius:10px; padding:9px; }
.stats b { font-size:20px; display:block; }
.stats small { font-size:11px; color:#555; }
.note { font-size: 11px; color: #555; line-height: 1.35; }
.dragging-panel { opacity:.92; box-shadow: 0 8px 25px rgba(0,0,0,.28) !important; }
.popup-title { font-size:15px; font-weight:700; margin-bottom:4px; }
.popup-badge { display:inline-block; color:white; padding:3px 7px; border-radius:999px; margin:0 5px 8px 0; }
.popup-table { border-collapse: collapse; width: 100%; font-size: 13px; }
.popup-table td { padding:3px 8px 3px 0; vertical-align:top; }
.popup-table td:first-child { font-weight:700; white-space:nowrap; }
.table-toolbar { display:flex; flex-wrap:wrap; gap:7px 12px; margin:8px 0; font-size:12px; align-items:center; }
.table-toolbar label { white-space:nowrap; }
.download-btn { border:1px solid #ccc; background:#f7f7f7; border-radius:8px; padding:7px 9px; font-size:11px; cursor:pointer; margin:0 6px 8px 0; }
.table-scroll { max-height: 52vh; overflow: auto; border: 1px solid #e5e5e5; border-radius: 10px; background:white; }
.stats-table { border-collapse: collapse; width: 100%; min-width: 690px; font-size: 11px; }
.stats-table th, .stats-table td { border-bottom: 1px solid #eee; border-right: 1px solid #f3f3f3; padding: 5px 6px; text-align: right; white-space: nowrap; }
.stats-table th.clickable { cursor:pointer; text-decoration: underline; text-underline-offset: 2px; }
.stats-table th:first-child, .stats-table td:first-child { position: sticky; left: 0; background: #fff; text-align: left; z-index: 1; min-width: 155px; }
.stats-table thead th { position: sticky; top: 0; background: #f7f7f7; z-index: 2; font-weight: 700; }
.stats-table thead th:first-child { z-index: 3; background:#f7f7f7; }
.stats-table tbody tr:last-child td { font-weight: 700; background:#fafafa; }
.stats-cell-muted { color:#777; }
@media (max-width: 900px) { .stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 760px) {
  .map-title { right: 10px; left: 10px; top: 10px; max-width: none; }
  .overview-panel { display:none; width:auto; }
  .filter-panel { left: 10px; right: 10px; bottom: 12px; top: auto; width: auto; max-height: 45vh; }
}