@almadar/ui 6.4.0 → 6.6.0

package/dist/components/index.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import * as React78 from 'react';
-import React78__default, { createContext, useContext, useMemo, useRef, useEffect, useCallback, useState, useLayoutEffect, useId, Suspense, lazy, useSyncExternalStore } from 'react';
+import * as React79 from 'react';
+import React79__default, { createContext, useContext, useMemo, useRef, useEffect, useCallback, useState, useLayoutEffect, useId, Suspense, lazy, useSyncExternalStore } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { EventBusContext, useTraitScopeChain, useCurrentPagePath, useGameAudioContextOptional, useRenderSlot, useNavStack, useEntitySchemaOptional, RenderSlotProvider, useEntityBindingSnapshot, useTraitScope, TraitScopeProvider } from '@almadar/ui/providers';
@@ -12,7 +12,7 @@ import { useTranslate } from '@almadar/ui/hooks';
 import { useUISlots, useTheme } from '@almadar/ui/context';
 import { evaluate, createMinimalContext } from '@almadar/evaluator';
 import { createContextFromBindings, interpolateValue } from '@almadar/runtime';
-import { mergeEntityFrame, isFileValue, isInlineTrait, isSecretConfigType, isRenderBindingMarker } from '@almadar/core';
+import { UI_SLOTS, mergeEntityFrame, isFileValue, isInlineTrait, isSecretConfigType, isRenderBindingMarker } from '@almadar/core';
 import { createPortal } from 'react-dom';
 import { wrapCallbackForEvent, perfStart, perfEnd } from '@almadar/runtime/ui';
 import { Link, Outlet, useLocation } from 'react-router-dom';
@@ -262,7 +262,7 @@ var init_SvgFlow = __esm({
       width = 100,
       height = 100
     }) => {
-      const markerId = React78__default.useMemo(() => {
+      const markerId = React79__default.useMemo(() => {
         flowIdCounter += 1;
         return `almadar-flow-arrow-${flowIdCounter}`;
       }, []);
@@ -855,7 +855,7 @@ var init_SvgRing = __esm({
       width = 100,
       height = 100
     }) => {
-      const gradientId = React78__default.useMemo(() => {
+      const gradientId = React79__default.useMemo(() => {
         ringIdCounter += 1;
         return `almadar-ring-glow-${ringIdCounter}`;
       }, []);
@@ -1397,7 +1397,7 @@ var init_Icon = __esm({
       const effectiveName = typeof icon === "string" && icon !== "" ? icon : name;
       const effectiveStrokeWidth = strokeWidth != null && strokeWidth > 0 ? strokeWidth : void 0;
       const family = useIconFamily();
-      const RenderedComponent = React78__default.useMemo(() => {
+      const RenderedComponent = React79__default.useMemo(() => {
         if (directIcon) return null;
         return effectiveName ? resolveIconForFamily(effectiveName) : null;
       }, [directIcon, effectiveName, family]);
@@ -1526,7 +1526,7 @@ var init_atlasSlice = __esm({
   }
 });
 function useAtlasSliceDataUrl(asset) {
-  const [, bump] = React78.useReducer((x) => x + 1, 0);
+  const [, bump] = React79.useReducer((x) => x + 1, 0);
   if (!isAtlasAsset(asset)) return void 0;
   const key = `${asset.atlas}#${asset.sprite}`;
   const cached = sliceDataUrlCache.get(key);
@@ -1589,13 +1589,13 @@ function AtlasImage({
   style,
   "aria-hidden": ariaHidden
 }) {
-  const [, bump] = React78.useReducer((x) => x + 1, 0);
-  const canvasRef = React78.useRef(null);
+  const [, bump] = React79.useReducer((x) => x + 1, 0);
+  const canvasRef = React79.useRef(null);
   const sliced = isAtlasAsset(asset);
   const atlas = sliced ? getAtlas(asset.atlas, bump) : void 0;
   const img = sliced && asset?.url ? getSheetImage(asset.url, bump) : null;
   const rect = sliced && atlas ? subRectFor(atlas, asset.sprite) : null;
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas || !img || !rect) return;
     canvas.width = rect.sw;
@@ -1671,7 +1671,7 @@ function resolveIconProp(value, sizeClass) {
     const IconComp = value;
     return /* @__PURE__ */ jsx(IconComp, { className: sizeClass });
   }
-  if (React78__default.isValidElement(value)) {
+  if (React79__default.isValidElement(value)) {
     return value;
   }
   if (typeof value === "object" && value !== null && isIconLike(value)) {
@@ -1748,7 +1748,7 @@ var init_Button = __esm({
       md: "h-icon-default w-icon-default",
       lg: "h-icon-default w-icon-default"
     };
-    Button = React78__default.forwardRef(
+    Button = React79__default.forwardRef(
       ({
         className,
         variant = "primary",
@@ -1820,7 +1820,7 @@ var init_Input = __esm({
     init_cn();
     init_Icon();
     init_useEventBus();
-    Input = React78__default.forwardRef(
+    Input = React79__default.forwardRef(
       ({
         className,
         inputType,
@@ -1844,9 +1844,9 @@ var init_Input = __esm({
         const eventBus = useEventBus();
         const type = inputType || htmlType || "text";
         const isDeclarative = typeof onChange === "string";
-        const [localValue, setLocalValue] = React78__default.useState(value);
-        const pendingEchoRef = React78__default.useRef(/* @__PURE__ */ new Set());
-        React78__default.useEffect(() => {
+        const [localValue, setLocalValue] = React79__default.useState(value);
+        const pendingEchoRef = React79__default.useRef(/* @__PURE__ */ new Set());
+        React79__default.useEffect(() => {
           if (!isDeclarative) return;
           const incoming = value == null ? "" : String(value);
           if (pendingEchoRef.current.has(incoming)) {
@@ -2013,7 +2013,7 @@ var Label;
 var init_Label = __esm({
   "components/core/atoms/Label.tsx"() {
     init_cn();
-    Label = React78__default.forwardRef(
+    Label = React79__default.forwardRef(
       ({ className, required, children, ...props }, ref) => {
         return /* @__PURE__ */ jsxs(
           "label",
@@ -2040,7 +2040,7 @@ var init_Textarea = __esm({
   "components/core/atoms/Textarea.tsx"() {
     init_cn();
     init_useEventBus();
-    Textarea = React78__default.forwardRef(
+    Textarea = React79__default.forwardRef(
       ({ className, error, onChange, ...props }, ref) => {
         const eventBus = useEventBus();
         const handleChange = (e) => {
@@ -2290,7 +2290,7 @@ var init_Select = __esm({
     init_cn();
     init_Icon();
     init_useEventBus();
-    Select = React78__default.forwardRef(
+    Select = React79__default.forwardRef(
       (props, _ref) => {
         const { multiple, searchable, clearable } = props;
         if (multiple || searchable || clearable) {
@@ -2307,7 +2307,7 @@ var init_Checkbox = __esm({
   "components/core/atoms/Checkbox.tsx"() {
     init_cn();
     init_useEventBus();
-    Checkbox = React78__default.forwardRef(
+    Checkbox = React79__default.forwardRef(
       ({ className, label, id, onChange, ...props }, ref) => {
         const inputId = id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;
         const eventBus = useEventBus();
@@ -2361,7 +2361,7 @@ var init_Spinner = __esm({
       md: "h-6 w-6",
       lg: "h-8 w-8"
     };
-    Spinner = React78__default.forwardRef(
+    Spinner = React79__default.forwardRef(
       ({ className, size = "md", overlay, ...props }, ref) => {
         if (overlay) {
           return /* @__PURE__ */ jsx(
@@ -2451,7 +2451,7 @@ var init_Card = __esm({
       chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
       "tile-image-first": "p-0 overflow-hidden"
     };
-    Card = React78__default.forwardRef(
+    Card = React79__default.forwardRef(
       ({
         className,
         variant = "bordered",
@@ -2500,9 +2500,9 @@ var init_Card = __esm({
       }
     );
     Card.displayName = "Card";
-    CardHeader = React78__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
+    CardHeader = React79__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("mb-4", className), ...props }));
     CardHeader.displayName = "CardHeader";
-    CardTitle = React78__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    CardTitle = React79__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
       "h3",
       {
         ref,
@@ -2515,11 +2515,11 @@ var init_Card = __esm({
       }
     ));
     CardTitle.displayName = "CardTitle";
-    CardContent = React78__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
+    CardContent = React79__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("", className), ...props }));
     CardContent.displayName = "CardContent";
     CardBody = CardContent;
     CardBody.displayName = "CardBody";
-    CardFooter = React78__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    CardFooter = React79__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
       "div",
       {
         ref,
@@ -2573,7 +2573,7 @@ var init_Badge = __esm({
       md: "px-2.5 py-1 text-sm",
       lg: "px-3 py-1.5 text-base"
     };
-    Badge = React78__default.forwardRef(
+    Badge = React79__default.forwardRef(
       ({ className, variant = "default", size = "sm", amount, label, icon, iconAsset, children, onRemove, removeLabel, ...props }, ref) => {
         const iconSizes3 = {
           sm: "h-icon-default w-icon-default",
@@ -2701,7 +2701,7 @@ var init_FilterPill = __esm({
       md: "w-3.5 h-3.5",
       lg: "w-4 h-4"
     };
-    FilterPill = React78__default.forwardRef(
+    FilterPill = React79__default.forwardRef(
       ({
         className,
         variant = "default",
@@ -2830,8 +2830,8 @@ var init_Avatar = __esm({
       actionPayload
     }) => {
       const eventBus = useEventBus();
-      const [imgFailed, setImgFailed] = React78__default.useState(false);
-      React78__default.useEffect(() => {
+      const [imgFailed, setImgFailed] = React79__default.useState(false);
+      React79__default.useEffect(() => {
         setImgFailed(false);
       }, [src]);
       const initials = providedInitials ?? (name ? generateInitials(name) : void 0);
@@ -3083,7 +3083,7 @@ var init_Box = __esm({
       fixed: "fixed",
       sticky: "sticky"
     };
-    Box = React78__default.forwardRef(
+    Box = React79__default.forwardRef(
       ({
         padding,
         paddingX,
@@ -3148,7 +3148,7 @@ var init_Box = __esm({
           onPointerDown?.(e);
         }, [hoverEvent, tapReveal, triggerProps, onPointerDown]);
         const isClickable = action || onClick;
-        return React78__default.createElement(
+        return React79__default.createElement(
           Component,
           {
             ref,
@@ -3202,7 +3202,7 @@ var init_Center = __esm({
       as: Component = "div"
     }) => {
       const mergedStyle = minHeight ? { minHeight, ...style } : style;
-      return React78__default.createElement(Component, {
+      return React79__default.createElement(Component, {
         className: cn(
           inline ? "inline-flex" : "flex",
           horizontal && "justify-center",
@@ -3470,7 +3470,7 @@ var init_Radio = __esm({
       md: "w-2.5 h-2.5",
       lg: "w-3 h-3"
     };
-    Radio = React78__default.forwardRef(
+    Radio = React79__default.forwardRef(
       ({
         label,
         helperText,
@@ -3487,12 +3487,12 @@ var init_Radio = __esm({
         onChange,
         ...props
       }, ref) => {
-        const reactId = React78__default.useId();
+        const reactId = React79__default.useId();
         const baseId = id || `radio-${reactId}`;
         const hasError = !!error;
         const eventBus = useEventBus();
-        const [selected, setSelected] = React78__default.useState(value);
-        React78__default.useEffect(() => {
+        const [selected, setSelected] = React79__default.useState(value);
+        React79__default.useEffect(() => {
           if (value !== void 0) setSelected(value);
         }, [value]);
         const pick = (next, e) => {
@@ -3674,7 +3674,7 @@ var init_Switch = __esm({
   "components/core/atoms/Switch.tsx"() {
     "use client";
     init_cn();
-    Switch = React78.forwardRef(
+    Switch = React79.forwardRef(
       ({
         checked,
         defaultChecked = false,
@@ -3685,10 +3685,10 @@ var init_Switch = __esm({
         name,
         className
       }, ref) => {
-        const [isChecked, setIsChecked] = React78.useState(
+        const [isChecked, setIsChecked] = React79.useState(
           checked !== void 0 ? checked : defaultChecked
         );
-        React78.useEffect(() => {
+        React79.useEffect(() => {
           if (checked !== void 0) {
             setIsChecked(checked);
           }
@@ -3851,7 +3851,7 @@ var init_Stack = __esm({
       };
       const isHorizontal = direction === "horizontal";
       const directionClass = responsive && isHorizontal ? reverse ? "flex-col-reverse md:flex-row-reverse" : "flex-col md:flex-row" : isHorizontal ? reverse ? "flex-row-reverse" : "flex-row" : reverse ? "flex-col-reverse" : "flex-col";
-      return React78__default.createElement(
+      return React79__default.createElement(
         Component,
         {
           className: cn(
@@ -4140,7 +4140,7 @@ var init_Typography = __esm({
       if (format !== void 0 && format !== "none" && (typeof body === "string" || typeof body === "number" || body instanceof Date)) {
         body = formatValue(body, format);
       }
-      return React78__default.createElement(
+      return React79__default.createElement(
         Component,
         {
           id,
@@ -4374,7 +4374,7 @@ var Dialog;
 var init_Dialog = __esm({
   "components/core/atoms/Dialog.tsx"() {
     init_cn();
-    Dialog = React78__default.forwardRef(
+    Dialog = React79__default.forwardRef(
       ({
         role = "dialog",
         "aria-modal": ariaModal = true,
@@ -4400,7 +4400,7 @@ var Aside;
 var init_Aside = __esm({
   "components/core/atoms/Aside.tsx"() {
     init_cn();
-    Aside = React78__default.forwardRef(
+    Aside = React79__default.forwardRef(
       ({ className, children, ...rest }, ref) => /* @__PURE__ */ jsx("aside", { ref, className: cn(className), ...rest, children })
     );
     Aside.displayName = "Aside";
@@ -4479,9 +4479,9 @@ var init_LawReferenceTooltip = __esm({
       className
     }) => {
       const { t } = useTranslate();
-      const [isVisible, setIsVisible] = React78__default.useState(false);
-      const timeoutRef = React78__default.useRef(null);
-      const triggerRef = React78__default.useRef(null);
+      const [isVisible, setIsVisible] = React79__default.useState(false);
+      const timeoutRef = React79__default.useRef(null);
+      const triggerRef = React79__default.useRef(null);
       const handleMouseEnter = () => {
         if (timeoutRef.current) clearTimeout(timeoutRef.current);
         timeoutRef.current = setTimeout(() => setIsVisible(true), 200);
@@ -4492,7 +4492,7 @@ var init_LawReferenceTooltip = __esm({
       };
       const { revealed, triggerProps } = useTapReveal({ refs: [triggerRef] });
       const open = isVisible || revealed;
-      React78__default.useEffect(() => {
+      React79__default.useEffect(() => {
         return () => {
           if (timeoutRef.current) clearTimeout(timeoutRef.current);
         };
@@ -4702,7 +4702,7 @@ var init_StatusDot = __esm({
       md: "w-2.5 h-2.5",
       lg: "w-3 h-3"
     };
-    StatusDot = React78__default.forwardRef(
+    StatusDot = React79__default.forwardRef(
       ({ className, status = "offline", pulse = false, size = "md", label, ...props }, ref) => {
         return /* @__PURE__ */ jsx(
           "span",
@@ -4756,7 +4756,7 @@ var init_TrendIndicator = __esm({
       down: "trending-down",
       flat: "arrow-right"
     };
-    TrendIndicator = React78__default.forwardRef(
+    TrendIndicator = React79__default.forwardRef(
       ({
         className,
         value,
@@ -4825,7 +4825,7 @@ var init_RangeSlider = __esm({
       md: "w-4 h-4",
       lg: "w-5 h-5"
     };
-    RangeSlider = React78__default.forwardRef(
+    RangeSlider = React79__default.forwardRef(
       ({
         className,
         min = 0,
@@ -5482,7 +5482,7 @@ var init_ContentSection = __esm({
       md: "py-16",
       lg: "py-24"
     };
-    ContentSection = React78__default.forwardRef(
+    ContentSection = React79__default.forwardRef(
       ({ children, background = "default", padding = "lg", id, className }, ref) => {
         return /* @__PURE__ */ jsx(
           Box,
@@ -6016,7 +6016,7 @@ var init_AnimatedReveal = __esm({
       "scale-up": { opacity: 1, transform: "scale(1) translateY(0)" },
       "none": {}
     };
-    AnimatedReveal = React78__default.forwardRef(
+    AnimatedReveal = React79__default.forwardRef(
       ({
         trigger = "scroll",
         animation = "fade-up",
@@ -6176,7 +6176,7 @@ var init_AnimatedGraphic = __esm({
   "components/marketing/atoms/AnimatedGraphic.tsx"() {
     "use client";
     init_cn();
-    AnimatedGraphic = React78__default.forwardRef(
+    AnimatedGraphic = React79__default.forwardRef(
       ({
         src,
         svgContent,
@@ -6199,7 +6199,7 @@ var init_AnimatedGraphic = __esm({
         const fetchedSvg = useFetchedSvg(svgContent ? void 0 : src);
         const resolvedSvg = svgContent ?? fetchedSvg;
         const prevAnimateRef = useRef(animate);
-        const setRef = React78__default.useCallback(
+        const setRef = React79__default.useCallback(
           (node) => {
             containerRef.current = node;
             if (typeof ref === "function") ref(node);
@@ -6300,7 +6300,7 @@ function resolveMarkerExpression(expression, entity, config, state) {
 function isPlainObject(value) {
   if (value === null || value === void 0 || typeof value !== "object") return false;
   if (Array.isArray(value)) return false;
-  if (React78__default.isValidElement(value)) return false;
+  if (React79__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   if (typeof value === "function") return false;
   return true;
@@ -6309,7 +6309,7 @@ function isEvaluatorResolvedData(value) {
   return evaluatorResolvedData.has(value);
 }
 function brandResolved(value) {
-  if (value !== null && typeof value === "object" && !React78__default.isValidElement(value) && !(value instanceof Date)) {
+  if (value !== null && typeof value === "object" && !React79__default.isValidElement(value) && !(value instanceof Date)) {
     resolvedMarkerFree.add(value);
   }
 }
@@ -6342,7 +6342,7 @@ function walkValue(value, scopeTrait, entity, config, state) {
     }
     const resolved = resolveMarkerExpression(value.expression, entity, config, state);
     markerResolutionCache.set(value, { entity, config, state, resolved });
-    if (resolved !== null && typeof resolved === "object" && !React78__default.isValidElement(resolved) && !(resolved instanceof Date)) {
+    if (resolved !== null && typeof resolved === "object" && !React79__default.isValidElement(resolved) && !(resolved instanceof Date)) {
       resolvedMarkerFree.add(resolved);
       evaluatorResolvedData.add(resolved);
     }
@@ -6999,7 +6999,7 @@ var init_ErrorBoundary = __esm({
         }
       );
     };
-    ErrorBoundary = class extends React78__default.Component {
+    ErrorBoundary = class extends React79__default.Component {
       constructor(props) {
         super(props);
         __publicField(this, "reset", () => {
@@ -7282,7 +7282,7 @@ var init_Container = __esm({
       as: Component = "div"
     }) => {
       const resolvedSize = maxWidth ?? size ?? "lg";
-      return React78__default.createElement(
+      return React79__default.createElement(
         Component,
         {
           className: cn(
@@ -9847,14 +9847,15 @@ function drawArrowHead(ctx, x1, y1, x2, y2, size) {
   ctx.closePath();
   ctx.fill();
 }
-function drawShape(ctx, shape, width, height, allShapes) {
+function drawShape(ctx, shape, width, height, allShapes, fontFamily) {
   ctx.save();
   const opacity = shape.opacity ?? 1;
   ctx.globalAlpha = opacity;
   const stroke = resolveColor2(shape.color, ctx, "#333333");
   const fill = shape.fill ? resolveColor2(shape.fill, ctx, "#cccccc") : void 0;
   ctx.lineWidth = shape.lineWidth ?? 2;
-  if (shape.dash) ctx.setLineDash([...DASH_PATTERNS[shape.dash]]);
+  const dashPattern = shape.dash ? DASH_PATTERNS[shape.dash] : void 0;
+  if (dashPattern) ctx.setLineDash([...dashPattern]);
   switch (shape.type) {
     case "grid": {
       const step = shape.step ?? 40;
@@ -9976,7 +9977,7 @@ function drawShape(ctx, shape, width, height, allShapes) {
     case "text": {
       if (shape.x == null || shape.y == null || !shape.text) break;
       ctx.fillStyle = stroke;
-      ctx.font = `${shape.fontSize ?? 14}px ${themeBodyFont(ctx.canvas)}`;
+      ctx.font = `${shape.fontSize ?? 14}px ${shape.fontFamily ?? fontFamily ?? themeBodyFont(ctx.canvas)}`;
       ctx.textAlign = shape.align ?? "left";
       ctx.textBaseline = "middle";
       ctx.fillText(shape.text, shape.x, shape.y);
@@ -10018,7 +10019,7 @@ function drawShape(ctx, shape, width, height, allShapes) {
   }
   ctx.restore();
 }
-function readoutShapes(readouts, width) {
+function readoutShapes(readouts, width, fontFamily) {
   const out = [];
   const chipH = 18;
   const gap = 6;
@@ -10042,13 +10043,14 @@ function readoutShapes(readouts, width) {
       text,
       color: "#ffffff",
       fontSize: 10,
-      align: "center"
+      align: "center",
+      fontFamily
     });
     rightEdge = chipX - gap;
   }
   return out;
 }
-function traceShapes(panel, k, width, height) {
+function traceShapes(panel, k, width, height, fontFamily) {
   const w = panel.width ?? Math.round(width * 0.32);
   const h = panel.height ?? Math.round(height * 0.28);
   const x = panel.x ?? width - w - 8;
@@ -10102,14 +10104,14 @@ function traceShapes(panel, k, width, height) {
       out.push({ type: "circle", x: last.x, y: last.y, radius: 2, color, fill: color });
     }
     if (series.label) {
-      out.push({ type: "text", x: x + 6, y: y + 10 + 11 * j, text: series.label, color, fontSize: 9 });
+      out.push({ type: "text", x: x + 6, y: y + 10 + 11 * j, text: series.label, color, fontSize: 9, fontFamily });
     }
   });
   if (panel.yLabel) {
-    out.push({ type: "text", x: x + w - 6, y: y + 10, text: panel.yLabel, color: "#6b7280", fontSize: 9, align: "right" });
+    out.push({ type: "text", x: x + w - 6, y: y + 10, text: panel.yLabel, color: "#6b7280", fontSize: 9, align: "right", fontFamily });
   }
   if (panel.xLabel) {
-    out.push({ type: "text", x: x + w - 6, y: y + h - 6, text: panel.xLabel, color: "#6b7280", fontSize: 9, align: "right" });
+    out.push({ type: "text", x: x + w - 6, y: y + h - 6, text: panel.xLabel, color: "#6b7280", fontSize: 9, align: "right", fontFamily });
   }
   return out;
 }
@@ -10132,13 +10134,14 @@ var init_LearningCanvas = __esm({
     init_useEventBus();
     init_webPainter2d();
     init_paintDispatch();
-    DASH_PATTERNS = { dashed: [6, 4], dotted: [2, 3] };
+    DASH_PATTERNS = { solid: [], dashed: [6, 4], dotted: [2, 3] };
     TRACE_SERIES_COLORS = ["#2563eb", "#dc2626", "#16a34a", "#f59e0b"];
     LearningCanvas = ({
       className,
       width = 600,
       height = 400,
       backgroundColor,
+      fontFamily,
       shapes = [],
       drawables,
       projector,
@@ -10174,10 +10177,10 @@ var init_LearningCanvas = __esm({
       }, [shapes]);
       const derivedShapes = useMemo(() => {
         if (!traces?.length && !readouts?.length) return shapes;
-        const traceOut = (traces ?? []).flatMap((panel, k) => traceShapes(panel, k, width, height));
-        const readoutOut = readouts?.length ? readoutShapes(readouts, width) : [];
+        const traceOut = (traces ?? []).flatMap((panel, k) => traceShapes(panel, k, width, height, fontFamily));
+        const readoutOut = readouts?.length ? readoutShapes(readouts, width, fontFamily) : [];
         return [...shapes, ...traceOut, ...readoutOut];
-      }, [shapes, traces, readouts, width, height]);
+      }, [shapes, traces, readouts, width, height, fontFamily]);
       const draw = useCallback(() => {
         const _perfT = perfStart("learningcanvas:paint");
         const canvas = canvasRef.current;
@@ -10196,15 +10199,15 @@ var init_LearningCanvas = __esm({
           ctx.fillRect(0, 0, width, height);
         }
         for (const shape of derivedShapes) {
-          if (shape.type !== "text") drawShape(ctx, shape, width, height, derivedShapes);
+          if (shape.type !== "text") drawShape(ctx, shape, width, height, derivedShapes, fontFamily);
         }
         for (const shape of derivedShapes) {
-          if (shape.type === "text") drawShape(ctx, shape, width, height, derivedShapes);
+          if (shape.type === "text") drawShape(ctx, shape, width, height, derivedShapes, fontFamily);
         }
         if (drawables?.length && projector) {
           const painter = createWebPainter(ctx, invalidateRef.current);
           const timeMs = needsAnim && typeof performance !== "undefined" ? performance.now() : 0;
-          const dctx = { projector, time: timeMs, invalidate: invalidateRef.current, fontFamily: themeBodyFont(canvas) };
+          const dctx = { projector, time: timeMs, invalidate: invalidateRef.current, fontFamily: fontFamily || themeBodyFont(canvas) };
           for (const node of drawables) {
             paintDrawable(painter, node, dctx);
           }
@@ -13321,6 +13324,250 @@ var init_EmptyState = __esm({
     EmptyState.displayName = "EmptyState";
   }
 });
+
+// lib/editorMotions.ts
+function clamp(value, min, max) {
+  return Math.max(min, Math.min(max, value));
+}
+function computeLines(text) {
+  const lines = [];
+  let start = 0;
+  for (let i = 0; i <= text.length; i++) {
+    if (i === text.length || text[i] === "\n") {
+      lines.push({ start, end: i });
+      start = i + 1;
+    }
+  }
+  return lines;
+}
+function lineIndexAt(lines, pos) {
+  for (let i = 0; i < lines.length; i++) {
+    if (pos <= lines[i].end) return i;
+  }
+  return lines.length - 1;
+}
+function findWords(text) {
+  const words = [];
+  const re = /\w+|\S+/g;
+  let m;
+  while ((m = re.exec(text)) !== null) {
+    words.push({ start: m.index, end: m.index + m[0].length });
+  }
+  return words;
+}
+function nextWordStart(text, pos) {
+  for (const w of findWords(text)) {
+    if (w.start > pos) return w.start;
+  }
+  return text.length;
+}
+function prevWordStart(text, pos) {
+  let result = 0;
+  for (const w of findWords(text)) {
+    if (w.start < pos) result = w.start;
+    else break;
+  }
+  return result;
+}
+function nextWordEnd(text, pos) {
+  for (const w of findWords(text)) {
+    const lastChar = w.end - 1;
+    if (lastChar > pos) return lastChar;
+  }
+  return text.length > 0 ? text.length - 1 : 0;
+}
+function firstNonBlank(text, line) {
+  let i = line.start;
+  while (i < line.end && (text[i] === " " || text[i] === "	")) i++;
+  return i;
+}
+function nextParagraphBoundary(lines, fromLineIdx, textLength) {
+  for (let i = fromLineIdx + 1; i < lines.length; i++) {
+    if (lines[i].start === lines[i].end) return lines[i].start;
+  }
+  return textLength;
+}
+function prevParagraphBoundary(lines, fromLineIdx) {
+  for (let i = fromLineIdx - 1; i >= 0; i--) {
+    if (lines[i].start === lines[i].end) return lines[i].start;
+  }
+  return 0;
+}
+function applyMotion(text, caret, motion, count) {
+  const n = Math.max(1, count);
+  const lines = computeLines(text);
+  const lineIdx = lineIndexAt(lines, caret);
+  const line = lines[lineIdx];
+  switch (motion) {
+    case "left":
+      return clamp(caret - n, line.start, line.end);
+    case "right":
+      return clamp(caret + n, line.start, line.end);
+    case "up": {
+      const col = caret - line.start;
+      const targetIdx = clamp(lineIdx - n, 0, lines.length - 1);
+      const target = lines[targetIdx];
+      return clamp(target.start + col, target.start, target.end);
+    }
+    case "down": {
+      const col = caret - line.start;
+      const targetIdx = clamp(lineIdx + n, 0, lines.length - 1);
+      const target = lines[targetIdx];
+      return clamp(target.start + col, target.start, target.end);
+    }
+    case "word-forward": {
+      let pos = caret;
+      for (let i = 0; i < n; i++) pos = nextWordStart(text, pos);
+      return pos;
+    }
+    case "word-back": {
+      let pos = caret;
+      for (let i = 0; i < n; i++) pos = prevWordStart(text, pos);
+      return pos;
+    }
+    case "word-end": {
+      let pos = caret;
+      for (let i = 0; i < n; i++) pos = nextWordEnd(text, pos);
+      return pos;
+    }
+    case "line-start":
+      return line.start;
+    case "line-end":
+      return line.end > line.start ? line.end - 1 : line.start;
+    case "first-nonblank":
+      return firstNonBlank(text, line);
+    case "doc-start":
+      return 0;
+    case "doc-end":
+      return text.length;
+    case "paragraph-forward": {
+      let pos = caret;
+      for (let i = 0; i < n; i++) {
+        pos = nextParagraphBoundary(lines, lineIndexAt(lines, pos), text.length);
+      }
+      return pos;
+    }
+    case "paragraph-back": {
+      let pos = caret;
+      for (let i = 0; i < n; i++) {
+        pos = prevParagraphBoundary(lines, lineIndexAt(lines, pos));
+      }
+      return pos;
+    }
+    case "line":
+    case "selection":
+      return caret;
+    default: {
+      const _exhaustive = motion;
+      return _exhaustive;
+    }
+  }
+}
+function motionRange(text, caret, motion, count, selection) {
+  if (motion === "selection") {
+    if (!selection) return [caret, caret];
+    return [Math.min(selection[0], selection[1]), Math.max(selection[0], selection[1])];
+  }
+  const lines = computeLines(text);
+  if (motion === "line") {
+    const n = Math.max(1, count);
+    const startIdx = lineIndexAt(lines, caret);
+    const endIdx = clamp(startIdx + n - 1, 0, lines.length - 1);
+    const start2 = lines[startIdx].start;
+    const rawEnd = lines[endIdx].end;
+    const end2 = rawEnd < text.length ? rawEnd + 1 : rawEnd;
+    return [start2, end2];
+  }
+  const newCaret = applyMotion(text, caret, motion, count);
+  let start = Math.min(caret, newCaret);
+  let end = Math.max(caret, newCaret);
+  if (motion === "word-end" || motion === "line-end") {
+    end = Math.min(Math.max(start, newCaret) + 1, text.length);
+  } else if (motion === "word-forward" && newCaret > caret) {
+    const startLine = lineIndexAt(lines, caret);
+    const endLine = lineIndexAt(lines, newCaret);
+    if (endLine !== startLine) {
+      end = lines[startLine].end;
+    }
+  }
+  return [start, end];
+}
+function applyOperator(text, range, operator, register) {
+  const start = clamp(range[0], 0, text.length);
+  const end = clamp(range[1], start, text.length);
+  const removed = text.slice(start, end);
+  if (operator === "yank") {
+    return { text, caret: start, register: removed };
+  }
+  return { text: text.slice(0, start) + text.slice(end), caret: start, register: removed };
+}
+var init_editorMotions = __esm({
+  "lib/editorMotions.ts"() {
+  }
+});
+function isMotionPayload(payload) {
+  return !!payload && typeof payload.editorId === "string" && typeof payload.motion === "string" && typeof payload.count === "number";
+}
+function isOperatePayload(payload) {
+  return !!payload && typeof payload.editorId === "string" && typeof payload.operator === "string" && typeof payload.motion === "string" && typeof payload.count === "number";
+}
+function isInsertTextPayload(payload) {
+  return !!payload && typeof payload.editorId === "string" && typeof payload.text === "string";
+}
+function isSetModePayload(payload) {
+  return !!payload && typeof payload.editorId === "string" && typeof payload.mode === "string" && typeof payload.caret === "string";
+}
+function useEditorCapabilities(args) {
+  const [caretMode, setCaretMode] = useState("bar");
+  const registerRef = useRef("");
+  useEventListener(`UI:${args.events.onMotion}`, (evt) => {
+    if (!args.editorId || !isMotionPayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
+    const ta = args.textareaRef.current;
+    if (!ta) return;
+    const { motion, count } = evt.payload;
+    const newCaret = applyMotion(ta.value, ta.selectionStart, motion, count);
+    if (ta.selectionStart !== ta.selectionEnd) {
+      ta.setSelectionRange(ta.selectionStart, newCaret);
+    } else {
+      ta.setSelectionRange(newCaret, newCaret);
+    }
+  });
+  useEventListener(`UI:${args.events.onOperate}`, (evt) => {
+    if (!args.editorId || !isOperatePayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
+    const ta = args.textareaRef.current;
+    if (!ta) return;
+    const { operator, motion, count } = evt.payload;
+    const selection = motion === "selection" ? [ta.selectionStart, ta.selectionEnd] : void 0;
+    const range = motionRange(ta.value, ta.selectionStart, motion, count, selection);
+    const result = applyOperator(ta.value, range, operator, registerRef.current);
+    registerRef.current = result.register;
+    if (operator === "yank") {
+      ta.setSelectionRange(range[0], range[0]);
+    } else {
+      ta.setRangeText("", range[0], range[1], "end");
+    }
+    args.applyChange(ta.value);
+  });
+  useEventListener(`UI:${args.events.onInsertText}`, (evt) => {
+    if (!args.editorId || !isInsertTextPayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
+    const ta = args.textareaRef.current;
+    if (!ta) return;
+    ta.setRangeText(evt.payload.text, ta.selectionStart, ta.selectionEnd, "end");
+    args.applyChange(ta.value);
+  });
+  useEventListener(`UI:${args.events.onSetMode}`, (evt) => {
+    if (!args.editorId || !isSetModePayload(evt.payload) || evt.payload.editorId !== args.editorId) return;
+    setCaretMode(evt.payload.caret);
+  });
+  return { caretMode };
+}
+var init_useEditorCapabilities = __esm({
+  "components/core/molecules/markdown/useEditorCapabilities.ts"() {
+    "use client";
+    init_useEventBus();
+    init_editorMotions();
+  }
+});
 function registerCodeLanguageLoader(loader) {
   codeLanguageLoader = loader;
 }
@@ -13409,7 +13656,36 @@ function useLanguageReady(language) {
   }, [language]);
   return ready;
 }
-var dynamicallyLoaded, codeLanguageLoader, orbStyleOverrides, orbStyle, loloStyleOverrides, loloStyle, log5, CODE_LANGUAGES, CODE_LANGUAGE_SET, DIFF_STYLES, DIFF_STYLE_FALLBACK, LINE_PROPS_FN, HIDDEN_LINE_NUMBERS, CodeBlock;
+function resolveHighlightStyle(lang) {
+  if (lang === "orb") return orbStyle;
+  if (lang === "lolo") return loloStyle;
+  return dark;
+}
+function plainCodeColorOf(style) {
+  return style['code[class*="language-"]']?.color ?? "#d4d4d4";
+}
+function buildLineProps(errorLines, extraClassName) {
+  return (lineNumber) => {
+    const base = {
+      "data-line": String(lineNumber - 1),
+      ...extraClassName ? { className: extraClassName } : {}
+    };
+    const severity = errorLines?.get(lineNumber);
+    if (!severity) return base;
+    return {
+      ...base,
+      style: {
+        display: "block",
+        backgroundColor: severity === "error" ? "rgba(248, 113, 113, 0.18)" : "rgba(251, 191, 36, 0.18)",
+        // amber-400 @ 18%
+        borderLeft: `3px solid ${severity === "error" ? "#ef4444" : "#f59e0b"}`,
+        paddingLeft: "0.5rem",
+        marginLeft: "-0.5rem"
+      }
+    };
+  };
+}
+var dynamicallyLoaded, codeLanguageLoader, orbStyleOverrides, orbStyle, loloStyleOverrides, loloStyle, log5, CODE_LANGUAGES, CODE_LANGUAGE_SET, DIFF_STYLES, DIFF_STYLE_FALLBACK, LINE_PROPS_FN, HIDDEN_LINE_NUMBERS, HIGHLIGHT_CAPACITY_BYTES, MONO_FONT_FAMILY, VIEWER_LINE_NUMBER_STYLE, CodeBlock;
 var init_CodeBlock = __esm({
   "components/core/molecules/markdown/CodeBlock.tsx"() {
     init_cn();
@@ -13425,6 +13701,7 @@ var init_CodeBlock = __esm({
     init_Textarea();
     init_Icon();
     init_useEventBus();
+    init_useEditorCapabilities();
     SyntaxHighlighter.registerLanguage("json", langJson);
     SyntaxHighlighter.registerLanguage("javascript", langJavascript);
     SyntaxHighlighter.registerLanguage("js", langJavascript);
@@ -13642,7 +13919,17 @@ var init_CodeBlock = __esm({
     DIFF_STYLE_FALLBACK = { bg: "", prefix: " ", text: "text-foreground" };
     LINE_PROPS_FN = (n) => ({ "data-line": String(n - 1) });
     HIDDEN_LINE_NUMBERS = { display: "none" };
-    CodeBlock = React78__default.memo(
+    HIGHLIGHT_CAPACITY_BYTES = 512 * 1024;
+    MONO_FONT_FAMILY = 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace';
+    VIEWER_LINE_NUMBER_STYLE = {
+      minWidth: "2.5em",
+      paddingRight: "1rem",
+      textAlign: "right",
+      userSelect: "none",
+      opacity: 0.5,
+      fontVariantNumeric: "tabular-nums"
+    };
+    CodeBlock = React79__default.memo(
       ({
         code: rawCode,
         language = "text",
@@ -13666,13 +13953,39 @@ var init_CodeBlock = __esm({
         actions,
         isLoading = false,
         error,
-        showCopy
+        showCopy,
+        // editor capability surface — P1 wires these
+        editorId,
+        onEditorFocus = "EDITOR_FOCUS",
+        onEditorBlur = "EDITOR_BLUR",
+        onMotion = "MOTION",
+        onOperate = "OPERATE",
+        onInsertText = "INSERT_TEXT",
+        onSetMode = "SET_MODE",
+        motions = [
+          "left",
+          "right",
+          "up",
+          "down",
+          "word-forward",
+          "word-back",
+          "word-end",
+          "line-start",
+          "line-end",
+          "first-nonblank",
+          "doc-start",
+          "doc-end",
+          "paragraph-forward",
+          "paragraph-back",
+          "line",
+          "selection"
+        ],
+        operators = ["delete", "yank", "change"]
       }) => {
         const code = typeof rawCode === "string" ? rawCode : String(rawCode ?? "");
-        const isOrb = language === "orb";
-        const isLolo = language === "lolo";
-        const activeStyle = isOrb ? orbStyle : isLolo ? loloStyle : dark;
-        const languageReady = useLanguageReady(language);
+        const activeStyle = resolveHighlightStyle(language);
+        const overCapacity = code.length > HIGHLIGHT_CAPACITY_BYTES;
+        const plainCodeColor = plainCodeColorOf(activeStyle);
         const eventBus = useEventBus();
         const { t } = useTranslate();
         const scrollRef = useRef(null);
@@ -13684,6 +13997,9 @@ var init_CodeBlock = __esm({
         const activeFile = files?.[activeFileIndex];
         const activeCode = activeFile?.code ?? code;
         const activeLanguage = activeFile?.language ?? language;
+        const languageReady = useLanguageReady(activeLanguage);
+        const viewerStyle = resolveHighlightStyle(activeLanguage);
+        const viewerPlainCodeColor = plainCodeColorOf(viewerStyle);
         const diffLines = useMemo(() => {
           if (propDiff) return propDiff;
           if (mode === "diff" && oldValue !== void 0 && newValue !== void 0) {
@@ -13713,33 +14029,33 @@ var init_CodeBlock = __esm({
             ov.scrollLeft = ta.scrollLeft;
           }
         }, []);
-        const errorLineProps = useMemo(() => {
-          if (!errorLines || errorLines.size === 0) {
-            return LINE_PROPS_FN;
-          }
-          return (lineNumber) => {
-            const severity = errorLines.get(lineNumber);
-            if (!severity) {
-              return { "data-line": String(lineNumber - 1) };
-            }
-            return {
-              "data-line": String(lineNumber - 1),
-              style: {
-                display: "block",
-                backgroundColor: severity === "error" ? "rgba(248, 113, 113, 0.18)" : "rgba(251, 191, 36, 0.18)",
-                // amber-400 @ 18%
-                borderLeft: `3px solid ${severity === "error" ? "#ef4444" : "#f59e0b"}`,
-                paddingLeft: "0.5rem",
-                marginLeft: "-0.5rem"
-              }
-            };
-          };
-        }, [errorLines]);
+        const handleEditableChange = useCallback((v) => {
+          lastPropCodeRef.current = v;
+          setEditableValue(v);
+          onChange?.(v);
+        }, [onChange]);
+        const { caretMode } = useEditorCapabilities({
+          editorId: editable ? editorId : void 0,
+          textareaRef: editableTextareaRef,
+          events: { onMotion, onOperate, onInsertText, onSetMode },
+          applyChange: handleEditableChange
+        });
+        const [caretIndex, setCaretIndex] = useState(0);
+        const caretRowCol = useMemo(() => {
+          const before = editableValue.slice(0, Math.min(caretIndex, editableValue.length));
+          const lines = before.split("\n");
+          return { row: lines.length - 1, col: lines[lines.length - 1].length };
+        }, [editableValue, caretIndex]);
+        const errorLineProps = useMemo(() => buildLineProps(errorLines), [errorLines]);
+        const viewerLineProps = useMemo(
+          () => buildLineProps(errorLines, "px-4 py-0.5 hover:bg-muted/50"),
+          [errorLines]
+        );
         const isFoldable = foldableProp ?? true;
         const [collapsed, setCollapsed] = useState(() => /* @__PURE__ */ new Set());
         const foldRegions = useMemo(
-          () => isFoldable ? computeFoldRegions(code) : [],
-          [code, isFoldable]
+          () => isFoldable && !overCapacity ? computeFoldRegions(code) : [],
+          [code, isFoldable, overCapacity]
         );
         const foldStartMap = useMemo(() => {
           const m = /* @__PURE__ */ new Map();
@@ -13773,8 +14089,67 @@ var init_CodeBlock = __esm({
         useEffect(() => {
           setCollapsed(/* @__PURE__ */ new Set());
         }, [code]);
+        const editableOverCapacity = editableValue.length > HIGHLIGHT_CAPACITY_BYTES;
+        const editableHighlightedElement = useMemo(
+          () => editableOverCapacity ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                padding: "1rem",
+                margin: 0,
+                whiteSpace: "pre",
+                minWidth: "100%",
+                color: plainCodeColor,
+                fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace',
+                fontSize: "13px",
+                lineHeight: "1.5"
+              },
+              children: editableValue || " "
+            }
+          ) : /* @__PURE__ */ jsx(
+            SyntaxHighlighter,
+            {
+              PreTag: "div",
+              language,
+              style: activeStyle,
+              wrapLines: errorLines && errorLines.size > 0,
+              lineProps: errorLineProps,
+              customStyle: {
+                backgroundColor: "transparent",
+                borderRadius: 0,
+                padding: "1rem",
+                margin: 0,
+                whiteSpace: "pre",
+                minWidth: "100%",
+                fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace',
+                fontSize: "13px",
+                lineHeight: "1.5"
+              },
+              codeTagProps: {
+                style: {
+                  fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace',
+                  fontSize: "13px",
+                  lineHeight: "1.5"
+                }
+              },
+              children: editableValue || " "
+            }
+          ),
+          [editableValue, editableOverCapacity, plainCodeColor, language, activeStyle, errorLines, errorLineProps, languageReady]
+        );
         const highlightedElement = useMemo(
-          () => /* @__PURE__ */ jsx(
+          () => overCapacity ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                margin: 0,
+                whiteSpace: "pre",
+                minWidth: "100%",
+                color: plainCodeColor
+              },
+              children: code
+            }
+          ) : /* @__PURE__ */ jsx(
             SyntaxHighlighter,
             {
               PreTag: "div",
@@ -13796,8 +14171,112 @@ var init_CodeBlock = __esm({
               children: code
             }
           ),
-          [code, language, activeStyle, languageReady]
+          [code, overCapacity, plainCodeColor, language, activeStyle, languageReady]
+        );
+        const viewerOverCapacity = activeCode.length > HIGHLIGHT_CAPACITY_BYTES;
+        const viewerHighlightedElement = useMemo(
+          () => viewerOverCapacity ? /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "px-4 py-0.5",
+              style: {
+                margin: 0,
+                whiteSpace: wrap ? "pre-wrap" : "pre",
+                wordBreak: wrap ? "break-all" : "normal",
+                color: viewerPlainCodeColor,
+                fontFamily: MONO_FONT_FAMILY,
+                fontSize: "12px",
+                lineHeight: "1.6"
+              },
+              children: activeCode
+            }
+          ) : /* @__PURE__ */ jsx(
+            SyntaxHighlighter,
+            {
+              PreTag: "div",
+              language: activeLanguage,
+              style: viewerStyle,
+              wrapLines: true,
+              wrapLongLines: wrap,
+              showLineNumbers,
+              lineNumberStyle: VIEWER_LINE_NUMBER_STYLE,
+              lineProps: viewerLineProps,
+              customStyle: {
+                backgroundColor: "transparent",
+                borderRadius: 0,
+                padding: "0.25rem 0",
+                margin: 0,
+                whiteSpace: wrap ? "pre-wrap" : "pre",
+                wordBreak: wrap ? "break-all" : "normal",
+                fontFamily: MONO_FONT_FAMILY,
+                fontSize: "12px",
+                lineHeight: "1.6"
+              },
+              codeTagProps: { style: { fontFamily: MONO_FONT_FAMILY, fontSize: "12px", lineHeight: "1.6" } },
+              children: activeCode
+            }
+          ),
+          [activeCode, viewerOverCapacity, viewerPlainCodeColor, activeLanguage, viewerStyle, wrap, showLineNumbers, viewerLineProps, languageReady]
         );
+        const diffOverCapacity = useMemo(
+          () => !!diffLines && diffLines.reduce((n, l) => n + l.content.length + 1, 0) > HIGHLIGHT_CAPACITY_BYTES,
+          [diffLines]
+        );
+        const diffRowElements = useMemo(() => {
+          if (!diffLines) return null;
+          return diffLines.map((line, idx) => {
+            const style = DIFF_STYLES[line.type] ?? DIFF_STYLE_FALLBACK;
+            return /* @__PURE__ */ jsxs(HStack, { gap: "none", align: "start", className: cn(style.bg, "px-4 py-0.5"), children: [
+              showLineNumbers && /* @__PURE__ */ jsx(
+                Typography,
+                {
+                  variant: "caption",
+                  color: "secondary",
+                  className: "w-8 text-right mr-3 select-none tabular-nums flex-shrink-0",
+                  children: line.lineNumber ?? ""
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                Typography,
+                {
+                  variant: "caption",
+                  className: cn("font-mono flex-1 min-w-0", style.text, wrap ? "whitespace-pre-wrap break-all" : "whitespace-pre"),
+                  children: [
+                    /* @__PURE__ */ jsx(Box, { as: "span", className: "select-none opacity-50 mr-2", children: style.prefix }),
+                    diffOverCapacity ? line.content || " " : /* @__PURE__ */ jsx(
+                      SyntaxHighlighter,
+                      {
+                        PreTag: "span",
+                        CodeTag: "span",
+                        language: activeLanguage,
+                        style: viewerStyle,
+                        customStyle: {
+                          display: "inline",
+                          background: "transparent",
+                          padding: 0,
+                          margin: 0,
+                          whiteSpace: wrap ? "pre-wrap" : "pre",
+                          wordBreak: wrap ? "break-all" : "normal",
+                          fontFamily: "inherit",
+                          fontSize: "inherit",
+                          lineHeight: "inherit"
+                        },
+                        codeTagProps: {
+                          style: {
+                            whiteSpace: wrap ? "pre-wrap" : "pre",
+                            fontFamily: "inherit",
+                            fontSize: "inherit"
+                          }
+                        },
+                        children: line.content || " "
+                      }
+                    )
+                  ]
+                }
+              )
+            ] }, idx);
+          });
+        }, [diffLines, showLineNumbers, wrap, diffOverCapacity, activeLanguage, viewerStyle, languageReady]);
         useLayoutEffect(() => {
           const container = codeRef.current;
           if (!container) return;
@@ -13941,7 +14420,6 @@ var init_CodeBlock = __esm({
             label: file.label,
             content: null
           }));
-          const lines = activeCode.split("\n");
           return /* @__PURE__ */ jsx(Card, { className: cn("overflow-hidden", className), children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column" }, children: [
             tabItems && tabItems.length > 1 && /* @__PURE__ */ jsx(Box, { className: "border-b border-border", children: /* @__PURE__ */ jsx(
               Tabs,
@@ -14004,49 +14482,7 @@ var init_CodeBlock = __esm({
                 ]
               }
             ),
-            /* @__PURE__ */ jsx(Box, { className: "overflow-auto bg-muted/20", style: { maxHeight }, children: diffLines ? /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column" }, className: "font-mono text-xs", children: diffLines.map((line, idx) => {
-              const style = DIFF_STYLES[line.type] ?? DIFF_STYLE_FALLBACK;
-              return /* @__PURE__ */ jsxs(HStack, { gap: "none", align: "start", className: cn(style.bg, "px-4 py-0.5"), children: [
-                showLineNumbers && /* @__PURE__ */ jsx(
-                  Typography,
-                  {
-                    variant: "caption",
-                    color: "secondary",
-                    className: "w-8 text-right mr-3 select-none tabular-nums flex-shrink-0",
-                    children: line.lineNumber ?? ""
-                  }
-                ),
-                /* @__PURE__ */ jsxs(
-                  Typography,
-                  {
-                    variant: "caption",
-                    className: cn("font-mono flex-1 min-w-0", style.text, wrap ? "whitespace-pre-wrap break-all" : "whitespace-pre"),
-                    children: [
-                      /* @__PURE__ */ jsx(Box, { as: "span", className: "select-none opacity-50 mr-2", children: style.prefix }),
-                      line.content
-                    ]
-                  }
-                )
-              ] }, idx);
-            }) }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column" }, className: "font-mono text-xs", children: lines.map((line, idx) => /* @__PURE__ */ jsxs(HStack, { gap: "none", align: "start", className: "px-4 py-0.5 hover:bg-muted/50", children: [
-              showLineNumbers && /* @__PURE__ */ jsx(
-                Typography,
-                {
-                  variant: "caption",
-                  color: "secondary",
-                  className: "w-8 text-right mr-4 select-none tabular-nums flex-shrink-0",
-                  children: idx + 1
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Typography,
-                {
-                  variant: "caption",
-                  className: cn("font-mono flex-1 min-w-0", wrap ? "whitespace-pre-wrap break-all" : "whitespace-pre"),
-                  children: line || " "
-                }
-              )
-            ] }, idx)) }) })
+            /* @__PURE__ */ jsx(Box, { className: "overflow-auto bg-muted/20", style: { maxHeight }, children: diffLines ? /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column" }, className: "font-mono text-xs", children: diffRowElements }) : /* @__PURE__ */ jsx("div", { className: "font-mono text-xs", children: viewerHighlightedElement }) })
           ] }) });
         }
         const hasHeader = showLanguageBadge || effectiveCopy;
@@ -14125,35 +14561,7 @@ var init_CodeBlock = __esm({
                         overflow: "hidden",
                         pointerEvents: "none"
                       },
-                      children: /* @__PURE__ */ jsx(
-                        SyntaxHighlighter,
-                        {
-                          PreTag: "div",
-                          language,
-                          style: activeStyle,
-                          wrapLines: errorLines && errorLines.size > 0,
-                          lineProps: errorLineProps,
-                          customStyle: {
-                            backgroundColor: "transparent",
-                            borderRadius: 0,
-                            padding: "1rem",
-                            margin: 0,
-                            whiteSpace: "pre",
-                            minWidth: "100%",
-                            fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace',
-                            fontSize: "13px",
-                            lineHeight: "1.5"
-                          },
-                          codeTagProps: {
-                            style: {
-                              fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace',
-                              fontSize: "13px",
-                              lineHeight: "1.5"
-                            }
-                          },
-                          children: editableValue || " "
-                        }
-                      )
+                      children: editableHighlightedElement
                     }
                   ),
                   /* @__PURE__ */ jsx(
@@ -14161,13 +14569,11 @@ var init_CodeBlock = __esm({
                     {
                       ref: editableTextareaRef,
                       defaultValue: code,
-                      onChange: (e) => {
-                        const v = e.target.value;
-                        lastPropCodeRef.current = v;
-                        setEditableValue(v);
-                        onChange?.(v);
-                      },
+                      onChange: (e) => handleEditableChange(e.target.value),
                       onScroll: handleEditableScroll,
+                      onSelect: (e) => setCaretIndex(e.currentTarget.selectionStart),
+                      onFocus: editorId ? () => eventBus.emit(`UI:${onEditorFocus}`, { editorId }) : void 0,
+                      onBlur: editorId ? () => eventBus.emit(`UI:${onEditorBlur}`, { editorId }) : void 0,
                       spellCheck: false,
                       style: {
                         position: "absolute",
@@ -14182,7 +14588,7 @@ var init_CodeBlock = __esm({
                         resize: "none",
                         backgroundColor: "transparent",
                         color: "transparent",
-                        caretColor: "#e6e6e6",
+                        caretColor: caretMode === "block" ? "transparent" : "#e6e6e6",
                         WebkitTextFillColor: "transparent",
                         fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace',
                         fontSize: "13px",
@@ -14193,6 +14599,22 @@ var init_CodeBlock = __esm({
                       }
                     },
                     editableTextareaKey
+                  ),
+                  caretMode !== "bar" && /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      "aria-hidden": true,
+                      style: {
+                        position: "absolute",
+                        top: `calc(1rem + ${caretRowCol.row * 19.5}px)`,
+                        left: `calc(1rem + ${caretRowCol.col}ch)`,
+                        width: "1ch",
+                        height: caretMode === "block" ? "19.5px" : "2px",
+                        backgroundColor: caretMode === "block" ? "rgba(230, 230, 230, 0.5)" : void 0,
+                        borderBottom: caretMode === "underline" ? "2px solid #e6e6e6" : void 0,
+                        pointerEvents: "none"
+                      }
+                    }
                   )
                 ]
               }
@@ -14220,55 +14642,175 @@ var init_CodeBlock = __esm({
           )
         ] });
       },
-      (prev, next) => prev.language === next.language && prev.code === next.code && prev.showCopyButton === next.showCopyButton && prev.showCopy === next.showCopy && prev.maxHeight === next.maxHeight && prev.foldable === next.foldable && prev.editable === next.editable && prev.onChange === next.onChange && prev.errorLines === next.errorLines && prev.mode === next.mode && prev.title === next.title && prev.diff === next.diff && prev.files === next.files && prev.actions === next.actions && prev.isLoading === next.isLoading && prev.error === next.error
+      (prev, next) => prev.language === next.language && prev.code === next.code && prev.showCopyButton === next.showCopyButton && prev.showCopy === next.showCopy && prev.maxHeight === next.maxHeight && prev.foldable === next.foldable && prev.editable === next.editable && prev.onChange === next.onChange && prev.errorLines === next.errorLines && prev.mode === next.mode && prev.title === next.title && prev.diff === next.diff && prev.files === next.files && prev.actions === next.actions && prev.isLoading === next.isLoading && prev.error === next.error && prev.editorId === next.editorId && prev.onEditorFocus === next.onEditorFocus && prev.onEditorBlur === next.onEditorBlur && prev.onMotion === next.onMotion && prev.onOperate === next.onOperate && prev.onInsertText === next.onInsertText && prev.onSetMode === next.onSetMode && prev.motions === next.motions && prev.operators === next.operators
     );
     CodeBlock.displayName = "CodeBlock";
   }
 });
+
+// components/core/molecules/markdown/mermaidSource.ts
+function isQuoted(label) {
+  const trimmed = label.trim();
+  return trimmed.length === 0 || trimmed.startsWith('"') && trimmed.endsWith('"') && trimmed.length > 1;
+}
+function quote(label) {
+  return `"${label.replace(/"/g, "#quot;")}"`;
+}
+function isIdentifierChar(ch) {
+  return /[A-Za-z0-9_\-.]/.test(ch);
+}
+function declaredType(code) {
+  for (const line of code.split("\n")) {
+    const trimmed = line.trim();
+    if (trimmed.length === 0 || trimmed.startsWith("%%")) continue;
+    return trimmed;
+  }
+  return "";
+}
+function isFlowchart(code) {
+  return FLOWCHART_DIRECTIVE.test(declaredType(code));
+}
+function quoteNodeLabels(code) {
+  let out = "";
+  let i = 0;
+  while (i < code.length) {
+    const shape = NODE_SHAPES.find(([open2]) => code.startsWith(open2, i));
+    const precededByIdentifier = i > 0 && isIdentifierChar(code[i - 1] ?? "");
+    if (shape === void 0 || !precededByIdentifier) {
+      out += code[i];
+      i += 1;
+      continue;
+    }
+    const [open, close] = shape;
+    const contentStart = i + open.length;
+    const closeAt = code.indexOf(close, contentStart);
+    const newlineAt = code.indexOf("\n", contentStart);
+    if (closeAt === -1 || newlineAt !== -1 && newlineAt < closeAt) {
+      out += code[i];
+      i += 1;
+      continue;
+    }
+    const label = code.slice(contentStart, closeAt);
+    out += open + (isQuoted(label) ? label : quote(label)) + close;
+    i = closeAt + close.length;
+  }
+  return out;
+}
+function quoteEdgeLabels(code) {
+  return code.split("\n").map((line) => {
+    let out = "";
+    let rest = line;
+    for (; ; ) {
+      const open = rest.indexOf("|");
+      if (open === -1) break;
+      const close = rest.indexOf("|", open + 1);
+      if (close === -1) break;
+      const label = rest.slice(open + 1, close);
+      out += rest.slice(0, open + 1) + (isQuoted(label) ? label : quote(label)) + "|";
+      rest = rest.slice(close + 1);
+    }
+    return out + rest;
+  }).join("\n");
+}
+function quoteSubgraphTitles(code) {
+  return code.split("\n").map((line) => {
+    const match = /^(\s*subgraph\s+)(.+?)(\s*)$/.exec(line);
+    if (match === null) return line;
+    const [, prefix, title, trailing] = match;
+    if (title === void 0 || prefix === void 0) return line;
+    if (isQuoted(title) || title.includes("[")) return line;
+    return prefix + quote(title) + (trailing ?? "");
+  }).join("\n");
+}
+function mermaidRepairCandidates(code) {
+  if (!isFlowchart(code)) return [];
+  const nodes = quoteNodeLabels(code);
+  const nodesAndEdges = quoteEdgeLabels(nodes);
+  const all = quoteSubgraphTitles(nodesAndEdges);
+  const ordered2 = [nodes, nodesAndEdges, all];
+  const seen = /* @__PURE__ */ new Set([code]);
+  const candidates = [];
+  for (const candidate of ordered2) {
+    if (seen.has(candidate)) continue;
+    seen.add(candidate);
+    candidates.push(candidate);
+  }
+  return candidates;
+}
+var NODE_SHAPES, FLOWCHART_DIRECTIVE;
+var init_mermaidSource = __esm({
+  "components/core/molecules/markdown/mermaidSource.ts"() {
+    NODE_SHAPES = [
+      ["[[", "]]"],
+      ["[(", ")]"],
+      ["([", "])"],
+      ["((", "))"],
+      ["{{", "}}"],
+      ["[", "]"],
+      ["(", ")"],
+      ["{", "}"]
+    ];
+    FLOWCHART_DIRECTIVE = /^(?:graph|flowchart)\b/;
+  }
+});
 function loadMermaid() {
   mermaidModule ?? (mermaidModule = import('mermaid').then((m) => m.default));
   return mermaidModule;
 }
-var mermaidModule, MermaidDiagram;
+var log6, mermaidModule, MermaidDiagram;
 var init_MermaidDiagram = __esm({
   "components/core/molecules/markdown/MermaidDiagram.tsx"() {
     init_Box();
     init_Typography();
     init_CodeBlock();
+    init_mermaidSource();
     init_cn();
+    log6 = createLogger("almadar:ui:mermaid-diagram");
     mermaidModule = null;
-    MermaidDiagram = React78__default.memo(
+    MermaidDiagram = React79__default.memo(
       ({ code, className }) => {
         const { resolvedMode } = useTheme();
+        const { t } = useTranslate();
         const containerRef = useRef(null);
-        const [error, setError] = useState(null);
+        const [unrenderable, setUnrenderable] = useState(false);
         const reactId = useId();
         useEffect(() => {
           let active = true;
           void (async () => {
-            try {
-              const mermaid = await loadMermaid();
-              mermaid.initialize({
-                startOnLoad: false,
-                securityLevel: "strict",
-                theme: resolvedMode === "dark" ? "dark" : "default"
-              });
-              const domId = `mermaid-${reactId.replace(/[^a-zA-Z0-9]/g, "")}`;
-              const { svg } = await mermaid.render(domId, code);
-              if (!active || !containerRef.current) return;
-              containerRef.current.innerHTML = svg;
-              setError(null);
-            } catch (err) {
-              if (active) setError(err instanceof Error ? err.message : String(err));
+            const mermaid = await loadMermaid();
+            mermaid.initialize({
+              startOnLoad: false,
+              securityLevel: "strict",
+              theme: resolvedMode === "dark" ? "dark" : "default"
+            });
+            const domId = `mermaid-${reactId.replace(/[^a-zA-Z0-9]/g, "")}`;
+            let firstError = null;
+            for (const [index, source] of [code, ...mermaidRepairCandidates(code)].entries()) {
+              try {
+                const { svg } = await mermaid.render(domId, source);
+                if (!active) return;
+                const container = containerRef.current;
+                if (container === null) return;
+                container.innerHTML = svg;
+                container.dataset.mermaidRepaired = String(index > 0);
+                setUnrenderable(false);
+                if (index > 0) log6.debug("mermaid:repaired", { candidate: index });
+                return;
+              } catch (err) {
+                firstError ?? (firstError = err instanceof Error ? err : new Error(String(err)));
+              }
             }
+            if (!active) return;
+            log6.warn("mermaid:unrenderable", { error: firstError?.message ?? "", code });
+            setUnrenderable(true);
           })();
           return () => {
             active = false;
           };
         }, [code, resolvedMode, reactId]);
         return /* @__PURE__ */ jsxs(Box, { className: cn("not-prose my-4", className), children: [
-          error !== null && /* @__PURE__ */ jsxs(Box, { className: "space-y-2 mb-2", children: [
-            /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-error whitespace-pre-wrap", children: error }),
+          unrenderable && /* @__PURE__ */ jsxs(Box, { className: "space-y-2 mb-2", "data-testid": "mermaid-unrenderable", children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: t("mermaid.unrenderable") }),
             /* @__PURE__ */ jsx(CodeBlock, { code, language: "mermaid" })
           ] }),
           /* @__PURE__ */ jsx(
@@ -14277,7 +14819,7 @@ var init_MermaidDiagram = __esm({
               ref: containerRef,
               "data-testid": "mermaid-diagram",
               className: "overflow-x-auto",
-              style: error !== null ? { display: "none" } : void 0
+              style: unrenderable ? { display: "none" } : void 0
             }
           )
         ] });
@@ -14295,7 +14837,7 @@ var init_MarkdownContent = __esm({
     init_CodeBlock();
     init_MermaidDiagram();
     init_cn();
-    MarkdownContent = React78__default.memo(
+    MarkdownContent = React79__default.memo(
       ({ content, direction = "ltr", className }) => {
         const { t: _t } = useTranslate();
         const safeContent = typeof content === "string" ? content : String(content ?? "");
@@ -15625,7 +16167,7 @@ var init_StateMachineView = __esm({
                 style: { top: title ? 30 : 0 },
                 children: [
                   entity && /* @__PURE__ */ jsx(EntityBox, { entity, config }),
-                  states.map((state) => renderStateNode ? /* @__PURE__ */ jsx(React78__default.Fragment, { children: renderStateNode(state, config) }, state.id) : /* @__PURE__ */ jsx(
+                  states.map((state) => renderStateNode ? /* @__PURE__ */ jsx(React79__default.Fragment, { children: renderStateNode(state, config) }, state.id) : /* @__PURE__ */ jsx(
                     StateNode,
                     {
                       state,
@@ -17682,14 +18224,14 @@ function useSafeEventBus2() {
     } };
   }
 }
-var log6, lookStyles4, ButtonGroup;
+var log7, lookStyles4, ButtonGroup;
 var init_ButtonGroup = __esm({
   "components/core/molecules/ButtonGroup.tsx"() {
     "use client";
     init_cn();
     init_atoms();
     init_useEventBus();
-    log6 = createLogger("almadar:ui:button-group");
+    log7 = createLogger("almadar:ui:button-group");
     lookStyles4 = {
       "right-aligned-buttons": "",
       "floating-bar": "fixed bottom-section left-1/2 -translate-x-1/2 shadow-elevation-toast bg-card p-card-sm rounded-container",
@@ -17770,7 +18312,7 @@ var init_ButtonGroup = __esm({
           {
             variant: "ghost",
             onClick: () => {
-              log6.debug("Filter clicked", { field: filter.field });
+              log7.debug("Filter clicked", { field: filter.field });
             },
             children: filter.label
           },
@@ -18266,8 +18808,8 @@ function MiniMap({
   tileAssets,
   unitAssets
 }) {
-  const canvasRef = React78.useRef(null);
-  const imgCacheRef = React78.useRef(/* @__PURE__ */ new Map());
+  const canvasRef = React79.useRef(null);
+  const imgCacheRef = React79.useRef(/* @__PURE__ */ new Map());
   function loadImg(url) {
     const cached = imgCacheRef.current.get(url);
     if (cached) return cached.complete ? cached : null;
@@ -18283,7 +18825,7 @@ function MiniMap({
     imgCacheRef.current.set(url, img);
     return null;
   }
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -18788,7 +19330,7 @@ function collectDrawnItems(nodes) {
   for (const n of nodes) {
     switch (n.type) {
       case "draw-sprite":
-        if (isValidScenePos(n.position)) out.push({ pos: n.position, id: n.id, anchor: n.anchor, width: n.width, height: n.height });
+        if (isValidScenePos(n.position)) out.push({ pos: n.position, id: n.id, anchor: n.anchor, width: n.width, height: n.height, rotation: n.rotation });
         break;
       case "draw-shape":
       case "draw-text":
@@ -18798,7 +19340,7 @@ function collectDrawnItems(nodes) {
         break;
       case "draw-sprite-layer":
         for (const it of n.items) {
-          if (isValidScenePos(it.position)) out.push({ pos: it.position, id: it.id, anchor: it.anchor, width: it.width, height: it.height });
+          if (isValidScenePos(it.position)) out.push({ pos: it.position, id: it.id, anchor: it.anchor, width: it.width, height: it.height, rotation: it.rotation });
         }
         break;
       case "draw-shape-layer":
@@ -18818,15 +19360,39 @@ function buildHitIndex(items) {
   }
   return m;
 }
+function withPreviewPosition(nodes, id, pos) {
+  return nodes.map((n) => {
+    if (n.type === "draw-sprite-layer" || n.type === "draw-shape-layer" || n.type === "draw-text-layer") {
+      if (!n.items.some((it) => it.id === id)) return n;
+      return { ...n, items: n.items.map((it) => it.id === id ? { ...it, position: pos } : it) };
+    }
+    if (n.type === "draw-group") {
+      if (!Array.isArray(n.items)) return n;
+      return { ...n, items: withPreviewPosition(n.items, id, pos) };
+    }
+    if (n.id === id && "position" in n) {
+      return { ...n, position: pos };
+    }
+    return n;
+  });
+}
 function hitTestSprites(items, projector, point) {
   for (let i = items.length - 1; i >= 0; i--) {
     const it = items[i];
     if (it.id === void 0) continue;
     const r = spriteRect(projector, { position: it.pos, anchor: it.anchor, width: it.width, height: it.height });
-    if (point.x >= r.x && point.x <= r.x + r.w && point.y >= r.y && point.y <= r.y + r.h) return it.id;
+    const test = it.rotation ? rotatePoint(point, { x: r.x + r.w / 2, y: r.y + r.h / 2 }, -it.rotation) : point;
+    if (test.x >= r.x && test.x <= r.x + r.w && test.y >= r.y && test.y <= r.y + r.h) return it.id;
   }
   return void 0;
 }
+function rotatePoint(p, center, radians) {
+  const cos = Math.cos(radians);
+  const sin = Math.sin(radians);
+  const dx = p.x - center.x;
+  const dy = p.y - center.y;
+  return { x: center.x + dx * cos - dy * sin, y: center.y + dx * sin + dy * cos };
+}
 var init_hitTest = __esm({
   "lib/drawable/hitTest.ts"() {
     init_contract();
@@ -18835,6 +19401,41 @@ var init_hitTest = __esm({
 function normalizeBackdrop(bg) {
   return typeof bg === "string" ? { url: bg, role: "decoration", category: "background" } : bg;
 }
+function selectionOverlayNodes(projector, item) {
+  const r = spriteRect(projector, { position: item.pos, anchor: item.anchor, width: item.width, height: item.height });
+  const tw = projector.tileWidth;
+  const cellTopLeft = projector.anchorPoint(item.pos, "top-left");
+  const offsetX = (r.x - cellTopLeft.x) / tw;
+  const offsetY = (r.y - cellTopLeft.y) / tw;
+  const width = r.w / tw;
+  const height = r.h / tw;
+  const handle = EDIT_HANDLE_SIZE_PX / tw;
+  const ring = {
+    type: "draw-shape",
+    shape: "rect",
+    position: item.pos,
+    anchor: "top-left",
+    offsetX,
+    offsetY,
+    width,
+    height,
+    stroke: EDIT_SELECTION_COLOR,
+    strokeWidth: 2,
+    fill: "none"
+  };
+  const handles = EDIT_SELECTION_CORNERS.map(([cx, cy]) => ({
+    type: "draw-shape",
+    shape: "rect",
+    position: item.pos,
+    anchor: "top-left",
+    offsetX: offsetX + cx * width - handle / 2,
+    offsetY: offsetY + cy * height - handle / 2,
+    width: handle,
+    height: handle,
+    fill: EDIT_SELECTION_COLOR
+  }));
+  return [ring, ...handles];
+}
 function Canvas2D({
   className,
   isLoading = false,
@@ -18848,6 +19449,12 @@ function Canvas2D({
   tileLeaveEvent,
   keyMap,
   keyUpMap,
+  editable = false,
+  selectedId = null,
+  onSelect,
+  onMove,
+  selectEvent,
+  moveEvent,
   camera = "pan-zoom",
   scale = 0.4,
   tileWidth,
@@ -18864,7 +19471,7 @@ function Canvas2D({
   const registerChildDrawable = useCallback((node) => {
     childDrawablesRef.current.push(node);
   }, []);
-  const hasJsxChildren = React78.Children.count(children) > 0;
+  const hasJsxChildren = React79.Children.count(children) > 0;
   function isDrawableLayer(node) {
     return node.type === "draw-sprite-layer" || node.type === "draw-shape-layer" || node.type === "draw-text-layer";
   }
@@ -19105,10 +19712,22 @@ function Canvas2D({
     painter.scale(cam.zoom, cam.zoom);
     painter.translate(-viewportSize.width / 2 - cam.x, -viewportSize.height / 2 - cam.y);
     const dctx = { projector, time: timeMs, invalidate: bumpAtlas };
-    for (const node of drawables) paintDrawable(painter, node, dctx);
+    let paintNodes = drawables;
+    if (editable) {
+      const drag = editDragRef.current;
+      if (drag && drag.moved) {
+        paintNodes = withPreviewPosition(paintNodes, drag.id, { x: drag.previewX, y: drag.previewY });
+      }
+      const selectedItem = selectedId != null ? drawnItems.find((it) => it.id === selectedId) : void 0;
+      if (selectedItem) {
+        const overlaySource = drag && drag.moved && drag.id === selectedId ? { ...selectedItem, pos: { x: drag.previewX, y: drag.previewY } } : selectedItem;
+        paintNodes = [...paintNodes, ...selectionOverlayNodes(projector, overlaySource)];
+      }
+    }
+    for (const node of paintNodes) paintDrawable(painter, node, dctx);
     painter.restore();
-    scheduleAnimation(drawables);
-  }, [viewportSize, backgroundImage, bgColor, drawables, projector, cameraRef, bumpAtlas, getImage, cameraPos, defaultGridFocus, camera, dragDistance]);
+    scheduleAnimation(paintNodes);
+  }, [viewportSize, backgroundImage, bgColor, drawables, projector, cameraRef, bumpAtlas, getImage, cameraPos, defaultGridFocus, camera, dragDistance, editable, selectedId, drawnItems]);
   useEffect(() => {
     drawTimeRef.current = draw;
   }, [draw]);
@@ -19153,23 +19772,83 @@ function Canvas2D({
     };
   }, [camera, followTarget, lerpToTarget, draw]);
   const singlePointerActiveRef = useRef(false);
+  const editDragRef = useRef(null);
+  const pointerToScene = useCallback((clientX, clientY) => {
+    const canvas = canvasRef.current;
+    if (!canvas) return { x: 0, y: 0 };
+    const world = screenToWorld(clientX, clientY, canvas, viewportSize);
+    const adjustedX = world.x - scaledTileWidth / 2;
+    const adjustedY = squareGrid ? world.y - scaledTileWidth / 2 : world.y - scaledDiamondTopY - scaledFloorHeight / 2;
+    return unproject(adjustedX, adjustedY);
+  }, [screenToWorld, viewportSize, scaledTileWidth, squareGrid, scaledDiamondTopY, scaledFloorHeight, unproject]);
   const handleCanvasPointerDown = useCallback((e) => {
     singlePointerActiveRef.current = true;
+    if (editable) {
+      if (!canvasRef.current) return;
+      const world = screenToWorld(e.clientX, e.clientY, canvasRef.current, viewportSize);
+      const hitId = hitTestSprites(drawnItems, projector, world);
+      if (hitId === void 0) return;
+      const item = [...drawnItems].reverse().find((it) => it.id === hitId);
+      if (!item) return;
+      editDragRef.current = {
+        id: hitId,
+        pointerId: e.pointerId,
+        startClientX: e.clientX,
+        startClientY: e.clientY,
+        startSceneX: item.pos.x,
+        startSceneY: item.pos.y,
+        moved: false,
+        previewX: item.pos.x,
+        previewY: item.pos.y
+      };
+      return;
+    }
     if (enableCamera) handlePointerDown(e);
-  }, [enableCamera, handlePointerDown]);
+  }, [editable, screenToWorld, viewportSize, drawnItems, projector, enableCamera, handlePointerDown]);
   const handleCanvasPointerMove = useCallback((e) => {
+    if (editable) {
+      const drag = editDragRef.current;
+      if (!drag || drag.pointerId !== e.pointerId) return;
+      const dxPx = e.clientX - drag.startClientX;
+      const dyPx = e.clientY - drag.startClientY;
+      if (!drag.moved && Math.abs(dxPx) + Math.abs(dyPx) <= 5) return;
+      drag.moved = true;
+      const nowScene = pointerToScene(e.clientX, e.clientY);
+      const startScene = pointerToScene(drag.startClientX, drag.startClientY);
+      drag.previewX = drag.startSceneX + (nowScene.x - startScene.x);
+      drag.previewY = drag.startSceneY + (nowScene.y - startScene.y);
+      draw();
+      return;
+    }
     if (enableCamera) handlePointerMove(e, () => draw());
-  }, [enableCamera, handlePointerMove, draw]);
+  }, [editable, pointerToScene, draw, enableCamera, handlePointerMove]);
   const handleCanvasHover = useCallback((e) => {
     if (singlePointerActiveRef.current) return;
     if (!tileHoverEvent || !canvasRef.current) return;
-    const world = screenToWorld(e.clientX, e.clientY, canvasRef.current, viewportSize);
-    const adjustedX = world.x - scaledTileWidth / 2;
-    const adjustedY = squareGrid ? world.y - scaledTileWidth / 2 : world.y - scaledDiamondTopY - scaledFloorHeight / 2;
-    const isoPos = unproject(adjustedX, adjustedY);
+    const isoPos = pointerToScene(e.clientX, e.clientY);
     eventBus.emit(`UI:${tileHoverEvent}`, { x: isoPos.x, y: isoPos.y });
-  }, [screenToWorld, viewportSize, scaledTileWidth, squareGrid, scaledDiamondTopY, scaledFloorHeight, unproject, tileHoverEvent, eventBus]);
+  }, [pointerToScene, tileHoverEvent, eventBus]);
   const handleCanvasPointerUp = useCallback((e) => {
+    if (editable) {
+      singlePointerActiveRef.current = false;
+      const drag = editDragRef.current;
+      if (drag && drag.pointerId === e.pointerId) {
+        editDragRef.current = null;
+        if (drag.moved) {
+          onMove?.(drag.id, drag.previewX, drag.previewY);
+          if (moveEvent) eventBus.emit(`UI:${moveEvent}`, { id: drag.id, x: drag.previewX, y: drag.previewY });
+          draw();
+          return;
+        }
+        const next = selectedId === drag.id ? null : drag.id;
+        onSelect?.(next);
+        if (selectEvent) eventBus.emit(`UI:${selectEvent}`, { id: next });
+        return;
+      }
+      onSelect?.(null);
+      if (selectEvent) eventBus.emit(`UI:${selectEvent}`, { id: null });
+      return;
+    }
     singlePointerActiveRef.current = false;
     if (enableCamera) handlePointerUp();
     if (dragDistance() > 5) return;
@@ -19180,16 +19859,14 @@ function Canvas2D({
       eventBus.emit(`UI:${unitClickEvent}`, { unitId: spriteHit });
       return;
     }
-    const adjustedX = world.x - scaledTileWidth / 2;
-    const adjustedY = squareGrid ? world.y - scaledTileWidth / 2 : world.y - scaledDiamondTopY - scaledFloorHeight / 2;
-    const isoPos = unproject(adjustedX, adjustedY);
+    const isoPos = pointerToScene(e.clientX, e.clientY);
     const hitId = hitIndex.get(`${isoPos.x},${isoPos.y}`);
     if (hitId !== void 0 && unitClickEvent) {
       eventBus.emit(`UI:${unitClickEvent}`, { unitId: hitId });
     } else if (tileClickEvent) {
       eventBus.emit(`UI:${tileClickEvent}`, { x: isoPos.x, y: isoPos.y });
     }
-  }, [enableCamera, handlePointerUp, dragDistance, screenToWorld, viewportSize, scaledTileWidth, squareGrid, scaledDiamondTopY, scaledFloorHeight, unproject, hitIndex, drawnItems, projector, tileClickEvent, unitClickEvent, eventBus]);
+  }, [editable, selectedId, onMove, moveEvent, onSelect, selectEvent, eventBus, draw, enableCamera, handlePointerUp, dragDistance, screenToWorld, viewportSize, drawnItems, projector, tileClickEvent, unitClickEvent, hitIndex, pointerToScene]);
   const handleCanvasPointerLeave = useCallback(() => {
     handleMouseLeave();
     if (tileLeaveEvent) eventBus.emit(`UI:${tileLeaveEvent}`, {});
@@ -19208,7 +19885,7 @@ function Canvas2D({
   }, [enableCamera, handlePointerUp]);
   const gestureHandlers = useCanvasGestures({
     canvasRef,
-    enabled: enableCamera || !!tileHoverEvent || !!tileClickEvent || !!unitClickEvent,
+    enabled: enableCamera || !!tileHoverEvent || !!tileClickEvent || !!unitClickEvent || editable,
     onPointerDown: handleCanvasPointerDown,
     onPointerMove: handleCanvasPointerMove,
     onPointerUp: handleCanvasPointerUp,
@@ -19340,7 +20017,7 @@ function Canvas2D({
     }
   ) });
 }
-var canvas2DLog;
+var canvas2DLog, EDIT_SELECTION_COLOR, EDIT_HANDLE_SIZE_PX, EDIT_SELECTION_CORNERS;
 var init_Canvas2D = __esm({
   "components/game/molecules/Canvas2D.tsx"() {
     "use client";
@@ -19365,8 +20042,12 @@ var init_Canvas2D = __esm({
     init_DrawGroup();
     init_registry();
     init_hitTest();
+    init_contract();
     init_isometric();
     canvas2DLog = createLogger("almadar:ui:game-canvas");
+    EDIT_SELECTION_COLOR = "#3b82f6";
+    EDIT_HANDLE_SIZE_PX = 8;
+    EDIT_SELECTION_CORNERS = [[0, 0], [1, 0], [0, 1], [1, 1]];
     Canvas2D.displayName = "Canvas2D";
   }
 });
@@ -19408,6 +20089,12 @@ function Canvas({
   featureClickEvent,
   keyMap,
   keyUpMap,
+  editable,
+  selectedId,
+  onSelect,
+  onMove,
+  selectEvent,
+  moveEvent,
   children
 }) {
   canvasLog.debug("Canvas render", { mode, drawablesCount: drawables?.length, projection, camera: camera ? JSON.stringify(camera) : void 0 });
@@ -19422,7 +20109,7 @@ function Canvas({
     if (mode !== "3d") return;
     const next = childDrawablesRef.current;
     canvasLog.debug("children:adopt", { registered: next.length, adopted: childDrawables.length });
-    if (next.length === 0 && React78.Children.count(children) > 0) return;
+    if (next.length === 0 && React79.Children.count(children) > 0) return;
     setChildDrawables(
       (prev) => prev.length === next.length && JSON.stringify(prev) === JSON.stringify(next) ? prev : [...next]
     );
@@ -19460,7 +20147,7 @@ function Canvas({
     };
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(Canvas3DHost2, { ...props3d }) }),
-      React78.Children.count(children) > 0 && /* @__PURE__ */ jsx(DrawableRegistryContext.Provider, { value: registerChildDrawable, children: /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { position: "absolute", width: 0, height: 0, overflow: "hidden" }, children }) })
+      React79.Children.count(children) > 0 && /* @__PURE__ */ jsx(DrawableRegistryContext.Provider, { value: registerChildDrawable, children: /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { position: "absolute", width: 0, height: 0, overflow: "hidden" }, children }) })
     ] });
   }
   return /* @__PURE__ */ jsx(
@@ -19485,6 +20172,12 @@ function Canvas({
       tileLeaveEvent,
       keyMap,
       keyUpMap,
+      editable,
+      selectedId,
+      onSelect,
+      onMove,
+      selectEvent,
+      moveEvent,
       ...children !== void 0 ? { children } : {}
     }
   );
@@ -21852,6 +22545,187 @@ var init_CodeRunnerPanel = __esm({
     CodeRunnerPanel.displayName = "CodeRunnerPanel";
   }
 });
+function matchesQuery(query, text) {
+  if (!query) return true;
+  let qi = 0;
+  const q = query.toLowerCase();
+  const t = text.toLowerCase();
+  for (let ti = 0; ti < t.length && qi < q.length; ti++) {
+    if (t[ti] === q[qi]) qi++;
+  }
+  return qi === q.length;
+}
+function commandMatches(command, query) {
+  if (!query) return true;
+  if (matchesQuery(query, command.label)) return true;
+  return (command.keywords ?? []).some((keyword) => matchesQuery(query, keyword));
+}
+function dispatchCommandPaletteCommand(command, deps) {
+  if (command.disabled) return;
+  if (command.event) deps.emit(`UI:${command.event}`, { commandId: command.id });
+  if (command.action) deps.emit(`UI:${command.action}`, command.actionPayload ?? {});
+  deps.onSelect?.(command);
+}
+var UNGROUPED, CommandPalette;
+var init_CommandPalette = __esm({
+  "components/core/molecules/CommandPalette.tsx"() {
+    "use client";
+    init_Box();
+    init_Stack();
+    init_Typography();
+    init_Icon();
+    init_Input();
+    init_Badge();
+    init_cn();
+    init_useEventBus();
+    init_Modal();
+    UNGROUPED = /* @__PURE__ */ Symbol("command-palette-ungrouped");
+    CommandPalette = ({
+      open,
+      onOpenChange,
+      commands,
+      onSelect,
+      placeholder = "Type a command...",
+      emptyLabel = "No matching commands",
+      className
+    }) => {
+      const eventBus = useEventBus();
+      const [query, setQuery] = useState("");
+      const [highlightIndex, setHighlightIndex] = useState(0);
+      const filtered = useMemo(
+        () => commands.filter((command) => commandMatches(command, query)),
+        [commands, query]
+      );
+      const groups = useMemo(() => {
+        const order = [];
+        const byGroup = /* @__PURE__ */ new Map();
+        for (const command of filtered) {
+          const key = command.group ?? UNGROUPED;
+          if (!byGroup.has(key)) {
+            byGroup.set(key, []);
+            order.push(key);
+          }
+          byGroup.get(key).push(command);
+        }
+        return order.map((key) => ({ group: key === UNGROUPED ? void 0 : key, items: byGroup.get(key) }));
+      }, [filtered]);
+      const resetQuery = useCallback(() => {
+        setQuery("");
+        setHighlightIndex(0);
+      }, []);
+      const handleClose = useCallback(() => {
+        resetQuery();
+        onOpenChange(false);
+      }, [onOpenChange, resetQuery]);
+      const handleSelect = useCallback(
+        (command) => {
+          if (command.disabled) return;
+          dispatchCommandPaletteCommand(command, { emit: eventBus.emit, onSelect });
+          handleClose();
+        },
+        [eventBus, onSelect, handleClose]
+      );
+      const handleQueryChange = useCallback((e) => {
+        setQuery(e.target.value);
+        setHighlightIndex(0);
+      }, []);
+      const handleKeyDown = useCallback(
+        (e) => {
+          if (filtered.length === 0) return;
+          if (e.key === "ArrowDown") {
+            e.preventDefault();
+            setHighlightIndex((prev) => prev < filtered.length - 1 ? prev + 1 : 0);
+          } else if (e.key === "ArrowUp") {
+            e.preventDefault();
+            setHighlightIndex((prev) => prev > 0 ? prev - 1 : filtered.length - 1);
+          } else if (e.key === "Enter") {
+            e.preventDefault();
+            const command = filtered[highlightIndex];
+            if (command) handleSelect(command);
+          }
+        },
+        [filtered, highlightIndex, handleSelect]
+      );
+      return /* @__PURE__ */ jsx(
+        Modal,
+        {
+          isOpen: open,
+          onClose: handleClose,
+          onExited: resetQuery,
+          showCloseButton: false,
+          size: "md",
+          className,
+          children: /* @__PURE__ */ jsx(Box, { "data-testid": "command-palette", children: /* @__PURE__ */ jsxs(VStack, { gap: "sm", children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                inputType: "search",
+                placeholder,
+                value: query,
+                onChange: handleQueryChange,
+                onKeyDown: handleKeyDown,
+                leftIcon: "search",
+                clearable: query.length > 0,
+                onClear: resetQuery,
+                autoFocus: true,
+                "data-testid": "command-palette-input"
+              }
+            ),
+            filtered.length === 0 ? /* @__PURE__ */ jsx(Box, { className: "px-2 py-6 text-center", "data-testid": "command-palette-empty", children: /* @__PURE__ */ jsx(Typography, { variant: "body", color: "muted", children: emptyLabel }) }) : /* @__PURE__ */ jsx(
+              Box,
+              {
+                className: "max-h-80 overflow-y-auto",
+                role: "listbox",
+                "aria-label": placeholder,
+                children: /* @__PURE__ */ jsx(VStack, { gap: "none", children: groups.map(({ group, items }) => /* @__PURE__ */ jsxs(Box, { children: [
+                  group ? /* @__PURE__ */ jsx(
+                    Typography,
+                    {
+                      variant: "caption",
+                      color: "muted",
+                      className: "px-3 pt-2 pb-1 block",
+                      children: group
+                    }
+                  ) : null,
+                  items.map((command) => {
+                    const index = filtered.indexOf(command);
+                    const isHighlighted = index === highlightIndex;
+                    return /* @__PURE__ */ jsxs(
+                      Box,
+                      {
+                        as: "button",
+                        role: "option",
+                        "aria-selected": isHighlighted,
+                        "aria-disabled": command.disabled || void 0,
+                        "data-testid": `command-palette-item-${command.id}`,
+                        onMouseEnter: () => !command.disabled && setHighlightIndex(index),
+                        onClick: () => handleSelect(command),
+                        className: cn(
+                          "w-full flex items-center gap-3 px-3 py-2 text-start rounded-sm",
+                          "text-sm transition-colors",
+                          "focus:outline-none",
+                          isHighlighted && "bg-muted",
+                          command.disabled && "opacity-50 cursor-not-allowed"
+                        ),
+                        children: [
+                          command.icon ? /* @__PURE__ */ jsx(Icon, { icon: command.icon, size: "sm", className: "flex-shrink-0" }) : null,
+                          /* @__PURE__ */ jsx(Typography, { variant: "small", className: "flex-1 truncate", children: command.label }),
+                          command.shortcut ? /* @__PURE__ */ jsx(Badge, { variant: "neutral", size: "sm", children: command.shortcut }) : null
+                        ]
+                      },
+                      command.id
+                    );
+                  })
+                ] }, String(group ?? "__ungrouped__"))) })
+              }
+            )
+          ] }) })
+        }
+      );
+    };
+    CommandPalette.displayName = "CommandPalette";
+  }
+});
 function formatCount(count) {
   if (count >= 1e3) {
     return `${(count / 1e3).toFixed(1)}k`;
@@ -22055,9 +22929,9 @@ function ControlButton({
   className
 }) {
   const eventBus = useEventBus();
-  const [isPressed, setIsPressed] = React78.useState(false);
+  const [isPressed, setIsPressed] = React79.useState(false);
   const actualPressed = pressed ?? isPressed;
-  const handlePointerDown = React78.useCallback(
+  const handlePointerDown = React79.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -22067,7 +22941,7 @@ function ControlButton({
     },
     [disabled, pressEvent, eventBus, onPress]
   );
-  const handlePointerUp = React78.useCallback(
+  const handlePointerUp = React79.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -22077,7 +22951,7 @@ function ControlButton({
     },
     [disabled, releaseEvent, eventBus, onRelease]
   );
-  const handlePointerLeave = React78.useCallback(
+  const handlePointerLeave = React79.useCallback(
     (e) => {
       if (isPressed) {
         setIsPressed(false);
@@ -22166,18 +23040,18 @@ function ControlGrid({
   className
 }) {
   const eventBus = useEventBus();
-  const [active, setActive] = React78.useState(/* @__PURE__ */ new Set());
-  const [coarse, setCoarse] = React78.useState(
+  const [active, setActive] = React79.useState(/* @__PURE__ */ new Set());
+  const [coarse, setCoarse] = React79.useState(
     () => typeof window !== "undefined" && window.matchMedia("(pointer: coarse)").matches
   );
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     if (visibility !== "auto" || typeof window === "undefined") return;
     const mq = window.matchMedia("(pointer: coarse)");
     const onChange = (e) => setCoarse(e.matches);
     mq.addEventListener("change", onChange);
     return () => mq.removeEventListener("change", onChange);
   }, [visibility]);
-  const handlePress = React78.useCallback(
+  const handlePress = React79.useCallback(
     (id) => {
       setActive((prev) => new Set(prev).add(id));
       if (actionEvent) eventBus.emit(`UI:${actionEvent}`, { id, pressed: true });
@@ -22191,7 +23065,7 @@ function ControlGrid({
     },
     [kind, actionEvent, directionEvent, directionEvents, eventBus, onAction, onDirection]
   );
-  const handleRelease = React78.useCallback(
+  const handleRelease = React79.useCallback(
     (id) => {
       setActive((prev) => {
         const next = new Set(prev);
@@ -23447,7 +24321,7 @@ var init_Menu = __esm({
         "bottom-end": "bottom-start"
       };
       const effectivePosition = direction === "rtl" ? rtlMirror[position] ?? position : position;
-      const triggerElement = React78__default.isValidElement(trigger) ? React78__default.cloneElement(trigger, {
+      const triggerElement = React79__default.isValidElement(trigger) ? React79__default.cloneElement(trigger, {
         ref: triggerRef,
         onClick: handleToggle
       }) : /* @__PURE__ */ jsx(
@@ -23550,14 +24424,14 @@ function useDataDnd(args) {
   const isZone = Boolean(dragGroup || accepts || sortable);
   const enabled = isZone || Boolean(dndRoot);
   const eventBus = useEventBus();
-  const parentRoot = React78__default.useContext(RootCtx);
+  const parentRoot = React79__default.useContext(RootCtx);
   const isRoot = enabled && parentRoot === null;
-  const zoneId = React78__default.useId();
+  const zoneId = React79__default.useId();
   const ownGroup = dragGroup ?? accepts ?? zoneId;
-  const [optimisticOrders, setOptimisticOrders] = React78__default.useState(() => /* @__PURE__ */ new Map());
-  const optimisticOrdersRef = React78__default.useRef(optimisticOrders);
+  const [optimisticOrders, setOptimisticOrders] = React79__default.useState(() => /* @__PURE__ */ new Map());
+  const optimisticOrdersRef = React79__default.useRef(optimisticOrders);
   optimisticOrdersRef.current = optimisticOrders;
-  const clearOptimisticOrder = React78__default.useCallback((group) => {
+  const clearOptimisticOrder = React79__default.useCallback((group) => {
     setOptimisticOrders((prev) => {
       if (!prev.has(group)) return prev;
       const next = new Map(prev);
@@ -23582,7 +24456,7 @@ function useDataDnd(args) {
     const raw = it[dndItemIdField];
     return raw != null ? String(raw) : `__idx_${idx}`;
   }).join("|");
-  const itemIds = React78__default.useMemo(
+  const itemIds = React79__default.useMemo(
     () => orderedItems.map((it, idx) => {
       const raw = it[dndItemIdField];
       return raw != null ? String(raw) : `__idx_${idx}`;
@@ -23593,7 +24467,7 @@ function useDataDnd(args) {
     const raw = it[dndItemIdField];
     return raw != null ? String(raw) : `__${idx}`;
   }).join("|");
-  React78__default.useEffect(() => {
+  React79__default.useEffect(() => {
     const root = isRoot ? null : parentRoot;
     if (root) {
       root.clearOptimisticOrder(ownGroup);
@@ -23601,20 +24475,20 @@ function useDataDnd(args) {
       clearOptimisticOrder(ownGroup);
     }
   }, [itemsContentSig, ownGroup]);
-  const zonesRef = React78__default.useRef(/* @__PURE__ */ new Map());
-  const registerZone = React78__default.useCallback((zoneId2, meta2) => {
+  const zonesRef = React79__default.useRef(/* @__PURE__ */ new Map());
+  const registerZone = React79__default.useCallback((zoneId2, meta2) => {
     zonesRef.current.set(zoneId2, meta2);
   }, []);
-  const unregisterZone = React78__default.useCallback((zoneId2) => {
+  const unregisterZone = React79__default.useCallback((zoneId2) => {
     zonesRef.current.delete(zoneId2);
   }, []);
-  const [activeDrag, setActiveDrag] = React78__default.useState(null);
-  const [overZoneGroup, setOverZoneGroup] = React78__default.useState(null);
-  const meta = React78__default.useMemo(
+  const [activeDrag, setActiveDrag] = React79__default.useState(null);
+  const [overZoneGroup, setOverZoneGroup] = React79__default.useState(null);
+  const meta = React79__default.useMemo(
     () => ({ group: ownGroup, dropEvent, reorderEvent, positionEvent, itemIds, rawItems: items, idField: dndItemIdField }),
     [ownGroup, dropEvent, reorderEvent, positionEvent, itemIds, items, dndItemIdField]
   );
-  React78__default.useEffect(() => {
+  React79__default.useEffect(() => {
     const target = isRoot ? null : parentRoot;
     if (!target) {
       zonesRef.current.set(zoneId, meta);
@@ -23633,7 +24507,7 @@ function useDataDnd(args) {
   }, [parentRoot, isRoot, zoneId, meta]);
   const sensors = useAlmadarDndSensors(true);
   const collisionDetection = almadarDndCollisionDetection;
-  const findZoneByItem = React78__default.useCallback(
+  const findZoneByItem = React79__default.useCallback(
     (id) => {
       for (const z of zonesRef.current.values()) {
         if (z.itemIds.includes(id)) return z;
@@ -23642,7 +24516,7 @@ function useDataDnd(args) {
     },
     []
   );
-  React78__default.useCallback(
+  React79__default.useCallback(
     (group) => {
       for (const z of zonesRef.current.values()) {
         if (z.group === group) return z;
@@ -23651,7 +24525,7 @@ function useDataDnd(args) {
     },
     []
   );
-  const handleDragEnd = React78__default.useCallback(
+  const handleDragEnd = React79__default.useCallback(
     (event) => {
       const { active, over } = event;
       const activeIdStr = String(active.id);
@@ -23742,8 +24616,8 @@ function useDataDnd(args) {
     },
     [eventBus]
   );
-  const sortableData = React78__default.useMemo(() => ({ dndGroup: ownGroup }), [ownGroup]);
-  const SortableItem = React78__default.useCallback(
+  const sortableData = React79__default.useMemo(() => ({ dndGroup: ownGroup }), [ownGroup]);
+  const SortableItem = React79__default.useCallback(
     ({ id, children }) => {
       const {
         attributes,
@@ -23783,7 +24657,7 @@ function useDataDnd(args) {
       id: droppableId,
       data: sortableData
     });
-    const ctx = React78__default.useContext(RootCtx);
+    const ctx = React79__default.useContext(RootCtx);
     const activeDrag2 = ctx?.activeDrag ?? null;
     const overZoneGroup2 = ctx?.overZoneGroup ?? null;
     const isThisZoneOver = overZoneGroup2 === ownGroup;
@@ -23798,7 +24672,7 @@ function useDataDnd(args) {
       showForeignPlaceholder,
       ctxAvailable: ctx != null
     });
-    React78__default.useEffect(() => {
+    React79__default.useEffect(() => {
       dndLog.info("dropzone:isOver:change", { droppableId, group: ownGroup, isOver, isThisZoneOver, showForeignPlaceholder, activeDragSourceGroup: activeDrag2?.sourceGroup ?? null });
     }, [droppableId, isOver, isThisZoneOver, showForeignPlaceholder]);
     return /* @__PURE__ */ jsx(
@@ -23812,11 +24686,11 @@ function useDataDnd(args) {
       }
     );
   };
-  const rootContextValue = React78__default.useMemo(
+  const rootContextValue = React79__default.useMemo(
     () => ({ registerZone, unregisterZone, activeDrag, overZoneGroup, optimisticOrders, clearOptimisticOrder }),
     [registerZone, unregisterZone, activeDrag, overZoneGroup, optimisticOrders, clearOptimisticOrder]
   );
-  const handleDragStart = React78__default.useCallback((event) => {
+  const handleDragStart = React79__default.useCallback((event) => {
     const sourceZone = findZoneByItem(event.active.id);
     const rect = event.active.rect.current.initial;
     const height = rect?.height && rect.height > 0 ? rect.height : 64;
@@ -23835,7 +24709,7 @@ function useDataDnd(args) {
       isRoot
     });
   }, [findZoneByItem, isRoot, zoneId]);
-  const handleDragOver = React78__default.useCallback((event) => {
+  const handleDragOver = React79__default.useCallback((event) => {
     const { active, over } = event;
     const overData = over?.data?.current;
     const overGroup = overData?.dndGroup ?? null;
@@ -23905,7 +24779,7 @@ function useDataDnd(args) {
       return next;
     });
   }, []);
-  const handleDragCancel = React78__default.useCallback((event) => {
+  const handleDragCancel = React79__default.useCallback((event) => {
     setActiveDrag(null);
     setOverZoneGroup(null);
     dndLog.warn("dragCancel", {
@@ -23913,12 +24787,12 @@ function useDataDnd(args) {
       reason: "dnd-kit cancelled the drag (escape key, pointer interrupted, or external)"
     });
   }, []);
-  const handleDragEndWithCleanup = React78__default.useCallback((event) => {
+  const handleDragEndWithCleanup = React79__default.useCallback((event) => {
     handleDragEnd(event);
     setActiveDrag(null);
     setOverZoneGroup(null);
   }, [handleDragEnd]);
-  const wrapContainer = React78__default.useCallback(
+  const wrapContainer = React79__default.useCallback(
     (children) => {
       if (!enabled) return children;
       const strategy = layout === "grid" ? rectSortingStrategy : verticalListSortingStrategy;
@@ -23972,7 +24846,7 @@ var init_useDataDnd = __esm({
     init_useAlmadarDndCollision();
     init_Box();
     dndLog = createLogger("almadar:ui:dnd");
-    RootCtx = React78__default.createContext(null);
+    RootCtx = React79__default.createContext(null);
   }
 });
 function renderIconInput(icon, props) {
@@ -24487,7 +25361,7 @@ function DataList({
 }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [visibleCount, setVisibleCount] = React78__default.useState(pageSize || Infinity);
+  const [visibleCount, setVisibleCount] = React79__default.useState(pageSize || Infinity);
   const fieldDefs = fields ?? columns ?? [];
   const allDataRaw = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const dnd = useDataDnd({
@@ -24503,14 +25377,14 @@ function DataList({
     dndRoot
   });
   const orderedData = dnd.orderedItems;
-  const allData = React78__default.useMemo(
+  const allData = React79__default.useMemo(
     () => sortRows(orderedData, sortBy, sortDirection),
     [orderedData, sortBy, sortDirection]
   );
   const data = pageSize > 0 ? allData.slice(0, visibleCount) : allData;
   const hasMoreLocal = pageSize > 0 && visibleCount < allData.length;
   const hasRenderProp = typeof children === "function";
-  React78__default.useEffect(() => {
+  React79__default.useEffect(() => {
     const renderItemTypeOf = typeof schemaRenderItem;
     const childrenTypeOf = typeof children;
     if (data.length > 0 && !hasRenderProp) {
@@ -24630,7 +25504,7 @@ function DataList({
       return v === void 0 || v === null || v === "" ? raw : String(v);
     };
     return /* @__PURE__ */ jsxs(VStack, { gap: "sm", className: cn("py-2", className), children: [
-      groups2.map((group, gi) => /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+      groups2.map((group, gi) => /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
         group.label && /* @__PURE__ */ jsx(Divider, { label: group.label, className: "my-2" }),
         group.items.map((itemData, index) => {
           const id = itemData.id || `${gi}-${index}`;
@@ -24846,7 +25720,7 @@ function DataList({
           className
         ),
         children: [
-          groups.map((group, gi) => /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+          groups.map((group, gi) => /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
             group.label && /* @__PURE__ */ jsx(Divider, { label: group.label, className: gi > 0 ? "mt-4" : "mt-0" }),
             group.items.map(
               (itemData, index) => renderItem(itemData, index, gi === groups.length - 1 && index === group.items.length - 1)
@@ -24955,8 +25829,8 @@ function ScalarControl({
   }
   const numeric = typeof value === "number";
   const initial = value === null ? "" : String(value);
-  const [draft, setDraft] = React78__default.useState(initial);
-  React78__default.useEffect(() => setDraft(initial), [initial]);
+  const [draft, setDraft] = React79__default.useState(initial);
+  React79__default.useEffect(() => setDraft(initial), [initial]);
   const commit = () => {
     if (numeric) {
       const n = draft.trim() === "" ? 0 : Number(draft);
@@ -25024,8 +25898,8 @@ function Row({
   onRemove,
   readonly
 }) {
-  const [keyDraft, setKeyDraft] = React78__default.useState(rowKey);
-  React78__default.useEffect(() => setKeyDraft(rowKey), [rowKey]);
+  const [keyDraft, setKeyDraft] = React79__default.useState(rowKey);
+  React79__default.useEffect(() => setKeyDraft(rowKey), [rowKey]);
   const container = isObj(value) || isArr(value);
   return /* @__PURE__ */ jsxs(VStack, { gap: "none", className: "group w-max min-w-full", children: [
     /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", className: "py-0.5 w-max", children: [
@@ -25068,7 +25942,7 @@ function ContainerNode({
   depth,
   readonly
 }) {
-  const [open, setOpen] = React78__default.useState(depth < 2);
+  const [open, setOpen] = React79__default.useState(depth < 2);
   const array = isArr(value);
   const entries = array ? value.map((v, i) => [String(i), v]) : Object.entries(value);
   const setObjValue = (key, next) => {
@@ -25210,7 +26084,7 @@ var init_FormSection = __esm({
       columns = 1,
       className
     }) => {
-      const [collapsed, setCollapsed] = React78__default.useState(defaultCollapsed);
+      const [collapsed, setCollapsed] = React79__default.useState(defaultCollapsed);
       const { t } = useTranslate();
       const eventBus = useEventBus();
       const gridClass = {
@@ -25218,7 +26092,7 @@ var init_FormSection = __esm({
         2: "grid-cols-1 md:grid-cols-2",
         3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
       }[columns];
-      React78__default.useCallback(() => {
+      React79__default.useCallback(() => {
         if (collapsible) {
           setCollapsed((prev) => !prev);
           eventBus.emit("UI:TOGGLE_COLLAPSE", { collapsed: !collapsed });
@@ -25627,8 +26501,8 @@ function TextLikeControl({
   onCommit
 }) {
   const initial = value === void 0 || value === null ? "" : String(value);
-  const [draft, setDraft] = React78__default.useState(initial);
-  React78__default.useEffect(() => setDraft(initial), [initial]);
+  const [draft, setDraft] = React79__default.useState(initial);
+  React79__default.useEffect(() => setDraft(initial), [initial]);
   const commit = () => {
     if (numeric) {
       const n = draft.trim() === "" ? 0 : Number(draft);
@@ -25817,14 +26691,14 @@ var init_NodeSlotEditor = __esm({
     isObj2 = (v) => v !== null && v !== void 0 && typeof v === "object" && !Array.isArray(v);
     NodeSlotEditor = ({ value, onChange, className }) => {
       const { type, props, wasArray } = normalize(value);
-      const patterns = React78__default.useMemo(() => {
+      const patterns = React79__default.useMemo(() => {
         try {
           return [...getKnownPatterns()].sort();
         } catch {
           return [];
         }
       }, []);
-      const options = React78__default.useMemo(
+      const options = React79__default.useMemo(
         () => [{ value: "", label: "\u2014 none \u2014" }, ...patterns.map((p) => ({ value: p, label: p }))],
         [patterns]
       );
@@ -25836,7 +26710,7 @@ var init_NodeSlotEditor = __esm({
         const pattern = { type: nextType, ...nextProps };
         onChange(wasArray || value === void 0 ? [pattern] : pattern);
       };
-      const schemaEntries = React78__default.useMemo(() => {
+      const schemaEntries = React79__default.useMemo(() => {
         if (!type) return [];
         const def = getPatternDefinition(type);
         if (!def?.propsSchema) return [];
@@ -26264,10 +27138,10 @@ var init_FileTree = __esm({
       indent = 16
     }) => {
       const [overrides, setOverrides] = useState(() => /* @__PURE__ */ new Map());
-      const byId = React78__default.useMemo(() => new Map(items.map((node) => [node.id, node])), [items]);
-      const selectedAncestors = React78__default.useMemo(() => ancestorsOf(selectedId, byId), [selectedId, byId]);
-      const lastSelectedRef = React78__default.useRef(selectedId);
-      React78__default.useEffect(() => {
+      const byId = React79__default.useMemo(() => new Map(items.map((node) => [node.id, node])), [items]);
+      const selectedAncestors = React79__default.useMemo(() => ancestorsOf(selectedId, byId), [selectedId, byId]);
+      const lastSelectedRef = React79__default.useRef(selectedId);
+      React79__default.useEffect(() => {
         if (selectedId === lastSelectedRef.current) return;
         lastSelectedRef.current = selectedId;
         setOverrides((prev) => {
@@ -26395,183 +27269,6 @@ var init_FormField = __esm({
     FormField.displayName = "FormField";
   }
 });
-function matchesQuery(query, text) {
-  if (!query) return true;
-  let qi = 0;
-  const q = query.toLowerCase();
-  const t = text.toLowerCase();
-  for (let ti = 0; ti < t.length && qi < q.length; ti++) {
-    if (t[ti] === q[qi]) qi++;
-  }
-  return qi === q.length;
-}
-function commandMatches(command, query) {
-  if (!query) return true;
-  if (matchesQuery(query, command.label)) return true;
-  return (command.keywords ?? []).some((keyword) => matchesQuery(query, keyword));
-}
-var UNGROUPED, CommandPalette;
-var init_CommandPalette = __esm({
-  "components/core/molecules/CommandPalette.tsx"() {
-    "use client";
-    init_Box();
-    init_Stack();
-    init_Typography();
-    init_Icon();
-    init_Input();
-    init_Badge();
-    init_cn();
-    init_useEventBus();
-    init_Modal();
-    UNGROUPED = /* @__PURE__ */ Symbol("command-palette-ungrouped");
-    CommandPalette = ({
-      open,
-      onOpenChange,
-      commands,
-      onSelect,
-      placeholder = "Type a command...",
-      emptyLabel = "No matching commands",
-      className
-    }) => {
-      const eventBus = useEventBus();
-      const [query, setQuery] = useState("");
-      const [highlightIndex, setHighlightIndex] = useState(0);
-      const filtered = useMemo(
-        () => commands.filter((command) => commandMatches(command, query)),
-        [commands, query]
-      );
-      const groups = useMemo(() => {
-        const order = [];
-        const byGroup = /* @__PURE__ */ new Map();
-        for (const command of filtered) {
-          const key = command.group ?? UNGROUPED;
-          if (!byGroup.has(key)) {
-            byGroup.set(key, []);
-            order.push(key);
-          }
-          byGroup.get(key).push(command);
-        }
-        return order.map((key) => ({ group: key === UNGROUPED ? void 0 : key, items: byGroup.get(key) }));
-      }, [filtered]);
-      const resetQuery = useCallback(() => {
-        setQuery("");
-        setHighlightIndex(0);
-      }, []);
-      const handleClose = useCallback(() => {
-        resetQuery();
-        onOpenChange(false);
-      }, [onOpenChange, resetQuery]);
-      const handleSelect = useCallback(
-        (command) => {
-          if (command.disabled) return;
-          if (command.event) eventBus.emit(`UI:${command.event}`, { commandId: command.id });
-          if (command.action) eventBus.emit(`UI:${command.action}`, command.actionPayload ?? {});
-          onSelect?.(command);
-          handleClose();
-        },
-        [eventBus, onSelect, handleClose]
-      );
-      const handleQueryChange = useCallback((e) => {
-        setQuery(e.target.value);
-        setHighlightIndex(0);
-      }, []);
-      const handleKeyDown = useCallback(
-        (e) => {
-          if (filtered.length === 0) return;
-          if (e.key === "ArrowDown") {
-            e.preventDefault();
-            setHighlightIndex((prev) => prev < filtered.length - 1 ? prev + 1 : 0);
-          } else if (e.key === "ArrowUp") {
-            e.preventDefault();
-            setHighlightIndex((prev) => prev > 0 ? prev - 1 : filtered.length - 1);
-          } else if (e.key === "Enter") {
-            e.preventDefault();
-            const command = filtered[highlightIndex];
-            if (command) handleSelect(command);
-          }
-        },
-        [filtered, highlightIndex, handleSelect]
-      );
-      return /* @__PURE__ */ jsx(
-        Modal,
-        {
-          isOpen: open,
-          onClose: handleClose,
-          onExited: resetQuery,
-          showCloseButton: false,
-          size: "md",
-          className,
-          children: /* @__PURE__ */ jsx(Box, { "data-testid": "command-palette", children: /* @__PURE__ */ jsxs(VStack, { gap: "sm", children: [
-            /* @__PURE__ */ jsx(
-              Input,
-              {
-                inputType: "search",
-                placeholder,
-                value: query,
-                onChange: handleQueryChange,
-                onKeyDown: handleKeyDown,
-                leftIcon: "search",
-                clearable: query.length > 0,
-                onClear: resetQuery,
-                autoFocus: true,
-                "data-testid": "command-palette-input"
-              }
-            ),
-            filtered.length === 0 ? /* @__PURE__ */ jsx(Box, { className: "px-2 py-6 text-center", "data-testid": "command-palette-empty", children: /* @__PURE__ */ jsx(Typography, { variant: "body", color: "muted", children: emptyLabel }) }) : /* @__PURE__ */ jsx(
-              Box,
-              {
-                className: "max-h-80 overflow-y-auto",
-                role: "listbox",
-                "aria-label": placeholder,
-                children: /* @__PURE__ */ jsx(VStack, { gap: "none", children: groups.map(({ group, items }) => /* @__PURE__ */ jsxs(Box, { children: [
-                  group ? /* @__PURE__ */ jsx(
-                    Typography,
-                    {
-                      variant: "caption",
-                      color: "muted",
-                      className: "px-3 pt-2 pb-1 block",
-                      children: group
-                    }
-                  ) : null,
-                  items.map((command) => {
-                    const index = filtered.indexOf(command);
-                    const isHighlighted = index === highlightIndex;
-                    return /* @__PURE__ */ jsxs(
-                      Box,
-                      {
-                        as: "button",
-                        role: "option",
-                        "aria-selected": isHighlighted,
-                        "aria-disabled": command.disabled || void 0,
-                        "data-testid": `command-palette-item-${command.id}`,
-                        onMouseEnter: () => !command.disabled && setHighlightIndex(index),
-                        onClick: () => handleSelect(command),
-                        className: cn(
-                          "w-full flex items-center gap-3 px-3 py-2 text-start rounded-sm",
-                          "text-sm transition-colors",
-                          "focus:outline-none",
-                          isHighlighted && "bg-muted",
-                          command.disabled && "opacity-50 cursor-not-allowed"
-                        ),
-                        children: [
-                          command.icon ? /* @__PURE__ */ jsx(Icon, { icon: command.icon, size: "sm", className: "flex-shrink-0" }) : null,
-                          /* @__PURE__ */ jsx(Typography, { variant: "small", className: "flex-1 truncate", children: command.label }),
-                          command.shortcut ? /* @__PURE__ */ jsx(Badge, { variant: "neutral", size: "sm", children: command.shortcut }) : null
-                        ]
-                      },
-                      command.id
-                    );
-                  })
-                ] }, String(group ?? "__ungrouped__"))) })
-              }
-            )
-          ] }) })
-        }
-      );
-    };
-    CommandPalette.displayName = "CommandPalette";
-  }
-});
 function getOrCreateStore(query) {
   if (!queryStores.has(query)) {
     queryStores.set(query, {
@@ -27286,7 +27983,7 @@ var init_Flex = __esm({
           flexStyle.flexBasis = typeof basis === "number" ? `${basis}px` : basis;
         }
       }
-      return React78__default.createElement(Component, {
+      return React79__default.createElement(Component, {
         className: cn(
           inline ? "inline-flex" : "flex",
           directionStyles[direction],
@@ -27405,7 +28102,7 @@ var init_Grid = __esm({
       as: Component = "div"
     }) => {
       const mergedStyle = rows2 ? { gridTemplateRows: `repeat(${rows2}, minmax(0, 1fr))`, ...style } : style;
-      return React78__default.createElement(
+      return React79__default.createElement(
         Component,
         {
           className: cn(
@@ -27827,9 +28524,9 @@ var init_Popover = __esm({
         onMouseLeave: handleClose,
         onPointerDown: tapTriggerProps.onPointerDown
       };
-      const childElement = React78__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
+      const childElement = React79__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
       const childPointerDown = childElement.props.onPointerDown;
-      const triggerElement = React78__default.cloneElement(
+      const triggerElement = React79__default.cloneElement(
         childElement,
         {
           ref: triggerRef,
@@ -28143,9 +28840,9 @@ function debug(...args) {
   const [first, ...rest] = args;
   const message = typeof first === "string" ? first : "<debug>";
   if (rest.length === 0 && typeof first === "string") {
-    log7.debug(message);
+    log8.debug(message);
   } else {
-    log7.debug(message, { args: rest.length > 0 ? formatArgs(rest) : formatArgs([first]) });
+    log8.debug(message, { args: rest.length > 0 ? formatArgs(rest) : formatArgs([first]) });
   }
 }
 function debugGroup(label) {
@@ -28173,11 +28870,11 @@ function toLogMetaValue(v) {
   }
   return String(v);
 }
-var NAMESPACE, log7;
+var NAMESPACE, log8;
 var init_debug = __esm({
   "lib/debug.ts"() {
     NAMESPACE = "almadar:ui:debug";
-    log7 = createLogger(NAMESPACE);
+    log8 = createLogger(NAMESPACE);
     createLogger("almadar:ui:debug:input");
     createLogger("almadar:ui:debug:collision");
     createLogger("almadar:ui:debug:physics");
@@ -28693,9 +29390,9 @@ var init_Tooltip = __esm({
           if (hideTimeoutRef.current) clearTimeout(hideTimeoutRef.current);
         };
       }, []);
-      const triggerElement = React78__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
+      const triggerElement = React79__default.isValidElement(children) ? children : /* @__PURE__ */ jsx("span", { children });
       const childPointerDown = triggerElement.props.onPointerDown;
-      const trigger = React78__default.cloneElement(triggerElement, {
+      const trigger = React79__default.cloneElement(triggerElement, {
         ref: triggerRef,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
@@ -28785,7 +29482,7 @@ var init_WizardProgress = __esm({
           children: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: normalizedSteps.map((step, index) => {
             const isActive = index === currentStep;
             const isCompleted = index < currentStep;
-            return /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+            return /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
               /* @__PURE__ */ jsx(
                 "button",
                 {
@@ -30469,7 +31166,7 @@ function GameMenu({
 }) {
   const resolvedOptions = (options?.length ? options : void 0) ?? (menuItems?.length ? menuItems : void 0) ?? DEFAULT_MENU_OPTIONS;
   const eventBus = useEventBus();
-  const handleOptionClick = React78.useCallback(
+  const handleOptionClick = React79.useCallback(
     (option) => {
       if (option.event) {
         eventBus.emit(`UI:${option.event}`, { option });
@@ -30705,7 +31402,7 @@ function StateGraph({
 }) {
   const eventBus = useEventBus();
   const nodes = states ?? [];
-  const positions = React78.useMemo(() => layoutStates(nodes, width, height), [nodes, width, height]);
+  const positions = React79.useMemo(() => layoutStates(nodes, width, height), [nodes, width, height]);
   return /* @__PURE__ */ jsxs(
     Box,
     {
@@ -30863,15 +31560,19 @@ function GameAudioToggle({
   size = "sm",
   className,
   onAsset,
-  offAsset
+  offAsset,
+  toggleEvent
 }) {
   const ctx = useGameAudioContextOptional();
   const [localMuted, setLocalMuted] = useState(false);
   const muted = ctx ? ctx.muted : localMuted;
   const setMuted = ctx ? ctx.setMuted : setLocalMuted;
+  const eventBus = useEventBus();
   const handleToggle = useCallback(() => {
-    setMuted(!muted);
-  }, [muted, setMuted]);
+    const next = !muted;
+    setMuted(next);
+    if (toggleEvent) eventBus.emit(`UI:${toggleEvent}`, { muted: next });
+  }, [muted, setMuted, toggleEvent, eventBus]);
   const activeAsset = muted ? offAsset : onAsset;
   return /* @__PURE__ */ jsx(
     Button,
@@ -30890,6 +31591,7 @@ var init_GameAudioToggle = __esm({
     "use client";
     init_atoms();
     init_cn();
+    init_useEventBus();
     init_GameIcon();
     GameAudioToggle.displayName = "GameAudioToggle";
   }
@@ -31161,6 +31863,47 @@ var init_useGameAudio = __esm({
     useGameAudio.displayName = "useGameAudio";
   }
 });
+function GameAudioCue({
+  cue,
+  cueSeq,
+  music,
+  muted,
+  volume,
+  manifest,
+  baseUrl
+}) {
+  const { play, playMusic, stopMusic, setMuted, setMasterVolume } = useGameAudio({
+    manifest,
+    baseUrl,
+    initialMuted: muted,
+    initialVolume: volume
+  });
+  const prevCueSeqRef = useRef(cueSeq);
+  useEffect(() => {
+    if (cue && cueSeq !== void 0 && cueSeq !== prevCueSeqRef.current) {
+      play(cue);
+    }
+    prevCueSeqRef.current = cueSeq;
+  }, [cue, cueSeq, play]);
+  useEffect(() => {
+    if (music) playMusic(music);
+    else stopMusic();
+  }, [music, playMusic, stopMusic]);
+  useEffect(() => {
+    if (muted !== void 0) setMuted(muted);
+  }, [muted, setMuted]);
+  useEffect(() => {
+    if (volume !== void 0) setMasterVolume(volume);
+  }, [volume, setMasterVolume]);
+  return null;
+}
+var init_GameAudioCue = __esm({
+  "components/game/atoms/GameAudioCue.tsx"() {
+    "use client";
+    init_useGameAudio();
+    GameAudioCue.displayName = "GameAudioCue";
+  }
+});
 function isKnownState(s) {
   return s in DEFAULT_STATE_STYLES;
 }
@@ -31242,7 +31985,7 @@ function LinearView({
     /* @__PURE__ */ jsx(HStack, { className: "flex-wrap items-center", gap: "xs", children: trait.states.map((state, i) => {
       const isDone = i < currentIdx;
       const isCurrent = i === currentIdx;
-      return /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+      return /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
         i > 0 && /* @__PURE__ */ jsx(
           Typography,
           {
@@ -31875,7 +32618,7 @@ function SequenceBar({
     else onSlotRemove?.(index);
   }, [emit, slotRemoveEvent, onSlotRemove, playing]);
   const paddedSlots = Array.from({ length: maxSlots }, (_, i) => slots[i]);
-  return /* @__PURE__ */ jsx(HStack, { className: cn("items-center", className), gap: "sm", children: paddedSlots.map((slot, i) => /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+  return /* @__PURE__ */ jsx(HStack, { className: cn("items-center", className), gap: "sm", children: paddedSlots.map((slot, i) => /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
     i > 0 && /* @__PURE__ */ jsx(
       Typography,
       {
@@ -32057,15 +32800,18 @@ var init_physicsPresets = __esm({
     ];
   }
 });
-var GAME_FONTS, GameShell;
-var init_GameShell = __esm({
-  "components/game/templates/GameShell.tsx"() {
-    init_cn();
-    init_Box();
-    init_Card();
-    init_Typography();
-    init_AtlasImage();
-    GAME_FONTS = {
+
+// lib/gameFonts.ts
+function resolveGameFontFamily(input) {
+  if (!input) return void 0;
+  const resolved = GAME_FONT_KEYS[input];
+  if (resolved) return `'${resolved}', ui-sans-serif, system-ui, sans-serif`;
+  return input;
+}
+var GAME_FONT_KEYS;
+var init_gameFonts = __esm({
+  "lib/gameFonts.ts"() {
+    GAME_FONT_KEYS = {
       fredoka: "Fredoka",
       future: "Kenney Future",
       "future-narrow": "Kenney Future Narrow",
@@ -32073,6 +32819,17 @@ var init_GameShell = __esm({
       blocks: "Kenney Blocks",
       mini: "Kenney Mini"
     };
+  }
+});
+var GameShell;
+var init_GameShell = __esm({
+  "components/game/templates/GameShell.tsx"() {
+    init_cn();
+    init_gameFonts();
+    init_Box();
+    init_Card();
+    init_Typography();
+    init_AtlasImage();
     GameShell = ({
       appName = "Game",
       hud,
@@ -32086,7 +32843,7 @@ var init_GameShell = __esm({
       fontFamily,
       "data-theme": dataTheme
     }) => {
-      const font = fontFamily ? GAME_FONTS[fontFamily] ?? fontFamily : void 0;
+      const displayFont = resolveGameFontFamily(fontFamily);
       return /* @__PURE__ */ jsxs(
         Box,
         {
@@ -32105,7 +32862,7 @@ var init_GameShell = __esm({
             // passed — an always-on inline stamp would shadow the orbital's
             // inline-theme font-family-display token (inline style beats the
             // theme provider's vars for the whole shell subtree).
-            ...font ? { "--font-family-display": `'${font}', ui-sans-serif, system-ui, sans-serif` } : {}
+            ...displayFont ? { "--font-family-display": displayFont } : {}
           },
           children: [
             backgroundAsset && /* @__PURE__ */ jsx(
@@ -32238,6 +32995,7 @@ var init_molecules = __esm({
     init_Canvas();
     init_useUnitSpriteAtlas();
     init_GameAudioToggle();
+    init_GameAudioCue();
     init_useGameAudio();
     init_useCamera();
     init_TraitStateViewer();
@@ -32266,6 +33024,7 @@ var init_MathCanvas = __esm({
     init_perf();
     init_atoms();
     init_Stack();
+    init_gameFonts();
     init_LearningCanvas();
     MathCanvas = ({
       className,
@@ -32285,6 +33044,7 @@ var init_MathCanvas = __esm({
       showTickLabels = false,
       tickLabelFontSize = 10,
       labelFontSize = 12,
+      fontFamily: fontFamilyProp,
       showCurveLabels = false,
       curves = [],
       points = [],
@@ -32307,6 +33067,7 @@ var init_MathCanvas = __esm({
       error
     }) => {
       const eventBus = useEventBus();
+      const fontFamily = resolveGameFontFamily(fontFamilyProp);
       const keyMapKey = keyMap ? JSON.stringify(keyMap) : null;
       const keyUpMapKey = keyUpMap ? JSON.stringify(keyUpMap) : null;
       const stableKeyMap = useMemo(() => keyMap, [keyMapKey]);
@@ -32356,18 +33117,18 @@ var init_MathCanvas = __esm({
           let kx = 0;
           for (let x = Math.ceil(xMin / gridStep) * gridStep; x <= xMax; x += gridStep, kx++) {
             if (kx % labelEveryX === 0 && x !== 0) {
-              out.push({ type: "text", x: mapX(x), y: xAxisY + 12, text: formatTick(x), color: "#6b7280", fontSize: tickLabelFontSize, align: "center" });
+              out.push({ type: "text", fontFamily, x: mapX(x), y: xAxisY + 12, text: formatTick(x), color: "#6b7280", fontSize: tickLabelFontSize, align: "center" });
             }
           }
           const labelEveryY = Math.max(1, Math.ceil((yMax - yMin) / gridStep / Math.floor(plotH / 28)));
           let ky = 0;
           for (let y = Math.ceil(yMin / gridStep) * gridStep; y <= yMax; y += gridStep, ky++) {
             if (ky % labelEveryY === 0 && y !== 0) {
-              out.push({ type: "text", x: yAxisX - 6, y: mapY(y), text: formatTick(y), color: "#6b7280", fontSize: tickLabelFontSize, align: "right" });
+              out.push({ type: "text", fontFamily, x: yAxisX - 6, y: mapY(y), text: formatTick(y), color: "#6b7280", fontSize: tickLabelFontSize, align: "right" });
             }
           }
           if (xMin <= 0 && xMax >= 0 && yMin <= 0 && yMax >= 0) {
-            out.push({ type: "text", x: yAxisX - 6, y: xAxisY + 12, text: "0", color: "#6b7280", fontSize: tickLabelFontSize, align: "right" });
+            out.push({ type: "text", fontFamily, x: yAxisX - 6, y: xAxisY + 12, text: "0", color: "#6b7280", fontSize: tickLabelFontSize, align: "right" });
           }
         }
         for (const region of regions) {
@@ -32394,6 +33155,7 @@ var init_MathCanvas = __esm({
             const mid = Math.floor(region.samples.length / 2);
             out.push({
               type: "text",
+              fontFamily,
               x: mapX((first.x + last.x) / 2),
               y: (mapY(region.samples[mid].y) + mapY(baseline)) / 2,
               text: region.label,
@@ -32430,14 +33192,14 @@ var init_MathCanvas = __esm({
             const px = mapX(guide.at);
             out.push({ type: "line", x1: px, y1: margin, x2: px, y2: height - margin, color, dash });
             if (guide.label) {
-              out.push({ type: "text", x: px + 4, y: margin + 10, text: guide.label, color, fontSize: 11 });
+              out.push({ type: "text", fontFamily, x: px + 4, y: margin + 10, text: guide.label, color, fontSize: 11 });
             }
           } else {
             if (guide.at < yMin || guide.at > yMax) continue;
             const py = mapY(guide.at);
             out.push({ type: "line", x1: margin, y1: py, x2: width - margin, y2: py, color, dash });
             if (guide.label) {
-              out.push({ type: "text", x: width - margin - 4, y: py - 8, text: guide.label, color, fontSize: labelFontSize, align: "right" });
+              out.push({ type: "text", fontFamily, x: width - margin - 4, y: py - 8, text: guide.label, color, fontSize: labelFontSize, align: "right" });
             }
           }
         }
@@ -32476,6 +33238,7 @@ var init_MathCanvas = __esm({
           if (showCurveLabels && curve.label && lastInRange) {
             out.push({
               type: "text",
+              fontFamily,
               x: mapX(lastInRange.x) + 6,
               y: mapY(lastInRange.y) - 6,
               text: curve.label,
@@ -32513,6 +33276,7 @@ var init_MathCanvas = __esm({
           if (hop.label) {
             out.push({
               type: "text",
+              fontFamily,
               x: (x1 + x2) / 2,
               y: xAxisY - peak - 8,
               text: hop.label,
@@ -32540,6 +33304,7 @@ var init_MathCanvas = __esm({
             const rad = mid * Math.PI / 180;
             out.push({
               type: "text",
+              fontFamily,
               x: mapX(angle.x + 1.35 * radius * Math.cos(rad)),
               y: mapY(angle.y + 1.35 * radius * Math.sin(rad)),
               text: angle.label,
@@ -32561,7 +33326,7 @@ var init_MathCanvas = __esm({
             fill: isOpen ? "#ffffff" : p.color ?? "#dc2626"
           });
           if (p.label) {
-            out.push({ type: "text", x: mapX(p.x) + 8, y: mapY(p.y) - 8, text: p.label, color: p.color ?? "#111827", fontSize: labelFontSize });
+            out.push({ type: "text", fontFamily, x: mapX(p.x) + 8, y: mapY(p.y) - 8, text: p.label, color: p.color ?? "#111827", fontSize: labelFontSize });
           }
         }
         for (const v of vectors) {
@@ -32572,7 +33337,7 @@ var init_MathCanvas = __esm({
           const y2 = mapY(v.y + v.vy);
           out.push({ type: "arrow", x1, y1, x2, y2, color: v.color ?? "#7c3aed", lineWidth: 2 });
           if (v.label) {
-            out.push({ type: "text", x: x2 + 6, y: y2 - 6, text: v.label, color: v.color ?? "#7c3aed", fontSize: labelFontSize });
+            out.push({ type: "text", fontFamily, x: x2 + 6, y: y2 - 6, text: v.label, color: v.color ?? "#7c3aed", fontSize: labelFontSize });
           }
         }
         out.push(...shapes);
@@ -32593,6 +33358,7 @@ var init_MathCanvas = __esm({
         showTickLabels,
         tickLabelFontSize,
         labelFontSize,
+        fontFamily,
         showCurveLabels,
         curves,
         points,
@@ -32648,6 +33414,7 @@ var init_MathCanvas = __esm({
             width,
             height,
             backgroundColor,
+            fontFamily,
             shapes: derivedShapes,
             drawables,
             projector,
@@ -33880,13 +34647,13 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect70, useRef: useRef67, useCallback: useCallback109, useState: useState109 } = React78__default;
+      const { useEffect: useEffect72, useRef: useRef70, useCallback: useCallback109, useState: useState110 } = React79__default;
       const { Typography: Typography2 } = await Promise.resolve().then(() => (init_Typography(), Typography_exports));
       const { useEventBus: useEventBus2 } = await Promise.resolve().then(() => (init_useEventBus(), useEventBus_exports));
       function MapUpdater({ centerLat, centerLng, zoom }) {
         const map = useMap();
-        const prevRef = useRef67({ centerLat, centerLng, zoom });
-        useEffect70(() => {
+        const prevRef = useRef70({ centerLat, centerLng, zoom });
+        useEffect72(() => {
           const prev = prevRef.current;
           if (prev.centerLat !== centerLat || prev.centerLng !== centerLng || prev.zoom !== zoom) {
             map.setView([centerLat, centerLng], zoom);
@@ -33897,7 +34664,7 @@ var init_MapView = __esm({
       }
       function MapClickHandler({ onMapClick }) {
         const map = useMap();
-        useEffect70(() => {
+        useEffect72(() => {
           if (!onMapClick) return;
           const handler = (e) => {
             onMapClick(e.latlng.lat, e.latlng.lng);
@@ -33925,7 +34692,7 @@ var init_MapView = __esm({
         showAttribution = true
       }) {
         const eventBus = useEventBus2();
-        const [clickedPosition, setClickedPosition] = useState109(null);
+        const [clickedPosition, setClickedPosition] = useState110(null);
         const handleMapClick = useCallback109((lat, lng) => {
           if (showClickedPin) {
             setClickedPosition({ lat, lng });
@@ -34825,8 +35592,8 @@ function TableView({
 }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [visibleCount, setVisibleCount] = React78__default.useState(pageSize > 0 ? pageSize : Infinity);
-  const [localSelected, setLocalSelected] = React78__default.useState(/* @__PURE__ */ new Set());
+  const [visibleCount, setVisibleCount] = React79__default.useState(pageSize > 0 ? pageSize : Infinity);
+  const [localSelected, setLocalSelected] = React79__default.useState(/* @__PURE__ */ new Set());
   const colDefs = (Array.isArray(columns) ? columns : void 0) ?? (Array.isArray(fields) ? fields : void 0) ?? [];
   const actionDefs = Array.isArray(itemActions) ? itemActions : [];
   const allDataRaw = Array.isArray(entity) ? entity : entity ? [entity] : [];
@@ -34847,7 +35614,7 @@ function TableView({
   const hasMore = pageSize > 0 && visibleCount < ordered2.length;
   const hasRenderProp = typeof children === "function";
   const idField = dndItemIdField ?? "id";
-  React78__default.useEffect(() => {
+  React79__default.useEffect(() => {
     tableViewLog.debug("render", {
       rowCount: data.length,
       colCount: colDefs.length,
@@ -34897,7 +35664,7 @@ function TableView({
     };
     eventBus.emit(`UI:${rowClickEvent}`, payload);
   };
-  const colFloors = React78__default.useMemo(
+  const colFloors = React79__default.useMemo(
     () => colDefs.map((col) => {
       const longest = data.reduce((widest, row) => {
         const cell = formatCell(asFieldValue(getNestedValue(row, col.field ?? col.key)), col.format);
@@ -35040,12 +35807,12 @@ function TableView({
         ]
       }
     );
-    return dnd.isZone ? /* @__PURE__ */ jsx(dnd.SortableItem, { id: row[idField] ?? id, children: rowInner }, id) : /* @__PURE__ */ jsx(React78__default.Fragment, { children: rowInner }, id);
+    return dnd.isZone ? /* @__PURE__ */ jsx(dnd.SortableItem, { id: row[idField] ?? id, children: rowInner }, id) : /* @__PURE__ */ jsx(React79__default.Fragment, { children: rowInner }, id);
   };
   const items = Array.from(data);
   const groups = groupBy ? groupData2(items, groupBy) : [{ label: "", items }];
   let runningIndex = 0;
-  const body = /* @__PURE__ */ jsx(Box, { role: "rowgroup", children: groups.map((group, gi) => /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+  const body = /* @__PURE__ */ jsx(Box, { role: "rowgroup", children: groups.map((group, gi) => /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
     group.label && /* @__PURE__ */ jsx(Divider, { label: group.label, className: gi > 0 ? "mt-3" : "mt-0" }),
     group.items.map((row) => renderRow(row, runningIndex++))
   ] }, gi)) });
@@ -36414,7 +37181,7 @@ var init_StepFlow = __esm({
       className
     }) => {
       if (orientation === "vertical") {
-        return /* @__PURE__ */ jsx(VStack, { gap: "none", className: cn("w-full", className), children: steps.map((step, index) => /* @__PURE__ */ jsx(React78__default.Fragment, { children: /* @__PURE__ */ jsxs(HStack, { gap: "md", align: "start", className: "w-full", children: [
+        return /* @__PURE__ */ jsx(VStack, { gap: "none", className: cn("w-full", className), children: steps.map((step, index) => /* @__PURE__ */ jsx(React79__default.Fragment, { children: /* @__PURE__ */ jsxs(HStack, { gap: "md", align: "start", className: "w-full", children: [
           /* @__PURE__ */ jsxs(VStack, { gap: "none", align: "center", children: [
             /* @__PURE__ */ jsx(StepCircle, { step, index }),
             showConnectors && index < steps.length - 1 && /* @__PURE__ */ jsx(Box, { className: "w-px h-8 bg-border" })
@@ -36425,7 +37192,7 @@ var init_StepFlow = __esm({
           ] })
         ] }) }, index)) });
       }
-      return /* @__PURE__ */ jsx(Box, { className: cn("w-full flex flex-col md:flex-row items-start gap-0", className), children: steps.map((step, index) => /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+      return /* @__PURE__ */ jsx(Box, { className: cn("w-full flex flex-col md:flex-row items-start gap-0", className), children: steps.map((step, index) => /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
         /* @__PURE__ */ jsxs(VStack, { gap: "sm", align: "center", className: "flex-1 w-full md:w-auto", children: [
           /* @__PURE__ */ jsx(StepCircle, { step, index }),
           /* @__PURE__ */ jsx(Typography, { variant: "h4", className: "text-center", children: step.title }),
@@ -37415,7 +38182,7 @@ var init_LikertScale = __esm({
       md: "text-base",
       lg: "text-lg"
     };
-    LikertScale = React78__default.forwardRef(
+    LikertScale = React79__default.forwardRef(
       ({
         question,
         options = DEFAULT_LIKERT_OPTIONS,
@@ -37427,7 +38194,7 @@ var init_LikertScale = __esm({
         variant = "radios",
         className
       }, ref) => {
-        const groupId = React78__default.useId();
+        const groupId = React79__default.useId();
         const eventBus = useEventBus();
         const handleSelect = useCallback(
           (next) => {
@@ -39850,7 +40617,7 @@ var init_DocBreadcrumb = __esm({
           "aria-label": t("aria.breadcrumb"),
           children: /* @__PURE__ */ jsx(HStack, { gap: "xs", align: "center", wrap: true, children: items.map((item, idx) => {
             const isLast = idx === items.length - 1;
-            return /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+            return /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
               idx > 0 && /* @__PURE__ */ jsx(
                 Icon,
                 {
@@ -40719,7 +41486,7 @@ var init_MiniStateMachine = __esm({
           const x = 2 + i * (NODE_W + GAP2 + ARROW_W + GAP2);
           const tc = transitionCounts[s.name] ?? 0;
           const role = getStateRole(s.name, s.isInitial ?? void 0, s.isTerminal ?? void 0, tc, maxTC);
-          return /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+          return /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
             /* @__PURE__ */ jsx(
               AvlState,
               {
@@ -40924,7 +41691,7 @@ var init_PageHeader = __esm({
         info: "bg-info/10 text-info"
       };
       return /* @__PURE__ */ jsxs(Box, { className: cn("mb-6", className), children: [
-        breadcrumbs && breadcrumbs.length > 0 && /* @__PURE__ */ jsx(Box, { as: "nav", className: "mb-4", children: /* @__PURE__ */ jsx(Box, { as: "ol", className: "flex items-center gap-2 text-sm", children: breadcrumbs.map((crumb, idx) => /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+        breadcrumbs && breadcrumbs.length > 0 && /* @__PURE__ */ jsx(Box, { as: "nav", className: "mb-4", children: /* @__PURE__ */ jsx(Box, { as: "ol", className: "flex items-center gap-2 text-sm", children: breadcrumbs.map((crumb, idx) => /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
           idx > 0 && /* @__PURE__ */ jsx(Typography, { variant: "small", color: "muted", children: "/" }),
           crumb.href ? /* @__PURE__ */ jsx(
             "a",
@@ -41282,7 +42049,7 @@ var init_Section = __esm({
       as: Component = "section"
     }) => {
       const hasHeader = title || description || action;
-      return React78__default.createElement(
+      return React79__default.createElement(
         Component,
         {
           className: cn(
@@ -41656,7 +42423,7 @@ var init_WizardContainer = __esm({
               const isCompleted = index < currentStep;
               const stepKey = step.id ?? step.tabId ?? `step-${index}`;
               const stepTitle = step.title ?? step.name ?? `Step ${index + 1}`;
-              return /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+              return /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
                 /* @__PURE__ */ jsx(
                   Button,
                   {
@@ -43443,7 +44210,7 @@ var init_ImportPreviewTree = __esm({
       const renderUnit = (unit, childrenByParent, depth) => {
         const summary = fieldSummary(unit);
         const children = childrenByParent.get(unit.ref) ?? [];
-        return /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+        return /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
           /* @__PURE__ */ jsxs(
             Box,
             {
@@ -43540,7 +44307,7 @@ var init_ImportProgress = __esm({
           PIPELINE.map((key, index) => {
             const isComplete = index < currentIndex;
             const isActive = index === currentIndex;
-            return /* @__PURE__ */ jsxs(React78__default.Fragment, { children: [
+            return /* @__PURE__ */ jsxs(React79__default.Fragment, { children: [
               index > 0 ? /* @__PURE__ */ jsx(Box, { className: "h-px w-4 bg-border" }) : null,
               /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-1", "data-testid": `import-progress-step-${key}`, children: [
                 /* @__PURE__ */ jsx(
@@ -44710,7 +45477,7 @@ var init_DetailPanel = __esm({
     }) => {
       const eventBus = useEventBus();
       const { t } = useTranslate();
-      const [titleDraft, setTitleDraft] = React78__default.useState(null);
+      const [titleDraft, setTitleDraft] = React79__default.useState(null);
       const isFieldDefArray = (arr) => {
         if (!arr || arr.length === 0) return false;
         const first = arr[0];
@@ -45176,7 +45943,7 @@ var init_SplitPane = __esm({
             /* @__PURE__ */ jsx(
               "div",
               {
-                className: cn("overflow-auto", leftClassName),
+                className: cn("flex flex-col overflow-auto", leftClassName),
                 style: {
                   [isHorizontal ? "width" : "height"]: `${ratio}%`,
                   flexShrink: 0
@@ -45194,7 +45961,7 @@ var init_SplitPane = __esm({
                 )
               }
             ),
-            /* @__PURE__ */ jsx("div", { className: cn("flex-1 overflow-auto", rightClassName), children: right })
+            /* @__PURE__ */ jsx("div", { className: cn("flex flex-col flex-1 min-h-0 min-w-0 overflow-auto", rightClassName), children: right })
           ]
         }
       );
@@ -45240,7 +46007,7 @@ var init_DockLayout = __esm({
       const showBottomPanel = Boolean(bottomPanel) && !bottomPanelCollapsed;
       const showSecondarySidebar = Boolean(secondarySidebar) && !secondarySidebarCollapsed;
       const centerRow = /* @__PURE__ */ jsxs(HStack, { gap: "none", className: "flex-1 min-h-0 min-w-0", children: [
-        /* @__PURE__ */ jsx(Box, { className: cn("flex-1 min-w-0 h-full overflow-auto", mainClassName), children: main }),
+        /* @__PURE__ */ jsx(Box, { className: cn("flex-1 min-w-0 min-h-0 overflow-auto", mainClassName), children: main }),
         showSecondarySidebar && /* @__PURE__ */ jsx(
           Box,
           {
@@ -45271,7 +46038,7 @@ var init_DockLayout = __esm({
           Box,
           {
             className: cn(
-              "flex-shrink-0 h-full overflow-auto border-r border-border",
+              "flex-shrink-0 min-h-0 overflow-auto border-r border-border",
               railClassName
             ),
             style: { width: railWidth },
@@ -45320,7 +46087,7 @@ var init_DockLayout = __esm({
   }
 });
 function extractTitle(children) {
-  if (!React78__default.isValidElement(children)) return void 0;
+  if (!React79__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -45682,7 +46449,7 @@ var init_Form = __esm({
       const isSchemaEntity = isOrbitalEntitySchema(entity);
       const resolvedEntity = isSchemaEntity ? entity : void 0;
       const entityName = typeof entity === "string" ? entity : resolvedEntity?.name;
-      const normalizedInitialData = React78__default.useMemo(() => {
+      const normalizedInitialData = React79__default.useMemo(() => {
         const entityRowAsInitial = isPlainEntityRow(entity) ? entity : void 0;
         const callerInitial = initialData !== null && typeof initialData === "object" && !Array.isArray(initialData) ? initialData : {};
         const merged = entityRowAsInitial !== void 0 ? { ...entityRowAsInitial, ...callerInitial } : callerInitial;
@@ -45701,7 +46468,7 @@ var init_Form = __esm({
         }
         return normalized;
       }, [entity, initialData]);
-      const entityDerivedFields = React78__default.useMemo(() => {
+      const entityDerivedFields = React79__default.useMemo(() => {
         if (fields && fields.length > 0) return void 0;
         if (!resolvedEntity) return void 0;
         return resolvedEntity.fields.map(
@@ -45722,16 +46489,16 @@ var init_Form = __esm({
       const conditionalFields = typeof conditionalFieldsRaw === "boolean" ? {} : conditionalFieldsRaw;
       const hiddenCalculations = typeof hiddenCalculationsRaw === "boolean" ? [] : hiddenCalculationsRaw;
       const violationTriggers = typeof violationTriggersRaw === "boolean" ? [] : violationTriggersRaw;
-      const [formData, setFormData] = React78__default.useState(
+      const [formData, setFormData] = React79__default.useState(
         normalizedInitialData
       );
-      const [collapsedSections, setCollapsedSections] = React78__default.useState(
+      const [collapsedSections, setCollapsedSections] = React79__default.useState(
         /* @__PURE__ */ new Set()
       );
-      const [submitError, setSubmitError] = React78__default.useState(null);
-      const formRef = React78__default.useRef(null);
+      const [submitError, setSubmitError] = React79__default.useState(null);
+      const formRef = React79__default.useRef(null);
       const formMode = props.mode;
-      const mountedRef = React78__default.useRef(false);
+      const mountedRef = React79__default.useRef(false);
       if (!mountedRef.current) {
         mountedRef.current = true;
         debug("forms", "mount", {
@@ -45744,7 +46511,7 @@ var init_Form = __esm({
         });
       }
       const shouldShowCancel = showCancel ?? (fields && fields.length > 0);
-      const evalContext = React78__default.useMemo(
+      const evalContext = React79__default.useMemo(
         () => ({
           formValues: formData,
           globalVariables: externalContext?.globalVariables ?? {},
@@ -45753,7 +46520,7 @@ var init_Form = __esm({
         }),
         [formData, externalContext]
       );
-      React78__default.useEffect(() => {
+      React79__default.useEffect(() => {
         debug("forms", "initialData-sync", {
           mode: formMode,
           normalizedInitialData,
@@ -45764,7 +46531,7 @@ var init_Form = __esm({
           setFormData(normalizedInitialData);
         }
       }, [normalizedInitialData]);
-      const processCalculations = React78__default.useCallback(
+      const processCalculations = React79__default.useCallback(
         (changedFieldId, newFormData) => {
           if (!hiddenCalculations.length) return;
           const context = {
@@ -45789,7 +46556,7 @@ var init_Form = __esm({
         },
         [hiddenCalculations, externalContext, eventBus]
       );
-      const checkViolations = React78__default.useCallback(
+      const checkViolations = React79__default.useCallback(
         (changedFieldId, newFormData) => {
           if (!violationTriggers.length) return;
           const context = {
@@ -45827,7 +46594,7 @@ var init_Form = __esm({
         processCalculations(name, newFormData);
         checkViolations(name, newFormData);
       };
-      const isFieldVisible = React78__default.useCallback(
+      const isFieldVisible = React79__default.useCallback(
         (fieldName2) => {
           const condition = conditionalFields[fieldName2];
           if (!condition) return true;
@@ -45835,7 +46602,7 @@ var init_Form = __esm({
         },
         [conditionalFields, evalContext]
       );
-      const isSectionVisible = React78__default.useCallback(
+      const isSectionVisible = React79__default.useCallback(
         (section) => {
           if (!section.condition) return true;
           return Boolean(evaluateFormExpression(section.condition, evalContext));
@@ -45911,7 +46678,7 @@ var init_Form = __esm({
           eventBus.emit(`UI:${onCancel}`);
         }
       };
-      const renderField = React78__default.useCallback(
+      const renderField = React79__default.useCallback(
         (field) => {
           const fieldName2 = field.name || field.field;
           if (!fieldName2) return null;
@@ -45933,7 +46700,7 @@ var init_Form = __esm({
         [formData, isFieldVisible, relationsData, relationsLoading, isLoading]
       );
       const effectiveFields = entityDerivedFields ?? fields;
-      const normalizedFields = React78__default.useMemo(() => {
+      const normalizedFields = React79__default.useMemo(() => {
         if (!effectiveFields || effectiveFields.length === 0) return [];
         return effectiveFields.map((field) => {
           if (typeof field === "string") {
@@ -45968,7 +46735,7 @@ var init_Form = __esm({
           };
         });
       }, [effectiveFields, resolvedEntity, fieldOverrides]);
-      const schemaFields = React78__default.useMemo(() => {
+      const schemaFields = React79__default.useMemo(() => {
         if (normalizedFields.length === 0) return null;
         if (isDebugEnabled()) {
           debugGroup(`Form: ${entityName || "unknown"}`);
@@ -45978,7 +46745,7 @@ var init_Form = __esm({
         }
         return normalizedFields.map(renderField).filter(Boolean);
       }, [normalizedFields, renderField, entityName, conditionalFields]);
-      const sectionElements = React78__default.useMemo(() => {
+      const sectionElements = React79__default.useMemo(() => {
         if (!sections || sections.length === 0) return null;
         return sections.map((section) => {
           if (!isSectionVisible(section)) {
@@ -46814,7 +47581,7 @@ var init_List = __esm({
         if (entity && typeof entity === "object" && "id" in entity) return [entity];
         return [];
       }, [entity]);
-      const getItemActions = React78__default.useCallback(
+      const getItemActions = React79__default.useCallback(
         (item) => {
           if (!itemActions) return [];
           if (typeof itemActions === "function") {
@@ -47296,7 +48063,7 @@ var init_MediaGallery = __esm({
         [selectable, selectedItems, selectionEvent, eventBus]
       );
       const entityData = Array.isArray(entity) ? entity : [];
-      const items = React78__default.useMemo(() => {
+      const items = React79__default.useMemo(() => {
         if (propItems && propItems.length > 0) return propItems;
         if (entityData.length === 0) return [];
         return entityData.map((record, idx) => {
@@ -47461,7 +48228,7 @@ var init_MediaGallery = __esm({
   }
 });
 function extractTitle2(children) {
-  if (!React78__default.isValidElement(children)) return void 0;
+  if (!React79__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -47716,7 +48483,7 @@ var init_debugRegistry = __esm({
   }
 });
 function useDebugData() {
-  const [data, setData] = React78.useState(() => ({
+  const [data, setData] = React79.useState(() => ({
     traits: [],
     ticks: [],
     guards: [],
@@ -47730,7 +48497,7 @@ function useDebugData() {
     },
     lastUpdate: Date.now()
   }));
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     const updateData = () => {
       setData({
         traits: getAllTraits(),
@@ -47839,12 +48606,12 @@ function layoutGraph(states, transitions, initialState, width, height) {
   return positions;
 }
 function WalkMinimap() {
-  const [walkStep, setWalkStep] = React78.useState(null);
-  const [traits2, setTraits] = React78.useState([]);
-  const [coveredEdges, setCoveredEdges] = React78.useState([]);
-  const [completedTraits, setCompletedTraits] = React78.useState(/* @__PURE__ */ new Set());
-  const prevTraitRef = React78.useRef(null);
-  React78.useEffect(() => {
+  const [walkStep, setWalkStep] = React79.useState(null);
+  const [traits2, setTraits] = React79.useState([]);
+  const [coveredEdges, setCoveredEdges] = React79.useState([]);
+  const [completedTraits, setCompletedTraits] = React79.useState(/* @__PURE__ */ new Set());
+  const prevTraitRef = React79.useRef(null);
+  React79.useEffect(() => {
     const interval = setInterval(() => {
       const w = window;
       const step = w.__orbitalWalkStep;
@@ -48280,15 +49047,15 @@ var init_EntitiesTab = __esm({
 });
 function EventFlowTab({ events: events2 }) {
   const { t } = useTranslate();
-  const [filter, setFilter] = React78.useState("all");
-  const containerRef = React78.useRef(null);
-  const [autoScroll, setAutoScroll] = React78.useState(true);
-  React78.useEffect(() => {
+  const [filter, setFilter] = React79.useState("all");
+  const containerRef = React79.useRef(null);
+  const [autoScroll, setAutoScroll] = React79.useState(true);
+  React79.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
   }, [events2.length, autoScroll]);
-  const filteredEvents = React78.useMemo(() => {
+  const filteredEvents = React79.useMemo(() => {
     if (filter === "all") return events2;
     return events2.filter((e) => e.type === filter);
   }, [events2, filter]);
@@ -48404,7 +49171,7 @@ var init_EventFlowTab = __esm({
 });
 function GuardsPanel({ guards }) {
   const { t } = useTranslate();
-  const [filter, setFilter] = React78.useState("all");
+  const [filter, setFilter] = React79.useState("all");
   if (guards.length === 0) {
     return /* @__PURE__ */ jsx(
       EmptyState,
@@ -48417,7 +49184,7 @@ function GuardsPanel({ guards }) {
   }
   const passedCount = guards.filter((g) => g.result).length;
   const failedCount = guards.length - passedCount;
-  const filteredGuards = React78.useMemo(() => {
+  const filteredGuards = React79.useMemo(() => {
     if (filter === "all") return guards;
     if (filter === "passed") return guards.filter((g) => g.result);
     return guards.filter((g) => !g.result);
@@ -48580,10 +49347,10 @@ function EffectBadge({ effect }) {
 }
 function TransitionTimeline({ transitions }) {
   const { t } = useTranslate();
-  const containerRef = React78.useRef(null);
-  const [autoScroll, setAutoScroll] = React78.useState(true);
-  const [expandedId, setExpandedId] = React78.useState(null);
-  React78.useEffect(() => {
+  const containerRef = React79.useRef(null);
+  const [autoScroll, setAutoScroll] = React79.useState(true);
+  const [expandedId, setExpandedId] = React79.useState(null);
+  React79.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
@@ -48863,9 +49630,9 @@ function getAllEvents(traits2) {
 function EventDispatcherTab({ traits: traits2, schema }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [log19, setLog] = React78.useState([]);
-  const prevStatesRef = React78.useRef(/* @__PURE__ */ new Map());
-  React78.useEffect(() => {
+  const [log20, setLog] = React79.useState([]);
+  const prevStatesRef = React79.useRef(/* @__PURE__ */ new Map());
+  React79.useEffect(() => {
     for (const trait of traits2) {
       const prev = prevStatesRef.current.get(trait.id);
       if (prev && prev !== trait.currentState) {
@@ -48927,9 +49694,9 @@ function EventDispatcherTab({ traits: traits2, schema }) {
       /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "medium", className: "text-muted-foreground mb-1", children: t("debug.otherEvents") }),
       /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: unavailableEvents.map((event) => /* @__PURE__ */ jsx(Badge, { variant: "default", size: "sm", className: "opacity-50", children: event }, event)) })
     ] }),
-    log19.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+    log20.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "medium", className: "text-muted-foreground mb-1", children: t("debug.recentTransitions") }),
-      /* @__PURE__ */ jsx(Stack, { gap: "xs", children: log19.map((entry, i) => /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "font-mono text-xs", children: [
+      /* @__PURE__ */ jsx(Stack, { gap: "xs", children: log20.map((entry, i) => /* @__PURE__ */ jsxs(Typography, { variant: "small", className: "font-mono text-xs", children: [
         /* @__PURE__ */ jsx("span", { className: "text-primary", children: entry.traitName }),
         " ",
         /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: entry.from }),
@@ -49034,10 +49801,10 @@ function VerifyModePanel({
   localCount
 }) {
   const { t } = useTranslate();
-  const [expanded, setExpanded] = React78.useState(true);
-  const scrollRef = React78.useRef(null);
-  const prevCountRef = React78.useRef(0);
-  React78.useEffect(() => {
+  const [expanded, setExpanded] = React79.useState(true);
+  const scrollRef = React79.useRef(null);
+  const prevCountRef = React79.useRef(0);
+  React79.useEffect(() => {
     if (expanded && transitions.length > prevCountRef.current && scrollRef.current) {
       scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
     }
@@ -49094,10 +49861,10 @@ function RuntimeDebugger({
   schema
 }) {
   const { t } = useTranslate();
-  const [isCollapsed, setIsCollapsed] = React78.useState(mode === "verify" ? true : defaultCollapsed);
-  const [isVisible, setIsVisible] = React78.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
+  const [isCollapsed, setIsCollapsed] = React79.useState(mode === "verify" ? true : defaultCollapsed);
+  const [isVisible, setIsVisible] = React79.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
   const debugData = useDebugData();
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     if (mode === "inline") return;
     return onDebugToggle((enabled) => {
       setIsVisible(enabled);
@@ -49106,7 +49873,7 @@ function RuntimeDebugger({
       }
     });
   }, [mode]);
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     if (mode === "inline") return;
     const handleKeyDown = (e) => {
       if (e.key === "`" && isVisible) {
@@ -49537,7 +50304,7 @@ var init_StatCard = __esm({
       const labelToUse = propLabel ?? propTitle;
       const eventBus = useEventBus();
       const { t } = useTranslate();
-      const handleActionClick = React78__default.useCallback(() => {
+      const handleActionClick = React79__default.useCallback(() => {
         if (action?.event) {
           eventBus.emit(`UI:${action.event}`, {});
         }
@@ -49548,7 +50315,7 @@ var init_StatCard = __esm({
       const data = Array.isArray(entity) ? entity : entity ? [entity] : [];
       const isLoading = externalLoading ?? false;
       const error = externalError;
-      const computeMetricValue = React78__default.useCallback(
+      const computeMetricValue = React79__default.useCallback(
         (metric, items) => {
           if (metric.value !== void 0) {
             return metric.value;
@@ -49587,7 +50354,7 @@ var init_StatCard = __esm({
         },
         []
       );
-      const schemaStats = React78__default.useMemo(() => {
+      const schemaStats = React79__default.useMemo(() => {
         if (!metrics || metrics.length === 0) return null;
         return metrics.map((metric) => ({
           label: metric.label,
@@ -49595,7 +50362,7 @@ var init_StatCard = __esm({
           format: metric.format
         }));
       }, [metrics, data, computeMetricValue]);
-      const calculatedTrend = React78__default.useMemo(() => {
+      const calculatedTrend = React79__default.useMemo(() => {
         if (manualTrend !== void 0) return manualTrend;
         if (previousValue === void 0 || currentValue2 === void 0)
           return void 0;
@@ -50235,8 +51002,8 @@ var init_SubagentTracePanel = __esm({
       ] });
     };
     InlineActivityStream = ({ activities, autoScroll = true, className }) => {
-      const endRef = React78__default.useRef(null);
-      React78__default.useEffect(() => {
+      const endRef = React79__default.useRef(null);
+      React79__default.useEffect(() => {
         if (!autoScroll) return;
         endRef.current?.scrollIntoView({ behavior: "smooth", block: "end" });
       }, [activities.length, autoScroll]);
@@ -50330,7 +51097,7 @@ var init_SubagentTracePanel = __esm({
     };
     SubagentRichCard = ({ subagent }) => {
       const { t } = useTranslate();
-      const activities = React78__default.useMemo(
+      const activities = React79__default.useMemo(
         () => subagentMessagesToActivities(subagent.messages),
         [subagent.messages]
       );
@@ -50407,8 +51174,8 @@ var init_SubagentTracePanel = __esm({
       ] });
     };
     CoordinatorConversation = ({ messages, autoScroll = true, className }) => {
-      const endRef = React78__default.useRef(null);
-      React78__default.useEffect(() => {
+      const endRef = React79__default.useRef(null);
+      React79__default.useEffect(() => {
         if (!autoScroll) return;
         endRef.current?.scrollIntoView({ behavior: "smooth", block: "end" });
       }, [messages.length, autoScroll]);
@@ -50843,7 +51610,7 @@ var init_Timeline = __esm({
     }) => {
       const { t } = useTranslate();
       const entityData = entity ?? [];
-      const items = React78__default.useMemo(() => {
+      const items = React79__default.useMemo(() => {
         if (propItems) return propItems;
         if (entityData.length === 0) return [];
         return entityData.map((record, idx) => {
@@ -50945,7 +51712,7 @@ var init_Timeline = __esm({
   }
 });
 function extractToastProps(children) {
-  if (!React78__default.isValidElement(children)) {
+  if (!React79__default.isValidElement(children)) {
     if (typeof children === "string") {
       return { message: children };
     }
@@ -50987,7 +51754,7 @@ var init_ToastSlot = __esm({
         eventBus.emit(`${prefix}CLOSE`);
       };
       if (!isVisible) return null;
-      const isCustomContent = React78__default.isValidElement(children) && !message;
+      const isCustomContent = React79__default.isValidElement(children) && !message;
       return /* @__PURE__ */ jsx(Box, { className: "fixed bottom-4 right-4 z-50", children: isCustomContent ? children : /* @__PURE__ */ jsx(
         Toast,
         {
@@ -51055,6 +51822,7 @@ var init_component_registry_generated = __esm({
     init_ChoiceButton();
     init_CodeBlock();
     init_CodeRunnerPanel();
+    init_CommandPalette();
     init_CommunityLinks();
     init_ConditionalWrapper();
     init_ConfettiEffect();
@@ -51119,6 +51887,7 @@ var init_component_registry_generated = __esm({
     init_FormSection();
     init_FormSectionHeader();
     init_FxOverlay();
+    init_GameAudioCue();
     init_GameAudioToggle();
     init_GameHud();
     init_GameIcon();
@@ -51329,6 +52098,7 @@ var init_component_registry_generated = __esm({
       "ChoiceButton": ChoiceButton,
       "CodeBlock": CodeBlock,
       "CodeRunnerPanel": CodeRunnerPanel,
+      "CommandPalette": CommandPalette,
       "CommunityLinks": CommunityLinks,
       "ConditionalWrapper": ConditionalWrapper,
       "ConfettiEffect": ConfettiEffect,
@@ -51395,6 +52165,7 @@ var init_component_registry_generated = __esm({
       "FormLayout": FormLayout,
       "FormSectionHeader": FormSectionHeader,
       "FxOverlay": FxOverlay,
+      "GameAudioCue": GameAudioCue,
       "GameAudioToggle": GameAudioToggle,
       "GameHud": GameHud,
       "GameIcon": GameIcon,
@@ -51577,7 +52348,7 @@ function SuspenseConfigProvider({
   config,
   children
 }) {
-  return React78__default.createElement(
+  return React79__default.createElement(
     SuspenseConfigContext.Provider,
     { value: config },
     children
@@ -51625,7 +52396,7 @@ function enrichFormFields(fields, entityDef) {
       }
       return { name: field, label: humanizeFieldName(field) };
     }
-    if (field && typeof field === "object" && !Array.isArray(field) && !React78__default.isValidElement(field) && !(field instanceof Date)) {
+    if (field && typeof field === "object" && !Array.isArray(field) && !React79__default.isValidElement(field) && !(field instanceof Date)) {
       const obj = field;
       const fieldName2 = typeof obj.name === "string" ? obj.name : typeof obj.field === "string" ? obj.field : void 0;
       if (!fieldName2) return field;
@@ -51678,7 +52449,7 @@ function enrichDetailFields(fields, entityDef) {
       const meta = metaFor(field);
       return meta ? { key: field, ...meta } : field;
     }
-    if (field && typeof field === "object" && !Array.isArray(field) && !React78__default.isValidElement(field) && !(field instanceof Date)) {
+    if (field && typeof field === "object" && !Array.isArray(field) && !React79__default.isValidElement(field) && !(field instanceof Date)) {
       const obj = field;
       const fieldName2 = typeof obj.key === "string" ? obj.key : typeof obj.name === "string" ? obj.name : void 0;
       if (!fieldName2 || obj.type) return field;
@@ -52137,7 +52908,7 @@ function renderPatternChildren(children, onDismiss, parentId = "root", parentPat
         const key = `${parentId}-${index}-trait:${traitName}`;
         return /* @__PURE__ */ jsx(TraitFrame, { traitName }, key);
       }
-      return /* @__PURE__ */ jsx(React78__default.Fragment, { children: child }, `${parentId}-${index}`);
+      return /* @__PURE__ */ jsx(React79__default.Fragment, { children: child }, `${parentId}-${index}`);
     }
     if (!child || typeof child !== "object") return null;
     const childId = `${parentId}-${index}`;
@@ -52194,7 +52965,7 @@ function isPatternConfig(value) {
   if (value === null || value === void 0) return false;
   if (typeof value !== "object") return false;
   if (Array.isArray(value)) return false;
-  if (React78__default.isValidElement(value)) return false;
+  if (React79__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   if (typeof value === "function") return false;
   const record = value;
@@ -52207,9 +52978,9 @@ function renderPatternValue(value) {
   if (typeof value === "string") return renderPatternChildren(value, () => {
   });
   if (value instanceof Date) return value.toLocaleString();
-  if (React78__default.isValidElement(value)) return value;
+  if (React79__default.isValidElement(value)) return value;
   if (Array.isArray(value)) {
-    return value.map((item, index) => /* @__PURE__ */ jsx(React78__default.Fragment, { children: renderPatternValue(item) }, index));
+    return value.map((item, index) => /* @__PURE__ */ jsx(React79__default.Fragment, { children: renderPatternValue(item) }, index));
   }
   if (isPatternConfig(value)) {
     const { type, ...props } = value;
@@ -52219,7 +52990,7 @@ function renderPatternValue(value) {
   return null;
 }
 function isPlainConfigObject(value) {
-  if (React78__default.isValidElement(value)) return false;
+  if (React79__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   const proto = Object.getPrototypeOf(value);
   return proto === Object.prototype || proto === null;
@@ -52393,7 +53164,7 @@ function SlotContentRenderer({
     for (const slotKey of CONTENT_NODE_SLOTS) {
       const slotVal = restProps[slotKey];
       if (slotVal === void 0 || slotVal === null) continue;
-      if (React78__default.isValidElement(slotVal) || typeof slotVal === "string" || typeof slotVal === "number" || typeof slotVal === "boolean") continue;
+      if (React79__default.isValidElement(slotVal) || typeof slotVal === "string" || typeof slotVal === "number" || typeof slotVal === "boolean") continue;
       const typelessChildren = !Array.isArray(slotVal) && typeof slotVal === "object" && !("type" in slotVal) && Array.isArray(slotVal.children) ? slotVal.children : void 0;
       if (typelessChildren !== void 0 || Array.isArray(slotVal) || typeof slotVal === "object" && "type" in slotVal) {
         nodeSlotOverrides[slotKey] = renderPatternChildren(
@@ -52447,7 +53218,7 @@ function SlotContentRenderer({
     const resolvedItems = Array.isArray(entityVal) && entityVal[0] !== "fn" ? entityVal : null;
     if (resolvedItems && resolvedItems.length > 0 && !finalProps.fields && !finalProps.columns) {
       const sample = resolvedItems[0];
-      if (sample && typeof sample === "object" && !Array.isArray(sample) && !React78__default.isValidElement(sample) && !(sample instanceof Date)) {
+      if (sample && typeof sample === "object" && !Array.isArray(sample) && !React79__default.isValidElement(sample) && !(sample instanceof Date)) {
         const keys = Object.keys(sample).filter((k) => k !== "id" && k !== "_id");
         finalProps.fields = keys.map((k, i) => ({ name: k, variant: i === 0 ? "h4" : "body" }));
       }
@@ -52881,7 +53652,7 @@ init_AboutPageTemplate();
 
 // components/index.ts
 init_cn();
-var log8 = createLogger("almadar:ui:orbital-history");
+var log9 = createLogger("almadar:ui:orbital-history");
 function useOrbitalHistory(options) {
   const { appId, authToken, userId, onHistoryChange, onRevertSuccess } = options;
   const getHeaders = useCallback(() => {
@@ -52943,7 +53714,7 @@ function useOrbitalHistory(options) {
         setCurrentVersion(mergedTimeline[0].version);
       }
     } catch (err) {
-      log8.error("Failed to load history", { error: err instanceof Error ? err : String(err) });
+      log9.error("Failed to load history", { error: err instanceof Error ? err : String(err) });
       setError(err instanceof Error ? err.message : "Failed to load history");
     } finally {
       setIsLoading(false);
@@ -52976,7 +53747,7 @@ function useOrbitalHistory(options) {
         error: data.error || "Unknown error during revert"
       };
     } catch (err) {
-      log8.error("Failed to revert", { error: err instanceof Error ? err : String(err) });
+      log9.error("Failed to revert", { error: err instanceof Error ? err : String(err) });
       return {
         success: false,
         error: err instanceof Error ? err.message : "Failed to revert"
@@ -53000,7 +53771,7 @@ function useOrbitalHistory(options) {
     refresh
   };
 }
-var log9 = createLogger("almadar:ui:filesystem");
+var log10 = createLogger("almadar:ui:filesystem");
 function useFileSystem() {
   const [status, setStatus] = useState("idle");
   const [error, setError] = useState(null);
@@ -53015,7 +53786,7 @@ function useFileSystem() {
     setError(null);
     setIsLoading(true);
     try {
-      log9.debug("Booting WebContainer");
+      log10.debug("Booting WebContainer");
       await new Promise((resolve) => setTimeout(resolve, 100));
       setStatus("ready");
     } catch (err) {
@@ -53076,7 +53847,7 @@ function useFileSystem() {
       setFiles(newTree);
       setStatus("running");
     } catch (err) {
-      log9.error("Failed to mount files", { error: err instanceof Error ? err : String(err) });
+      log10.error("Failed to mount files", { error: err instanceof Error ? err : String(err) });
     } finally {
       setIsLoading(false);
     }
@@ -53117,7 +53888,7 @@ function useFileSystem() {
     const path = contentArg !== void 0 ? pathOrContent : selectedPath;
     const content = contentArg !== void 0 ? contentArg : pathOrContent;
     if (!path) {
-      log9.warn("updateContent called without path and no file selected");
+      log10.warn("updateContent called without path and no file selected");
       return;
     }
     setFileContents((prev) => {
@@ -53133,14 +53904,14 @@ function useFileSystem() {
     setSelectedFile((prev) => prev ? { ...prev, content, isDirty: true } : null);
   }, []);
   const refreshTree = useCallback(async () => {
-    log9.debug("Refreshing tree");
+    log10.debug("Refreshing tree");
   }, []);
   const runCommand = useCallback(async (command) => {
-    log9.debug("Running command", { command });
+    log10.debug("Running command", { command });
     return { exitCode: 0, output: "" };
   }, []);
   const startDevServer = useCallback(async () => {
-    log9.debug("Starting dev server");
+    log10.debug("Starting dev server");
     setPreviewUrl("http://localhost:5173");
   }, []);
   return {
@@ -53163,7 +53934,7 @@ function useFileSystem() {
     startDevServer
   };
 }
-var log10 = createLogger("almadar:ui:extensions");
+var log11 = createLogger("almadar:ui:extensions");
 var defaultManifest = {
   languages: {
     typescript: { extensions: [".ts", ".tsx"], icon: "ts", color: "#3178c6" },
@@ -53182,7 +53953,7 @@ function useExtensions(options) {
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState(null);
   const loadExtension = useCallback(async (extensionId) => {
-    log10.debug("Loading extension", { extensionId });
+    log11.debug("Loading extension", { extensionId });
   }, []);
   const loadExtensions = useCallback(async () => {
     setIsLoading(true);
@@ -53254,7 +54025,7 @@ function useExtensions(options) {
     getExtensionForFile
   };
 }
-var log11 = createLogger("almadar:ui:file-editor");
+var log12 = createLogger("almadar:ui:file-editor");
 function useFileEditor(options) {
   const { extensions, fileSystem, onSchemaUpdate } = options;
   const [openFiles, setOpenFiles] = useState([]);
@@ -53279,7 +54050,7 @@ function useFileEditor(options) {
       setOpenFiles((prev) => [...prev, newFile]);
       setActiveFilePath(path);
     } catch (err) {
-      log11.error("Failed to open file", { error: err instanceof Error ? err : String(err) });
+      log12.error("Failed to open file", { error: err instanceof Error ? err : String(err) });
     }
   }, [openFiles, fileSystem, extensions]);
   const closeFile = useCallback((path) => {
@@ -53340,7 +54111,7 @@ function useFileEditor(options) {
         }
       }
     } catch (err) {
-      log11.error("Failed to save file", { error: err instanceof Error ? err : String(err) });
+      log12.error("Failed to save file", { error: err instanceof Error ? err : String(err) });
     } finally {
       setIsSaving(false);
     }
@@ -53369,7 +54140,7 @@ function useFileEditor(options) {
     saveAllFiles
   };
 }
-var log12 = createLogger("almadar:ui:compile");
+var log13 = createLogger("almadar:ui:compile");
 function useCompile() {
   const [isCompiling, setIsCompiling] = useState(false);
   const [stage, setStage] = useState("idle");
@@ -53380,7 +54151,7 @@ function useCompile() {
     setStage("compiling");
     setError(null);
     try {
-      log12.debug("Compiling schema", { name: schema.name });
+      log13.debug("Compiling schema", { name: schema.name });
       const result = {
         success: true,
         files: []
@@ -53406,7 +54177,7 @@ function useCompile() {
     compileSchema
   };
 }
-var log13 = createLogger("almadar:ui:preview");
+var log14 = createLogger("almadar:ui:preview");
 function usePreview(options) {
   const [previewUrl, setPreviewUrl] = useState(null);
   const [isLoading, setIsLoading] = useState(!!options?.appId);
@@ -53440,17 +54211,17 @@ function usePreview(options) {
       setIsLoading(false);
       return;
     }
-    log13.debug("Setting up preview for app", { appId });
+    log14.debug("Setting up preview for app", { appId });
     setPreviewUrl(`/api/orbitals/${appId}`);
     setIsLoading(false);
   }, [options?.appId]);
   const startPreview = useCallback(async () => {
-    log13.debug("startPreview called");
+    log14.debug("startPreview called");
   }, []);
   const stopPreview = useCallback(async () => {
     setIsLoading(true);
     try {
-      log13.debug("Stopping preview server");
+      log14.debug("Stopping preview server");
       setPreviewUrl(null);
       setApp(null);
     } finally {
@@ -53459,15 +54230,15 @@ function usePreview(options) {
   }, []);
   const refresh = useCallback(async () => {
     if (!previewUrl) return;
-    log13.debug("Refreshing preview");
+    log14.debug("Refreshing preview");
     setPreviewUrl(`${previewUrl.split("?")[0]}?t=${Date.now()}`);
   }, [previewUrl]);
   const handleRefresh = useCallback(async () => {
-    log13.debug("Handle refresh");
+    log14.debug("Handle refresh");
     await refresh();
   }, [refresh]);
   const handleReset = useCallback(async () => {
-    log13.debug("Resetting preview");
+    log14.debug("Resetting preview");
     setError(null);
     setLoadError(null);
     setErrorToast(null);
@@ -53501,7 +54272,7 @@ function usePreview(options) {
     dismissErrorToast
   };
 }
-var log14 = createLogger("almadar:ui:agent-chat");
+var log15 = createLogger("almadar:ui:agent-chat");
 function useAgentChat(options) {
   const [messages, setMessages] = useState([]);
   const [status, setStatus] = useState("idle");
@@ -53524,7 +54295,7 @@ function useAgentChat(options) {
         timestamp: Date.now()
       };
       setMessages((prev) => [...prev, userMessage]);
-      log14.debug("Sending message", { content });
+      log15.debug("Sending message", { content });
       const assistantMessage = {
         id: (Date.now() + 1).toString(),
         role: "assistant",
@@ -53547,7 +54318,7 @@ function useAgentChat(options) {
     setError(null);
     const skillName = Array.isArray(skill) ? skill[0] : skill;
     try {
-      log14.debug("Starting generation", () => ({ skillName, prompt, genOptions: JSON.stringify(genOptions) }));
+      log15.debug("Starting generation", () => ({ skillName, prompt, genOptions: JSON.stringify(genOptions) }));
       await new Promise((resolve) => setTimeout(resolve, 100));
       setStatus("complete");
       options?.onComplete?.();
@@ -53559,10 +54330,10 @@ function useAgentChat(options) {
     }
   }, [options]);
   const continueConversation = useCallback(async (message) => {
-    log14.debug("Continue conversation", { message: Array.isArray(message) ? message : [message] });
+    log15.debug("Continue conversation", { message: Array.isArray(message) ? message : [message] });
   }, []);
   const resumeWithDecision = useCallback(async (decisions) => {
-    log14.debug("Resume with decision", () => ({ decisions: JSON.stringify(decisions), count: decisions.length }));
+    log15.debug("Resume with decision", () => ({ decisions: JSON.stringify(decisions), count: decisions.length }));
     setInterrupt(null);
   }, []);
   const cancel = useCallback(() => {
@@ -53599,7 +54370,7 @@ function useAgentChat(options) {
     clearHistory
   };
 }
-var log15 = createLogger("almadar:ui:validation");
+var log16 = createLogger("almadar:ui:validation");
 function useValidation() {
   const [result, setResult] = useState(null);
   const [isValidating, setIsValidating] = useState(false);
@@ -53613,7 +54384,7 @@ function useValidation() {
     setStage("validating");
     setProgressMessage("Validating schema...");
     try {
-      log15.debug("Validating app", { appId });
+      log16.debug("Validating app", { appId });
       const validationResult = {
         valid: true,
         errors: [],
@@ -53666,7 +54437,7 @@ function useValidation() {
     reset
   };
 }
-var log16 = createLogger("almadar:ui:deep-agent");
+var log17 = createLogger("almadar:ui:deep-agent");
 function useDeepAgentGeneration() {
   const [requests, setRequests] = useState([]);
   const [currentRequest, setCurrentRequest] = useState(null);
@@ -53690,7 +54461,7 @@ function useDeepAgentGeneration() {
     setCurrentRequest(request);
     setRequests((prev) => [...prev, request]);
     try {
-      log16.debug("Generating from prompt", { prompt });
+      log17.debug("Generating from prompt", { prompt });
       await new Promise((resolve) => setTimeout(resolve, 100));
       request.status = "completed";
       setCurrentRequest(request);
@@ -53710,7 +54481,7 @@ function useDeepAgentGeneration() {
     }
   }, []);
   const startGeneration = useCallback(async (skill, prompt, _options) => {
-    log16.debug("Starting generation with skill", { skill });
+    log17.debug("Starting generation with skill", { skill });
     await generate(prompt);
   }, [generate]);
   const cancelGeneration = useCallback(() => {
@@ -53732,7 +54503,7 @@ function useDeepAgentGeneration() {
     setIsComplete(false);
   }, []);
   const submitInterruptDecisions = useCallback((decisions) => {
-    log16.debug("Submitting interrupt decisions", () => ({ decisions: JSON.stringify(decisions), count: decisions.length }));
+    log17.debug("Submitting interrupt decisions", () => ({ decisions: JSON.stringify(decisions), count: decisions.length }));
     setInterrupt(null);
   }, []);
   return {
@@ -53754,6 +54525,66 @@ function useDeepAgentGeneration() {
 
 // hooks/index.ts
 init_useEventBus();
+
+// hooks/useKeyboardRouter.ts
+init_useEventBus();
+function useKeyboardRouter(options) {
+  const {
+    captureTable,
+    editorFocusEvent = "EDITOR_FOCUS",
+    editorBlurEvent = "EDITOR_BLUR",
+    keyEvent = "KEY",
+    enabled = true
+  } = options;
+  const eventBus = useEventBus();
+  const captureTableRef = useRef(captureTable);
+  captureTableRef.current = captureTable;
+  const focusedEditorIdRef = useRef(null);
+  useEffect(() => {
+    const unsubFocus = eventBus.on(`UI:${editorFocusEvent}`, (event) => {
+      const editorId = event.payload?.editorId;
+      if (typeof editorId === "string") {
+        focusedEditorIdRef.current = editorId;
+      }
+    });
+    const unsubBlur = eventBus.on(`UI:${editorBlurEvent}`, (event) => {
+      const editorId = event.payload?.editorId;
+      if (typeof editorId === "string" && focusedEditorIdRef.current === editorId) {
+        focusedEditorIdRef.current = null;
+      }
+    });
+    return () => {
+      unsubFocus();
+      unsubBlur();
+    };
+  }, [eventBus, editorFocusEvent, editorBlurEvent]);
+  useEffect(() => {
+    if (!enabled) return;
+    const handleKeyDown = (event) => {
+      if (event.isComposing) return;
+      const target = focusedEditorIdRef.current ?? "shell";
+      const entry = captureTableRef.current[target];
+      const captured = entry !== void 0 && (entry.mode === "any" || entry.keys.has(event.key));
+      if (captured) {
+        event.preventDefault();
+      }
+      eventBus.emit(`UI:${keyEvent}`, {
+        editorId: target,
+        key: event.key,
+        code: event.code,
+        ctrl: event.ctrlKey,
+        alt: event.altKey,
+        shift: event.shiftKey,
+        meta: event.metaKey,
+        repeat: event.repeat
+      });
+    };
+    window.addEventListener("keydown", handleKeyDown, { capture: true });
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown, { capture: true });
+    };
+  }, [eventBus, enabled, keyEvent]);
+}
 function expressionEqual(a, b) {
   if (Object.is(a, b)) return true;
   if (Array.isArray(a) && Array.isArray(b)) {
@@ -53781,7 +54612,7 @@ function expressionEqual(a, b) {
 function isPlainSlotObject(value) {
   if (value === null || value === void 0 || typeof value !== "object") return false;
   if (Array.isArray(value)) return false;
-  if (React78__default.isValidElement(value)) return false;
+  if (React79__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   if (isRenderBindingMarker(value)) return false;
   return true;
@@ -53800,7 +54631,7 @@ function shareValue(prev, next) {
     return prev instanceof Date && next instanceof Date && prev.getTime() === next.getTime() ? { value: prev, equal: true } : { value: next, equal: false };
   }
   if (typeof prev === "function" || typeof next === "function") return { value: next, equal: false };
-  if (React78__default.isValidElement(prev) || React78__default.isValidElement(next)) return { value: next, equal: false };
+  if (React79__default.isValidElement(prev) || React79__default.isValidElement(next)) return { value: next, equal: false };
   if (Array.isArray(prev) && Array.isArray(next)) {
     let equal = prev.length === next.length;
     const out = new Array(next.length);
@@ -53836,21 +54667,12 @@ function reconcileSlotProps(prev, next) {
 }
 
 // hooks/useUISlots.ts
-var log17 = createLogger("almadar:ui:ui-slots");
+var log18 = createLogger("almadar:ui:ui-slots");
 var DEFAULT_SOURCE_KEY = "__default__";
 var MULTI_SOURCE_STACK_TRAIT = "__multi_source_stack__";
-var ALL_SLOTS2 = [
-  "main",
-  "sidebar",
-  "modal",
-  "drawer",
-  "overlay",
-  "center",
-  "toast",
-  "hud-top",
-  "hud-bottom",
-  "floating"
-];
+var ALL_SLOTS2 = UI_SLOTS.filter(
+  (slot) => !slot.includes(".") && slot !== "hud" && slot !== "screen"
+);
 var DEFAULT_SLOTS = ALL_SLOTS2.reduce(
   (acc, slot) => {
     acc[slot] = null;
@@ -53913,7 +54735,7 @@ function useUISlotManager() {
       try {
         callback(slot, content);
       } catch (error) {
-        log17.error("Subscriber error", { error: error instanceof Error ? error : String(error) });
+        log18.error("Subscriber error", { error: error instanceof Error ? error : String(error) });
       }
     });
   }, []);
@@ -53925,7 +54747,7 @@ function useUISlotManager() {
         try {
           callback(content);
         } catch (error) {
-          log17.error("Trait subscriber error", { traitName, error: error instanceof Error ? error : String(error) });
+          log18.error("Trait subscriber error", { traitName, error: error instanceof Error ? error : String(error) });
         }
       });
     },
@@ -53982,7 +54804,7 @@ function useUISlotManager() {
         const slotSources = prev[config.target] ?? {};
         const existing = slotSources[sourceKey];
         if (existing && existing.priority > content.priority) {
-          log17.warn("Slot already has higher priority content", {
+          log18.warn("Slot already has higher priority content", {
             slot: config.target,
             sourceKey,
             existingPriority: existing.priority,
@@ -53993,7 +54815,7 @@ function useUISlotManager() {
         if (existing && existing.priority === content.priority && existing.pattern === content.pattern && existing.animation === content.animation && existing.transitionEvent === content.transitionEvent && existing.fromState === content.fromState && existing.entity === content.entity && existing.nodeId === content.nodeId && existing.autoDismissAt === void 0 && content.autoDismissAt === void 0 && existing.onDismiss === void 0 === (content.onDismiss === void 0)) {
           const reconciled = reconcileSlotProps(existing.props, content.props);
           if (reconciled.equal) {
-            log17.debug("slot:flush-bail", { slot: config.target, sourceKey, pattern: content.pattern });
+            log18.debug("slot:flush-bail", { slot: config.target, sourceKey, pattern: content.pattern });
             return prev;
           }
           content.props = reconciled.value;
@@ -54005,7 +54827,7 @@ function useUISlotManager() {
         const nextAll = { ...prev, [config.target]: nextSources };
         const priorWriters = Object.keys(slotSources);
         if (priorWriters.length === 1 && priorWriters[0] !== sourceKey) {
-          log17.warn("slot:contention", {
+          log18.warn("slot:contention", {
             slot: config.target,
             writers: [priorWriters[0], sourceKey],
             patternTypes: [slotSources[priorWriters[0]].pattern, content.pattern]
@@ -54015,7 +54837,7 @@ function useUISlotManager() {
           indexTraitRender(content.sourceTrait, content);
           notifyTraitSubscribers(content.sourceTrait, content);
         }
-        log17.info("slot:written", {
+        log18.info("slot:written", {
           slot: config.target,
           sourceKey,
           sourceTrait: content.sourceTrait,
@@ -54060,7 +54882,7 @@ function useUISlotManager() {
       setSources((prev) => {
         const slotSources = prev[slot];
         if (!slotSources || !(sourceKey in slotSources)) {
-          log17.debug("slot:clear-noop", { slot, sourceTrait, reason: !slotSources ? "no-slot" : "no-source" });
+          log18.debug("slot:clear-noop", { slot, sourceTrait, reason: !slotSources ? "no-slot" : "no-source" });
           return prev;
         }
         const content = slotSources[sourceKey];
@@ -54076,7 +54898,7 @@ function useUISlotManager() {
         }
         const nextSources = { ...slotSources };
         delete nextSources[sourceKey];
-        log17.info("slot:cleared", { slot, sourceTrait, lastPatternType: content.pattern });
+        log18.info("slot:cleared", { slot, sourceTrait, lastPatternType: content.pattern });
         notifySubscribers(slot, aggregateSlot(nextSources));
         return { ...prev, [slot]: nextSources };
       });
@@ -54252,7 +55074,7 @@ function useTraitListens(dispatch, listens, eventBusInstance) {
     };
   }, [eventBus, dispatch, stableListens]);
 }
-var log18 = createLogger("almadar:ui:shared-entity-store");
+var log19 = createLogger("almadar:ui:shared-entity-store");
 var EMPTY_ENTITY_STATE = {};
 function createSharedEntityStore() {
   const states = /* @__PURE__ */ new Map();
@@ -54282,7 +55104,7 @@ function createSharedEntityStore() {
       try {
         callback();
       } catch (error) {
-        log18.error("Shared entity subscriber error", {
+        log19.error("Shared entity subscriber error", {
           entityId,
           error: error instanceof Error ? error : String(error)
         });
@@ -54888,7 +55710,8 @@ var en_default = {
   "richTextEditor.image": "Insert image",
   "richTextEditor.imagePrompt": "Image URL",
   "richTextEditor.placeholder": "Start writing\u2026",
-  "form.imageUrlFallback": "\u2026or paste an image address"
+  "form.imageUrlFallback": "\u2026or paste an image address",
+  "mermaid.unrenderable": "This diagram could not be displayed. Its source is shown below."
 };
 
 // hooks/useTranslate.ts
@@ -54909,7 +55732,7 @@ var I18nContext = createContext({
 });
 I18nContext.displayName = "I18nContext";
 var I18nProvider = I18nContext.Provider;
-function useTranslate116() {
+function useTranslate117() {
   return useContext(I18nContext);
 }
 function createTranslate(messages) {
@@ -55095,4 +55918,4 @@ function useGitHubBranches(owner, repo, enabled = true) {
   });
 }
 
-export { ALL_PRESETS, ALMADAR_DND_MIME, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, ArticleSection, Aside, AssetPicker, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, CTABanner, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CaseStudyCard, CaseStudyOrganism, Center, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, Coachmark, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommandPalette, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ContentSection, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTIONS, DEFAULT_MATRIX_COLUMNS, DEFAULT_SLOTS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmojiPicker, EmptyState, EntityDisplayEvents, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, FloatingToolbar, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, HStack, Header, HealthBar, HeroOrganism, HeroSection, I18nProvider, IDENTITY_BOOK_FIELDS, Icon, IconPicker, ImportPreviewTree, ImportProgress, ImportSourcePicker, InfiniteScrollSentinel, Input, InputGroup, InstallBox, JazariStateMachine, JsonTreeEditor, Label, LandingPageTemplate, LawReferenceTooltip, LearningCanvas, LearningScene3D, Lightbox, LikertScale, LineChart2 as LineChart, List3 as List, LoadingState, MapView, MarkdownContent, MarketingFooter, MarketingStatCard, MasterDetail, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NodeSlotEditor, NotifyListener, NumberStepper, OnboardingSpotlight, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, PageTransition, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, Presence, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PropertyInspector, PullQuote, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichTextEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, ServiceCatalog, SharedEntityStoreContext, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, SplitSection, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StepFlow, StepFlowOrganism, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagCloud, TagInput, TeamCard, TeamOrganism, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitFrame, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UploadDropZone, VStack, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, arrowBetween, billboardLabel, boardEntity, bool, calculateAttackTargets, calculateValidMoves, cn, createInitialGameState, createSharedEntityStore, createTranslate, createUnitAnimationState, cylinderBetween, get3DClickPayload, getCurrentFrame, getTileDimensions, inferDirection, isoToScreen, makeAsset, makeAssetMap, mapBookData, meshSphere, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, parseLessonSegments, parseMarkdownWithCodeBlocks, parseQueryBinding, pendulum, projectileMotion, registerCodeLanguageLoader, renderPatternValue, resolveFieldMap, resolveFrame, resolveSheetDirection, rows, runTickFrame, sanitizeRichHtml, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAgentChat, useAnchorRect, useAtlasSliceDataUrl, useAuthContext, useCamera, useCanvasGestures, useCompile, useConnectGitHub, useDeepAgentGeneration, useDisconnectGitHub, useDragReorder, useDraggable, useDropZone, useEmitEvent, useEventBus, useEventListener, useExtensions, useFileEditor, useFileSystem, useGameAudio, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useImageCache, useInfiniteScroll, useLongPress, useMediaQuery, useOrbitalHistory, usePresence, usePreview, usePullToRefresh, useQuerySingleton, useRenderInterpolation, useSharedEntitySnapshot, useSharedEntityStore, useSharedEntityStoreContext, useSwipeGesture, useTapReveal, useTraitListens, useTranslate116 as useTranslate, useUIEvents, useUISlotManager, useUnitSpriteAtlas, useValidation, vec2 };
+export { ALL_PRESETS, ALMADAR_DND_MIME, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, ArticleSection, Aside, AssetPicker, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, CTABanner, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CaseStudyCard, CaseStudyOrganism, Center, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, Coachmark, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommandPalette, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ContentSection, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTIONS, DEFAULT_MATRIX_COLUMNS, DEFAULT_SLOTS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmojiPicker, EmptyState, EntityDisplayEvents, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, FloatingToolbar, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioCue, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, HStack, Header, HealthBar, HeroOrganism, HeroSection, I18nProvider, IDENTITY_BOOK_FIELDS, Icon, IconPicker, ImportPreviewTree, ImportProgress, ImportSourcePicker, InfiniteScrollSentinel, Input, InputGroup, InstallBox, JazariStateMachine, JsonTreeEditor, Label, LandingPageTemplate, LawReferenceTooltip, LearningCanvas, LearningScene3D, Lightbox, LikertScale, LineChart2 as LineChart, List3 as List, LoadingState, MapView, MarkdownContent, MarketingFooter, MarketingStatCard, MasterDetail, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NodeSlotEditor, NotifyListener, NumberStepper, OnboardingSpotlight, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, PageTransition, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, Presence, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PropertyInspector, PullQuote, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichTextEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, ServiceCatalog, SharedEntityStoreContext, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, SplitSection, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StepFlow, StepFlowOrganism, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagCloud, TagInput, TeamCard, TeamOrganism, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitFrame, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UploadDropZone, VStack, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, arrowBetween, billboardLabel, boardEntity, bool, calculateAttackTargets, calculateValidMoves, cn, createInitialGameState, createSharedEntityStore, createTranslate, createUnitAnimationState, cylinderBetween, dispatchCommandPaletteCommand, get3DClickPayload, getCurrentFrame, getTileDimensions, inferDirection, isoToScreen, makeAsset, makeAssetMap, mapBookData, meshSphere, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, parseLessonSegments, parseMarkdownWithCodeBlocks, parseQueryBinding, pendulum, projectileMotion, registerCodeLanguageLoader, renderPatternValue, resolveFieldMap, resolveFrame, resolveSheetDirection, rows, runTickFrame, sanitizeRichHtml, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAgentChat, useAnchorRect, useAtlasSliceDataUrl, useAuthContext, useCamera, useCanvasGestures, useCompile, useConnectGitHub, useDeepAgentGeneration, useDisconnectGitHub, useDragReorder, useDraggable, useDropZone, useEmitEvent, useEventBus, useEventListener, useExtensions, useFileEditor, useFileSystem, useGameAudio, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useImageCache, useInfiniteScroll, useKeyboardRouter, useLongPress, useMediaQuery, useOrbitalHistory, usePresence, usePreview, usePullToRefresh, useQuerySingleton, useRenderInterpolation, useSharedEntitySnapshot, useSharedEntityStore, useSharedEntityStoreContext, useSwipeGesture, useTapReveal, useTraitListens, useTranslate117 as useTranslate, useUIEvents, useUISlotManager, useUnitSpriteAtlas, useValidation, vec2 };