Flip the client to region-key resolution + region names in the dossier (v0.19 P1 of #16)

- src/lib/regions.ts (new): cached, turf-free same-origin fetches of
  /region-keys.json (feature id -> key) and /regions.geo.json (id -> name) so
  WorldMap and NationPanel share one fetch each.
- WorldMap.tsx: stamps each feature's properties.regionKey (from the manifest,
  by its stable id) and resolves owner / flash / hover / click from that key via
  the shared mapFeatureOwner; the per-region flash lights the exact sub-region
  whose owner changed; click carries only the sub-region name.
- NationPanel.tsx: territory chips show the region's human name (falling back
  to the raw key) with the key in the title / data-attr.
- App.tsx: the selected-region dossier label drops the now-unused parent code.

src/components/NationPanel.tsx

@@ -1,8 +1,10 @@
+import { useEffect, useState } from 'react';
 import { Badge } from './ui/badge';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from './ui/card';
 import StatBar from './StatBar';
 import { nationColor } from '@shared/protocol';
 import { RELATION_COLORS } from '@/lib/colors';
+import { keyToName } from '@/lib/regions';
 import type { Nation, RelationStatus } from '@shared/types';
 
 /** Human labels for a diplomatic status (the raw value is kept in data-attrs). */
@@ -38,6 +40,23 @@ export default function NationPanel({ nation, nations, isPlayer, inWindow = fals
   const relations = Object.entries(nation.relations).sort(([a], [b]) => a.localeCompare(b));
   const regions = nation.territory;
 
+  // Human region names for the territory chips (region key -> name), loaded once
+  // (cached in @/lib/regions). A key with no known name falls back to the raw key.
+  const [keyNames, setKeyNames] = useState<Record<string, string>>({});
+  useEffect(() => {
+    let cancelled = false;
+    keyToName()
+      .then((m) => {
+        if (!cancelled) setKeyNames(m);
+      })
+      .catch(() => {
+        /* names are cosmetic — a failed fetch just leaves the raw keys */
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
   const identity = (
     <div className="flex items-center gap-3">
       <span
@@ -95,15 +114,20 @@ export default function NationPanel({ nation, nations, isPlayer, inWindow = fals
         </h3>
         {regions.length > 0 ? (
           <div className="flex flex-wrap gap-1.5">
-            {regions.map((code) => (
-              <span
-                key={code}
-                className="rounded border px-1.5 py-0.5 text-xs tabular-nums"
-                style={{ borderColor: `${color}66`, color, background: `${color}12` }}
-              >
-                {code}
-              </span>
-            ))}
+            {regions.map((key) => {
+              const label = keyNames[key] ?? key;
+              return (
+                <span
+                  key={key}
+                  className="rounded border px-1.5 py-0.5 text-xs"
+                  style={{ borderColor: `${color}66`, color, background: `${color}12` }}
+                  title={key}
+                  data-region-key={key}
+                >
+                  {label}
+                </span>
+              );
+            })}
           </div>
         ) : (
           <p className="text-sm text-muted-foreground">No territory.</p>