border tweak

app.js

@@ -20,6 +20,7 @@ const state = {
   showFeatures: true,
   showLabels: true,
   map: null,
+  hoverEntities: [],
 };
 
 const canvas = document.getElementById("mapCanvas");
@@ -169,8 +170,8 @@ function renderStats(map) {
   }
 }
 
-function nearestEntity(map, x, y, maxDistance = 5) {
-  const groups = [
+function buildHoverEntities(map) {
+  return [
     ...(map.modernCities || []),
     ...(map.ports || []),
     ...(map.stations || []),
@@ -183,9 +184,12 @@ function nearestEntity(map, x, y, maxDistance = 5) {
     ...(map.villages || []),
     ...(map.adminCenters || []),
   ];
+}
+
+function nearestEntity(items, x, y, maxDistance = 5) {
   let best = null;
   let bestD = maxDistance;
-  for (const item of groups) {
+  for (const item of items) {
     const d = Math.hypot(item.x - x, item.y - y);
     if (d < bestD) { best = item; bestD = d; }
   }
@@ -201,6 +205,11 @@ function adminName(map, adminId) {
   return center?.name || (adminId >= 0 ? `Municipality ${adminId + 1}` : "-");
 }
 
+function adminPopulation(map, adminId) {
+  const center = (map.adminCenters || [])[adminId];
+  return Number.isFinite(center?.municipalityPopulation) ? center.municipalityPopulation : null;
+}
+
 function prefectureNameForCell(map, i) {
   const id = map.prefectureRegionId?.[i] ?? -1;
   const region = (map.prefectureRegions || []).find((p) => p.id === id);
@@ -217,13 +226,16 @@ function updateTooltip(event) {
     return;
   }
   const i = y * state.map.width + x;
-  const entity = nearestEntity(state.map, x, y);
+  const entity = nearestEntity(state.hoverEntities, x, y);
   const elevation = state.map.elevation?.[i] ?? 0;
   const density = state.map.populationDensity?.[i] ?? 0;
+  const hoveredAdminId = state.map.adminId?.[i] ?? -1;
+  const hoveredAdminPopulation = adminPopulation(state.map, hoveredAdminId);
   const lines = [
     `<strong>${entity ? `${entity.name} / ${entity.kind}` : `${x}, ${y}`}</strong>`,
     `Prefecture: ${prefectureNameForCell(state.map, i)}`,
-    `Admin: ${adminName(state.map, state.map.adminId?.[i] ?? -1)}`,
+    `Admin: ${adminName(state.map, hoveredAdminId)}`,
+    `Admin Pop: ${hoveredAdminPopulation === null ? "-" : hoveredAdminPopulation.toLocaleString()}`,
     `Land: ${state.map.sea?.[i] ? "Sea" : landuseName(state.map.landuse?.[i])}`,
     `Elevation: ${elevation.toFixed(3)} / Slope: ${(state.map.slope?.[i] ?? 0).toFixed(3)}`,
     `River: ${(state.map.river?.[i] ?? 0).toFixed(2)} / Density: ${density.toFixed(2)}`,
@@ -241,7 +253,8 @@ function updateTooltip(event) {
   tooltipEl.classList.add("visible");
 }
 
-function renderModeButtons() {  modeGrid.innerHTML = "";
+function renderModeButtons() {
+  modeGrid.innerHTML = "";
   for (const [key, label] of modes) {
     const button = document.createElement("button");
     button.type = "button";
@@ -262,6 +275,7 @@ async function regenerate() {
   await nextFrame();
   try {
     state.map = await generateMapAsync(parseSeed(state.seedText), { onProgress: updateGenerationProgress });
+    state.hoverEntities = buildHoverEntities(state.map);
     renderStats(state.map);
     redraw();
     if (progressStageEl) progressStageEl.textContent = `Done in ${formatMs(state.map.generationTotalMs || 0)}`;