* { box-sizing: border-box; margin: 0; padding: 0; }

html, body { width: 100%; height: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif; }

/* 顶部栏 */
.topbar {
  position: fixed; top: 0; left: 0; right: 0; height: 52px;
  background: #1f2937; color: #fff; display: flex; align-items: center;
  padding: 0 16px; z-index: 1000; box-shadow: 0 2px 4px rgba(0,0,0,.2);
}
.logo { font-size: 18px; font-weight: bold; margin-right: 24px; }
.basemap-switch { display: flex; align-items: center; gap: 6px; }
.basemap-switch .label { color: #9ca3af; margin-right: 4px; font-size: 13px; }
.basemap-switch button {
  background: #374151; color: #fff; border: none; padding: 6px 12px;
  border-radius: 4px; cursor: pointer; font-size: 13px;
}
.basemap-switch button.active { background: #2563eb; }
.basemap-switch button:hover:not(.active) { background: #4b5563; }
.topbar-right { margin-left: auto; }
.coord {
  background: rgba(0,0,0,.4); padding: 6px 12px; border-radius: 4px;
  font-family: "Consolas", "Monaco", monospace; font-size: 13px;
}

/* 左侧工具栏 */
.sidebar {
  position: fixed; top: 70px; left: 12px; z-index: 999;
  display: flex; flex-direction: column; gap: 6px;
  background: #fff; padding: 6px; border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.sidebar button {
  width: 40px; height: 40px; border: none; background: #f3f4f6;
  border-radius: 4px; cursor: pointer; font-size: 16px;
  font-weight: 600; color: #374151;
  display: flex; align-items: center; justify-content: center;
}
.sidebar button:hover { background: #e5e7eb; }
.sidebar button.active { background: #2563eb; color: #fff; }

/* 右侧面板 */
.panel {
  position: fixed; top: 70px; right: 12px; width: 320px; max-height: calc(100vh - 90px);
  background: #fff; border-radius: 8px; padding: 14px; overflow-y: auto;
  box-shadow: 0 2px 8px rgba(0,0,0,.15); z-index: 999;
}
.panel-section { margin-bottom: 16px; }
.panel-section h3 { font-size: 14px; margin-bottom: 8px; color: #374151; }
.panel-section ul { font-size: 13px; color: #4b5563; line-height: 1.8; padding-left: 20px; }
.panel-section code {
  background: #f3f4f6; padding: 1px 4px; border-radius: 3px; font-size: 12px;
}
.row { display: flex; gap: 6px; margin-bottom: 6px; }
.row input {
  flex: 1; padding: 6px 8px; border: 1px solid #d1d5db; border-radius: 4px; font-size: 13px;
}
.row button {
  padding: 6px 12px; background: #2563eb; color: #fff; border: none;
  border-radius: 4px; cursor: pointer; font-size: 13px;
}
.row button:hover { background: #1d4ed8; }
.panel-section button {
  margin-top: 6px; padding: 6px 12px; background: #2563eb; color: #fff;
  border: none; border-radius: 4px; cursor: pointer; font-size: 13px;
  margin-right: 6px;
}
.poi-list { list-style: none; padding: 0; max-height: 260px; overflow-y: auto; }
.poi-list li {
  padding: 8px; border-bottom: 1px solid #e5e7eb; cursor: pointer; font-size: 13px;
}
.poi-list li:hover { background: #f3f4f6; }
.poi-list .addr { color: #6b7280; font-size: 12px; }
.info {
  margin-top: 8px; padding: 8px; background: #f9fafb; border-radius: 4px;
  font-size: 13px; color: #374151; min-height: 24px;
}

/* 地图 */
#map { position: absolute; top: 52px; left: 0; right: 0; bottom: 0; }

/* Leaflet 测量标签 */
.measure-label {
  background: rgba(0,0,0,.7); color: #fff; padding: 2px 6px;
  border-radius: 3px; font-size: 12px; white-space: nowrap;
  border: none !important;
}
