@almadar/ui 5.21.12 → 5.22.2

package/dist/avl/index.cjs

@@ -7179,7 +7179,7 @@ var init_SvgGrid = __esm({
       x,
       y,
       cols = 4,
-      rows = 3,
+      rows: rows2 = 3,
       spacing = 20,
       nodeRadius = 3,
       color = "var(--color-primary)",
@@ -7188,7 +7188,7 @@ var init_SvgGrid = __esm({
       highlights = []
     }) => {
       const highlightSet = new Set(highlights);
-      return /* @__PURE__ */ jsxRuntime.jsx("g", { className, opacity, children: Array.from({ length: rows }).map(
+      return /* @__PURE__ */ jsxRuntime.jsx("g", { className, opacity, children: Array.from({ length: rows2 }).map(
         (_, row) => Array.from({ length: cols }).map((_2, col) => {
           const index = row * cols + col;
           const isHighlighted = highlightSet.has(index);
@@ -7848,7 +7848,7 @@ var init_Input = __esm({
         onClear,
         value,
         options,
-        rows = 3,
+        rows: rows2 = 3,
         onChange,
         ...props
       }, ref) => {
@@ -7898,7 +7898,7 @@ var init_Input = __esm({
               ref,
               value,
               onChange,
-              rows,
+              rows: rows2,
               className: baseClassName,
               ...props
             }
@@ -9893,66 +9893,6 @@ var init_RangeSlider = __esm({
     RangeSlider.displayName = "RangeSlider";
   }
 });
-function easeOut(t) {
-  return t * (2 - t);
-}
-var AnimatedCounter;
-var init_AnimatedCounter = __esm({
-  "components/marketing/atoms/AnimatedCounter.tsx"() {
-    "use client";
-    init_cn();
-    init_Typography();
-    AnimatedCounter = ({
-      value: rawValue,
-      duration = 600,
-      prefix,
-      suffix,
-      className
-    }) => {
-      const numericRaw = typeof rawValue === "number" ? rawValue : Number.parseFloat(String(rawValue ?? ""));
-      const value = !Number.isNaN(numericRaw) ? numericRaw : 0;
-      const [displayValue, setDisplayValue] = React97.useState(value);
-      const previousValueRef = React97.useRef(value);
-      const animationFrameRef = React97.useRef(null);
-      React97.useEffect(() => {
-        const from = previousValueRef.current;
-        const to = value;
-        previousValueRef.current = value;
-        if (from === to) {
-          setDisplayValue(to);
-          return;
-        }
-        const startTime = performance.now();
-        const diff = to - from;
-        function animate(currentTime) {
-          const elapsed = currentTime - startTime;
-          const progress = Math.min(elapsed / duration, 1);
-          const easedProgress = easeOut(progress);
-          setDisplayValue(from + diff * easedProgress);
-          if (progress < 1) {
-            animationFrameRef.current = requestAnimationFrame(animate);
-          } else {
-            setDisplayValue(to);
-          }
-        }
-        animationFrameRef.current = requestAnimationFrame(animate);
-        return () => {
-          if (animationFrameRef.current !== null) {
-            cancelAnimationFrame(animationFrameRef.current);
-          }
-        };
-      }, [value, duration]);
-      const decimalPlaces = Number.isInteger(value) ? 0 : String(value).split(".")[1]?.length ?? 0;
-      const formattedValue = displayValue.toFixed(decimalPlaces);
-      return /* @__PURE__ */ jsxRuntime.jsxs(Typography, { variant: "h3", className: cn("tabular-nums", className), children: [
-        prefix,
-        formattedValue,
-        suffix
-      ] });
-    };
-    AnimatedCounter.displayName = "AnimatedCounter";
-  }
-});
 function useInfiniteScroll(onLoadMore, options = {}) {
   const { rootMargin = "200px", hasMore = true, isLoading = false } = options;
   const observerRef = React97.useRef(null);
@@ -12436,15 +12376,15 @@ function HeaderSkeleton({ className }) {
     ] })
   ] });
 }
-function TableSkeleton({ rows = 5, columns = 4, className }) {
+function TableSkeleton({ rows: rows2 = 5, columns = 4, className }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "none", className: cn("border border-border rounded-lg overflow-hidden", className), children: [
     /* @__PURE__ */ jsxRuntime.jsx(HStack, { className: "px-4 py-3 bg-muted/30 border-b border-border", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(SkeletonBlock, { className: "h-4 flex-1 mx-2" }, i)) }),
-    Array.from({ length: rows }).map((_, rowIdx) => /* @__PURE__ */ jsxRuntime.jsx(
+    Array.from({ length: rows2 }).map((_, rowIdx) => /* @__PURE__ */ jsxRuntime.jsx(
       HStack,
       {
         className: cn(
           "px-4 py-3",
-          rowIdx < rows - 1 && "border-b border-border"
+          rowIdx < rows2 - 1 && "border-b border-border"
         ),
         children: Array.from({ length: columns }).map((_2, colIdx) => /* @__PURE__ */ jsxRuntime.jsx(SkeletonLine, { className: "flex-1 mx-2" }, colIdx))
       },
@@ -12492,18 +12432,18 @@ function CardSkeleton({ className }) {
     }
   );
 }
-function TextSkeleton({ rows = 3, className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(VStack, { gap: "sm", className, children: Array.from({ length: rows }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
+function TextSkeleton({ rows: rows2 = 3, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(VStack, { gap: "sm", className, children: Array.from({ length: rows2 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(
     SkeletonLine,
     {
-      className: i === rows - 1 ? "w-2/3" : "w-full"
+      className: i === rows2 - 1 ? "w-2/3" : "w-full"
     },
     i
   )) });
 }
 function Skeleton({
   variant = "text",
-  rows,
+  rows: rows2,
   columns,
   fields,
   className
@@ -12513,15 +12453,15 @@ function Skeleton({
     case "header":
       return /* @__PURE__ */ jsxRuntime.jsx(HeaderSkeleton, { className });
     case "table":
-      return /* @__PURE__ */ jsxRuntime.jsx(TableSkeleton, { rows, columns, className });
+      return /* @__PURE__ */ jsxRuntime.jsx(TableSkeleton, { rows: rows2, columns, className });
     case "form":
       return /* @__PURE__ */ jsxRuntime.jsx(FormSkeleton, { fields, className });
     case "card":
       return /* @__PURE__ */ jsxRuntime.jsx(CardSkeleton, { className });
     case "text":
-      return /* @__PURE__ */ jsxRuntime.jsx(TextSkeleton, { rows, className });
+      return /* @__PURE__ */ jsxRuntime.jsx(TextSkeleton, { rows: rows2, className });
     default:
-      return /* @__PURE__ */ jsxRuntime.jsx(TextSkeleton, { rows, className });
+      return /* @__PURE__ */ jsxRuntime.jsx(TextSkeleton, { rows: rows2, className });
   }
 }
 var pulseClass;
@@ -14149,7 +14089,7 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect79, useRef: useRef71, useCallback: useCallback122, useState: useState113 } = React97__namespace.default;
+      const { useEffect: useEffect79, useRef: useRef71, useCallback: useCallback123, useState: useState113 } = React97__namespace.default;
       const { Typography: Typography2 } = await Promise.resolve().then(() => (init_Typography(), Typography_exports));
       const { useEventBus: useEventBus3 } = await Promise.resolve().then(() => (init_useEventBus(), useEventBus_exports));
       function MapUpdater({ centerLat, centerLng, zoom }) {
@@ -14195,7 +14135,7 @@ var init_MapView = __esm({
       }) {
         const eventBus = useEventBus3();
         const [clickedPosition, setClickedPosition] = useState113(null);
-        const handleMapClick = useCallback122((lat, lng) => {
+        const handleMapClick = useCallback123((lat, lng) => {
           if (showClickedPin) {
             setClickedPosition({ lat, lng });
           }
@@ -14204,7 +14144,7 @@ var init_MapView = __esm({
             eventBus.emit(`UI:${mapClickEvent}`, { latitude: lat, longitude: lng });
           }
         }, [onMapClick, mapClickEvent, eventBus, showClickedPin]);
-        const handleMarkerClick = useCallback122((marker) => {
+        const handleMarkerClick = useCallback123((marker) => {
           onMarkerClick?.(marker);
           if (markerClickEvent) {
             eventBus.emit(`UI:${markerClickEvent}`, { ...marker });
@@ -14425,7 +14365,7 @@ function InputPattern({
 function TextareaPattern({
   value = "",
   placeholder,
-  rows = 4,
+  rows: rows2 = 4,
   disabled = false,
   fieldError,
   onChange,
@@ -14445,7 +14385,7 @@ function TextareaPattern({
     {
       value: localValue,
       placeholder,
-      rows,
+      rows: rows2,
       disabled,
       error: fieldError,
       onChange: handleChange,
@@ -14930,6 +14870,91 @@ var init_ActionPalette = __esm({
     ActionPalette.displayName = "ActionPalette";
   }
 });
+function parseValue(value) {
+  if (value === "" || value == null) return { num: 0, prefix: "", suffix: "", decimals: 0 };
+  const match = String(value).match(/^([^0-9]*)([0-9]+(?:\.[0-9]+)?)(.*)$/);
+  if (!match) {
+    return { num: 0, prefix: "", suffix: String(value), decimals: 0 };
+  }
+  const numStr = match[2];
+  const decimalIdx = numStr.indexOf(".");
+  const decimals = decimalIdx >= 0 ? numStr.length - decimalIdx - 1 : 0;
+  return {
+    prefix: match[1],
+    num: parseFloat(numStr),
+    suffix: match[3],
+    decimals
+  };
+}
+var AnimatedCounter;
+var init_AnimatedCounter = __esm({
+  "components/core/molecules/AnimatedCounter.tsx"() {
+    "use client";
+    init_cn();
+    init_Box();
+    init_Typography();
+    AnimatedCounter = ({
+      value,
+      label,
+      duration = 1500,
+      className
+    }) => {
+      const ref = React97.useRef(null);
+      const [displayValue, setDisplayValue] = React97.useState("0");
+      const [hasAnimated, setHasAnimated] = React97.useState(false);
+      const animate = React97.useCallback(() => {
+        const { num: num2, prefix, suffix, decimals } = parseValue(value);
+        if (num2 === 0) {
+          setDisplayValue(String(value));
+          return;
+        }
+        const startTime = performance.now();
+        const tick = (now2) => {
+          const elapsed = now2 - startTime;
+          const progress = Math.min(elapsed / duration, 1);
+          const eased = 1 - Math.pow(1 - progress, 3);
+          const current = eased * num2;
+          setDisplayValue(`${prefix}${current.toFixed(decimals)}${suffix}`);
+          if (progress < 1) {
+            requestAnimationFrame(tick);
+          } else {
+            setDisplayValue(String(value));
+          }
+        };
+        requestAnimationFrame(tick);
+      }, [value, duration]);
+      React97.useEffect(() => {
+        if (hasAnimated) return;
+        const el = ref.current;
+        if (!el) return;
+        const observer2 = new IntersectionObserver(
+          (entries) => {
+            if (entries[0].isIntersecting) {
+              setHasAnimated(true);
+              animate();
+              observer2.disconnect();
+            }
+          },
+          { threshold: 0.3 }
+        );
+        observer2.observe(el);
+        return () => observer2.disconnect();
+      }, [hasAnimated, animate]);
+      return /* @__PURE__ */ jsxRuntime.jsxs(Box, { ref, className: cn("flex flex-col items-center gap-1 p-4", className), children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Typography,
+          {
+            variant: "h2",
+            className: "text-primary font-bold tabular-nums",
+            children: hasAnimated ? displayValue : "0"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", color: "muted", className: "text-center", children: label })
+      ] });
+    };
+    AnimatedCounter.displayName = "AnimatedCounter";
+  }
+});
 var AuthLayout;
 var init_AuthLayout = __esm({
   "components/core/templates/AuthLayout.tsx"() {
@@ -16315,6 +16340,39 @@ var init_IsometricCanvas2 = __esm({
     init_IsometricCanvas();
   }
 });
+
+// components/game/organisms/boardEntity.ts
+function boardEntity(entity) {
+  if (!entity) return void 0;
+  return Array.isArray(entity) ? entity[0] : entity;
+}
+function str(v) {
+  return v == null ? "" : String(v);
+}
+function num(v, fallback = 0) {
+  const n = Number(v);
+  return Number.isFinite(n) ? n : fallback;
+}
+function rows(v) {
+  return Array.isArray(v) ? v : [];
+}
+function vec2(v) {
+  const o = v ?? {};
+  return { x: num(o.x), y: num(o.y) };
+}
+function unitPosition(u) {
+  return vec2(u.position);
+}
+function unitTeam(u) {
+  return str(u.team);
+}
+function unitHealth(u) {
+  return num(u.health);
+}
+var init_boardEntity = __esm({
+  "components/game/organisms/boardEntity.ts"() {
+  }
+});
 function BattleBoard({
   entity,
   scale = 0.45,
@@ -16341,43 +16399,49 @@ function BattleBoard({
   attackEvent,
   className
 }) {
-  const tiles = entity.tiles;
-  const features = entity.features ?? [];
-  const boardWidth = entity.boardWidth ?? 8;
-  const boardHeight = entity.boardHeight ?? 6;
-  const assetManifest = entity.assetManifest;
-  const backgroundImage = entity.backgroundImage;
-  const units = entity.units;
-  const selectedUnitId = entity.selectedUnitId;
-  const currentPhase = entity.phase;
-  const currentTurn = entity.turn;
-  const gameResult = entity.gameResult;
+  const board = boardEntity(entity) ?? {};
+  const tiles = Array.isArray(board.tiles) ? board.tiles : [];
+  const features = Array.isArray(board.features) ? board.features : [];
+  const boardWidth = num(board.boardWidth, 8);
+  const boardHeight = num(board.boardHeight, 6);
+  const assetManifest = board.assetManifest;
+  const backgroundImage = board.backgroundImage;
+  const units = rows(board.units);
+  const selectedUnitId = board.selectedUnitId ?? null;
+  const currentPhase = str(board.phase) || "observation";
+  const currentTurn = num(board.turn, 1);
+  const gameResult = board.gameResult ?? null;
   const eventBus = useEventBus();
   const { t } = hooks.useTranslate();
   const [hoveredTile, setHoveredTile] = React97.useState(null);
   const [isShaking, setIsShaking] = React97.useState(false);
   const selectedUnit = React97.useMemo(
-    () => units.find((u) => u.id === selectedUnitId) ?? null,
+    () => units.find((u) => str(u.id) === selectedUnitId) ?? null,
     [units, selectedUnitId]
   );
   const hoveredUnit = React97.useMemo(() => {
     if (!hoveredTile) return null;
-    return units.find(
-      (u) => u.position.x === hoveredTile.x && u.position.y === hoveredTile.y && u.health > 0
-    ) ?? null;
+    return units.find((u) => {
+      const p2 = unitPosition(u);
+      return p2.x === hoveredTile.x && p2.y === hoveredTile.y && unitHealth(u) > 0;
+    }) ?? null;
   }, [hoveredTile, units]);
-  const playerUnits = React97.useMemo(() => units.filter((u) => u.team === "player" && u.health > 0), [units]);
-  const enemyUnits = React97.useMemo(() => units.filter((u) => u.team === "enemy" && u.health > 0), [units]);
+  const playerUnits = React97.useMemo(() => units.filter((u) => unitTeam(u) === "player" && unitHealth(u) > 0), [units]);
+  const enemyUnits = React97.useMemo(() => units.filter((u) => unitTeam(u) === "enemy" && unitHealth(u) > 0), [units]);
   const validMoves = React97.useMemo(() => {
     if (!selectedUnit || currentPhase !== "movement") return [];
     const moves = [];
-    const range = selectedUnit.movement;
+    const range = num(selectedUnit.movement);
+    const origin = unitPosition(selectedUnit);
     for (let dy = -range; dy <= range; dy++) {
       for (let dx = -range; dx <= range; dx++) {
-        const nx = selectedUnit.position.x + dx;
-        const ny = selectedUnit.position.y + dy;
+        const nx = origin.x + dx;
+        const ny = origin.y + dy;
         const dist = Math.abs(dx) + Math.abs(dy);
-        if (dist > 0 && dist <= range && nx >= 0 && nx < boardWidth && ny >= 0 && ny < boardHeight && !units.some((u) => u.position.x === nx && u.position.y === ny && u.health > 0)) {
+        if (dist > 0 && dist <= range && nx >= 0 && nx < boardWidth && ny >= 0 && ny < boardHeight && !units.some((u) => {
+          const p2 = unitPosition(u);
+          return p2.x === nx && p2.y === ny && unitHealth(u) > 0;
+        })) {
           moves.push({ x: nx, y: ny });
         }
       }
@@ -16386,11 +16450,14 @@ function BattleBoard({
   }, [selectedUnit, currentPhase, units, boardWidth, boardHeight]);
   const attackTargets = React97.useMemo(() => {
     if (!selectedUnit || currentPhase !== "action") return [];
-    return units.filter((u) => u.team !== selectedUnit.team && u.health > 0).filter((u) => {
-      const dx = Math.abs(u.position.x - selectedUnit.position.x);
-      const dy = Math.abs(u.position.y - selectedUnit.position.y);
+    const sp = unitPosition(selectedUnit);
+    const sTeam = unitTeam(selectedUnit);
+    return units.filter((u) => unitTeam(u) !== sTeam && unitHealth(u) > 0).filter((u) => {
+      const p2 = unitPosition(u);
+      const dx = Math.abs(p2.x - sp.x);
+      const dy = Math.abs(p2.y - sp.y);
       return dx <= 1 && dy <= 1 && dx + dy > 0;
-    }).map((u) => u.position);
+    }).map((u) => unitPosition(u));
   }, [selectedUnit, currentPhase, units]);
   const MOVE_SPEED_MS_PER_TILE = 300;
   const movementAnimRef = React97.useRef(null);
@@ -16430,23 +16497,25 @@ function BattleBoard({
     return () => clearInterval(interval);
   }, []);
   const isoUnits = React97.useMemo(() => {
-    return units.filter((u) => u.health > 0).map((unit) => {
-      const pos = movingPositions.get(unit.id) ?? unit.position;
+    return units.filter((u) => unitHealth(u) > 0).map((unit) => {
+      const id = str(unit.id);
+      const pos = movingPositions.get(id) ?? unitPosition(unit);
+      const unitTraits = Array.isArray(unit.traits) ? unit.traits : void 0;
       return {
-        id: unit.id,
+        id,
         position: pos,
-        name: unit.name,
-        team: unit.team,
-        health: unit.health,
-        maxHealth: unit.maxHealth,
-        unitType: unit.unitType,
-        heroId: unit.heroId,
-        sprite: unit.sprite,
-        traits: unit.traits?.map((t2) => ({
-          name: t2.name,
-          currentState: t2.currentState,
-          states: t2.states,
-          cooldown: t2.cooldown ?? 0
+        name: str(unit.name),
+        team: unitTeam(unit),
+        health: unitHealth(unit),
+        maxHealth: num(unit.maxHealth),
+        unitType: unit.unitType == null ? void 0 : str(unit.unitType),
+        heroId: unit.heroId == null ? void 0 : str(unit.heroId),
+        sprite: unit.sprite == null ? void 0 : str(unit.sprite),
+        traits: unitTraits?.map((tr) => ({
+          name: tr.name,
+          currentState: tr.currentState,
+          states: tr.states,
+          cooldown: tr.cooldown ?? 0
         }))
       };
     });
@@ -16458,8 +16527,8 @@ function BattleBoard({
     [scale, baseOffsetX]
   );
   const checkGameEnd = React97.useCallback(() => {
-    const pa = units.filter((u) => u.team === "player" && u.health > 0);
-    const ea = units.filter((u) => u.team === "enemy" && u.health > 0);
+    const pa = units.filter((u) => unitTeam(u) === "player" && unitHealth(u) > 0);
+    const ea = units.filter((u) => unitTeam(u) === "enemy" && unitHealth(u) > 0);
     if (pa.length === 0) {
       onGameEnd?.("defeat");
       if (gameEndEvent) {
@@ -16473,21 +16542,22 @@ function BattleBoard({
     }
   }, [units, onGameEnd, gameEndEvent, eventBus]);
   const handleUnitClick = React97.useCallback((unitId) => {
-    const unit = units.find((u) => u.id === unitId);
+    const unit = units.find((u) => str(u.id) === unitId);
     if (!unit) return;
     if (unitClickEvent) {
       eventBus.emit(`UI:${unitClickEvent}`, { unitId });
     }
     if (currentPhase === "action" && selectedUnit) {
-      if (unit.team === "enemy" && attackTargets.some((t2) => t2.x === unit.position.x && t2.y === unit.position.y)) {
-        const damage = calculateDamage ? calculateDamage(selectedUnit, unit) : Math.max(1, selectedUnit.attack - unit.defense);
+      const up = unitPosition(unit);
+      if (unitTeam(unit) === "enemy" && attackTargets.some((t2) => t2.x === up.x && t2.y === up.y)) {
+        const damage = calculateDamage ? calculateDamage(selectedUnit, unit) : Math.max(1, num(selectedUnit.attack) - num(unit.defense));
         setIsShaking(true);
         setTimeout(() => setIsShaking(false), 300);
         onAttack?.(selectedUnit, unit, damage);
         if (attackEvent) {
           eventBus.emit(`UI:${attackEvent}`, {
-            attackerId: selectedUnit.id,
-            targetId: unit.id,
+            attackerId: str(selectedUnit.id),
+            targetId: str(unit.id),
             damage
           });
         }
@@ -16502,9 +16572,9 @@ function BattleBoard({
     if (currentPhase === "movement" && selectedUnit) {
       if (movementAnimRef.current) return;
       if (validMoves.some((m) => m.x === x && m.y === y)) {
-        const from = { ...selectedUnit.position };
+        const from = { ...unitPosition(selectedUnit) };
         const to = { x, y };
-        startMoveAnimation(selectedUnit.id, from, to, () => {
+        startMoveAnimation(str(selectedUnit.id), from, to, () => {
           onUnitMove?.(selectedUnit, to);
         });
       }
@@ -16662,6 +16732,7 @@ var init_BattleBoard = __esm({
     init_Typography();
     init_Stack();
     init_IsometricCanvas2();
+    init_boardEntity();
     init_isometric();
     BattleBoard.displayName = "BattleBoard";
   }
@@ -17055,24 +17126,24 @@ var init_CodeBlock = __esm({
             return;
           }
           lineEls.forEach((el) => {
-            const num = parseInt(el.getAttribute("data-line") ?? "-1", 10);
-            if (hiddenLines.has(num)) {
+            const num2 = parseInt(el.getAttribute("data-line") ?? "-1", 10);
+            if (hiddenLines.has(num2)) {
               el.style.display = "none";
               return;
             }
             el.style.display = "";
             el.style.position = "relative";
             el.style.paddingLeft = "1.2em";
-            const region = foldStartMap.get(num);
+            const region = foldStartMap.get(num2);
             if (!region) return;
-            const isCollapsed = collapsed.has(num);
+            const isCollapsed = collapsed.has(num2);
             const toggle = document.createElement("span");
             toggle.className = "fold-toggle";
             toggle.textContent = isCollapsed ? "\u25B6" : "\u25BC";
             toggle.style.cssText = "position:absolute;left:0;top:0;width:1.2em;text-align:center;cursor:pointer;color:#858585;font-size:10px;user-select:none;line-height:inherit;height:100%";
             toggle.addEventListener("click", (e) => {
               e.stopPropagation();
-              toggleFoldRef.current(num);
+              toggleFoldRef.current(num2);
             });
             el.insertBefore(toggle, el.firstChild);
             if (isCollapsed) {
@@ -19325,10 +19396,13 @@ var init_BookChapterView = __esm({
     init_cn();
     BookChapterView = ({
       chapter,
+      orbitalSchema,
       direction,
       className
     }) => {
       const { t: _t } = hooks.useTranslate();
+      const title = String(chapter.title ?? "");
+      const content = String(chapter.content ?? "");
       return /* @__PURE__ */ jsxRuntime.jsxs(
         VStack,
         {
@@ -19336,16 +19410,16 @@ var init_BookChapterView = __esm({
           className: cn("px-6 py-8 max-w-4xl mx-auto w-full", className),
           style: { direction },
           children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h1", className: "text-3xl font-bold", children: chapter.title }),
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h1", className: "text-3xl font-bold", children: title }),
             /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
-            !!chapter.orbitalSchema && /* @__PURE__ */ jsxRuntime.jsx(ScaledDiagram, { children: /* @__PURE__ */ jsxRuntime.jsx(
+            !!orbitalSchema && /* @__PURE__ */ jsxRuntime.jsx(ScaledDiagram, { children: /* @__PURE__ */ jsxRuntime.jsx(
               JazariStateMachine,
               {
-                schema: chapter.orbitalSchema,
+                schema: orbitalSchema,
                 direction
               }
             ) }),
-            /* @__PURE__ */ jsxRuntime.jsx(ContentRenderer, { content: chapter.content, direction })
+            /* @__PURE__ */ jsxRuntime.jsx(ContentRenderer, { content, direction })
           ]
         }
       );
@@ -19443,7 +19517,7 @@ var init_BookNavBar = __esm({
     BookNavBar = ({
       currentPage,
       totalPages,
-      chapterTitle,
+      chapterTitle: chapterTitle2,
       direction,
       className
     }) => {
@@ -19484,12 +19558,12 @@ var init_BookNavBar = __esm({
               )
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex-1 mx-4 max-w-md", children: [
-              chapterTitle && /* @__PURE__ */ jsxRuntime.jsx(
+              chapterTitle2 && /* @__PURE__ */ jsxRuntime.jsx(
                 Typography,
                 {
                   variant: "caption",
                   className: "text-center block truncate text-muted-foreground",
-                  children: chapterTitle
+                  children: chapterTitle2
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(ProgressBar, { value: progress, size: "sm", variant: "primary" })
@@ -19556,31 +19630,35 @@ var init_BookTableOfContents = __esm({
           style: { direction },
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h1", className: "text-3xl font-bold text-center mb-4", children: t("book.tableOfContents") }),
-            parts.map((part, partIdx) => /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", align: "center", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "default", size: "sm", children: t("book.partNumber", { number: String(partIdx + 1) }) }),
-                /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h3", className: "font-semibold", children: part.title })
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx(VStack, { gap: "xs", className: direction === "rtl" ? "pr-6" : "pl-6", children: part.chapters.map((chapter) => {
-                const isCurrent = chapter.id === currentChapterId;
-                return /* @__PURE__ */ jsxRuntime.jsx(
-                  Button,
-                  {
-                    variant: "ghost",
-                    size: "sm",
-                    action: "BOOK_NAVIGATE",
-                    actionPayload: { chapterId: chapter.id },
-                    className: cn(
-                      "justify-start text-left w-full",
-                      direction === "rtl" && "text-right",
-                      isCurrent && "bg-blue-50 dark:bg-blue-950 text-blue-600 dark:text-blue-400"
-                    ),
-                    children: /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "truncate", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: chapter.title }) })
-                  },
-                  chapter.id
-                );
-              }) })
-            ] }, partIdx))
+            parts.map((part, partIdx) => {
+              const chapters = Array.isArray(part.chapters) ? part.chapters : [];
+              return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", align: "center", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "default", size: "sm", children: t("book.partNumber", { number: String(partIdx + 1) }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h3", className: "font-semibold", children: String(part.title ?? "") })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx(VStack, { gap: "xs", className: direction === "rtl" ? "pr-6" : "pl-6", children: chapters.map((chapter) => {
+                  const id = chapter.id == null ? "" : String(chapter.id);
+                  const isCurrent = id === currentChapterId;
+                  return /* @__PURE__ */ jsxRuntime.jsx(
+                    Button,
+                    {
+                      variant: "ghost",
+                      size: "sm",
+                      action: "BOOK_NAVIGATE",
+                      actionPayload: { chapterId: id },
+                      className: cn(
+                        "justify-start text-left w-full",
+                        direction === "rtl" && "text-right",
+                        isCurrent && "bg-blue-50 dark:bg-blue-950 text-blue-600 dark:text-blue-400"
+                      ),
+                      children: /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "truncate", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: String(chapter.title ?? "") }) })
+                    },
+                    id
+                  );
+                }) })
+              ] }, partIdx);
+            })
           ]
         }
       );
@@ -19702,27 +19780,41 @@ function resolveFieldMap(fieldMap) {
 function get(obj, key) {
   return obj[key];
 }
+function asStr(v) {
+  return v == null ? "" : String(v);
+}
 function mapBookData(raw, fields = IDENTITY_BOOK_FIELDS) {
   const rawParts = get(raw, fields.parts) ?? [];
-  return {
-    title: get(raw, fields.title) ?? "",
-    subtitle: get(raw, fields.subtitle),
-    author: get(raw, fields.author),
-    coverImageUrl: get(raw, fields.coverImageUrl),
-    direction: get(raw, fields.direction) ?? void 0,
-    parts: rawParts.map((part) => {
-      const rawChapters = get(part, fields.chapters) ?? [];
-      return {
-        title: get(part, fields.partTitle) ?? "",
-        chapters: rawChapters.map((ch) => ({
-          id: get(ch, fields.chapterId) ?? "",
-          title: get(ch, fields.chapterTitle) ?? "",
-          content: get(ch, fields.chapterContent) ?? "",
-          orbitalSchema: get(ch, fields.chapterOrbitalSchema)
-        }))
-      };
-    })
+  const direction = get(raw, fields.direction) ?? "ltr";
+  const cover = {
+    title: asStr(get(raw, fields.title)),
+    subtitle: asStr(get(raw, fields.subtitle)),
+    author: asStr(get(raw, fields.author)),
+    coverImageUrl: asStr(get(raw, fields.coverImageUrl)),
+    direction
   };
+  const schemaByChapterId = {};
+  const chapters = [];
+  const parts = rawParts.map((part) => {
+    const rawChapters = get(part, fields.chapters) ?? [];
+    const chapterRows = rawChapters.map((ch) => {
+      const id = asStr(get(ch, fields.chapterId));
+      const schema = get(ch, fields.chapterOrbitalSchema);
+      if (schema) schemaByChapterId[id] = schema;
+      const row = {
+        id,
+        title: asStr(get(ch, fields.chapterTitle)),
+        content: asStr(get(ch, fields.chapterContent))
+      };
+      chapters.push(row);
+      return row;
+    });
+    return {
+      title: asStr(get(part, fields.partTitle)),
+      chapters: chapterRows
+    };
+  });
+  return { cover, direction, parts, chapters, schemaByChapterId };
 }
 var IDENTITY_BOOK_FIELDS, AR_BOOK_FIELDS, FIELD_MAP_REGISTRY;
 var init_types2 = __esm({
@@ -19760,10 +19852,7 @@ var init_types2 = __esm({
     };
   }
 });
-function flattenChapters(book) {
-  return book.parts.flatMap((part) => part.chapters);
-}
-var PRINT_STYLES, BookViewer;
+var chapterId, chapterTitle, PRINT_STYLES, BookViewer;
 var init_BookViewer = __esm({
   "components/marketing/organisms/book/BookViewer.tsx"() {
     init_Box();
@@ -19776,6 +19865,8 @@ var init_BookViewer = __esm({
     init_BookNavBar();
     init_EmptyState();
     init_types2();
+    chapterId = (ch) => ch?.id == null ? void 0 : String(ch.id);
+    chapterTitle = (ch) => ch?.title == null ? void 0 : String(ch.title);
     PRINT_STYLES = `
 @media print {
   .book-viewer-page {
@@ -19804,14 +19895,14 @@ var init_BookViewer = __esm({
         return mapBookData(raw, resolvedFieldMap);
       }, [entity, resolvedFieldMap]);
       const direction = book?.direction ?? "ltr";
-      const chapters = React97.useMemo(() => book ? flattenChapters(book) : [], [book]);
+      const chapters = React97.useMemo(() => book ? book.chapters : [], [book]);
       const totalPages = 2 + chapters.length;
       const navigateTo = React97.useCallback(
         (page) => {
           const clamped = Math.max(0, Math.min(page, totalPages - 1));
           setCurrentPage(clamped);
-          const chapterId = clamped >= 2 ? chapters[clamped - 2]?.id : void 0;
-          eventBus.emit("UI:BOOK_PAGE_CHANGE", { pageIndex: clamped, chapterId });
+          const id = clamped >= 2 ? chapterId(chapters[clamped - 2]) : void 0;
+          eventBus.emit("UI:BOOK_PAGE_CHANGE", { pageIndex: clamped, chapterId: id });
         },
         [totalPages, chapters, eventBus]
       );
@@ -19823,8 +19914,8 @@ var init_BookViewer = __esm({
           eventBus.on("UI:BOOK_PAGE_NEXT", () => navigateTo(currentPage + 1)),
           eventBus.on("UI:BOOK_PRINT", () => window.print()),
           eventBus.on("UI:BOOK_NAVIGATE", (event) => {
-            const chapterId = event.payload?.chapterId;
-            const idx = chapters.findIndex((ch) => ch.id === chapterId);
+            const targetId = event.payload?.chapterId;
+            const idx = chapters.findIndex((ch) => chapterId(ch) === targetId);
             if (idx >= 0) navigateTo(idx + 2);
           })
         ];
@@ -19841,9 +19932,11 @@ var init_BookViewer = __esm({
           style.remove();
         };
       }, []);
-      const currentChapterId = currentPage >= 2 ? chapters[currentPage - 2]?.id : void 0;
-      const currentChapterTitle = currentPage >= 2 ? chapters[currentPage - 2]?.title : void 0;
+      const currentChapterId = currentPage >= 2 ? chapterId(chapters[currentPage - 2]) : void 0;
+      const currentChapterTitle = currentPage >= 2 ? chapterTitle(chapters[currentPage - 2]) : void 0;
       if (!book) return /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { message: t("book.noData") });
+      const cover = book.cover;
+      const coverTitle = String(cover.title ?? "");
       return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { className: cn("relative h-full overflow-hidden bg-background", className), children: [
         /* @__PURE__ */ jsxRuntime.jsxs(
           Box,
@@ -19855,10 +19948,10 @@ var init_BookViewer = __esm({
                 /* @__PURE__ */ jsxRuntime.jsx(
                   BookCoverPage,
                   {
-                    title: book.title,
-                    subtitle: book.subtitle,
-                    author: book.author,
-                    coverImageUrl: book.coverImageUrl,
+                    title: coverTitle,
+                    subtitle: String(cover.subtitle ?? "") || void 0,
+                    author: String(cover.author ?? "") || void 0,
+                    coverImageUrl: String(cover.coverImageUrl ?? "") || void 0,
                     direction
                   }
                 ),
@@ -19869,23 +19962,27 @@ var init_BookViewer = __esm({
                     direction
                   }
                 ),
-                chapters.map((chapter) => /* @__PURE__ */ jsxRuntime.jsx(
-                  BookChapterView,
-                  {
-                    chapter,
-                    direction
-                  },
-                  chapter.id
-                ))
+                chapters.map((chapter) => {
+                  const id = chapterId(chapter);
+                  return /* @__PURE__ */ jsxRuntime.jsx(
+                    BookChapterView,
+                    {
+                      chapter,
+                      orbitalSchema: id ? book.schemaByChapterId[id] : void 0,
+                      direction
+                    },
+                    id
+                  );
+                })
               ] }),
               /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "print:hidden", children: [
                 currentPage === 0 && /* @__PURE__ */ jsxRuntime.jsx(
                   BookCoverPage,
                   {
-                    title: book.title,
-                    subtitle: book.subtitle,
-                    author: book.author,
-                    coverImageUrl: book.coverImageUrl,
+                    title: coverTitle,
+                    subtitle: String(cover.subtitle ?? "") || void 0,
+                    author: String(cover.author ?? "") || void 0,
+                    coverImageUrl: String(cover.coverImageUrl ?? "") || void 0,
                     direction
                   }
                 ),
@@ -19901,6 +19998,7 @@ var init_BookViewer = __esm({
                   BookChapterView,
                   {
                     chapter: chapters[currentPage - 2],
+                    orbitalSchema: currentChapterId ? book.schemaByChapterId[currentChapterId] : void 0,
                     direction
                   }
                 )
@@ -19913,7 +20011,7 @@ var init_BookViewer = __esm({
           {
             currentPage,
             totalPages,
-            chapterTitle: currentPage === 0 ? book.title : currentPage === 1 ? t("book.tableOfContents") : currentChapterTitle,
+            chapterTitle: currentPage === 0 ? coverTitle : currentPage === 1 ? t("book.tableOfContents") : currentChapterTitle,
             direction
           }
         )
@@ -20011,7 +20109,7 @@ var init_Grid = __esm({
     };
     Grid = ({
       cols = 1,
-      rows,
+      rows: rows2,
       gap = "md",
       rowGap,
       colGap,
@@ -20023,7 +20121,7 @@ var init_Grid = __esm({
       children,
       as: Component = "div"
     }) => {
-      const mergedStyle = rows ? { gridTemplateRows: `repeat(${rows}, minmax(0, 1fr))`, ...style } : style;
+      const mergedStyle = rows2 ? { gridTemplateRows: `repeat(${rows2}, minmax(0, 1fr))`, ...style } : style;
       return React97__namespace.default.createElement(
         Component,
         {
@@ -20739,14 +20837,14 @@ function BuilderBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
+  const resolved = boardEntity(entity);
   const [placements, setPlacements] = React97.useState({});
   const [headerError, setHeaderError] = React97.useState(false);
   const [submitted, setSubmitted] = React97.useState(false);
   const [attempts, setAttempts] = React97.useState(0);
   const [showHint, setShowHint] = React97.useState(false);
-  const components = resolved?.components ?? [];
-  const slots = resolved?.slots ?? [];
+  const components = Array.isArray(resolved?.components) ? resolved.components : [];
+  const slots = Array.isArray(resolved?.slots) ? resolved.slots : [];
   const usedComponentIds = new Set(Object.values(placements));
   const availableComponents = components.filter((c) => !usedComponentIds.has(c.id));
   const [selectedComponent, setSelectedComponent] = React97.useState(null);
@@ -20780,7 +20878,7 @@ function BuilderBoard({
   }, [slots, placements, attempts, completeEvent, emit]);
   const handleReset = () => {
     setSubmitted(false);
-    if (attempts >= 2 && resolved?.hint) {
+    if (attempts >= 2 && str(resolved?.hint)) {
       setShowHint(true);
     }
   };
@@ -20793,20 +20891,24 @@ function BuilderBoard({
   };
   const getComponentById = (id) => components.find((c) => c.id === id);
   if (!resolved) return null;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
+  const hint = str(resolved.hint);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Box,
     {
       className,
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: "p-4", children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: resolved.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.description })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: str(resolved.title) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: str(resolved.description) })
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: t("builder.components") }),
@@ -20866,9 +20968,9 @@ function BuilderBoard({
         ] }) }),
         submitted && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", align: "center", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: allCorrect ? LucideIcons2.CheckCircle : LucideIcons2.XCircle, size: "lg", className: allCorrect ? "text-success" : "text-error" }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: allCorrect ? resolved.successMessage ?? t("builder.success") : resolved.failMessage ?? t("builder.incorrect") })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: allCorrect ? str(resolved.successMessage) || t("builder.success") : str(resolved.failMessage) || t("builder.incorrect") })
         ] }) }),
-        showHint && resolved.hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.hint }) }),
+        showHint && hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: hint }) }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", justify: "center", children: [
           !submitted ? /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "primary", onClick: handleSubmit, disabled: !allPlaced, children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: LucideIcons2.Wrench, size: "sm" }),
@@ -20887,6 +20989,7 @@ var init_BuilderBoard = __esm({
   "components/game/organisms/puzzles/builder/BuilderBoard.tsx"() {
     init_atoms2();
     init_useEventBus();
+    init_boardEntity();
     BuilderBoard.displayName = "BuilderBoard";
   }
 });
@@ -21224,21 +21327,24 @@ function CalendarGrid({
       eventBus.emit(`UI:${longPressEvent}`, { date: day.toISOString(), time, ...longPressPayload });
     }, 500);
   }, [longPressEvent, longPressPayload, eventBus]);
-  const renderEvent = (event) => /* @__PURE__ */ jsxRuntime.jsx(
-    Box,
-    {
-      rounded: "md",
-      padding: "xs",
-      border: true,
-      className: cn(
-        "cursor-pointer hover:shadow-sm transition-shadow text-xs truncate",
-        event.color ? event.color : "bg-blue-500/15 border-blue-500/30 text-blue-600"
-      ),
-      onClick: (e) => handleEventClick(event, e),
-      children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", className: "truncate font-medium", children: event.title })
-    },
-    event.id
-  );
+  const renderEvent = (event) => {
+    const color = event.color;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Box,
+      {
+        rounded: "md",
+        padding: "xs",
+        border: true,
+        className: cn(
+          "cursor-pointer hover:shadow-sm transition-shadow text-xs truncate",
+          color ? color : "bg-blue-500/15 border-blue-500/30 text-blue-600"
+        ),
+        onClick: (e) => handleEventClick(event, e),
+        children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", className: "truncate font-medium", children: event.title })
+      },
+      event.id
+    );
+  };
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Box,
     {
@@ -22902,7 +23008,6 @@ var init_CardGrid = __esm({
       alignItems = "stretch",
       className,
       children,
-      // EntityDisplayProps
       entity,
       isLoading = false,
       error = null,
@@ -23374,14 +23479,14 @@ var init_CaseStudyOrganism = __esm({
         /* @__PURE__ */ jsxRuntime.jsx(SimpleGrid, { cols: cols > 0 ? cols : 1, gap: "lg", children: items.map((study) => /* @__PURE__ */ jsxRuntime.jsx(
           CaseStudyCard,
           {
-            title: study.title,
-            description: study.description,
-            category: study.category,
-            categoryColor: study.categoryColor,
-            href: study.href,
-            linkLabel: study.linkLabel
+            title: String(study.title ?? ""),
+            description: String(study.description ?? ""),
+            category: String(study.category ?? ""),
+            categoryColor: study.categoryColor != null ? String(study.categoryColor) : void 0,
+            href: String(study.href ?? ""),
+            linkLabel: study.linkLabel != null ? String(study.linkLabel) : void 0
           },
-          study.id
+          String(study.id ?? "")
         )) })
       ] });
     };
@@ -23404,10 +23509,10 @@ function CastleBoard({
   className
 }) {
   const eventBus = useEventBus();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
-  const tiles = resolved?.tiles ?? [];
-  const features = resolved?.features ?? [];
-  const units = resolved?.units ?? [];
+  const resolved = boardEntity(entity);
+  const tiles = Array.isArray(resolved?.tiles) ? resolved.tiles : [];
+  const features = Array.isArray(resolved?.features) ? resolved.features : [];
+  const units = Array.isArray(resolved?.units) ? resolved.units : [];
   const assetManifest = resolved?.assetManifest;
   const backgroundImage = resolved?.backgroundImage;
   const [hoveredTile, setHoveredTile] = React97.useState(null);
@@ -23435,7 +23540,7 @@ function CastleBoard({
       onFeatureClick?.(feature);
       if (featureClickEvent) {
         eventBus.emit(`UI:${featureClickEvent}`, {
-          featureId: feature.id,
+          featureId: feature.id ?? "",
           featureType: feature.type,
           x: feature.x,
           y: feature.y
@@ -23503,6 +23608,7 @@ var init_CastleBoard = __esm({
     init_cn();
     init_useEventBus();
     init_IsometricCanvas2();
+    init_boardEntity();
     init_isometric();
     CastleBoard.displayName = "CastleBoard";
   }
@@ -24313,14 +24419,14 @@ function ClassifierBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
+  const resolved = boardEntity(entity);
   const [assignments, setAssignments] = React97.useState({});
   const [headerError, setHeaderError] = React97.useState(false);
   const [submitted, setSubmitted] = React97.useState(false);
   const [attempts, setAttempts] = React97.useState(0);
   const [showHint, setShowHint] = React97.useState(false);
-  const items = resolved?.items ?? [];
-  const categories = resolved?.categories ?? [];
+  const items = Array.isArray(resolved?.items) ? resolved.items : [];
+  const categories = Array.isArray(resolved?.categories) ? resolved.categories : [];
   const unassignedItems = items.filter((item) => !assignments[item.id]);
   const allAssigned = Object.keys(assignments).length === items.length;
   const results = submitted ? items.map((item) => ({
@@ -24352,7 +24458,7 @@ function ClassifierBoard({
   }, [items, assignments, attempts, completeEvent, emit]);
   const handleReset = () => {
     setSubmitted(false);
-    if (attempts >= 2 && resolved?.hint) {
+    if (attempts >= 2 && str(resolved?.hint)) {
       setShowHint(true);
     }
   };
@@ -24363,20 +24469,25 @@ function ClassifierBoard({
     setShowHint(false);
   };
   if (!resolved) return null;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
+  const hint = str(resolved.hint);
+  const failMessage = str(resolved.failMessage);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Box,
     {
       className,
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: "p-4", children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: resolved.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.description })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: str(resolved.title) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: str(resolved.description) })
         ] }) }),
         unassignedItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: t("classifier.itemsToSort") }),
@@ -24428,10 +24539,10 @@ function ClassifierBoard({
         }) }),
         submitted && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", align: "center", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: allCorrect ? LucideIcons2.CheckCircle : LucideIcons2.XCircle, size: "lg", className: allCorrect ? "text-success" : "text-error" }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: allCorrect ? resolved.successMessage ?? t("classifier.allCorrect") : `${correctCount}/${items.length} ${t("classifier.correct")}` }),
-          !allCorrect && resolved.failMessage && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: "text-muted-foreground", children: resolved.failMessage })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: allCorrect ? str(resolved.successMessage) || t("classifier.allCorrect") : `${correctCount}/${items.length} ${t("classifier.correct")}` }),
+          !allCorrect && failMessage && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: "text-muted-foreground", children: failMessage })
         ] }) }),
-        showHint && resolved.hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.hint }) }),
+        showHint && hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: hint }) }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", justify: "center", children: [
           !submitted ? /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "primary", onClick: handleSubmit, disabled: !allAssigned, children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: LucideIcons2.Send, size: "sm" }),
@@ -24450,6 +24561,7 @@ var init_ClassifierBoard = __esm({
   "components/game/organisms/puzzles/classifier/ClassifierBoard.tsx"() {
     init_atoms2();
     init_useEventBus();
+    init_boardEntity();
     ClassifierBoard.displayName = "ClassifierBoard";
   }
 });
@@ -30820,7 +30932,7 @@ function InventoryPanel({
   const slotArray = Array.from({ length: safeSlots }, (_, index) => {
     return safeItems[index] ?? null;
   });
-  const rows = Math.ceil(safeSlots / safeColumns);
+  const rows2 = Math.ceil(safeSlots / safeColumns);
   const handleSlotClick = React97.useCallback((index) => {
     if (selectSlotEvent) eventBus.emit(`UI:${selectSlotEvent}`, { index });
     onSelectSlot?.(index);
@@ -30889,7 +31001,7 @@ function InventoryPanel({
         className: "grid gap-1 bg-[var(--color-card)] p-2 rounded-container border border-border",
         style: {
           gridTemplateColumns: `repeat(${safeColumns}, ${slotSize}px)`,
-          gridTemplateRows: `repeat(${rows}, ${slotSize}px)`
+          gridTemplateRows: `repeat(${rows2}, ${slotSize}px)`
         },
         children: slotArray.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
           "button",
@@ -34853,11 +34965,11 @@ function LatticeSVG({
 }) {
   const paths = [];
   const cols = 5;
-  const rows = Math.ceil(h / (w / cols));
+  const rows2 = Math.ceil(h / (w / cols));
   const cellW = w / cols;
   const cellH = cellW;
   const bulge = cellW * 0.3;
-  for (let row = 0; row < rows; row++) {
+  for (let row = 0; row < rows2; row++) {
     for (let col = 0; col < cols; col++) {
       const cx = col * cellW + cellW / 2;
       const cy = row * cellH + cellH / 2;
@@ -35269,7 +35381,7 @@ var init_MatrixQuestion = __esm({
     };
     MatrixQuestion = ({
       title,
-      rows,
+      rows: rows2,
       columns = DEFAULT_MATRIX_COLUMNS,
       values,
       onChange,
@@ -35279,7 +35391,7 @@ var init_MatrixQuestion = __esm({
       className
     }) => {
       const styles = sizeStyles13[size];
-      const safeRows = rows ?? [];
+      const safeRows = rows2 ?? [];
       const safeValues = values ?? {};
       const eventBus = useEventBus();
       const handleChange = React97.useCallback(
@@ -35907,7 +36019,8 @@ var init_PositionedCanvas = __esm({
           dragRef.current = null;
           setDraggingId(null);
           if (!wasDrag) {
-            const next = selectedId === item.id ? null : item.id;
+            const itemId = item.id;
+            const next = selectedId === itemId ? null : itemId;
             onSelect?.(next);
             if (selectEvent) {
               eventBus.emit(`UI:${selectEvent}`, { id: next });
@@ -35942,15 +36055,22 @@ var init_PositionedCanvas = __esm({
             style: { width, height },
             onClick: handleContainerClick,
             children: items.map((item) => {
+              const itemId = item.id;
+              const label = item.label;
+              const x = item.x;
+              const y = item.y;
+              const capacity = item.capacity;
+              const partySize = item.partySize;
+              const serverName = item.serverName;
               const status = item.status ?? "empty";
               const shape = item.shape ?? "round";
-              const isSelected = selectedId === item.id;
-              const isDragging = draggingId === item.id;
+              const isSelected = selectedId === itemId;
+              const isDragging = draggingId === itemId;
               const statusBadge = STATUS_BADGE[status];
               return /* @__PURE__ */ jsxRuntime.jsxs(
                 Box,
                 {
-                  "data-testid": `item-node-${item.id}`,
+                  "data-testid": `item-node-${itemId}`,
                   "data-status": status,
                   className: cn(
                     "absolute flex flex-col items-center justify-center gap-1 border-2 select-none",
@@ -35961,7 +36081,7 @@ var init_PositionedCanvas = __esm({
                     isSelected && "outline outline-2 outline-offset-2 outline-primary shadow-md",
                     isDragging && "shadow-lg z-10"
                   ),
-                  style: { left: item.x, top: item.y, touchAction: "none" },
+                  style: { left: x, top: y, touchAction: "none" },
                   onPointerDown: (e) => handlePointerDown(e, item),
                   onPointerMove: handlePointerMove,
                   onPointerUp: (e) => handlePointerUp(e, item),
@@ -35969,10 +36089,10 @@ var init_PositionedCanvas = __esm({
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex items-center gap-1", children: [
                       getStatusIcon(status),
-                      /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", weight: "semibold", children: item.label })
+                      /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", weight: "semibold", children: label })
                     ] }),
-                    /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", color: "secondary", children: item.partySize !== void 0 && status === "seated" ? `${item.partySize}/${item.capacity}` : `Cap ${item.capacity}` }),
-                    status === "seated" && item.serverName && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", color: "secondary", className: "truncate max-w-[80%]", children: item.serverName }),
+                    /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", color: "secondary", children: partySize !== void 0 && status === "seated" ? `${partySize}/${capacity}` : `Cap ${capacity}` }),
+                    status === "seated" && serverName && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", color: "secondary", className: "truncate max-w-[80%]", children: serverName }),
                     isSelected && /* @__PURE__ */ jsxRuntime.jsx(
                       Badge,
                       {
@@ -35984,7 +36104,7 @@ var init_PositionedCanvas = __esm({
                     )
                   ]
                 },
-                item.id
+                itemId
               );
             })
           }
@@ -36756,9 +36876,10 @@ var init_RichBlockEditor = __esm({
 });
 function collectInitiallyCollapsed(nodes, acc) {
   for (const n of nodes) {
+    const replies = n.replies;
     if (n.collapsed) acc.add(n.id);
-    if (n.replies && n.replies.length > 0) {
-      collectInitiallyCollapsed(n.replies, acc);
+    if (replies && replies.length > 0) {
+      collectInitiallyCollapsed(replies, acc);
     }
   }
 }
@@ -36788,44 +36909,52 @@ var init_ReplyTree = __esm({
     }) => {
       const eventBus = useEventBus();
       const { t } = hooks.useTranslate();
-      const hasReplies = !!node.replies && node.replies.length > 0;
-      const isCollapsed = collapsedSet.has(node.id);
+      const nodeId = node.id;
+      const authorName = node.authorName;
+      const authorAvatarUrl = node.authorAvatarUrl;
+      const content = node.content;
+      const postedAt = node.postedAt;
+      const voteCount = node.voteCount;
+      const userVote = node.userVote;
+      const replies = node.replies;
+      const hasReplies = !!replies && replies.length > 0;
+      const isCollapsed = collapsedSet.has(nodeId);
       const atMaxDepth = depth >= maxDepth;
       const [replyOpen, setReplyOpen] = React97.useState(false);
       const [draft, setDraft] = React97.useState("");
       const handleVote = React97.useCallback(
         (next) => {
-          onVote?.(node.id, next);
-          if (voteEvent) eventBus.emit(`UI:${voteEvent}`, { nodeId: node.id, vote: next });
+          onVote?.(nodeId, next);
+          if (voteEvent) eventBus.emit(`UI:${voteEvent}`, { nodeId, vote: next });
         },
-        [node.id, onVote, voteEvent, eventBus]
+        [nodeId, onVote, voteEvent, eventBus]
       );
       const handleReply = React97.useCallback(() => {
-        onReply?.(node.id);
+        onReply?.(nodeId);
         setReplyOpen((open) => !open);
-      }, [node.id, onReply]);
+      }, [nodeId, onReply]);
       const handleSubmitReply = React97.useCallback(() => {
-        const content = draft.trim();
-        if (!content) return;
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        const text = draft.trim();
+        if (!text) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: nodeId, content: text });
         setDraft("");
         setReplyOpen(false);
-      }, [node.id, draft, replyEvent, eventBus]);
+      }, [nodeId, draft, replyEvent, eventBus]);
       const handleCancelReply = React97.useCallback(() => {
         setDraft("");
         setReplyOpen(false);
       }, []);
       const handleFlag = React97.useCallback(() => {
-        onFlag?.(node.id);
-        if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
-      }, [node.id, onFlag, flagEvent, eventBus]);
+        onFlag?.(nodeId);
+        if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId });
+      }, [nodeId, onFlag, flagEvent, eventBus]);
       const handleContinue = React97.useCallback(() => {
-        onContinueThread?.(node.id);
-        if (continueThreadEvent) eventBus.emit(`UI:${continueThreadEvent}`, { nodeId: node.id });
-      }, [node.id, onContinueThread, continueThreadEvent, eventBus]);
+        onContinueThread?.(nodeId);
+        if (continueThreadEvent) eventBus.emit(`UI:${continueThreadEvent}`, { nodeId });
+      }, [nodeId, onContinueThread, continueThreadEvent, eventBus]);
       const handleToggle = React97.useCallback(() => {
-        toggleCollapse(node.id);
-      }, [node.id, toggleCollapse]);
+        toggleCollapse(nodeId);
+      }, [nodeId, toggleCollapse]);
       return /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-row gap-2 items-stretch min-w-0", children: [
         /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-col items-center flex-shrink-0 w-6", children: [
           hasReplies ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -36857,25 +36986,25 @@ var init_ReplyTree = __esm({
             /* @__PURE__ */ jsxRuntime.jsx(
               Avatar,
               {
-                src: node.authorAvatarUrl,
-                name: node.authorName,
+                src: authorAvatarUrl,
+                name: authorName,
                 size: "sm"
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "semibold", children: node.authorName }),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", color: "secondary", children: node.postedAt })
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "semibold", children: authorName }),
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", color: "secondary", children: postedAt })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: "whitespace-pre-wrap break-words", children: node.content }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: "whitespace-pre-wrap break-words", children: content }),
           showActions && /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               VoteStack,
               {
-                count: node.voteCount ?? 0,
-                userVote: node.userVote ?? null,
+                count: voteCount ?? 0,
+                userVote: userVote ?? null,
                 onVote: handleVote,
                 size: "sm",
                 variant: "horizontal",
-                label: t("replyTree.voteOnReplyBy", { author: node.authorName })
+                label: t("replyTree.voteOnReplyBy", { author: authorName })
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(
@@ -36885,7 +37014,7 @@ var init_ReplyTree = __esm({
                 size: "sm",
                 leftIcon: "message-square",
                 onClick: handleReply,
-                "aria-label": t("replyTree.replyTo", { author: node.authorName }),
+                "aria-label": t("replyTree.replyTo", { author: authorName }),
                 children: t("replyTree.reply")
               }
             ),
@@ -36896,7 +37025,7 @@ var init_ReplyTree = __esm({
                 size: "sm",
                 leftIcon: "flag",
                 onClick: handleFlag,
-                "aria-label": t("replyTree.flagReplyBy", { author: node.authorName }),
+                "aria-label": t("replyTree.flagReplyBy", { author: authorName }),
                 children: t("replyTree.flag")
               }
             )
@@ -36908,9 +37037,9 @@ var init_ReplyTree = __esm({
                 inputType: "textarea",
                 rows: 2,
                 value: draft,
-                placeholder: t("replyTree.replyToPlaceholder", { author: node.authorName }),
+                placeholder: t("replyTree.replyToPlaceholder", { author: authorName }),
                 onChange: (e) => setDraft(e.target.value),
-                "aria-label": t("replyTree.replyTo", { author: node.authorName })
+                "aria-label": t("replyTree.replyTo", { author: authorName })
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
@@ -36941,7 +37070,7 @@ var init_ReplyTree = __esm({
               ),
               children: t("replyTree.continueThread")
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "flex flex-col gap-2 mt-1", children: node.replies.map((child) => /* @__PURE__ */ jsxRuntime.jsx(
+          ) : /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "flex flex-col gap-2 mt-1", children: replies.map((child) => /* @__PURE__ */ jsxRuntime.jsx(
             ReplyTreeNode,
             {
               node: child,
@@ -38852,8 +38981,8 @@ var init_WizardContainer = __esm({
           return void 0;
         if (typeof controlledStep === "number") return controlledStep;
         if (typeof controlledStep === "string") return parseInt(controlledStep, 10);
-        const num = Number(controlledStep);
-        return isNaN(num) ? void 0 : num;
+        const num2 = Number(controlledStep);
+        return isNaN(num2) ? void 0 : num2;
       })();
       const currentStep = normalizedControlledStep !== void 0 ? normalizedControlledStep : internalStep;
       const totalSteps = steps.length;
@@ -40558,7 +40687,7 @@ function DebuggerBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
+  const resolved = boardEntity(entity);
   const [flaggedLines, setFlaggedLines] = React97.useState(/* @__PURE__ */ new Set());
   const [headerError, setHeaderError] = React97.useState(false);
   const [submitted, setSubmitted] = React97.useState(false);
@@ -40576,7 +40705,7 @@ function DebuggerBoard({
       return next;
     });
   };
-  const lines = resolved?.lines ?? [];
+  const lines = Array.isArray(resolved?.lines) ? resolved.lines : [];
   const bugLines = lines.filter((l) => l.isBug);
   const correctFlags = lines.filter((l) => l.isBug && flaggedLines.has(l.id));
   const falseFlags = lines.filter((l) => !l.isBug && flaggedLines.has(l.id));
@@ -40591,7 +40720,7 @@ function DebuggerBoard({
   }, [correctFlags.length, bugLines.length, falseFlags.length, attempts, completeEvent, emit]);
   const handleReset = () => {
     setSubmitted(false);
-    if (attempts >= 2 && resolved?.hint) {
+    if (attempts >= 2 && str(resolved?.hint)) {
       setShowHint(true);
     }
   };
@@ -40602,24 +40731,28 @@ function DebuggerBoard({
     setShowHint(false);
   };
   if (!resolved) return null;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
+  const hint = str(resolved.hint);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Box,
     {
       className,
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: "p-4", children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
           /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "xs", align: "center", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: LucideIcons2.Bug, size: "sm" }),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: resolved.title })
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: str(resolved.title) })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.description }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: t("debugger.findBugs", { count: String(resolved.bugCount) }) })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: str(resolved.description) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: t("debugger.findBugs", { count: String(num(resolved.bugCount)) }) })
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-0 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(VStack, { gap: "none", children: lines.map((line, i) => {
           const isFlagged = flaggedLines.has(line.id);
@@ -40651,7 +40784,7 @@ function DebuggerBoard({
           );
         }) }) }),
         submitted && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: allCorrect ? resolved.successMessage ?? t("debugger.allFound") : `${correctFlags.length}/${bugLines.length} ${t("debugger.bugsFound")}` }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: allCorrect ? str(resolved.successMessage) || t("debugger.allFound") : `${correctFlags.length}/${bugLines.length} ${t("debugger.bugsFound")}` }),
           bugLines.map((line) => /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "xs", align: "start", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               Icon,
@@ -40667,7 +40800,7 @@ function DebuggerBoard({
             ] })
           ] }, line.id))
         ] }) }),
-        showHint && resolved.hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.hint }) }),
+        showHint && hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: hint }) }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", justify: "center", children: [
           !submitted ? /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "primary", onClick: handleSubmit, disabled: flaggedLines.size === 0, children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: LucideIcons2.Send, size: "sm" }),
@@ -40686,6 +40819,7 @@ var init_DebuggerBoard = __esm({
   "components/game/organisms/puzzles/debugger/DebuggerBoard.tsx"() {
     init_atoms2();
     init_useEventBus();
+    init_boardEntity();
     DebuggerBoard.displayName = "DebuggerBoard";
   }
 });
@@ -40723,7 +40857,7 @@ function getBadgeVariant(fieldName, value) {
   return "default";
 }
 function formatFieldLabel(fieldName) {
-  return fieldName.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
+  return fieldName.replace(/([A-Z])/g, " $1").replace(/^./, (str2) => str2.toUpperCase());
 }
 function formatFieldValue(value, fieldName) {
   if (typeof value === "number") {
@@ -40742,26 +40876,26 @@ function formatFieldValue(value, fieldName) {
 }
 function renderRichFieldValue(value, fieldName, fieldType) {
   if (value === void 0 || value === null) return "\u2014";
-  const str = String(value);
+  const str2 = String(value);
   switch (fieldType) {
     case "image":
     case "url": {
-      if (str.match(/\.(png|jpe?g|gif|svg|webp|avif)(\?|$)/i) || str.startsWith("data:image/")) {
+      if (str2.match(/\.(png|jpe?g|gif|svg|webp|avif)(\?|$)/i) || str2.startsWith("data:image/")) {
         return /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "mt-1 max-w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
           "img",
           {
-            src: str,
+            src: str2,
             alt: formatFieldLabel(fieldName),
             className: "max-w-full max-h-64 rounded-md object-contain",
             loading: "lazy"
           }
         ) });
       }
-      return str;
+      return str2;
     }
     case "markdown":
     case "richtext":
-      return /* @__PURE__ */ jsxRuntime.jsx(React97.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: "break-words", children: str }), children: /* @__PURE__ */ jsxRuntime.jsx(
+      return /* @__PURE__ */ jsxRuntime.jsx(React97.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: "break-words", children: str2 }), children: /* @__PURE__ */ jsxRuntime.jsx(
         Box,
         {
           className: "prose prose-sm max-w-none",
@@ -40779,11 +40913,11 @@ function renderRichFieldValue(value, fieldName, fieldType) {
             "--tw-prose-th-borders": "var(--color-border)",
             "--tw-prose-td-borders": "var(--color-border)"
           },
-          children: /* @__PURE__ */ jsxRuntime.jsx(ReactMarkdown2, { children: str })
+          children: /* @__PURE__ */ jsxRuntime.jsx(ReactMarkdown2, { children: str2 })
         }
       ) });
     case "code":
-      return /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "mt-1 rounded-md bg-muted p-3 overflow-x-auto", children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "text-sm font-mono whitespace-pre-wrap break-words m-0", children: /* @__PURE__ */ jsxRuntime.jsx("code", { children: str }) }) });
+      return /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "mt-1 rounded-md bg-muted p-3 overflow-x-auto", children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "text-sm font-mono whitespace-pre-wrap break-words m-0", children: /* @__PURE__ */ jsxRuntime.jsx("code", { children: str2 }) }) });
     case "html":
       return /* @__PURE__ */ jsxRuntime.jsx(
         Box,
@@ -40803,12 +40937,12 @@ function renderRichFieldValue(value, fieldName, fieldType) {
             "--tw-prose-th-borders": "var(--color-border)",
             "--tw-prose-td-borders": "var(--color-border)"
           },
-          children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: str })
+          children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: str2 })
         }
       );
     case "date":
     case "datetime": {
-      const d = new Date(str);
+      const d = new Date(str2);
       if (!isNaN(d.getTime())) {
         return d.toLocaleDateString(void 0, {
           year: "numeric",
@@ -40817,7 +40951,7 @@ function renderRichFieldValue(value, fieldName, fieldType) {
           ...fieldType === "datetime" ? { hour: "2-digit", minute: "2-digit" } : {}
         });
       }
-      return str;
+      return str2;
     }
     default:
       return formatFieldValue(value, fieldName);
@@ -41495,6 +41629,40 @@ var init_RuleEditor = __esm({
     RuleEditor.displayName = "RuleEditor";
   }
 });
+
+// components/game/organisms/puzzles/event-handler/puzzleObject.ts
+function objId(o) {
+  return o.id == null ? "" : String(o.id);
+}
+function objName(o) {
+  return o.name == null ? "" : String(o.name);
+}
+function objIcon(o) {
+  return o.icon == null ? "" : String(o.icon);
+}
+function objStates(o) {
+  return Array.isArray(o.states) ? o.states : [];
+}
+function objCurrentState(o) {
+  return o.currentState == null ? "" : String(o.currentState);
+}
+function objAvailableEvents(o) {
+  return Array.isArray(o.availableEvents) ? o.availableEvents : [];
+}
+function objAvailableActions(o) {
+  return Array.isArray(o.availableActions) ? o.availableActions : [];
+}
+function objRules(o) {
+  return Array.isArray(o.rules) ? o.rules : [];
+}
+function objMaxRules(o) {
+  const n = Number(o.maxRules);
+  return Number.isFinite(n) && n > 0 ? n : 3;
+}
+var init_puzzleObject = __esm({
+  "components/game/organisms/puzzles/event-handler/puzzleObject.ts"() {
+  }
+});
 function ObjectRulePanel({
   object,
   onRulesChange,
@@ -41502,55 +41670,63 @@ function ObjectRulePanel({
   className
 }) {
   const { t } = hooks.useTranslate();
-  const maxRules = object.maxRules || 3;
-  const canAdd = object.rules.length < maxRules;
+  const id = objId(object);
+  const name = objName(object);
+  const icon = objIcon(object);
+  const states = objStates(object);
+  const currentState = objCurrentState(object);
+  const availableEvents = objAvailableEvents(object);
+  const availableActions = objAvailableActions(object);
+  const rules = objRules(object);
+  const maxRules = objMaxRules(object);
+  const canAdd = rules.length < maxRules;
   const handleRuleChange = React97.useCallback((index, updatedRule) => {
-    const newRules = [...object.rules];
+    const newRules = [...rules];
     newRules[index] = updatedRule;
-    onRulesChange(object.id, newRules);
-  }, [object.id, object.rules, onRulesChange]);
+    onRulesChange(id, newRules);
+  }, [id, rules, onRulesChange]);
   const handleRuleRemove = React97.useCallback((index) => {
-    const newRules = object.rules.filter((_, i) => i !== index);
-    onRulesChange(object.id, newRules);
-  }, [object.id, object.rules, onRulesChange]);
+    const newRules = rules.filter((_, i) => i !== index);
+    onRulesChange(id, newRules);
+  }, [id, rules, onRulesChange]);
   const handleAddRule = React97.useCallback(() => {
     if (!canAdd || disabled) return;
-    const firstEvent = object.availableEvents[0]?.value || "";
-    const firstAction = object.availableActions[0]?.value || "";
+    const firstEvent = availableEvents[0]?.value || "";
+    const firstAction = availableActions[0]?.value || "";
     const newRule = {
       id: `rule-${nextRuleId++}`,
       whenEvent: firstEvent,
       thenAction: firstAction
     };
-    onRulesChange(object.id, [...object.rules, newRule]);
-  }, [canAdd, disabled, object, onRulesChange]);
+    onRulesChange(id, [...rules, newRule]);
+  }, [canAdd, disabled, id, rules, availableEvents, availableActions, onRulesChange]);
   const machine = {
-    name: object.name,
-    states: object.states,
-    currentState: object.currentState,
-    transitions: object.rules.map((r2) => ({
-      from: object.currentState,
-      to: object.states.find((s) => s !== object.currentState) || object.currentState,
+    name,
+    states,
+    currentState,
+    transitions: rules.map((r2) => ({
+      from: currentState,
+      to: states.find((s) => s !== currentState) || currentState,
       event: r2.whenEvent
     }))
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { className: cn("p-4 rounded-lg bg-card border border-border", className), gap: "sm", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-center", gap: "sm", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", children: object.icon }),
+      /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", children: icon }),
       /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "none", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body1", className: "text-foreground font-bold", children: object.name }),
-        /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: t("eventHandler.state") + ": " + object.currentState })
+        /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body1", className: "text-foreground font-bold", children: name }),
+        /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: t("eventHandler.state") + ": " + currentState })
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(TraitStateViewer, { trait: machine, variant: "compact", size: "sm" }),
     /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground font-medium", children: t("eventHandler.rules", { count: object.rules.length, max: maxRules }) + ":" }),
-      object.rules.map((rule, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground font-medium", children: t("eventHandler.rules", { count: rules.length, max: maxRules }) + ":" }),
+      rules.map((rule, i) => /* @__PURE__ */ jsxRuntime.jsx(
         RuleEditor,
         {
           rule,
-          availableEvents: object.availableEvents,
-          availableActions: object.availableActions,
+          availableEvents,
+          availableActions,
           onChange: (r2) => handleRuleChange(i, r2),
           onRemove: () => handleRuleRemove(i),
           disabled
@@ -41568,6 +41744,7 @@ var init_ObjectRulePanel = __esm({
     init_cn();
     init_TraitStateViewer();
     init_RuleEditor();
+    init_puzzleObject();
     nextRuleId = 1;
     ObjectRulePanel.displayName = "ObjectRulePanel";
   }
@@ -41634,11 +41811,11 @@ function EventHandlerBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
-  const entityObjects = resolved?.objects ?? [];
-  const [objects, setObjects] = React97.useState(entityObjects);
+  const resolved = boardEntity(entity);
+  const entityObjects = rows(resolved?.objects);
+  const [objects, setObjects] = React97.useState(() => [...entityObjects]);
   const [selectedObjectId, setSelectedObjectId] = React97.useState(
-    entityObjects[0]?.id || null
+    entityObjects[0] ? objId(entityObjects[0]) : null
   );
   const [headerError, setHeaderError] = React97.useState(false);
   const [playState, setPlayState] = React97.useState("editing");
@@ -41649,10 +41826,10 @@ function EventHandlerBoard({
   React97.useEffect(() => () => {
     if (timerRef.current) clearTimeout(timerRef.current);
   }, []);
-  const selectedObject = objects.find((o) => o.id === selectedObjectId) || null;
+  const selectedObject = objects.find((o) => objId(o) === selectedObjectId) || null;
   const handleRulesChange = React97.useCallback((objectId, rules) => {
     setObjects((prev) => prev.map(
-      (o) => o.id === objectId ? { ...o, rules } : o
+      (o) => objId(o) === objectId ? { ...o, rules } : o
     ));
   }, []);
   const addLogEntry = React97.useCallback((icon, message, status = "done") => {
@@ -41666,11 +41843,12 @@ function EventHandlerBoard({
     setEventLog([]);
     const allRules = [];
     objects.forEach((obj) => {
-      obj.rules.forEach((rule) => {
+      objRules(obj).forEach((rule) => {
         allRules.push({ object: obj, rule });
       });
     });
-    const triggers = resolved?.triggerEvents || [];
+    const triggers = Array.isArray(resolved?.triggerEvents) ? resolved.triggerEvents : [];
+    const goalEvent = str(resolved?.goalEvent);
     const eventQueue = [...triggers];
     const firedEvents = /* @__PURE__ */ new Set();
     let stepIdx = 0;
@@ -41699,14 +41877,14 @@ function EventHandlerBoard({
         addLogEntry("\u26A1", t("eventHandler.noListeners", { event: currentEvent }), "done");
       } else {
         matching.forEach(({ object, rule }) => {
-          addLogEntry(object.icon, t("eventHandler.heardEvent", { object: object.name, event: currentEvent, action: rule.thenAction }), "done");
+          addLogEntry(objIcon(object), t("eventHandler.heardEvent", { object: objName(object), event: currentEvent, action: rule.thenAction }), "done");
           eventQueue.push(rule.thenAction);
-          if (rule.thenAction === resolved?.goalEvent) {
+          if (rule.thenAction === goalEvent) {
             goalReached = true;
           }
         });
       }
-      if (currentEvent === resolved?.goalEvent) {
+      if (currentEvent === goalEvent) {
         goalReached = true;
       }
       stepIdx++;
@@ -41724,65 +41902,75 @@ function EventHandlerBoard({
   }, []);
   const handleReset = React97.useCallback(() => {
     if (timerRef.current) clearTimeout(timerRef.current);
-    setObjects(resolved?.objects ?? []);
+    const resetObjects = rows(resolved?.objects);
+    setObjects([...resetObjects]);
     setPlayState("editing");
     setEventLog([]);
-    setSelectedObjectId((resolved?.objects ?? [])[0]?.id || null);
+    setSelectedObjectId(resetObjects[0] ? objId(resetObjects[0]) : null);
     setAttempts(0);
   }, [resolved?.objects]);
   if (!resolved) return null;
   const objectViewers = objects.map((obj) => {
+    const states = objStates(obj);
+    const currentState = objCurrentState(obj);
     const machine = {
-      name: obj.name,
-      states: obj.states,
-      currentState: obj.currentState,
-      transitions: obj.rules.map((r2) => ({
-        from: obj.currentState,
-        to: obj.states.find((s) => s !== obj.currentState) || obj.currentState,
+      name: objName(obj),
+      states,
+      currentState,
+      transitions: objRules(obj).map((r2) => ({
+        from: currentState,
+        to: states.find((s) => s !== currentState) || currentState,
         event: r2.whenEvent
       }))
     };
     return { obj, machine };
   });
-  const showHint = attempts >= 3 && resolved.hint;
+  const hint = str(resolved.hint);
+  const showHint = attempts >= 3 && hint;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
   const encourageKey = ENCOURAGEMENT_KEYS[Math.min(attempts - 1, ENCOURAGEMENT_KEYS.length - 1)] ?? ENCOURAGEMENT_KEYS[0];
   return /* @__PURE__ */ jsxRuntime.jsxs(
     VStack,
     {
       className: cn("p-4 gap-6", className),
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", className: "text-foreground", children: resolved.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground", children: resolved.description }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", className: "text-foreground", children: str(resolved.title) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground", children: str(resolved.description) }),
           /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-center p-2 rounded bg-primary/10 border border-primary/30", gap: "xs", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-primary font-bold", children: t("game.goal") + ":" }),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-foreground", children: resolved.goalCondition })
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-foreground", children: str(resolved.goalCondition) })
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground font-medium", children: t("eventHandler.clickObject") + ":" }),
-          /* @__PURE__ */ jsxRuntime.jsx(HStack, { className: "flex-wrap", gap: "sm", children: objectViewers.map(({ obj, machine }) => /* @__PURE__ */ jsxRuntime.jsx(
-            Box,
-            {
-              className: cn(
-                "p-3 rounded-container border-2 cursor-pointer transition-all hover:scale-105",
-                selectedObjectId === obj.id ? "border-primary bg-primary/10" : "border-border bg-card hover:border-muted-foreground"
-              ),
-              onClick: () => setSelectedObjectId(obj.id),
-              children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", className: "items-center min-w-[120px]", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", children: obj.icon }),
-                /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground font-medium", children: obj.name }),
-                /* @__PURE__ */ jsxRuntime.jsx(TraitStateViewer, { trait: machine, variant: "compact", size: "sm" })
-              ] })
-            },
-            obj.id
-          )) })
+          /* @__PURE__ */ jsxRuntime.jsx(HStack, { className: "flex-wrap", gap: "sm", children: objectViewers.map(({ obj, machine }) => {
+            const oid = objId(obj);
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              Box,
+              {
+                className: cn(
+                  "p-3 rounded-container border-2 cursor-pointer transition-all hover:scale-105",
+                  selectedObjectId === oid ? "border-primary bg-primary/10" : "border-border bg-card hover:border-muted-foreground"
+                ),
+                onClick: () => setSelectedObjectId(oid),
+                children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", className: "items-center min-w-[120px]", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", children: objIcon(obj) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground font-medium", children: objName(obj) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(TraitStateViewer, { trait: machine, variant: "compact", size: "sm" })
+                ] })
+              },
+              oid
+            );
+          }) })
         ] }),
         selectedObject && /* @__PURE__ */ jsxRuntime.jsx(
           ObjectRulePanel,
@@ -41793,12 +41981,12 @@ function EventHandlerBoard({
           }
         ),
         eventLog.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(EventLog, { entries: eventLog }),
-        playState === "success" && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-success/20 border border-success text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", className: "text-success", children: resolved.successMessage || t("eventHandler.chainComplete") }) }),
+        playState === "success" && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-success/20 border border-success text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", className: "text-success", children: str(resolved.successMessage) || t("eventHandler.chainComplete") }) }),
         playState === "fail" && /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-warning/10 border border-warning/30 text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body1", className: "text-foreground font-medium", children: t(encourageKey) }) }),
           showHint && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-3 rounded-container bg-accent/10 border border-accent/30", children: /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-start", gap: "xs", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-accent font-bold shrink-0", children: "\u{1F4A1} " + t("game.hint") + ":" }),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground", children: resolved.hint })
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground", children: hint })
           ] }) })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", children: [
@@ -41826,6 +42014,8 @@ var init_EventHandlerBoard = __esm({
     init_TraitStateViewer();
     init_ObjectRulePanel();
     init_EventLog();
+    init_puzzleObject();
+    init_boardEntity();
     ENCOURAGEMENT_KEYS = [
       "puzzle.tryAgain1",
       "puzzle.tryAgain2",
@@ -41914,7 +42104,10 @@ var init_FeatureGridOrganism = __esm({
       );
       React97.useCallback(
         (feature) => {
-          eventBus.emit("UI:FEATURE_CLICK", { id: feature.id, href: feature.href ?? "" });
+          eventBus.emit("UI:FEATURE_CLICK", {
+            id: String(feature.id ?? ""),
+            href: String(feature.href ?? "")
+          });
         },
         [eventBus]
       );
@@ -41924,14 +42117,17 @@ var init_FeatureGridOrganism = __esm({
       if (error) {
         return /* @__PURE__ */ jsxRuntime.jsx(ErrorState, { message: error.message, className });
       }
-      const featureCards = items.map((feature) => ({
-        icon: feature.icon,
-        title: feature.title,
-        description: feature.description,
-        href: feature.href,
-        linkLabel: feature.linkLabel,
-        variant: feature.href ? "interactive" : "bordered"
-      }));
+      const featureCards = items.map((feature) => {
+        const href = feature.href != null ? String(feature.href) : void 0;
+        return {
+          icon: feature.icon != null ? String(feature.icon) : void 0,
+          title: String(feature.title ?? ""),
+          description: String(feature.description ?? ""),
+          href,
+          linkLabel: feature.linkLabel != null ? String(feature.linkLabel) : void 0,
+          variant: href ? "interactive" : "bordered"
+        };
+      });
       return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: cn("w-full", className), children: [
         (heading || subtitle) && /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", align: "center", className: "w-full", children: [
           heading && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h2", align: "center", children: heading }),
@@ -43249,22 +43445,24 @@ var init_HeroOrganism = __esm({
         () => Array.isArray(entity) ? entity[0] : entity && typeof entity === "object" ? entity : void 0,
         [entity]
       );
+      const primaryAction = resolved?.primaryAction;
+      const secondaryAction = resolved?.secondaryAction;
       const handlePrimaryClick = React97.useCallback(() => {
-        if (resolved?.primaryAction) {
+        if (primaryAction) {
           eventBus.emit("UI:CTA_PRIMARY", {
-            label: resolved.primaryAction.label,
-            href: resolved.primaryAction.href
+            label: String(primaryAction.label ?? ""),
+            href: String(primaryAction.href ?? "")
           });
         }
-      }, [eventBus, resolved]);
+      }, [eventBus, primaryAction]);
       const handleSecondaryClick = React97.useCallback(() => {
-        if (resolved?.secondaryAction) {
+        if (secondaryAction) {
           eventBus.emit("UI:CTA_SECONDARY", {
-            label: resolved.secondaryAction.label,
-            href: resolved.secondaryAction.href
+            label: String(secondaryAction.label ?? ""),
+            href: String(secondaryAction.href ?? "")
           });
         }
-      }, [eventBus, resolved]);
+      }, [eventBus, secondaryAction]);
       if (isLoading) {
         return /* @__PURE__ */ jsxRuntime.jsx(LoadingState, { message: t("common.loading"), className });
       }
@@ -43274,17 +43472,19 @@ var init_HeroOrganism = __esm({
       if (!resolved) {
         return null;
       }
+      const imageRaw = resolved.image;
+      const image = imageRaw ? { src: String(imageRaw.src ?? ""), alt: String(imageRaw.alt ?? "") } : void 0;
       return /* @__PURE__ */ jsxRuntime.jsxs(
         HeroSection,
         {
-          tag: resolved.tag,
-          title: resolved.title,
-          titleAccent: resolved.titleAccent,
-          subtitle: resolved.subtitle,
-          primaryAction: resolved.primaryAction ? { label: resolved.primaryAction.label, href: resolved.primaryAction.href } : void 0,
-          secondaryAction: resolved.secondaryAction ? { label: resolved.secondaryAction.label, href: resolved.secondaryAction.href } : void 0,
-          installCommand: resolved.installCommand,
-          image: resolved.image,
+          tag: resolved.tag != null ? String(resolved.tag) : void 0,
+          title: String(resolved.title ?? ""),
+          titleAccent: resolved.titleAccent != null ? String(resolved.titleAccent) : void 0,
+          subtitle: String(resolved.subtitle ?? ""),
+          primaryAction: primaryAction ? { label: String(primaryAction.label ?? ""), href: String(primaryAction.href ?? "") } : void 0,
+          secondaryAction: secondaryAction ? { label: String(secondaryAction.label ?? ""), href: String(secondaryAction.href ?? "") } : void 0,
+          installCommand: resolved.installCommand != null ? String(resolved.installCommand) : void 0,
+          image,
           imagePosition: resolved.imagePosition,
           background: resolved.background,
           className: cn(className),
@@ -43293,8 +43493,8 @@ var init_HeroOrganism = __esm({
             /* @__PURE__ */ jsxRuntime.jsx(
               _HeroClickInterceptor,
               {
-                hasPrimary: !!resolved.primaryAction,
-                hasSecondary: !!resolved.secondaryAction,
+                hasPrimary: !!primaryAction,
+                hasSecondary: !!secondaryAction,
                 onPrimaryClick: handlePrimaryClick,
                 onSecondaryClick: handleSecondaryClick
               }
@@ -43523,7 +43723,7 @@ function formatValue3(value, fieldName) {
   return String(value);
 }
 function formatFieldLabel2(fieldName) {
-  return fieldName.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase()).replace(/Id$/, "").trim();
+  return fieldName.replace(/([A-Z])/g, " $1").replace(/^./, (str2) => str2.toUpperCase()).replace(/Id$/, "").trim();
 }
 var STATUS_STYLES2, StatusBadge, ProgressIndicator, List3;
 var init_List = __esm({
@@ -44370,20 +44570,22 @@ function NegotiatorBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
+  const resolved = boardEntity(entity);
   const [history, setHistory] = React97.useState([]);
   const [headerError, setHeaderError] = React97.useState(false);
   const [showHint, setShowHint] = React97.useState(false);
+  const totalRounds = num(resolved?.totalRounds);
+  const targetScore = num(resolved?.targetScore);
   const currentRound = history.length;
-  const isComplete = currentRound >= (resolved?.totalRounds ?? 0);
+  const isComplete = currentRound >= totalRounds;
   const playerTotal = history.reduce((s, r2) => s + r2.playerPayoff, 0);
   const opponentTotal = history.reduce((s, r2) => s + r2.opponentPayoff, 0);
-  const won = isComplete && playerTotal >= (resolved?.targetScore ?? 0);
-  const actions = resolved?.actions ?? [];
-  const payoffMatrix = resolved?.payoffMatrix ?? [];
+  const won = isComplete && playerTotal >= targetScore;
+  const actions = Array.isArray(resolved?.actions) ? resolved.actions : [];
+  const payoffMatrix = Array.isArray(resolved?.payoffMatrix) ? resolved.payoffMatrix : [];
   const handleAction = React97.useCallback((actionId) => {
     if (isComplete) return;
-    const opponentAction = getOpponentAction(resolved?.opponentStrategy ?? "random", actions, history);
+    const opponentAction = getOpponentAction(str(resolved?.opponentStrategy) || "random", actions, history);
     const payoff = payoffMatrix.find(
       (p2) => p2.playerAction === actionId && p2.opponentAction === opponentAction
     );
@@ -44396,42 +44598,46 @@ function NegotiatorBoard({
     };
     const newHistory = [...history, result];
     setHistory(newHistory);
-    if (newHistory.length >= (resolved?.totalRounds ?? 0)) {
+    if (newHistory.length >= totalRounds) {
       const total = newHistory.reduce((s, r2) => s + r2.playerPayoff, 0);
-      if (total >= (resolved?.targetScore ?? 0)) {
+      if (total >= targetScore) {
         emit(`UI:${completeEvent}`, { success: true, score: total });
       }
-      if (newHistory.length >= 3 && resolved?.hint) {
+      if (newHistory.length >= 3 && str(resolved?.hint)) {
         setShowHint(true);
       }
     }
-  }, [isComplete, resolved, actions, payoffMatrix, history, currentRound, completeEvent, emit]);
+  }, [isComplete, resolved, totalRounds, targetScore, actions, payoffMatrix, history, currentRound, completeEvent, emit]);
   const handleReset = () => {
     setHistory([]);
     setShowHint(false);
   };
   const getActionLabel = (id) => actions.find((a) => a.id === id)?.label ?? id;
   if (!resolved) return null;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
+  const hint = str(resolved.hint);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Box,
     {
       className,
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: "p-4", children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: resolved.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.description }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: str(resolved.title) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: str(resolved.description) }),
           /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "md", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Badge, { size: "sm", children: t("negotiator.round", { current: String(currentRound), total: String(resolved.totalRounds) }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(Badge, { size: "sm", children: t("negotiator.round", { current: String(currentRound), total: String(totalRounds) }) }),
             /* @__PURE__ */ jsxRuntime.jsxs(Badge, { size: "sm", children: [
               t("negotiator.target"),
               ": ",
-              resolved.targetScore
+              targetScore
             ] })
           ] })
         ] }) }),
@@ -44480,16 +44686,16 @@ function NegotiatorBoard({
         ] }) }),
         isComplete && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", align: "center", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: LucideIcons2.CheckCircle, size: "lg", className: won ? "text-success" : "text-error" }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: won ? resolved.successMessage ?? t("negotiator.success") : resolved.failMessage ?? t("negotiator.failed") }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", weight: "bold", children: won ? str(resolved.successMessage) || t("negotiator.success") : str(resolved.failMessage) || t("negotiator.failed") }),
           /* @__PURE__ */ jsxRuntime.jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
             t("negotiator.finalScore"),
             ": ",
             playerTotal,
             "/",
-            resolved.targetScore
+            targetScore
           ] })
         ] }) }),
-        showHint && resolved.hint && !won && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.hint }) }),
+        showHint && hint && !won && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: hint }) }),
         isComplete && !won && /* @__PURE__ */ jsxRuntime.jsx(HStack, { justify: "center", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "primary", onClick: handleReset, children: t("negotiator.playAgain") }) })
       ] })
     }
@@ -44499,6 +44705,7 @@ var init_NegotiatorBoard = __esm({
   "components/game/organisms/puzzles/negotiator/NegotiatorBoard.tsx"() {
     init_atoms2();
     init_useEventBus();
+    init_boardEntity();
     NegotiatorBoard.displayName = "NegotiatorBoard";
   }
 });
@@ -44534,13 +44741,13 @@ var init_PricingOrganism = __esm({
         return /* @__PURE__ */ jsxRuntime.jsx(ErrorState, { message: error.message, className });
       }
       const plans = items.map((plan) => ({
-        name: plan.name,
-        price: plan.price,
-        description: plan.description,
-        features: plan.features,
-        action: { label: plan.actionLabel, href: plan.actionHref },
-        highlighted: plan.highlighted,
-        badge: plan.badge
+        name: String(plan.name ?? ""),
+        price: String(plan.price ?? ""),
+        description: plan.description != null ? String(plan.description) : void 0,
+        features: (plan.features ?? []).map((f3) => String(f3)),
+        action: { label: String(plan.actionLabel ?? ""), href: String(plan.actionHref ?? "") },
+        highlighted: Boolean(plan.highlighted),
+        badge: plan.badge != null ? String(plan.badge) : void 0
       }));
       return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: cn("w-full", className), children: [
         (heading || subtitle) && /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", align: "center", className: "w-full", children: [
@@ -46630,16 +46837,20 @@ function SequencerBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
+  const resolved = boardEntity(entity);
+  const maxSlots = num(resolved?.maxSlots);
+  const solutions = Array.isArray(resolved?.solutions) ? resolved.solutions : [];
+  const availableActions = Array.isArray(resolved?.availableActions) ? resolved.availableActions : [];
+  const allowDuplicates = resolved?.allowDuplicates !== false;
   const [headerError, setHeaderError] = React97.useState(false);
   const [slots, setSlots] = React97.useState(
-    () => Array.from({ length: resolved?.maxSlots ?? 0 }, () => void 0)
+    () => Array.from({ length: maxSlots }, () => void 0)
   );
   const [playState, setPlayState] = React97.useState("idle");
   const [currentStep, setCurrentStep] = React97.useState(-1);
   const [attempts, setAttempts] = React97.useState(0);
   const [slotFeedback, setSlotFeedback] = React97.useState(
-    () => Array.from({ length: resolved?.maxSlots ?? 0 }, () => null)
+    () => Array.from({ length: maxSlots }, () => null)
   );
   const timerRef = React97.useRef(null);
   React97.useEffect(() => () => {
@@ -46673,17 +46884,17 @@ function SequencerBoard({
   }, [emit]);
   const handleReset = React97.useCallback(() => {
     if (timerRef.current) clearTimeout(timerRef.current);
-    setSlots(Array.from({ length: resolved?.maxSlots ?? 0 }, () => void 0));
+    setSlots(Array.from({ length: maxSlots }, () => void 0));
     setPlayState("idle");
     setCurrentStep(-1);
     setAttempts(0);
-    setSlotFeedback(Array.from({ length: resolved?.maxSlots ?? 0 }, () => null));
-  }, [resolved?.maxSlots]);
+    setSlotFeedback(Array.from({ length: maxSlots }, () => null));
+  }, [maxSlots]);
   const filledSlots = slots.filter((s) => !!s);
   const canPlay = filledSlots.length > 0 && playState === "idle";
   const handlePlay = React97.useCallback(() => {
     if (!canPlay) return;
-    setSlotFeedback(Array.from({ length: resolved?.maxSlots ?? 0 }, () => null));
+    setSlotFeedback(Array.from({ length: maxSlots }, () => null));
     emit("UI:PLAY_SOUND", { key: "confirm" });
     const sequence = slots.map((s) => s?.id || "");
     if (playEvent) {
@@ -46694,10 +46905,10 @@ function SequencerBoard({
     let step = 0;
     const advance = () => {
       step++;
-      if (step >= (resolved?.maxSlots ?? 0)) {
+      if (step >= maxSlots) {
         const playerSeq = slots.map((s) => s?.id);
         const playerIds = slots.filter(Boolean).map((s) => s?.id || "");
-        const success = (resolved?.solutions ?? []).some(
+        const success = solutions.some(
           (sol) => sol.length === playerIds.length && sol.every((id, i) => id === playerIds[i])
         );
         if (success) {
@@ -46709,7 +46920,7 @@ function SequencerBoard({
           }
         } else {
           setAttempts((prev) => prev + 1);
-          const feedback = computeSlotFeedback(playerSeq, resolved?.solutions ?? []);
+          const feedback = computeSlotFeedback(playerSeq, solutions);
           setSlotFeedback(feedback);
           setPlayState("idle");
           setCurrentStep(-1);
@@ -46727,10 +46938,10 @@ function SequencerBoard({
       }
     };
     timerRef.current = setTimeout(advance, stepDurationMs);
-  }, [canPlay, slots, resolved?.maxSlots, resolved?.solutions, stepDurationMs, playEvent, completeEvent, emit]);
+  }, [canPlay, slots, maxSlots, solutions, stepDurationMs, playEvent, completeEvent, emit]);
   const machine = {
-    name: resolved?.title ?? "",
-    description: resolved?.description ?? "",
+    name: str(resolved?.title),
+    description: str(resolved?.description),
     states: slots.map((s, i) => stepLabel(s, i)),
     currentState: currentStep >= 0 ? stepLabel(slots[currentStep], currentStep) : "__idle__",
     transitions: slots.slice(0, -1).map((s, i) => ({
@@ -46739,37 +46950,41 @@ function SequencerBoard({
       event: "NEXT"
     }))
   };
-  const usedIds = resolved?.allowDuplicates === false ? slots.filter(Boolean).map((s) => s?.id || "") : [];
-  const showHint = attempts >= 3 && !!resolved?.hint;
+  const usedIds = !allowDuplicates ? slots.filter(Boolean).map((s) => s?.id || "") : [];
+  const hint = str(resolved?.hint);
+  const showHint = attempts >= 3 && !!hint;
   const hasFeedback = slotFeedback.some((f3) => f3 !== null);
   const correctCount = slotFeedback.filter((f3) => f3 === "correct").length;
   const encourageKey = ENCOURAGEMENT_KEYS2[Math.min(attempts - 1, ENCOURAGEMENT_KEYS2.length - 1)] ?? ENCOURAGEMENT_KEYS2[0];
   if (!resolved) return null;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     VStack,
     {
       className: cn("p-4 gap-6", className),
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", className: "text-foreground", children: resolved.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground", children: resolved.description })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", className: "text-foreground", children: str(resolved.title) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground", children: str(resolved.description) })
         ] }),
         showHint && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-3 rounded-container bg-accent/10 border border-accent/30", children: /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-start", gap: "xs", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-accent font-bold shrink-0", children: "\u{1F4A1} " + t("game.hint") + ":" }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground", children: resolved.hint })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground", children: hint })
         ] }) }),
         filledSlots.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(TraitStateViewer, { trait: machine, variant: "linear", size: "md" }),
         /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", children: [
           /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-center justify-between", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground font-medium", children: t("sequencer.yourSequence") + ":" }),
             hasFeedback && playState === "idle" && /* @__PURE__ */ jsxRuntime.jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
-              `${correctCount}/${resolved.maxSlots} `,
+              `${correctCount}/${maxSlots} `,
               "\u2705"
             ] })
           ] }),
@@ -46777,7 +46992,7 @@ function SequencerBoard({
             SequenceBar,
             {
               slots,
-              maxSlots: resolved.maxSlots,
+              maxSlots,
               onSlotDrop: handleSlotDrop,
               onSlotRemove: handleSlotRemove,
               playing: playState === "playing",
@@ -46791,15 +47006,15 @@ function SequencerBoard({
         playState !== "playing" && /* @__PURE__ */ jsxRuntime.jsx(
           ActionPalette,
           {
-            actions: resolved.availableActions,
+            actions: availableActions,
             usedActionIds: usedIds,
-            allowDuplicates: resolved.allowDuplicates !== false,
+            allowDuplicates,
             categoryColors,
             label: t("sequencer.dragActions")
           }
         ),
         hasFeedback && playState === "idle" && attempts > 0 && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-3 rounded-container bg-warning/10 border border-warning/30 text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground", children: t(encourageKey) }) }),
-        playState === "success" && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-success/20 border border-success text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", className: "text-success", children: resolved.successMessage || t("sequencer.levelComplete") }) }),
+        playState === "success" && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-success/20 border border-success text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", className: "text-success", children: str(resolved.successMessage) || t("sequencer.levelComplete") }) }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             Button,
@@ -46823,6 +47038,7 @@ var init_SequencerBoard = __esm({
     init_cn();
     init_useEventBus();
     init_TraitStateViewer();
+    init_boardEntity();
     init_SequenceBar();
     init_ActionPalette();
     ENCOURAGEMENT_KEYS2 = [
@@ -46872,18 +47088,21 @@ var init_ShowcaseOrganism = __esm({
           heading && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h2", align: "center", children: heading }),
           subtitle && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body1", color: "muted", align: "center", className: "max-w-2xl", children: subtitle })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(SimpleGrid, { cols: columns, gap: "lg", children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
-          ShowcaseCard,
-          {
-            title: item.title,
-            description: item.description,
-            image: item.image,
-            href: item.href,
-            badge: item.badge,
-            accentColor: item.accentColor
-          },
-          item.id
-        )) })
+        /* @__PURE__ */ jsxRuntime.jsx(SimpleGrid, { cols: columns, gap: "lg", children: items.map((item) => {
+          const imageRaw = item.image;
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            ShowcaseCard,
+            {
+              title: String(item.title ?? ""),
+              description: item.description != null ? String(item.description) : void 0,
+              image: { src: String(imageRaw?.src ?? ""), alt: String(imageRaw?.alt ?? "") },
+              href: item.href != null ? String(item.href) : void 0,
+              badge: item.badge != null ? String(item.badge) : void 0,
+              accentColor: item.accentColor != null ? String(item.accentColor) : void 0
+            },
+            String(item.id ?? "")
+          );
+        }) })
       ] });
     };
     ShowcaseOrganism.displayName = "ShowcaseOrganism";
@@ -47251,8 +47470,8 @@ function SimulatorBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
-  const parameters = resolved?.parameters ?? [];
+  const resolved = boardEntity(entity);
+  const parameters = Array.isArray(resolved?.parameters) ? resolved.parameters : [];
   const [values, setValues] = React97.useState(() => {
     const init = {};
     for (const p2 of parameters) {
@@ -47266,15 +47485,15 @@ function SimulatorBoard({
   const [showHint, setShowHint] = React97.useState(false);
   const computeOutput = React97.useCallback((params) => {
     try {
-      const fn = new Function("params", `return (${resolved?.computeExpression})`);
+      const fn = new Function("params", `return (${str(resolved?.computeExpression)})`);
       return fn(params);
     } catch {
       return 0;
     }
   }, [resolved?.computeExpression]);
   const output = React97.useMemo(() => computeOutput(values) ?? 0, [computeOutput, values]);
-  const targetValue = resolved?.targetValue ?? 0;
-  const targetTolerance = resolved?.targetTolerance ?? 0;
+  const targetValue = num(resolved?.targetValue);
+  const targetTolerance = num(resolved?.targetTolerance);
   const isCorrect = Math.abs(output - targetValue) <= targetTolerance;
   const handleParameterChange = (id, value) => {
     if (submitted) return;
@@ -47289,7 +47508,7 @@ function SimulatorBoard({
   };
   const handleReset = () => {
     setSubmitted(false);
-    if (attempts >= 2 && resolved?.hint) {
+    if (attempts >= 2 && str(resolved?.hint)) {
       setShowHint(true);
     }
   };
@@ -47304,20 +47523,26 @@ function SimulatorBoard({
     setShowHint(false);
   };
   if (!resolved) return null;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
+  const hint = str(resolved.hint);
+  const outputLabel = str(resolved.outputLabel);
+  const outputUnit = str(resolved.outputUnit);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Box,
     {
       className,
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: "p-4", children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: resolved.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.description })
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", weight: "bold", children: str(resolved.title) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: str(resolved.description) })
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "md", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: t("simulator.parameters") }),
@@ -47358,28 +47583,28 @@ function SimulatorBoard({
           ] }, param.id))
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", align: "center", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: resolved.outputLabel }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", weight: "bold", className: "uppercase tracking-wider text-muted-foreground", children: outputLabel }),
           /* @__PURE__ */ jsxRuntime.jsxs(Typography, { variant: "h3", weight: "bold", children: [
             output.toFixed(2),
             " ",
-            resolved.outputUnit
+            outputUnit
           ] }),
           submitted && /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "xs", align: "center", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: isCorrect ? LucideIcons2.CheckCircle : LucideIcons2.XCircle, size: "sm", className: isCorrect ? "text-success" : "text-error" }),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: isCorrect ? "text-success" : "text-error", children: isCorrect ? resolved.successMessage ?? t("simulator.correct") : resolved.failMessage ?? t("simulator.incorrect") })
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", className: isCorrect ? "text-success" : "text-error", children: isCorrect ? str(resolved.successMessage) || t("simulator.correct") : str(resolved.failMessage) || t("simulator.incorrect") })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsxs(Typography, { variant: "caption", className: "text-muted-foreground", children: [
             t("simulator.target"),
             ": ",
             targetValue,
             " ",
-            resolved.outputUnit,
+            outputUnit,
             " (\xB1",
             targetTolerance,
             ")"
           ] })
         ] }) }),
-        showHint && resolved.hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: resolved.hint }) }),
+        showHint && hint && /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 border-l-4 border-l-warning", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body", children: hint }) }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", justify: "center", children: [
           !submitted ? /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "primary", onClick: handleSubmit, children: [
             /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: LucideIcons2.Play, size: "sm" }),
@@ -47398,6 +47623,7 @@ var init_SimulatorBoard = __esm({
   "components/game/organisms/puzzles/simulator/SimulatorBoard.tsx"() {
     init_atoms2();
     init_useEventBus();
+    init_boardEntity();
     SimulatorBoard.displayName = "SimulatorBoard";
   }
 });
@@ -47823,22 +48049,25 @@ function VariablePanel({
   return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { className: cn("p-3 rounded-lg bg-card border border-border", className), gap: "sm", children: [
     /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground font-medium", children: t("stateArchitect.variables", { name: entityName }) }),
     variables.map((v) => {
-      const max = v.max ?? 100;
-      const min = v.min ?? 0;
-      const pct = Math.round((v.value - min) / (max - min) * 100);
+      const name = v.name == null ? "" : String(v.name);
+      const value = numField(v.value);
+      const max = numField(v.max, 100);
+      const min = numField(v.min, 0);
+      const unit = v.unit == null ? "" : String(v.unit);
+      const pct = Math.round((value - min) / (max - min) * 100);
       const isHigh = pct > 80;
       const isLow = pct < 20;
       return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "none", children: [
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-center justify-between", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-foreground font-medium", children: v.name }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-foreground font-medium", children: name }),
           /* @__PURE__ */ jsxRuntime.jsxs(Typography, { variant: "caption", className: cn(
             isHigh ? "text-error" : isLow ? "text-warning" : "text-foreground"
           ), children: [
-            v.value,
-            v.unit || "",
+            value,
+            unit,
             " / ",
             max,
-            v.unit || ""
+            unit
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -47849,14 +48078,19 @@ function VariablePanel({
             size: "sm"
           }
         )
-      ] }, v.name);
+      ] }, name);
     })
   ] });
 }
+var numField;
 var init_VariablePanel = __esm({
   "components/game/organisms/puzzles/state-architect/VariablePanel.tsx"() {
     init_atoms2();
     init_cn();
+    numField = (v, fallback = 0) => {
+      const n = Number(v);
+      return Number.isFinite(n) ? n : fallback;
+    };
     VariablePanel.displayName = "VariablePanel";
   }
 });
@@ -47883,14 +48117,21 @@ function StateArchitectBoard({
 }) {
   const { emit } = useEventBus();
   const { t } = hooks.useTranslate();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
-  const [transitions, setTransitions] = React97.useState(resolved?.transitions ?? []);
+  const resolved = boardEntity(entity);
+  const entityStates = Array.isArray(resolved?.states) ? resolved.states : [];
+  const initialState = str(resolved?.initialState);
+  const entityName = str(resolved?.entityName);
+  const availableEvents = Array.isArray(resolved?.availableEvents) ? resolved.availableEvents : [];
+  const testCases = Array.isArray(resolved?.testCases) ? resolved.testCases : [];
+  const entityTransitions = Array.isArray(resolved?.transitions) ? resolved.transitions : [];
+  const entityVariables = rows(resolved?.variables);
+  const [transitions, setTransitions] = React97.useState(entityTransitions);
   const [headerError, setHeaderError] = React97.useState(false);
   const [playState, setPlayState] = React97.useState("editing");
-  const [currentState, setCurrentState] = React97.useState(resolved?.initialState ?? "");
+  const [currentState, setCurrentState] = React97.useState(initialState);
   const [selectedState, setSelectedState] = React97.useState(null);
   const [testResults, setTestResults] = React97.useState([]);
-  const [variables, setVariables] = React97.useState(resolved?.variables ?? []);
+  const [variables, setVariables] = React97.useState(() => [...entityVariables]);
   const [attempts, setAttempts] = React97.useState(0);
   const timerRef = React97.useRef(null);
   const [addingFrom, setAddingFrom] = React97.useState(null);
@@ -47899,12 +48140,12 @@ function StateArchitectBoard({
   }, []);
   const GRAPH_W = 500;
   const GRAPH_H = 400;
-  const positions = React97.useMemo(() => layoutStates(resolved?.states ?? [], GRAPH_W, GRAPH_H), [resolved?.states]);
+  const positions = React97.useMemo(() => layoutStates(entityStates, GRAPH_W, GRAPH_H), [entityStates]);
   const handleStateClick = React97.useCallback((state) => {
     if (playState !== "editing") return;
     if (addingFrom) {
       if (addingFrom !== state) {
-        const event = resolved?.availableEvents[0] || "EVENT";
+        const event = availableEvents[0] || "EVENT";
         const newTrans = {
           id: `t-${nextTransId++}`,
           from: addingFrom,
@@ -47917,7 +48158,7 @@ function StateArchitectBoard({
     } else {
       setSelectedState(state);
     }
-  }, [playState, addingFrom, resolved?.availableEvents]);
+  }, [playState, addingFrom, availableEvents]);
   const handleStartAddTransition = React97.useCallback(() => {
     if (!selectedState) return;
     setAddingFrom(selectedState);
@@ -47926,9 +48167,9 @@ function StateArchitectBoard({
     setTransitions((prev) => prev.filter((t2) => t2.id !== transId));
   }, []);
   const machine = React97.useMemo(() => ({
-    name: resolved?.entityName ?? "",
-    description: resolved?.description ?? "",
-    states: resolved?.states ?? [],
+    name: entityName,
+    description: str(resolved?.description),
+    states: entityStates,
     currentState,
     transitions: transitions.map((t2) => ({
       from: t2.from,
@@ -47936,7 +48177,7 @@ function StateArchitectBoard({
       event: t2.event,
       guardHint: t2.guardHint
     }))
-  }), [resolved, currentState, transitions]);
+  }), [entityName, resolved, entityStates, currentState, transitions]);
   const handleTest = React97.useCallback(() => {
     if (playState !== "editing") return;
     if (testEvent) emit(`UI:${testEvent}`, {});
@@ -47945,7 +48186,7 @@ function StateArchitectBoard({
     const results = [];
     let testIdx = 0;
     const runNextTest = () => {
-      if (testIdx >= (resolved?.testCases.length ?? 0)) {
+      if (testIdx >= testCases.length) {
         const allPassed = results.every((r2) => r2.passed);
         setPlayState(allPassed ? "success" : "fail");
         setTestResults(results);
@@ -47960,9 +48201,9 @@ function StateArchitectBoard({
         }
         return;
       }
-      const testCase = resolved?.testCases[testIdx];
+      const testCase = testCases[testIdx];
       if (!testCase) return;
-      let state = resolved.initialState;
+      let state = initialState;
       for (const event of testCase.events) {
         const trans = transitions.find((t2) => t2.from === state && t2.event === event);
         if (trans) {
@@ -47980,53 +48221,57 @@ function StateArchitectBoard({
       timerRef.current = setTimeout(runNextTest, stepDurationMs);
     };
     timerRef.current = setTimeout(runNextTest, stepDurationMs);
-  }, [playState, transitions, resolved, stepDurationMs, testEvent, completeEvent, emit]);
+  }, [playState, transitions, testCases, initialState, stepDurationMs, testEvent, completeEvent, emit]);
   const handleTryAgain = React97.useCallback(() => {
     if (timerRef.current) clearTimeout(timerRef.current);
     setPlayState("editing");
-    setCurrentState(resolved?.initialState ?? "");
+    setCurrentState(initialState);
     setTestResults([]);
-  }, [resolved?.initialState]);
+  }, [initialState]);
   const handleReset = React97.useCallback(() => {
     if (timerRef.current) clearTimeout(timerRef.current);
-    setTransitions(resolved?.transitions ?? []);
+    setTransitions(entityTransitions);
     setPlayState("editing");
-    setCurrentState(resolved?.initialState ?? "");
+    setCurrentState(initialState);
     setTestResults([]);
-    setVariables(resolved?.variables ?? []);
+    setVariables([...entityVariables]);
     setSelectedState(null);
     setAddingFrom(null);
     setAttempts(0);
-  }, [resolved]);
+  }, [entityTransitions, initialState, entityVariables]);
   const codeData = React97.useMemo(() => ({
-    name: resolved?.entityName ?? "",
-    states: resolved?.states ?? [],
-    initialState: resolved?.initialState ?? "",
+    name: entityName,
+    states: entityStates,
+    initialState,
     transitions: transitions.map((t2) => ({
       from: t2.from,
       to: t2.to,
       event: t2.event,
       ...t2.guardHint ? { guard: t2.guardHint } : {}
     }))
-  }), [resolved, transitions]);
+  }), [entityName, entityStates, initialState, transitions]);
   if (!resolved) return null;
+  const theme = resolved.theme ?? void 0;
+  const themeBackground = theme?.background;
+  const headerImage = str(resolved.headerImage);
+  const hint = str(resolved.hint);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     VStack,
     {
       className: cn("p-4 gap-6", className),
       style: {
-        backgroundImage: resolved.theme?.background ? `url(${resolved.theme.background})` : void 0,
+        backgroundImage: themeBackground ? `url(${themeBackground})` : void 0,
         backgroundSize: "cover",
         backgroundPosition: "center"
       },
       children: [
-        resolved.headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolved.headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : resolved.headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
+        headerImage && !headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 overflow-hidden rounded-container", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: headerImage, alt: "", onError: () => setHeaderError(true), className: "w-full h-full object-cover" }) }) : headerImage && headerError ? /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "w-full h-32 rounded-container bg-gradient-to-br from-muted to-accent opacity-60" }) : null,
         /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", className: "text-foreground", children: resolved.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground", children: resolved.description }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h4", className: "text-foreground", children: str(resolved.title) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-muted-foreground", children: str(resolved.description) }),
           /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-center p-2 rounded bg-warning/10 border border-warning/30", gap: "xs", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-warning font-bold", children: t("game.hint") + ":" }),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-foreground", children: resolved.hint })
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "caption", className: "text-foreground", children: hint })
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "flex-wrap items-start", gap: "lg", children: [
@@ -48074,14 +48319,14 @@ function StateArchitectBoard({
                       ]
                     }
                   ),
-                  resolved.states.map((state) => /* @__PURE__ */ jsxRuntime.jsx(
+                  entityStates.map((state) => /* @__PURE__ */ jsxRuntime.jsx(
                     StateNode2,
                     {
                       name: state,
                       position: positions[state],
                       isCurrent: state === currentState,
                       isSelected: state === selectedState,
-                      isInitial: state === resolved.initialState,
+                      isInitial: state === initialState,
                       onClick: () => handleStateClick(state)
                     },
                     state
@@ -48128,7 +48373,7 @@ function StateArchitectBoard({
             /* @__PURE__ */ jsxRuntime.jsx(
               VariablePanel,
               {
-                entityName: resolved.entityName,
+                entityName,
                 variables
               }
             ),
@@ -48143,12 +48388,12 @@ function StateArchitectBoard({
             resolved.showCodeView !== false && /* @__PURE__ */ jsxRuntime.jsx(CodeView, { data: codeData, label: "View Code" })
           ] })
         ] }),
-        playState === "success" && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-success/20 border border-success text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", className: "text-success", children: resolved.successMessage || t("stateArchitect.allPassed") }) }),
+        playState === "success" && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-success/20 border border-success text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h5", className: "text-success", children: str(resolved.successMessage) || t("stateArchitect.allPassed") }) }),
         playState === "fail" && /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", children: [
           /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-4 rounded-container bg-warning/10 border border-warning/30 text-center", children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body1", className: "text-foreground font-medium", children: t(ENCOURAGEMENT_KEYS3[Math.min(attempts - 1, ENCOURAGEMENT_KEYS3.length - 1)] ?? ENCOURAGEMENT_KEYS3[0]) }) }),
-          attempts >= 3 && resolved.hint && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-3 rounded-container bg-accent/10 border border-accent/30", children: /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-start", gap: "xs", children: [
+          attempts >= 3 && hint && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "p-3 rounded-container bg-accent/10 border border-accent/30", children: /* @__PURE__ */ jsxRuntime.jsxs(HStack, { className: "items-start", gap: "xs", children: [
             /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-accent font-bold shrink-0", children: "\u{1F4A1} " + t("game.hint") + ":" }),
-            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground", children: resolved.hint })
+            /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", className: "text-foreground", children: hint })
           ] }) })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs(HStack, { gap: "sm", children: [
@@ -48178,6 +48423,7 @@ var init_StateArchitectBoard = __esm({
     init_TransitionArrow();
     init_VariablePanel();
     init_CodeView();
+    init_boardEntity();
     ENCOURAGEMENT_KEYS3 = [
       "puzzle.tryAgain1",
       "puzzle.tryAgain2",
@@ -48214,8 +48460,8 @@ var init_StatsOrganism = __esm({
         return /* @__PURE__ */ jsxRuntime.jsx(ErrorState, { message: error.message, className });
       }
       const stats = items.map((item) => ({
-        value: item.value,
-        label: item.label
+        value: String(item.value ?? ""),
+        label: String(item.label ?? "")
       }));
       return /* @__PURE__ */ jsxRuntime.jsx(
         StatsGrid,
@@ -48261,10 +48507,10 @@ var init_StepFlowOrganism = __esm({
         return /* @__PURE__ */ jsxRuntime.jsx(ErrorState, { message: error.message, className });
       }
       const steps = items.map((item) => ({
-        number: item.number,
-        title: item.title,
-        description: item.description,
-        icon: item.icon
+        number: item.number != null ? Number(item.number) : void 0,
+        title: String(item.title ?? ""),
+        description: String(item.description ?? ""),
+        icon: item.icon != null ? String(item.icon) : void 0
       }));
       return /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "lg", className: cn("w-full", className), children: [
         (heading || subtitle) && /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "sm", align: "center", className: "w-full", children: [
@@ -48437,13 +48683,13 @@ var init_TeamOrganism = __esm({
         /* @__PURE__ */ jsxRuntime.jsx(SimpleGrid, { cols: cols > 0 ? cols : 1, gap: "lg", children: items.map((member) => /* @__PURE__ */ jsxRuntime.jsx(
           TeamCard,
           {
-            name: member.name,
-            nameAr: member.nameAr,
-            role: member.role,
-            bio: member.bio,
-            avatar: member.avatar
+            name: String(member.name ?? ""),
+            nameAr: member.nameAr != null ? String(member.nameAr) : void 0,
+            role: String(member.role ?? ""),
+            bio: String(member.bio ?? ""),
+            avatar: member.avatar != null ? String(member.avatar) : void 0
           },
-          member.id
+          String(member.id ?? "")
         )) })
       ] });
     };
@@ -48680,8 +48926,8 @@ function useBattleState(initialUnits, eventConfig = {}, callbacks = {}) {
   const [turn, setTurn] = React97.useState(1);
   const [gameResult, setGameResult] = React97.useState(null);
   const checkGameEnd = React97.useCallback((currentUnits) => {
-    const pa = currentUnits.filter((u) => u.team === "player" && u.health > 0);
-    const ea = currentUnits.filter((u) => u.team === "enemy" && u.health > 0);
+    const pa = currentUnits.filter((u) => unitTeam(u) === "player" && unitHealth(u) > 0);
+    const ea = currentUnits.filter((u) => unitTeam(u) === "enemy" && unitHealth(u) > 0);
     if (pa.length === 0) {
       setGameResult("defeat");
       setPhase("game_over");
@@ -48699,34 +48945,36 @@ function useBattleState(initialUnits, eventConfig = {}, callbacks = {}) {
     }
   }, [onGameEnd, gameEndEvent, eventBus]);
   const handleUnitClick = React97.useCallback((unitId) => {
-    const unit = units.find((u) => u.id === unitId);
+    const unit = units.find((u) => str(u.id) === unitId);
     if (!unit) return;
     if (unitClickEvent) {
       eventBus.emit(`UI:${unitClickEvent}`, { unitId });
     }
     if (phase === "observation" || phase === "selection") {
-      if (unit.team === "player") {
+      if (unitTeam(unit) === "player") {
         setSelectedUnitId(unitId);
         setPhase("movement");
       }
     } else if (phase === "action") {
-      const selectedUnit = units.find((u) => u.id === selectedUnitId);
+      const selectedUnit = units.find((u) => str(u.id) === selectedUnitId);
       if (!selectedUnit) return;
-      if (unit.team === "enemy") {
-        const dx = Math.abs(unit.position.x - selectedUnit.position.x);
-        const dy = Math.abs(unit.position.y - selectedUnit.position.y);
+      if (unitTeam(unit) === "enemy") {
+        const up = unitPosition(unit);
+        const sp = unitPosition(selectedUnit);
+        const dx = Math.abs(up.x - sp.x);
+        const dy = Math.abs(up.y - sp.y);
         if (dx <= 1 && dy <= 1 && dx + dy > 0) {
-          const damage = calculateDamage ? calculateDamage(selectedUnit, unit) : Math.max(1, selectedUnit.attack - unit.defense);
-          const newHealth = Math.max(0, unit.health - damage);
+          const damage = calculateDamage ? calculateDamage(selectedUnit, unit) : Math.max(1, num(selectedUnit.attack) - num(unit.defense));
+          const newHealth = Math.max(0, unitHealth(unit) - damage);
           const updatedUnits = units.map(
-            (u) => u.id === unit.id ? { ...u, health: newHealth } : u
+            (u) => str(u.id) === str(unit.id) ? { ...u, health: newHealth } : u
           );
           setUnits(updatedUnits);
           onAttack?.(selectedUnit, unit, damage);
           if (attackEvent) {
             eventBus.emit(`UI:${attackEvent}`, {
-              attackerId: selectedUnit.id,
-              targetId: unit.id,
+              attackerId: str(selectedUnit.id),
+              targetId: str(unit.id),
               damage
             });
           }
@@ -48743,16 +48991,20 @@ function useBattleState(initialUnits, eventConfig = {}, callbacks = {}) {
       eventBus.emit(`UI:${tileClickEvent}`, { x, y });
     }
     if (phase === "movement" && selectedUnitId) {
-      const selectedUnit = units.find((u) => u.id === selectedUnitId);
+      const selectedUnit = units.find((u) => str(u.id) === selectedUnitId);
       if (!selectedUnit) return;
-      const dx = Math.abs(x - selectedUnit.position.x);
-      const dy = Math.abs(y - selectedUnit.position.y);
+      const sp = unitPosition(selectedUnit);
+      const dx = Math.abs(x - sp.x);
+      const dy = Math.abs(y - sp.y);
       const dist = dx + dy;
-      if (dist > 0 && dist <= selectedUnit.movement) {
-        if (!units.some((u) => u.position.x === x && u.position.y === y && u.health > 0)) {
+      if (dist > 0 && dist <= num(selectedUnit.movement)) {
+        if (!units.some((u) => {
+          const p2 = unitPosition(u);
+          return p2.x === x && p2.y === y && unitHealth(u) > 0;
+        })) {
           setUnits(
             (prev) => prev.map(
-              (u) => u.id === selectedUnitId ? { ...u, position: { x, y } } : u
+              (u) => str(u.id) === selectedUnitId ? { ...u, position: { x, y } } : u
             )
           );
           setPhase("action");
@@ -48795,12 +49047,13 @@ var init_useBattleState = __esm({
   "components/game/organisms/hooks/useBattleState.ts"() {
     "use client";
     init_useEventBus();
+    init_boardEntity();
   }
 });
 function UncontrolledBattleBoard({ entity, ...rest }) {
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
+  const resolved = boardEntity(entity);
   const battleState = useBattleState(
-    resolved?.initialUnits ?? [],
+    rows(resolved?.initialUnits),
     {
       tileClickEvent: rest.tileClickEvent,
       unitClickEvent: rest.unitClickEvent,
@@ -48836,10 +49089,23 @@ function UncontrolledBattleBoard({ entity, ...rest }) {
 var init_UncontrolledBattleBoard = __esm({
   "components/game/organisms/UncontrolledBattleBoard.tsx"() {
     init_BattleBoard();
+    init_boardEntity();
     init_useBattleState();
     UncontrolledBattleBoard.displayName = "UncontrolledBattleBoard";
   }
 });
+function heroPosition(h) {
+  return vec2(h.position);
+}
+function heroOwner(h) {
+  return str(h.owner);
+}
+function heroMovement(h) {
+  return num(h.movement);
+}
+function hexPassable(h) {
+  return h.passable !== false;
+}
 function defaultIsInRange(from, to, range) {
   return Math.abs(from.x - to.x) + Math.abs(from.y - to.y) <= range;
 }
@@ -48870,36 +49136,36 @@ function WorldMapBoard({
   className
 }) {
   const eventBus = useEventBus();
-  const resolved = Array.isArray(entity) ? entity[0] : entity;
-  const hexes = resolved?.hexes ?? [];
-  const heroes = resolved?.heroes ?? [];
-  const features = resolved?.features ?? [];
-  const selectedHeroId = resolved?.selectedHeroId;
+  const resolved = boardEntity(entity);
+  const hexes = rows(resolved?.hexes);
+  const heroes = rows(resolved?.heroes);
+  const features = Array.isArray(resolved?.features) ? resolved.features : [];
+  const selectedHeroId = resolved?.selectedHeroId ?? null;
   const assetManifest = resolved?.assetManifest;
   const backgroundImage = resolved?.backgroundImage;
   const [hoveredTile, setHoveredTile] = React97.useState(null);
   const selectedHero = React97.useMemo(
-    () => heroes.find((h) => h.id === selectedHeroId) ?? null,
+    () => heroes.find((h) => str(h.id) === selectedHeroId) ?? null,
     [heroes, selectedHeroId]
   );
   const tiles = React97.useMemo(
     () => hexes.map((hex) => ({
-      x: hex.x,
-      y: hex.y,
-      terrain: hex.terrain,
-      terrainSprite: hex.terrainSprite
+      x: num(hex.x),
+      y: num(hex.y),
+      terrain: str(hex.terrain),
+      terrainSprite: hex.terrainSprite == null ? void 0 : str(hex.terrainSprite)
     })),
     [hexes]
   );
   const baseUnits = React97.useMemo(
     () => heroes.map((hero) => ({
-      id: hero.id,
-      position: hero.position,
-      name: hero.name,
-      team: hero.owner === "enemy" ? "enemy" : "player",
+      id: str(hero.id),
+      position: heroPosition(hero),
+      name: str(hero.name),
+      team: heroOwner(hero) === "enemy" ? "enemy" : "player",
       health: 100,
       maxHealth: 100,
-      sprite: hero.sprite
+      sprite: hero.sprite == null ? void 0 : str(hero.sprite)
     })),
     [heroes]
   );
@@ -48940,73 +49206,94 @@ function WorldMapBoard({
   const isoUnits = React97.useMemo(() => {
     if (movingPositions.size === 0) return baseUnits;
     return baseUnits.map((u) => {
-      const pos = movingPositions.get(u.id);
+      const pos = u.id == null ? void 0 : movingPositions.get(u.id);
       return pos ? { ...u, position: pos } : u;
     });
   }, [baseUnits, movingPositions]);
   const validMoves = React97.useMemo(() => {
-    if (!selectedHero || selectedHero.movement <= 0) return [];
+    if (!selectedHero || heroMovement(selectedHero) <= 0) return [];
+    const sp = heroPosition(selectedHero);
+    const sOwner = heroOwner(selectedHero);
+    const range = heroMovement(selectedHero);
     const moves = [];
     hexes.forEach((hex) => {
-      if (hex.passable === false) return;
-      if (hex.x === selectedHero.position.x && hex.y === selectedHero.position.y) return;
-      if (!isInRange(selectedHero.position, { x: hex.x, y: hex.y }, selectedHero.movement)) return;
-      if (heroes.some((h) => h.position.x === hex.x && h.position.y === hex.y && h.owner === selectedHero.owner)) return;
-      moves.push({ x: hex.x, y: hex.y });
+      const hx = num(hex.x);
+      const hy = num(hex.y);
+      if (!hexPassable(hex)) return;
+      if (hx === sp.x && hy === sp.y) return;
+      if (!isInRange(sp, { x: hx, y: hy }, range)) return;
+      if (heroes.some((h) => {
+        const hp = heroPosition(h);
+        return hp.x === hx && hp.y === hy && heroOwner(h) === sOwner;
+      })) return;
+      moves.push({ x: hx, y: hy });
     });
     return moves;
   }, [selectedHero, hexes, heroes, isInRange]);
   const attackTargets = React97.useMemo(() => {
-    if (!selectedHero || selectedHero.movement <= 0) return [];
-    return heroes.filter((h) => h.owner !== selectedHero.owner).filter((h) => isInRange(selectedHero.position, h.position, selectedHero.movement)).map((h) => h.position);
+    if (!selectedHero || heroMovement(selectedHero) <= 0) return [];
+    const sp = heroPosition(selectedHero);
+    const sOwner = heroOwner(selectedHero);
+    const range = heroMovement(selectedHero);
+    return heroes.filter((h) => heroOwner(h) !== sOwner).filter((h) => isInRange(sp, heroPosition(h), range)).map((h) => heroPosition(h));
   }, [selectedHero, heroes, isInRange]);
-  const maxY = Math.max(...hexes.map((h) => h.y), 0);
+  const maxY = Math.max(...hexes.map((h) => num(h.y)), 0);
   const baseOffsetX = (maxY + 1) * (TILE_WIDTH * scale / 2);
   const tileToScreen = React97.useCallback(
     (tx, ty) => isoToScreen(tx, ty, scale, baseOffsetX),
     [scale, baseOffsetX]
   );
   const hoveredHex = React97.useMemo(
-    () => hoveredTile ? hexes.find((h) => h.x === hoveredTile.x && h.y === hoveredTile.y) ?? null : null,
+    () => hoveredTile ? hexes.find((h) => num(h.x) === hoveredTile.x && num(h.y) === hoveredTile.y) ?? null : null,
     [hoveredTile, hexes]
   );
   const hoveredHero = React97.useMemo(
-    () => hoveredTile ? heroes.find((h) => h.position.x === hoveredTile.x && h.position.y === hoveredTile.y) ?? null : null,
+    () => hoveredTile ? heroes.find((h) => {
+      const hp = heroPosition(h);
+      return hp.x === hoveredTile.x && hp.y === hoveredTile.y;
+    }) ?? null : null,
     [hoveredTile, heroes]
   );
   const handleTileClick = React97.useCallback((x, y) => {
     if (movementAnimRef.current) return;
-    const hex = hexes.find((h) => h.x === x && h.y === y);
+    const hex = hexes.find((h) => num(h.x) === x && num(h.y) === y);
     if (!hex) return;
     if (tileClickEvent) {
       eventBus.emit(`UI:${tileClickEvent}`, { x, y });
     }
     if (selectedHero && validMoves.some((m) => m.x === x && m.y === y)) {
-      startMoveAnimation(selectedHero.id, { ...selectedHero.position }, { x, y }, () => {
-        onHeroMove?.(selectedHero.id, x, y);
+      const heroId = str(selectedHero.id);
+      startMoveAnimation(heroId, { ...heroPosition(selectedHero) }, { x, y }, () => {
+        onHeroMove?.(heroId, x, y);
         if (heroMoveEvent) {
-          eventBus.emit(`UI:${heroMoveEvent}`, { heroId: selectedHero.id, toX: x, toY: y });
+          eventBus.emit(`UI:${heroMoveEvent}`, { heroId, toX: x, toY: y });
         }
-        if (hex.feature && hex.feature !== "none") {
-          onFeatureEnter?.(selectedHero.id, hex);
+        const feature = str(hex.feature);
+        if (feature && feature !== "none") {
+          onFeatureEnter?.(heroId, hex);
           if (featureEnterEvent) {
-            eventBus.emit(`UI:${featureEnterEvent}`, { heroId: selectedHero.id, feature: hex.feature, hex });
+            eventBus.emit(`UI:${featureEnterEvent}`, { heroId, feature, hex });
           }
         }
       });
       return;
     }
-    const enemy = heroes.find((h) => h.position.x === x && h.position.y === y && h.owner === "enemy");
+    const enemy = heroes.find((h) => {
+      const hp = heroPosition(h);
+      return hp.x === x && hp.y === y && heroOwner(h) === "enemy";
+    });
     if (selectedHero && enemy && attackTargets.some((t) => t.x === x && t.y === y)) {
-      onBattleEncounter?.(selectedHero.id, enemy.id);
+      const attackerId = str(selectedHero.id);
+      const defenderId = str(enemy.id);
+      onBattleEncounter?.(attackerId, defenderId);
       if (battleEncounterEvent) {
-        eventBus.emit(`UI:${battleEncounterEvent}`, { attackerId: selectedHero.id, defenderId: enemy.id });
+        eventBus.emit(`UI:${battleEncounterEvent}`, { attackerId, defenderId });
       }
     }
   }, [hexes, heroes, selectedHero, validMoves, attackTargets, startMoveAnimation, onHeroMove, onFeatureEnter, onBattleEncounter, eventBus, tileClickEvent, heroMoveEvent, featureEnterEvent, battleEncounterEvent]);
   const handleUnitClick = React97.useCallback((unitId) => {
-    const hero = heroes.find((h) => h.id === unitId);
-    if (hero && (hero.owner === "player" || allowMoveAllHeroes)) {
+    const hero = heroes.find((h) => str(h.id) === unitId);
+    if (hero && (heroOwner(hero) === "player" || allowMoveAllHeroes)) {
       onHeroSelect?.(unitId);
       if (heroSelectEvent) {
         eventBus.emit(`UI:${heroSelectEvent}`, { heroId: unitId });
@@ -49079,6 +49366,7 @@ var init_WorldMapBoard = __esm({
     init_Stack();
     init_LoadingState();
     init_IsometricCanvas2();
+    init_boardEntity();
     init_isometric();
     WorldMapBoard.displayName = "WorldMapBoard";
   }
@@ -52642,10 +52930,10 @@ function parseApplicationLevel(schema) {
   }
   const count = schema.orbitals.length;
   const cols = Math.ceil(Math.sqrt(count));
-  const rows = Math.ceil(count / cols);
+  const rows2 = Math.ceil(count / cols);
   const spacing = 200;
   const gridW = cols * spacing;
-  const gridH = rows * spacing;
+  const gridH = rows2 * spacing;
   const originX = (600 - gridW) / 2 + spacing / 2;
   const originY = (400 - gridH) / 2 + spacing / 2;
   schema.orbitals.forEach((orbital, i) => {
@@ -55787,11 +56075,11 @@ function buildMockData(schema) {
       result[entityName] = entity.instances;
       continue;
     }
-    const rows = Array.from(
+    const rows2 = Array.from(
       { length: 10 },
       (_, i) => generateEntityRow(entity, i + 1)
     );
-    result[entityName] = rows;
+    result[entityName] = rows2;
   }
   for (const orbital of schema.orbitals) {
     for (const traitRef of orbital.traits ?? []) {
@@ -59290,18 +59578,18 @@ function layoutOrbitals(count, containerW, containerH) {
   if (count === 0) return [];
   if (count === 1) return [{ cx: containerW / 2, cy: containerH / 2 }];
   const cols = Math.min(count, Math.ceil(Math.sqrt(count)));
-  const rows = Math.ceil(count / cols);
+  const rows2 = Math.ceil(count / cols);
   const edgePad = 24;
   const fitMinCx = UNIT_DISPLAY_W / 2 + edgePad;
   const fitMinCy = UNIT_DISPLAY_H / 2 + edgePad;
   const fitMaxCx = Math.max(fitMinCx, containerW - UNIT_DISPLAY_W / 2 - edgePad);
   const fitMaxCy = Math.max(fitMinCy, containerH - UNIT_DISPLAY_H / 2 - edgePad);
   const fitStepX = cols > 1 ? (fitMaxCx - fitMinCx) / (cols - 1) : 0;
-  const fitStepY = rows > 1 ? (fitMaxCy - fitMinCy) / (rows - 1) : 0;
+  const fitStepY = rows2 > 1 ? (fitMaxCy - fitMinCy) / (rows2 - 1) : 0;
   const stepX = Math.min(fitStepX, UNIT_DISPLAY_W * 3.5);
   const stepY = Math.min(fitStepY, UNIT_DISPLAY_H * 3.5);
   const gridW = (cols - 1) * stepX;
-  const gridH = (rows - 1) * stepY;
+  const gridH = (rows2 - 1) * stepY;
   const originX = (containerW - gridW) / 2;
   const originY = (containerH - gridH) / 2;
   return Array.from({ length: count }, (_, i) => ({