feat: added features and fixes

src/core/entities/index.ts

@@ -104,6 +104,51 @@ export interface ActiveTask {
   completed: boolean;
 }
 
+export interface CognitiveAnchor {
+  name: string;
+  distance: number;
+  range: string;
+  direction: string;
+}
+
+export interface ExplorationStatus {
+  percentage: number;
+  fullyExplored: boolean;
+}
+
+export interface RememberedPOI {
+  id: string;
+  name: string;
+  category: string;
+  tags: string[];
+  relativeDirection: string;
+}
+
+export interface ZoneMemory {
+  zoneId: string;
+  name: string;
+  zoneType: string;
+  category: string;
+  exploration: ExplorationStatus;
+  rememberedPOIs: RememberedPOI[];
+}
+
+export interface ZoneMemorySummary {
+  zoneId: string;
+  name: string;
+  zoneType: string;
+  category: string;
+  explorationPercentage: number;
+  fullyExplored: boolean;
+}
+
+export interface MentalMap {
+  home?: CognitiveAnchor;
+  nearestCity?: CognitiveAnchor;
+  currentZoneMemory?: ZoneMemory;
+  knownZones: ZoneMemorySummary[];
+}
+
 export interface CitizenPerception {
   identity: Identity;
   status: CitizenStatus;
@@ -113,6 +158,9 @@ export interface CitizenPerception {
   lastAction: LastAction | null;
   activeTask: ActiveTask | null;
   position: Vector3;
+  mentalMap?: MentalMap;
+  recentMessages: SpeechMessage[];
+  coins: number;
 }
 
 
@@ -144,9 +192,9 @@ export interface CitizenDetail {
 }
 
 export interface CognitionEntry {
-  entityId: string;
+  citizenId: string;
   tick: number;
-  thoughtProcess: string;
+  reasoning: string;
   actionTarget: string;
 }
 
@@ -157,6 +205,9 @@ export interface WorldObject {
   y: number;
   z: number;
   displayName: string;
+  category?: string;
+  owned?: string | null;
+  tags: string[];
   properties: Record<string, unknown>;
 }
 
@@ -178,6 +229,11 @@ export interface Zone {
   id: string;
   name: string;
   type: string;
+  category?: string;
+  owned?: string | null;
+  tags: string[];
+  isEntryRestricted: boolean;
+  parentZoneId?: string | null;
   center: Vector3;
   width: number;
   length: number;

src/data/mappers/citizenMapper.ts

@@ -10,10 +10,15 @@
   InventoryItem,
   LastAction,
   ActiveTask,
+  MentalMap,
+  CognitiveAnchor,
+  ZoneMemory,
+  ZoneMemorySummary,
+  RememberedPOI,
   CognitionEntry,
   Vector3,
   SpeechMessage,
   ExplorationProgress,
 } from '@core/entities';
 
 // Helpers for null safety
@@ -112,6 +117,61 @@
   };
 }
 
+function mapCognitiveAnchor(raw: Raw): CognitiveAnchor | undefined {
+  if (!raw) return undefined;
+  return {
+    name: str(raw.name),
+    distance: num(raw.distance),
+    range: str(raw.range, 'UNKNOWN'),
+    direction: str(raw.direction, 'CENTER'),
+  };
+}
+
+function mapRememberedPOI(raw: Raw): RememberedPOI {
+  return {
+    id: str(raw?.id, ''),
+    name: str(raw?.name),
+    category: str(raw?.category, 'UNKNOWN'),
+    tags: arr<string>(raw?.tags),
+    relativeDirection: str(raw?.relativeDirection, 'UNKNOWN'),
+  };
+}
+
+function mapZoneMemory(raw: Raw): ZoneMemory | undefined {
+  if (!raw) return undefined;
+  return {
+    zoneId: str(raw.zoneId, ''),
+    name: str(raw.name),
+    zoneType: str(raw.zoneType, 'UNKNOWN'),
+    category: str(raw.category, 'UNKNOWN'),
+    exploration: {
+      percentage: num(raw.exploration?.percentage),
+      fullyExplored: bool(raw.exploration?.fullyExplored),
+    },
+    rememberedPOIs: arr<Raw>(raw.rememberedPOIs).map(mapRememberedPOI),
+  };
+}
+
+function mapZoneMemorySummary(raw: Raw): ZoneMemorySummary {
+  return {
+    zoneId: str(raw?.zoneId, ''),
+    name: str(raw?.name),
+    zoneType: str(raw?.zoneType, 'UNKNOWN'),
+    category: str(raw?.category, 'UNKNOWN'),
+    explorationPercentage: num(raw?.explorationPercentage),
+    fullyExplored: bool(raw?.fullyExplored),
+  };
+}
+
+function mapMentalMap(raw: Raw): MentalMap {
+  return {
+    home: mapCognitiveAnchor(raw?.home),
+    nearestCity: mapCognitiveAnchor(raw?.nearestCity),
+    currentZoneMemory: mapZoneMemory(raw?.currentZoneMemory),
+    knownZones: arr<Raw>(raw?.knownZones).map(mapZoneMemorySummary),
+  };
+}
+
 function mapPerception(raw: Raw): CitizenPerception {
   return {
     identity: mapIdentity(raw?.identity),
@@ -122,6 +182,9 @@
     lastAction: mapLastAction(raw?.lastAction),
     activeTask: mapActiveTask(raw?.activeTask),
     position: mapVector3(raw?.position),
+    mentalMap: mapMentalMap(raw?.mentalMap),
+    recentMessages: arr<Raw>(raw?.recentMessages).map(mapSpeechMessage),
+    coins: num(raw?.coins),
   };
 }
 
@@ -167,9 +230,9 @@
 
 export function mapCognitionEntry(raw: Raw): CognitionEntry {
   return {
-    entityId: str(raw?.entityId, ''),
+    citizenId: str(raw?.citizenId || raw?.entityId, ''),
     tick: num(raw?.tick),
-    thoughtProcess: str(raw?.thoughtProcess, ''),
+    reasoning: str(raw?.reasoning || raw?.thoughtProcess, ''),
     actionTarget: str(raw?.actionTarget, ''),
   };
 }

src/data/mappers/worldMapper.ts

@@ -7,19 +7,19 @@
   Vector3
 } from '@core/entities';
 
 type Raw = any;
 
 const str = (val: any, fallback = ''): string => String(val ?? fallback);
 const num = (val: any, fallback = 0): number => {
   const n = Number(val);
   return isNaN(n) ? fallback : n;
 };
 
 export function mapVector3(raw: any): Vector3 {
   return { x: num(raw?.x), y: num(raw?.y), z: num(raw?.z) };
 }
 
 export function mapWorldObject(raw: any): WorldObject {
   return {
     id: String(raw?.id || ''),
     type: String(raw?.type || 'UNKNOWN'),
@@ -27,6 +27,9 @@
     y: Number(raw?.y || 0),
     z: Number(raw?.z || 0),
     displayName: String(raw?.displayName || raw?.id || 'Unknown Object'),
+    category: raw?.category ? String(raw.category) : undefined,
+    owned: raw?.owned ? String(raw.owned) : null,
+    tags: Array.isArray(raw?.tags) ? raw.tags.map(String) : [],
     properties: raw?.properties || {},
   };
 }
@@ -54,6 +57,11 @@
     id: str(raw?.id),
     name: str(raw?.name, 'Unnamed Zone'),
     type: str(raw?.type, 'UNKNOWN'),
+    category: raw?.category ? str(raw.category) : undefined,
+    owned: raw?.owned ? str(raw.owned) : null,
+    tags: Array.isArray(raw?.tags) ? raw.tags.map((t: string) => str(t)) : [],
+    isEntryRestricted: !!raw?.isEntryRestricted,
+    parentZoneId: raw?.parentZoneId ? str(raw.parentZoneId) : null,
     center: mapVector3(raw?.center),
     width: num(raw?.width),
     length: num(raw?.length),

src/presentation/layout/RightSidebar.tsx

@@ -4,7 +4,16 @@ import { useWorldStore } from '@store/useWorldStore';
 import { useUIStore } from '@store/useUIStore';
 import { useCitizenDetail, useCognitionPolling } from '@shared/hooks/usePolling';
 import { vitalityColor, stateBadgeClass, truncate } from '@shared/utils/formatters';
-import type { CitizenDetail, CognitionEntry, CitizenSummary, SpeechMessage, ExplorationProgress } from '@core/entities';
+import type { 
+  CitizenDetail, 
+  CognitionEntry, 
+  CitizenSummary, 
+  SpeechMessage, 
+  ExplorationProgress,
+  MentalMap,
+  CognitiveAnchor,
+  ZoneMemorySummary
+} from '@core/entities';
 
 // ─── Sub-components ──────────────────────────────
 
@@ -105,6 +114,94 @@ function RecentMessagesList({ messages }: { messages: SpeechMessage[] }) {
   );
 }
 
+function CognitiveAnchorCard({ anchor, label }: { anchor: CognitiveAnchor; label: string }) {
+  return (
+    <div 
+      className="flex flex-col gap-1 p-2 rounded border border-slate-700/50 bg-slate-800/30"
+    >
+      <div className="flex justify-between items-center text-[10px] uppercase font-bold tracking-wider text-slate-500">
+        <span>{label}</span>
+        <span className="text-cyan-400 font-mono">{anchor.range}</span>
+      </div>
+      <div className="text-xs font-medium text-slate-200 truncate">{anchor.name}</div>
+      <div className="flex justify-between text-[10px] text-slate-500 mt-1">
+        <span>{anchor.distance.toFixed(1)}m</span>
+        <span className="text-cyan-500/70">{anchor.direction}</span>
+      </div>
+    </div>
+  );
+}
+
+function MentalMapSection({ mentalMap }: { mentalMap?: MentalMap }) {
+  const [isOpen, setIsOpen] = React.useState(false);
+
+  if (!mentalMap) return null;
+
+  const hasAnchors = mentalMap.home || mentalMap.nearestCity;
+  const hasZones = mentalMap.knownZones.length > 0;
+
+  if (!hasAnchors && !hasZones) return null;
+
+  return (
+    <div className="flex flex-col gap-2">
+      <button
+        onClick={() => setIsOpen(!isOpen)}
+        className="flex items-center justify-between w-full text-slate-500 text-xs uppercase hover:text-slate-300 transition-colors group"
+      >
+        <div className="flex items-center gap-2">
+          <span>Mental Map</span>
+          <span className="badge badge-idle text-[10px] leading-none px-1.5 opacity-60">
+            {mentalMap.knownZones.length}
+          </span>
+        </div>
+        <span className={`text-[10px] transition-transform duration-200 ${isOpen ? 'rotate-90' : ''}`}>
+          ▶
+        </span>
+      </button>
+
+      {isOpen && (
+        <div className="flex flex-col gap-3 animate-fade-in pl-1 border-l border-slate-800 ml-1 mt-1">
+          {/* Anchors */}
+          {hasAnchors && (
+            <div className="grid grid-cols-2 gap-2">
+              {mentalMap.home && <CognitiveAnchorCard label="Home" anchor={mentalMap.home} />}
+              {mentalMap.nearestCity && <CognitiveAnchorCard label="Nearest City" anchor={mentalMap.nearestCity} />}
+            </div>
+          )}
+
+          {/* Known Zones */}
+          {hasZones && (
+            <div className="flex flex-col gap-1.5">
+              <h5 className="text-[9px] uppercase font-bold tracking-widest text-slate-600 mb-0.5">Known Regions</h5>
+              {mentalMap.knownZones.map((zone: ZoneMemorySummary) => (
+                <div 
+                  key={zone.zoneId}
+                  className="flex flex-col gap-1 px-2 py-1.5 rounded bg-slate-800/40 border border-slate-700/20"
+                >
+                  <div className="flex justify-between items-center text-[10px]">
+                    <span className="text-slate-300 font-medium truncate">{zone.name}</span>
+                    <span className={zone.fullyExplored ? 'text-green-400' : 'text-slate-500'}>
+                      {zone.fullyExplored ? '✓' : `${zone.explorationPercentage}%`}
+                    </span>
+                  </div>
+                  {!zone.fullyExplored && (
+                    <div className="h-0.5 w-full bg-slate-900 rounded-full overflow-hidden">
+                      <div 
+                        className="h-full bg-slate-600 transition-all duration-500" 
+                        style={{ width: `${zone.explorationPercentage}%` }}
+                      />
+                    </div>
+                  )}
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+      )}
+    </div>
+  );
+}
+
 function ThoughtHistoryList({ history }: { history: CognitionEntry[] }) {
   const [isOpen, setIsOpen] = React.useState(false);
 
@@ -228,6 +325,9 @@ function CitizenInspector({ detail, uuid }: { detail: CitizenDetail; uuid: strin
       {/* Exploration (Collapsible) */}
       <ExplorationProgressList progress={detail.explorationProgress} />
 
+      {/* Mental Map (New) */}
+      <MentalMapSection mentalMap={perception.mentalMap} />
+
       {/* Active Task */}
       {activeTask && (
         <div className="p-2.5 rounded-lg" style={{ background: 'rgba(30,41,59,0.7)', border: '1px solid rgba(100,116,139,0.2)' }}>
@@ -343,7 +443,7 @@ function CognitionEntryCard({ entry }: { entry: CognitionEntry }) {
         <span className="text-slate-500 text-xs truncate max-w-24">{entry.actionTarget}</span>
       </div>
       <p className="text-slate-400 text-xs leading-relaxed">
-        {expanded ? entry.thoughtProcess : truncate(entry.thoughtProcess, 80)}
+        {expanded ? entry.reasoning : truncate(entry.reasoning, 80)}
       </p>
     </button>
   );

src/presentation/map/MapViewport.tsx

@@ -40,7 +40,7 @@
   }>>(new Map());
   const trailSprites = useRef<Map<string, Graphics>>(new Map());
   const worldObjectSprites = useRef<Map<string, Graphics>>(new Map());
   const zoneSprites = useRef<Map<string, { g: Graphics; label: any }>>(new Map());
 
   // Tooltip overlay state
   const [hoveredInfo, setHoveredInfo] = React.useState<{ text: string; x: number; y: number } | null>(null);
@@ -96,7 +96,7 @@
 
     // Update citizen/trail positions immediately on pan/zoom
     updateCitizenPositions(W, H);
   }, [isReady, appRef, layers, updateCitizenPositions]);
 
   // Interaction hook
   const { 
@@ -186,7 +186,7 @@
     if (containerRef.current) ro.observe(containerRef.current);
 
     return () => {
-      app.ticker.remove(tick);
+      if (app.ticker) app.ticker.remove(tick);
       ro.disconnect();
     };
   }, [isReady, appRef, layers, updateViewportBounds, cameraRef, zoomRef, visibleLayers.trails]);
@@ -194,8 +194,8 @@
   // Reactive data updates
   useEffect(() => {
     if (!appRef.current || !layers.citizens.current) return;
     const W = appRef.current.renderer.width / (window.devicePixelRatio || 1);
     const H = appRef.current.renderer.height / (window.devicePixelRatio || 1);
 
     citizens.forEach(tracked => {
       const c = tracked.current;

src/presentation/map/renderers.ts

@@ -66,7 +66,7 @@ export function drawCitizenGlyph(
   // State indicator dot (stress/hunger)
   if (c.vitality < 35) {
     g.circle(CITIZEN_RADIUS - 2, -(CITIZEN_RADIUS - 2), 3)
-      .fill({ color: 0xef4444 });
+      .fill({ color: 0xd97706 });
   }
 }
 
@@ -136,16 +136,18 @@ export function renderZones(
     const { g, label } = sprite;
     const color = isInterior ? 0x6366f1 : 0x8b5cf6;
     const fillColor = isInterior ? 0x1e1b4b : color;
+    const strokeColor = zone.isEntryRestricted ? 0xd97706 : color;
+    const strokeWidth = zone.isEntryRestricted ? 1.5 : (isInterior ? 1.5 : 1);
 
     g.clear();
     if (isInterior) {
       g.rect(sx - hw, sy - hh, hw * 2, hh * 2)
         .fill({ color: fillColor, alpha: 0.4 })
-        .stroke({ color, width: 1.5, alpha: 0.6, alignment: 1 });
+        .stroke({ color: strokeColor, width: strokeWidth, alpha: 0.6, alignment: 1 });
     } else {
       g.rect(sx - hw, sy - hh, hw * 2, hh * 2)
         .fill({ color, alpha: 0.02 })
-        .stroke({ color, width: 1, alpha: 0.2 });
+        .stroke({ color: strokeColor, width: strokeWidth, alpha: zone.isEntryRestricted ? 0.8 : 0.2 });
     }
 
     label.x = sx - label.width / 2;