@almadar/shell-web 1.1.0 → 1.2.1

package/dist/{chunk-MS4K3K2R.js → chunk-TAEOMNDK.js}

@@ -1,23 +1,23 @@
-import { FileTree } from './chunk-57DC34LY.js';
-import { AvlStateMachine, metricsFor, BODY_CHAR, MARGIN, PILL_H, MAX_SCALE, MIN_SCALE } from './chunk-4YJ53G7S.js';
-import { AvlGlyph, AvlEvent, AvlGuard } from './chunk-AGVSO4WY.js';
-import { AvlState, AvlFieldType } from './chunk-7N6ZPHQ5.js';
-import { stateMachinePlayback, Accordion, tracePlayback, describedTransitionLines } from './chunk-REXYVBUO.js';
-import { EmptyState } from './chunk-AGXD77SL.js';
-import { useContainerWidth, computeOrbitalLayout, edgePath, roundedEdgePath, loopKey, LOOP_LINE } from './chunk-M74BCDBQ.js';
+import { FileTree } from './chunk-AL2XXMYR.js';
+import { AvlStateMachine, metricsFor, BODY_CHAR, MARGIN, PILL_H, MAX_SCALE, MIN_SCALE } from './chunk-RDPELAFQ.js';
+import { AvlGlyph, AvlEvent, AvlGuard } from './chunk-CCO2ZH7F.js';
+import { AvlState, AvlFieldType } from './chunk-DPDKBY6Z.js';
+import { stateMachinePlayback, Accordion, tracePlayback, describedTransitionLines } from './chunk-3DA36FOA.js';
+import { EmptyState } from './chunk-3YUMGEEW.js';
+import { useContainerWidth, loopKey, computeOrbitalLayout, edgePath, roundedEdgePath, LOOP_LINE } from './chunk-HA2BYO5E.js';
 import { parseTraitLevel, traitLevelFromDescription, programTraits, traitLevelFromTrait, traitEventWires } from './chunk-PCR37T3U.js';
-import { Tooltip, Popover, getOrCreatePortalRoot, ThemedPortal } from './chunk-PRLHKBXG.js';
-import { CONNECTION_COLORS, avlTint, STATE_COLORS, avlSeries, parseComputedColor, resolveThemeColor, THEME_SERIES, AVL_INK, AVL_FONT, AVL_STROKE, getStateRole, effectCategoryOf, EFFECT_CATEGORY_COLORS, AvlEffect } from './chunk-FAKU5F62.js';
-import { computeLineDiff, isEditorMotion, applyMotion, isEditorOperator, motionRange, applyOperator, isEditableTarget, verifierAttached, registerCheck, bindEventBus, bindTraitStateGetter, recordTransition, registerTrait, registerTraitSnapshot, unregisterTrait, recordingTransport, recordServerResponse, serverEffectTraces, asEnterAnimation, slotPlaysDefaultEnter, useSlotEnterRestart, ENTER_SLOT_CLASS, enterClassName, getNestedValue, parseLessonSegments, isDebugEnabled2, onDebugToggle, debugGroup, debug, debugGroupEnd, resolveImageUrl, isDebugEnabled, parseContentSegments, bindCanvasCapture, bindLastDrawables, parseMarkdownWithCodeBlocks, subscribeToTraitChanges, subscribeToTickChanges, subscribeToGuardChanges, subscribeToDebugEvents, subscribeToVerification, getEntitySnapshot, profilerOnRender, updateAssetStatus, getSummary, getBridgeHealth, getTransitions, getAllChecks, getDebugEvents, getGuardHistory, getAllTicks, getAllTraits, keyMapCode, resolveKeyMapEvent } from './chunk-2WGR4TDJ.js';
+import { Tooltip, Popover, getOrCreatePortalRoot, ThemedPortal } from './chunk-V5SVGUYN.js';
+import { CONNECTION_COLORS, avlTint, STATE_COLORS, avlSeries, parseComputedColor, resolveThemeColor, THEME_SERIES, AVL_INK, AVL_FONT, AVL_STROKE, getStateRole, effectCategoryOf, EFFECT_CATEGORY_COLORS, AvlEffect } from './chunk-3UQNFRYV.js';
+import { computeLineDiff, isEditorMotion, applyMotion, isEditorOperator, motionRange, applyOperator, isEditableTarget, verifierAttached, registerCheck, bindEventBus, bindTraitStateGetter, recordTransition, registerTrait, registerTraitSnapshot, unregisterTrait, recordingTransport, recordServerResponse, serverEffectTraces, asEnterAnimation, slotPlaysDefaultEnter, useSlotEnterRestart, ENTER_SLOT_CLASS, enterClassName, getNestedValue, isDebugEnabled2, onDebugToggle, debugGroup, debug, debugGroupEnd, resolveImageUrl, isDebugEnabled, parseContentSegments, bindCanvasCapture, bindLastDrawables, subscribeToTraitChanges, subscribeToTickChanges, subscribeToGuardChanges, subscribeToDebugEvents, subscribeToVerification, getEntitySnapshot, profilerOnRender, updateAssetStatus, getSummary, getBridgeHealth, getTransitions, getAllChecks, getDebugEvents, getGuardHistory, getAllTicks, getAllTraits, keyMapCode, resolveKeyMapEvent } from './chunk-LKL5RULQ.js';
 import { registerHostSignOut, registerHostSignIn, registerHostConsent, local_store_transport_exports, collectEmbeddedTraits, openBrowserStore, browserStoreName, persistedMemory, openLocalKernel, nativeMemoryPersistence, createResidenceTransport, answerHostAsk, wrapCallbackForEvent, perfStart, perfEnd, registerHostAudio } from './chunk-ZDRDJKYB.js';
-import { useEditorFocus, keyChord, usePageHead, EditorFocusProvider, claimDispatch, useDragReorder, useQuerySingleton, usePullToRefresh, useCanvasGestures, useAuthContext, useSwipeGesture, useLongPress } from './chunk-PRXQGGCO.js';
-import { useArbitraryClassStyles, CurrentPagePathProvider, UISlotProvider, OrbitalThemeProvider, spacingTokenOf, positionOf, withPosition, snapToSpacingStep, defaultSpacingStepPx, spacingOf, withSizing, withSpacing, layoutOf, withLayout, useUISlots, sizingOf, useCurrentPagePath, useUser, DESIGN_COLOR_TOKENS, DESIGN_RADIUS_TOKENS, DESIGN_SPACING_SCALE, sizeLimitOf, withSizeLimit, isArbitraryClass, tokenOfDesignClass } from './chunk-AE7VCQB6.js';
-import { ALL_SLOTS } from './chunk-YHMRX6YA.js';
-import { useTranslate, Box, useEventBus, useScopedMode, useMediaQuery, HStack, Typography, cn, Card, Icon, Badge, Button, domPassthrough, Textarea, TextHighlight, Radio, Label, useEventListener, VStack, Spinner, useTheme, useThemeScope, useContentSurface, Select, getAllPages, matchPathAmong, NavStackProvider, usePrefersReducedMotion, useNavStack, ThemeProvider, INLINE_TEXT_ATTR, Input, EventBusProvider, registryKeyMode, ThemeScopeContext, usePendingScopeValue, PendingScopeContext, isMotionEnabled, useRenderI18n, useScopeHasPending, TraitScopeProvider, beginPending, endPending, useDialogBehavior, usePresence, Overlay, SurfaceBoundary, Dialog, useTraitScope, VideoEmbed, TypewriterText, TrendIndicator, TimeSlotCell, ThemeToggle, Switch, SvgStack, SvgShield, SvgRing, SvgPulse, SvgNode, SvgMorph, SvgMesh, SvgLobe, SvgGrid, SvgFlow, SvgConnection, SvgBranch, StatusDot, Stack, Sparkline, SectionHeader, RangeSlider, ProgressBar, Presence, PatternTile, LawReferenceTooltip, InfiniteScrollSentinel, Image as Image$1, GameIcon, FlipContainer, FilterPill, DayCell, ConfettiEffect, ConditionalWrapper, Checkbox, Center, Avatar, AtlasPanel, AtlasImage, Aside, AnimatedReveal, AnimatedGraphic, evaluateBindings, pressableProps, useFormatContext, formatValue, Divider, resolveIcon, Spacer, CONFETTI_BURST_KEYFRAMES, usePendingAction, guardsHold, toDateTimeInputValue, toDateInputValue, sortRows, STRETCHED_CONTROL, rowOpenControlProps, formatDate, STRETCHED_ABOVE, isAtlasAsset, getAtlas, resolveAssetSource, blit, followHref, usePendingRows, useTraitScopeChain, motionTiming, layoutScale, getTraitPresence, useTapReveal, getTileDimensions, fxHash01, createConfettiParticles, evaluateBinding, atlasUrlOf, atlasFailed, isSpriteSheetAtlas, subRectFor, boxesOf } from './chunk-4YXBKHHM.js';
-import { isNotificationSlot, isPortalSlot } from './chunk-P4ZFUQFF.js';
-import * as React51 from 'react';
-import React51__default, { createContext, useMemo, useState, useCallback, useRef, useEffect, useLayoutEffect, lazy, useId, useContext, useSyncExternalStore, Suspense, useReducer, Profiler } from 'react';
-import { DIAGRAM_TONES, FieldTagSchema, EFFECT_OPERATORS, LOADING_STATE_MARKER, notFoundPage, isHostSignInRoute, localeAlternates, hasKernelEvaluator, DIAGRAM_TONE_COLOR_KEYS, DIAGRAM_TEXT_SIZES, orbitalInlineEntities, storesRowsInBrowser, isInlineTrait, isPageReference, navigatePatternPath, isAriaRole, toPayloadValue, installKernelEvaluator, mintUlid, TRAIT_MOUNT_ERROR_TESTID, inlineTraitRefs, AwaitRenderSchema, isRowSetMarker, isRenderBindingMarker, actionTestId, PATTERN_PROP_TYPE_ERROR_TESTID, kernelEvaluator, toWireValue, KernelEvalError, isSExpr, containsEntityBinding, RENDER_BINDING_MARKER, isEventPayloadValue, FORM_PATTERN, ACTION_OVERFLOW_TESTID, quoteExpr, isJsonObject, ANONYMOUS_USER, answerToMutations, isFileValue, isTypeVariable } from '@almadar/core';
+import { useEditorFocus, keyChord, usePageHead, EditorFocusProvider, claimDispatch, useDragReorder, useQuerySingleton, usePullToRefresh, useCanvasGestures, useAuthContext, useSwipeGesture, useLongPress } from './chunk-S3LS3B7N.js';
+import { useArbitraryClassStyles, CurrentPagePathProvider, UISlotProvider, OrbitalThemeProvider, spacingTokenOf, positionOf, withPosition, snapToSpacingStep, defaultSpacingStepPx, spacingOf, withSizing, withSpacing, layoutOf, withLayout, useUISlots, sizingOf, useCurrentPagePath, useUser, DESIGN_COLOR_TOKENS, DESIGN_RADIUS_TOKENS, DESIGN_SPACING_SCALE, sizeLimitOf, withSizeLimit, isArbitraryClass, tokenOfDesignClass } from './chunk-2LNXLMK3.js';
+import { ALL_SLOTS } from './chunk-ANTJUQRD.js';
+import { useTranslate, Box, useEventBus, useScopedMode, useMediaQuery, HStack, Typography, cn, Card, Icon, Badge, Button, domPassthrough, Textarea, TextHighlight, Radio, Label, useEventListener, VStack, Spinner, useTheme, useThemeScope, useContentSurface, Select, getAllPages, matchPathAmong, NavStackProvider, usePrefersReducedMotion, useNavStack, ThemeProvider, INLINE_TEXT_ATTR, Input, EventBusProvider, registryKeyMode, ThemeScopeContext, usePendingScopeValue, PendingScopeContext, isMotionEnabled, useRenderI18n, useScopeHasPending, beginPending, endPending, TraitScopeProvider, useDialogBehavior, usePresence, Overlay, SurfaceBoundary, Dialog, useTraitScope, evaluateBindings, VideoEmbed, TypewriterText, TrendIndicator, TimeSlotCell, ThemeToggle, Switch, SvgStack, SvgShield, SvgRing, SvgPulse, SvgNode, SvgMorph, SvgMesh, SvgLobe, SvgGrid, SvgFlow, SvgConnection, SvgBranch, StatusDot, Stack, Sparkline, SectionHeader, RangeSlider, ProgressBar, Presence, PatternTile, LawReferenceTooltip, InfiniteScrollSentinel, Image as Image$1, GameIcon, FlipContainer, FilterPill, DayCell, ConfettiEffect, ConditionalWrapper, Checkbox, Center, Avatar, AtlasPanel, AtlasImage, Aside, AnimatedReveal, AnimatedGraphic, pressableProps, useFormatContext, formatValue, Divider, resolveIcon, Spacer, resolveColorToken, CONFETTI_BURST_KEYFRAMES, usePendingAction, guardsHold, toDateTimeInputValue, toDateInputValue, sortRows, STRETCHED_CONTROL, rowOpenControlProps, formatDate, STRETCHED_ABOVE, isAtlasAsset, getAtlas, resolveAssetSource, blit, followHref, usePendingRows, useTraitScopeChain, motionTiming, layoutScale, getTraitPresence, useTapReveal, getTileDimensions, fxHash01, createConfettiParticles, evaluateBinding, atlasUrlOf, atlasFailed, isSpriteSheetAtlas, subRectFor, boxesOf } from './chunk-D5FJU4XC.js';
+import { paintsInTraitFrame, isPortalSlot, isNotificationSlot } from './chunk-AZ74UPG6.js';
+import * as React52 from 'react';
+import React52__default, { createContext, useMemo, useState, useCallback, useRef, useEffect, useLayoutEffect, lazy, useId, useContext, useSyncExternalStore, Suspense, useReducer, Profiler } from 'react';
+import { DIAGRAM_TONES, TRACE_ACTIVITY_TYPES, FieldTagSchema, EFFECT_OPERATORS, LOADING_STATE_MARKER, notFoundPage, isHostSignInRoute, localeAlternates, hasKernelEvaluator, DIAGRAM_TONE_COLOR_KEYS, DIAGRAM_TEXT_SIZES, orbitalInlineEntities, storesRowsInBrowser, isInlineTrait, isPageReference, navigatePatternPath, isAriaRole, toPayloadValue, installKernelEvaluator, mintUlid, TRAIT_MOUNT_ERROR_TESTID, inlineTraitRefs, AwaitRenderSchema, isRenderBindingMarker, isRowSetMarker, actionTestId, PATTERN_PROP_TYPE_ERROR_TESTID, isSExpr, kernelEvaluator, toWireValue, KernelEvalError, containsEntityBinding, RENDER_BINDING_MARKER, isEventPayloadValue, quoteExpr, FORM_PATTERN, ACTION_OVERFLOW_TESTID, isJsonObject, ANONYMOUS_USER, answerToMutations, isFileValue, isTypeVariable } from '@almadar/core';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Code, FileText, WrapText, Check, Copy, ChevronLeft, ChevronRight, AlertCircle, Circle, Clock, CheckCircle2, TrendingUp, TrendingDown, Minus, Eraser, X, Search, Bold, Italic, Underline, Strikethrough, Heading1, Heading2, Heading3, List, ListOrdered, Quote, Link, Image as Image$2, PauseCircle, HelpCircle, Upload, ZoomIn, Menu as Menu$1, ZoomOut, RotateCcw, DollarSign, Download, Printer, ArrowLeft, Link2, AlertTriangle, Trash2, Play, Terminal, CheckCircle, XCircle, ChevronUp, ChevronDown, GitBranch, Pencil, Eye, Plus, Lightbulb, ArrowRight, Trash } from 'lucide-react';
 import { translateLolo, translateOrb, ORB_COLORS, installNativeLanguages } from '@almadar/syntax';
@@ -37,8 +37,8 @@ import { forceSimulation, forceLink, forceManyBody, forceCollide, forceX, forceY
 import { isKnownStdOperator } from '@almadar/std/registry';
 import { createPortal } from 'react-dom';
 import { TraitMountError } from '@almadar/shell-runtime/client/trait-mount-error';
+import { createHttpTransport, TransportStatusError } from '@almadar/shell-runtime/client/EventTransport';
 import { createMemoryCircuitStore } from '@almadar/shell-runtime/client/circuit-store';
-import { createHttpTransport } from '@almadar/shell-runtime/client/EventTransport';
 import { loadLazyPage } from '@almadar/shell-runtime';
 
 var Tabs = ({
@@ -1005,6 +1005,348 @@ var SelectionAnnotator = ({
   );
 };
 SelectionAnnotator.displayName = "SelectionAnnotator";
+var FONT = 'ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Mono", "Courier New", monospace';
+var LINE_PX = 19.5;
+var PROBE = "0000000000";
+var SYNTAX_TONES = {
+  keyword: "var(--color-primary)",
+  string: "var(--color-success)",
+  comment: "var(--color-muted-foreground)",
+  number: "var(--color-warning)",
+  type: "var(--color-accent)",
+  function: "var(--color-info)",
+  operator: "var(--color-foreground)",
+  punctuation: "var(--color-muted-foreground)",
+  variable: "var(--color-foreground)"
+};
+var tint = (token, percent) => `color-mix(in srgb, var(${token}) ${percent}%, transparent)`;
+var ANNOTATION_TONES = {
+  search: tint("--color-warning", 40),
+  review: tint("--color-primary", 22),
+  "review-recent": tint("--color-accent", 35),
+  error: tint("--color-error", 25),
+  warning: tint("--color-warning", 25),
+  info: tint("--color-info", 22)
+};
+var SELECTION_BG = tint("--color-primary", 35);
+var caretStyle = (caret) => {
+  if (caret === "bar") return { boxShadow: "inset 2px 0 0 var(--color-foreground)" };
+  if (caret === "underline") return { boxShadow: "inset 0 -2px 0 var(--color-foreground)" };
+  return { backgroundColor: "var(--color-foreground)", color: "var(--color-background)" };
+};
+var before = (aRow, aCol, bRow, bCol) => aRow < bRow || aRow === bRow && aCol <= bCol;
+function runsOf(row, chars, decorations, selection, cursor, caret) {
+  const len = chars.length;
+  const cells = chars.map((ch) => ({ ch, tones: [], selected: false }));
+  const eol = { ch: " ", tones: [], selected: false };
+  const cellAt = (i) => cells[i] ?? eol;
+  for (const d of decorations) {
+    const start = row === d.fromRow ? d.fromCol : 0;
+    const end = row === d.toRow ? d.toCol : len;
+    for (let i = Math.max(0, start); i < Math.min(len, end); i++) {
+      const cell = cells[i];
+      cell.tones.push(d.tone);
+      const fg = SYNTAX_TONES[d.tone];
+      const bg = ANNOTATION_TONES[d.tone];
+      if (fg !== void 0) cell.fg = fg;
+      if (bg !== void 0) cell.bg = bg;
+      if (d.label !== void 0) cell.label = d.label;
+    }
+  }
+  let lineSelected = false;
+  if (selection !== null) {
+    const fromFirst = before(selection.fromRow, selection.fromCol, selection.toRow, selection.toCol);
+    const minRow = fromFirst ? selection.fromRow : selection.toRow;
+    const minCol = fromFirst ? selection.fromCol : selection.toCol;
+    const maxRow = fromFirst ? selection.toRow : selection.fromRow;
+    const maxCol = fromFirst ? selection.toCol : selection.fromCol;
+    if (row >= minRow && row <= maxRow) {
+      if (selection.linewise) {
+        lineSelected = true;
+        for (const cell of cells) cell.selected = true;
+        if (len === 0) eol.selected = true;
+      } else {
+        const start = row === minRow ? minCol : 0;
+        const end = row === maxRow ? maxCol : len;
+        for (let i = Math.max(0, start); i <= end && i <= len; i++) cellAt(i).selected = true;
+      }
+    }
+  }
+  if (row === cursor.row) cellAt(Math.min(cursor.col, len)).caret = caret;
+  const shown = [...cells];
+  if (eol.selected || eol.caret !== void 0) shown.push(eol);
+  const runs = [];
+  const keyOf = (c) => `${c.fg ?? ""}|${c.bg ?? ""}|${c.tones.join(" ")}|${c.label ?? ""}|${c.selected}`;
+  for (const cell of shown) {
+    const last = runs[runs.length - 1];
+    if (last !== void 0 && cell.caret === void 0 && last.cell.caret === void 0 && keyOf(last.cell) === keyOf(cell)) {
+      last.text += cell.ch;
+    } else {
+      runs.push({ text: cell.ch, cell });
+    }
+  }
+  return { runs, lineSelected };
+}
+function BufferCodeBlock({
+  code: rawCode,
+  maxHeight = "60vh",
+  className,
+  editorId,
+  onEditorFocus = "EDITOR_FOCUS",
+  onEditorBlur = "EDITOR_BLUR",
+  onKey,
+  onPointerDown,
+  onHover,
+  cursor,
+  caret = "block",
+  selection = null,
+  decorations,
+  popover = null,
+  lineNumbers,
+  relativeLineNumbers = false
+}) {
+  const eventBus = useEventBus();
+  const editorFocus = useEditorFocus();
+  const surfaceRef = useRef(null);
+  const scrollRef = useRef(null);
+  const linesRef = useRef(null);
+  const probeRef = useRef(null);
+  const popoverRef = useRef(null);
+  const hoverCell = useRef("");
+  const [flipped, setFlipped] = useState(false);
+  const text = typeof rawCode === "string" ? rawCode : String(rawCode ?? "");
+  const lines = useMemo(() => text.split("\n").map((line2) => Array.from(line2)), [text]);
+  const byRow = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const d of decorations ?? []) {
+      for (let r = d.fromRow; r <= d.toRow; r++) {
+        const held = map.get(r);
+        if (held) held.push(d);
+        else map.set(r, [d]);
+      }
+    }
+    return map;
+  }, [decorations]);
+  const showGutter = lineNumbers !== false;
+  const gutterChars = String(lines.length).length;
+  const noDecorations = [];
+  const charWidth = useCallback(() => {
+    const probe = probeRef.current;
+    return probe ? probe.getBoundingClientRect().width / PROBE.length : 0;
+  }, []);
+  useLayoutEffect(() => {
+    const scroller = scrollRef.current;
+    if (!scroller) return;
+    const top = cursor.row * LINE_PX;
+    const height = scroller.clientHeight;
+    if (top < scroller.scrollTop) scroller.scrollTop = top;
+    else if (height > 0 && top + LINE_PX > scroller.scrollTop + height) scroller.scrollTop = top + LINE_PX - height;
+    const cw = charWidth();
+    const width = scroller.clientWidth;
+    if (cw > 0 && width > 0) {
+      const left = cursor.col * cw;
+      if (left < scroller.scrollLeft) scroller.scrollLeft = left;
+      else if (left + cw > scroller.scrollLeft + width) scroller.scrollLeft = left + cw - width;
+    }
+  }, [cursor.row, cursor.col, charWidth]);
+  useLayoutEffect(() => {
+    const scroller = scrollRef.current;
+    const note = popoverRef.current;
+    if (!popover || !scroller || !note) {
+      setFlipped(false);
+      return;
+    }
+    const height = note.offsetHeight;
+    const below = (popover.fromRow + 1) * LINE_PX;
+    const noRoomBelow = scroller.clientHeight > 0 && below + height > scroller.scrollTop + scroller.clientHeight;
+    const roomAbove = popover.fromRow * LINE_PX - height >= scroller.scrollTop;
+    setFlipped(noRoomBelow && roomAbove);
+  }, [popover]);
+  const cellOf = (e) => {
+    const surface = linesRef.current;
+    const rect = surface ? surface.getBoundingClientRect() : { left: 0, top: 0 };
+    const last = lines.length - 1;
+    const hit = e.target instanceof Element ? e.target.closest("[data-row]") : null;
+    const hitRow = hit ? Number(hit.getAttribute("data-row")) : NaN;
+    const row = Number.isNaN(hitRow) ? Math.min(last, Math.max(0, Math.floor((e.clientY - rect.top) / LINE_PX))) : hitRow;
+    const cw = charWidth();
+    const len = lines[row]?.length ?? 0;
+    const col = cw > 0 ? Math.min(len, Math.max(0, Math.floor((e.clientX - rect.left) / cw))) : 0;
+    return { row, col };
+  };
+  const handleKeyDown = (e) => {
+    if (e.nativeEvent.isComposing || e.key === "Process") return;
+    e.preventDefault();
+    if (onKey && editorId) {
+      eventBus.emit(`UI:${onKey}`, {
+        editorId,
+        key: e.key,
+        code: e.code,
+        ctrl: e.ctrlKey,
+        alt: e.altKey,
+        shift: e.shiftKey,
+        meta: e.metaKey,
+        repeat: e.repeat
+      });
+    }
+  };
+  const handlePointerDown = (e) => {
+    e.preventDefault();
+    surfaceRef.current?.focus();
+    if (onPointerDown && editorId) eventBus.emit(`UI:${onPointerDown}`, { editorId, ...cellOf(e) });
+  };
+  const handlePointerMove = (e) => {
+    const cell = cellOf(e);
+    const key = `${cell.row}:${cell.col}`;
+    if (key === hoverCell.current) return;
+    hoverCell.current = key;
+    if (onHover && editorId) eventBus.emit(`UI:${onHover}`, { editorId, ...cell });
+  };
+  const gutterNumber = (row) => relativeLineNumbers && row !== cursor.row ? Math.abs(row - cursor.row) : row + 1;
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ref: surfaceRef,
+      "data-buffer": "",
+      role: "textbox",
+      "aria-multiline": "true",
+      "aria-readonly": "true",
+      tabIndex: 0,
+      className,
+      onKeyDown: handleKeyDown,
+      onPointerDown: handlePointerDown,
+      onPointerMove: handlePointerMove,
+      onPointerLeave: () => {
+        hoverCell.current = "";
+      },
+      onFocus: () => {
+        if (!editorId) return;
+        editorFocus.focus(editorId);
+        eventBus.emit(`UI:${onEditorFocus}`, { editorId });
+      },
+      onBlur: () => {
+        if (!editorId) return;
+        editorFocus.blur(editorId);
+        eventBus.emit(`UI:${onEditorBlur}`, { editorId });
+      },
+      style: {
+        outline: "none",
+        backgroundColor: "var(--color-surface-subtle)",
+        color: "var(--color-foreground)",
+        fontFamily: FONT,
+        fontSize: "13px",
+        lineHeight: `${LINE_PX}px`,
+        cursor: "text",
+        userSelect: "none"
+      },
+      children: /* @__PURE__ */ jsxs(Box, { ref: scrollRef, "data-buffer-scroll": "", style: { display: "flex", overflow: "auto", maxHeight, position: "relative" }, children: [
+        showGutter && /* @__PURE__ */ jsx(
+          Box,
+          {
+            "aria-hidden": "true",
+            style: {
+              position: "sticky",
+              left: 0,
+              flexShrink: 0,
+              zIndex: 1,
+              boxSizing: "content-box",
+              width: `${gutterChars}ch`,
+              padding: "0 1ch",
+              textAlign: "right",
+              backgroundColor: "var(--color-surface-subtle)",
+              color: "var(--color-muted-foreground)",
+              fontVariantNumeric: "tabular-nums"
+            },
+            children: lines.map((_, row) => /* @__PURE__ */ jsx(
+              Box,
+              {
+                "data-gutter": "",
+                style: { height: LINE_PX, color: row === cursor.row ? "var(--color-foreground)" : void 0 },
+                children: gutterNumber(row)
+              },
+              row
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsxs(Box, { ref: linesRef, style: { position: "relative", flexGrow: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx(
+            Box,
+            {
+              as: "span",
+              ref: probeRef,
+              "aria-hidden": "true",
+              "data-probe": "",
+              style: { position: "absolute", visibility: "hidden", whiteSpace: "pre", pointerEvents: "none" },
+              children: PROBE
+            }
+          ),
+          lines.map((chars, row) => {
+            const { runs, lineSelected } = runsOf(row, chars, byRow.get(row) ?? noDecorations, selection, cursor, caret);
+            return /* @__PURE__ */ jsx(
+              Box,
+              {
+                "data-row": row,
+                ...lineSelected ? { "data-selected-line": "" } : {},
+                style: { height: LINE_PX, whiteSpace: "pre", minWidth: "max-content" },
+                children: runs.map((run, i) => /* @__PURE__ */ jsx(
+                  Box,
+                  {
+                    as: "span",
+                    ...run.cell.caret !== void 0 ? { "data-caret": run.cell.caret } : {},
+                    ...run.cell.selected ? { "data-selected": "" } : {},
+                    ...run.cell.tones.length > 0 ? { "data-tone": run.cell.tones.join(" ") } : {},
+                    ...run.cell.label !== void 0 ? { role: "group", "aria-label": run.cell.label } : {},
+                    style: {
+                      ...run.cell.fg !== void 0 ? { color: run.cell.fg } : {},
+                      ...run.cell.bg !== void 0 ? { backgroundColor: run.cell.bg } : {},
+                      ...run.cell.selected ? { backgroundColor: SELECTION_BG } : {},
+                      ...run.cell.caret !== void 0 ? caretStyle(run.cell.caret) : {}
+                    },
+                    children: run.text
+                  },
+                  i
+                ))
+              },
+              row
+            );
+          }),
+          popover && /* @__PURE__ */ jsxs(
+            Box,
+            {
+              ref: popoverRef,
+              "data-popover": "",
+              role: "note",
+              style: {
+                position: "absolute",
+                left: `${popover.fromCol}ch`,
+                top: flipped ? popover.fromRow * LINE_PX : (popover.fromRow + 1) * LINE_PX,
+                transform: flipped ? "translateY(-100%)" : void 0,
+                zIndex: 2,
+                maxWidth: "60ch",
+                padding: "0.5rem 0.75rem",
+                whiteSpace: "normal",
+                pointerEvents: "none",
+                backgroundColor: "var(--color-card)",
+                color: "var(--color-foreground)",
+                border: "1px solid var(--color-border)",
+                borderRadius: "0.375rem",
+                boxShadow: "var(--shadow-lg)"
+              },
+              children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "label", children: popover.title }),
+                popover.sections.map((section, i) => /* @__PURE__ */ jsxs(Box, { style: { marginTop: "0.375rem" }, children: [
+                  /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "muted", children: section.heading }),
+                  section.lines.map((line2, j) => /* @__PURE__ */ jsx(Typography, { variant: "body2", children: line2 }, j))
+                ] }, i)),
+                popover.busy && /* @__PURE__ */ jsx(Box, { as: "span", "data-busy": "", role: "progressbar", "aria-busy": "true", className: "animate-pulse", style: { color: "var(--color-muted-foreground)" }, children: "\u2026" })
+              ]
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+}
 var loadedPrism;
 var prismLoad;
 var programLanguagesRegistered = false;
@@ -1447,7 +1789,7 @@ function translateProgram(source, language, lang) {
   }
   return source;
 }
-var CodeBlock = React51__default.memo(
+var ClassicCodeBlock = React52__default.memo(
   ({
     code: rawCode,
     language = "text",
@@ -2430,7 +2772,7 @@ var CodeBlock = React51__default.memo(
                         },
                         children: diagnosticUnderlines.map((seg, i) => {
                           const mark = seg.range ?? seg.marker;
-                          if (!mark) return /* @__PURE__ */ jsx(React51__default.Fragment, { children: seg.text }, i);
+                          if (!mark) return /* @__PURE__ */ jsx(React52__default.Fragment, { children: seg.text }, i);
                           return /* @__PURE__ */ jsx(
                             Box,
                             {
@@ -2725,6 +3067,10 @@ var CodeBlock = React51__default.memo(
   },
   (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.completions === next.completions && prev.assist === next.assist && prev.problems === next.problems && prev.diagnostics === next.diagnostics && prev.definitionAt === next.definitionAt && prev.onGoToDefinition === next.onGoToDefinition && prev.diagnosticsCode === next.diagnosticsCode && prev.lineNumbers === next.lineNumbers && prev.errorLines === next.errorLines && prev.highlightLines?.start === next.highlightLines?.start && prev.highlightLines?.end === next.highlightLines?.end && prev.mode === next.mode && prev.title === next.title && prev.diff === next.diff && prev.files === next.files && prev.naturalLanguages === next.naturalLanguages && 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.onKey === next.onKey && prev.motions === next.motions && prev.operators === next.operators && prev.askEvent === next.askEvent && prev.noteEvent === next.noteEvent && prev.askLabel === next.askLabel && prev.noteLabel === next.noteLabel
 );
+ClassicCodeBlock.displayName = "ClassicCodeBlock";
+var CodeBlock = React52__default.memo(
+  (props) => props.cursor !== void 0 ? /* @__PURE__ */ jsx(BufferCodeBlock, { ...props, cursor: props.cursor }) : /* @__PURE__ */ jsx(ClassicCodeBlock, { ...props })
+);
 CodeBlock.displayName = "CodeBlock";
 
 // src/lib/canvas-tools.ts
@@ -2753,7 +3099,7 @@ var CANVAS_TOOLS = [
 function hasCanvasTool(tools, tool) {
   return tools.includes(tool);
 }
-var IconButton = React51__default.forwardRef(
+var IconButton = React52__default.forwardRef(
   ({ icon, label, tooltipPosition = "right", variant = "ghost", size = "sm", className, ...rest }, ref) => {
     const touch = useMediaQuery("(hover: none)");
     const button = /* @__PURE__ */ jsx(
@@ -3615,14 +3961,14 @@ function insertionLineRect(container, children, index, axis) {
     return axis === "vertical" ? { top: container.top, left: container.left, width: container.width, height: INSERTION_LINE_PX } : { top: container.top, left: container.left, width: INSERTION_LINE_PX, height: container.height };
   }
   const clamped = Math.max(0, Math.min(index, children.length));
-  const before = children[clamped];
+  const before2 = children[clamped];
   const after = children[clamped - 1];
-  const ref = before ?? after ?? container;
+  const ref = before2 ?? after ?? container;
   if (axis === "vertical") {
-    const edge2 = before && after ? (after.top + after.height + before.top) / 2 : before ? before.top : after ? after.top + after.height : container.top;
+    const edge2 = before2 && after ? (after.top + after.height + before2.top) / 2 : before2 ? before2.top : after ? after.top + after.height : container.top;
     return { top: edge2 - half, left: ref.left, width: ref.width, height: INSERTION_LINE_PX };
   }
-  const edge = before && after ? (after.left + after.width + before.left) / 2 : before ? before.left : after ? after.left + after.width : container.left;
+  const edge = before2 && after ? (after.left + after.width + before2.left) / 2 : before2 ? before2.left : after ? after.left + after.width : container.left;
   return { top: ref.top, left: edge - half, width: INSERTION_LINE_PX, height: ref.height };
 }
 var GRID_POSITION = {
@@ -4243,7 +4589,7 @@ function EntitySchemaProvider({
   orbitalsByTrait,
   children
 }) {
-  const contextValue = React51__default.useMemo(() => ({ orbitalsByTrait }), [orbitalsByTrait]);
+  const contextValue = React52__default.useMemo(() => ({ orbitalsByTrait }), [orbitalsByTrait]);
   return /* @__PURE__ */ jsx(EntitySchemaContext.Provider, { value: contextValue, children });
 }
 function useEntitySchema() {
@@ -4286,7 +4632,7 @@ function resolveMarkerExpression(expression, entity, config, state, i18n) {
 function isPlainObject(value) {
   if (value === null || value === void 0 || typeof value !== "object") return false;
   if (Array.isArray(value)) return false;
-  if (React51__default.isValidElement(value)) return false;
+  if (React52__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   if (typeof value === "function") return false;
   return true;
@@ -4301,7 +4647,7 @@ function cachedContainer(value, scopeTrait, entity, config, state, i18n, rowSets
 var resolvedMarkerFree = /* @__PURE__ */ new WeakSet();
 var evaluatorResolvedData = /* @__PURE__ */ new WeakSet();
 function isPatternNode(value) {
-  if (value === null || typeof value !== "object" || Array.isArray(value) || React51__default.isValidElement(value) || value instanceof Date) return false;
+  if (value === null || typeof value !== "object" || Array.isArray(value) || React52__default.isValidElement(value) || value instanceof Date) return false;
   const type = value.type;
   return typeof type === "string" && getComponentForPattern(type) !== null;
 }
@@ -4312,7 +4658,7 @@ function isEvaluatorResolvedData(value) {
   return evaluatorResolvedData.has(value);
 }
 function brandResolved(value) {
-  if (value !== null && typeof value === "object" && !React51__default.isValidElement(value) && !(value instanceof Date)) {
+  if (value !== null && typeof value === "object" && !React52__default.isValidElement(value) && !(value instanceof Date)) {
     resolvedMarkerFree.add(value);
   }
 }
@@ -4355,7 +4701,7 @@ function walkValue(value, scopeTrait, entity, config, state, i18n, rowSets) {
     }
     const resolved = resolveMarkerExpression(value.expression, entity, config, state, i18n);
     markerResolutionCache.set(value, { entity, config, state, i18n, resolved });
-    if (resolved !== null && typeof resolved === "object" && !React51__default.isValidElement(resolved) && !(resolved instanceof Date)) {
+    if (resolved !== null && typeof resolved === "object" && !React52__default.isValidElement(resolved) && !(resolved instanceof Date)) {
       resolvedMarkerFree.add(resolved);
       if (!holdsRenderNode(resolved)) evaluatorResolvedData.add(resolved);
     }
@@ -4718,7 +5064,7 @@ var Drawer = ({
   const positionClasses2 = position === "right" ? "right-0 border-l" : "left-0 border-r";
   const drawerSign = position === "right" ? 1 : -1;
   const slideTransform = position === "right" ? "translateX(100%)" : "translateX(-100%)";
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
+  const layer = /* @__PURE__ */ jsxs(Fragment, { children: [
     modal && /* @__PURE__ */ jsx(
       Overlay,
       {
@@ -4793,6 +5139,7 @@ var Drawer = ({
       }
     )
   ] });
+  return contained ? layer : /* @__PURE__ */ jsx(ThemedPortal, { children: layer });
 };
 Drawer.displayName = "Drawer";
 var SplitPane = ({
@@ -5412,7 +5759,7 @@ var DefaultFallback = ({ error, onRetry }) => {
     }
   );
 };
-var ErrorBoundary = class extends React51__default.Component {
+var ErrorBoundary = class extends React52__default.Component {
   static displayName = "ErrorBoundary";
   constructor(props) {
     super(props);
@@ -5692,7 +6039,7 @@ function renderNode(node, key) {
     return /* @__PURE__ */ jsx(VStack, { gap: "lg", children: node.stack.map((child, i) => renderNode(child, i)) }, key);
   }
   const { variant, rows, columns, fields } = node.shape;
-  return /* @__PURE__ */ jsx(React51__default.Fragment, { children: renderVariant(variant, rows, columns, fields, void 0) }, key);
+  return /* @__PURE__ */ jsx(React52__default.Fragment, { children: renderVariant(variant, rows, columns, fields, void 0) }, key);
 }
 function SkeletonTree({ node, className }) {
   const { t } = useTranslate();
@@ -5742,7 +6089,7 @@ function useAwaitingSkeleton(target) {
   return "slot" in target ? source.forSlot(target.slot) : source.forTrait(target.trait);
 }
 var LazySlotContentRenderer = lazy(
-  () => import('./UISlotRenderer-PY7FIJXN.js').then((m) => ({
+  () => import('./UISlotRenderer-5OURMAP2.js').then((m) => ({
     default: m.SlotContentRenderer
   }))
 );
@@ -5995,10 +6342,10 @@ function splitFirstMatch(node, annotation) {
     if (child.type === "text" && typeof child.value === "string") {
       const at = child.value.indexOf(annotation.text);
       if (at < 0) continue;
-      const before = child.value.slice(0, at);
+      const before2 = child.value.slice(0, at);
       const after = child.value.slice(at + annotation.text.length);
       const replacement = [];
-      if (before) replacement.push({ type: "text", value: before });
+      if (before2) replacement.push({ type: "text", value: before2 });
       replacement.push({
         type: "element",
         tagName: "mark",
@@ -6229,9 +6576,14 @@ function resolveCanvasTheme(scope) {
   const r = new ScopeReader(scope);
   try {
     const tones = {};
+    const unresolvedTones = [];
     for (const tone of DIAGRAM_TONES) {
       const c = r.color(toneVar(tone));
-      tones[tone] = c ? colorCss(c) : "currentColor";
+      if (c) tones[tone] = colorCss(c);
+      else {
+        tones[tone] = "transparent";
+        unresolvedTones.push(tone);
+      }
     }
     const surface = (name) => {
       const c = r.color(name);
@@ -6250,6 +6602,7 @@ function resolveCanvasTheme(scope) {
         onPrimary: surface("--color-primary-foreground")
       },
       tones,
+      unresolvedTones,
       series: SERIES_TONES.map((t) => tones[t]),
       strokes: {
         thin: r.length("--diagram-stroke-thin", 1),
@@ -6364,11 +6717,22 @@ function useCanvasTheme(scopeRef, scopePresent = true) {
   }, [appliedTheme, scopeKey, scopeRef, scopePresent]);
   return state;
 }
-
-// src/lib/mermaidTheme.ts
 var PIE_SLOTS = 12;
+var READ_TONES = ["ink", "label", "axis", "grid", "guide", "fill", "highlight"];
+var SERIES_TONE_IDS = ["series-1", "series-2", "series-3", "series-4", "series-5", "series-6", "series-7", "series-8"];
+var UnresolvedThemeToneError = class extends Error {
+  constructor(tones) {
+    super(`diagram tones unresolved on the scope: declare ${tones.map((t) => `--color-${DIAGRAM_TONE_COLOR_KEYS[t]}`).join(", ")}`);
+    this.tones = tones;
+    this.name = "UnresolvedThemeToneError";
+  }
+  tones;
+};
 function mermaidThemeVariables(theme, mode) {
   const { tones, series } = theme;
+  const drawnSeries = SERIES_TONE_IDS.filter((_, i) => i < series.length && i < PIE_SLOTS);
+  const missing = [...READ_TONES, ...drawnSeries].filter((t) => theme.unresolvedTones.includes(t));
+  if (missing.length > 0) throw new UnresolvedThemeToneError(missing);
   const seriesAt = (i) => series[i % series.length] ?? tones.highlight;
   const vars = {
     darkMode: mode === "dark",
@@ -6420,7 +6784,7 @@ function loadMermaid() {
   mermaidModule ??= import('mermaid').then((m) => m.default);
   return mermaidModule;
 }
-var MermaidDiagram = React51__default.memo(
+var MermaidDiagram = React52__default.memo(
   ({ code, className }) => {
     const resolvedMode = useScopedMode();
     const { t } = useTranslate();
@@ -6498,7 +6862,7 @@ var urlTransform = (url, key, node) => key === "src" && node.tagName === "img" &
 var loadedKatex;
 function loadKatex() {
   if (loadedKatex !== void 0) return Promise.resolve(loadedKatex);
-  return import('./katexPlugin-NCDKOOQY.js').then((m) => {
+  return import('./katexPlugin-WGJ4JFZU.js').then((m) => {
     loadedKatex = m.rehypeKatex;
     return m.rehypeKatex;
   });
@@ -6629,7 +6993,7 @@ var STATIC_COMPONENTS = {
     );
   }
 };
-var MarkdownContent = React51__default.memo(
+var MarkdownContent = React52__default.memo(
   ({ content, direction = "ltr", askEvent, noteEvent, askLabel, noteLabel, annotations, annotationEvent, className, ...rest }) => {
     const { t: _t } = useTranslate();
     const safeContent = typeof content === "string" ? content : String(content ?? "");
@@ -6732,6 +7096,7 @@ var CHANGE_KIND_ICON = {
   "theme-changed": "palette",
   "behavior-composed": "layers"
 };
+var KNOWN_ACTIVITY_TYPES = new Set(TRACE_ACTIVITY_TYPES);
 function jumpTargetOf(activity) {
   switch (activity.type) {
     case "orbital_started":
@@ -6769,7 +7134,7 @@ function activityRowFacts(items, activityOf) {
   });
   return facts;
 }
-function describe(activity, t, facts) {
+function describe(activity, t, facts, toolLabel) {
   switch (activity.type) {
     case "message":
       return { icon: "info", color: "muted", text: activity.content, details: [] };
@@ -6777,7 +7142,7 @@ function describe(activity, t, facts) {
       return {
         icon: "wrench",
         color: "muted",
-        text: t("agentActivity.toolCall", { tool: activity.tool }),
+        text: toolLabel ?? t("agentActivity.toolCall", { tool: activity.tool }),
         details: [],
         ...activity.argsText !== "" && activity.argsText !== "{}" ? { raw: activity.argsText } : {}
       };
@@ -6785,7 +7150,7 @@ function describe(activity, t, facts) {
       return {
         icon: activity.success ? "corner-down-right" : "alert-circle",
         color: activity.success ? "muted" : "error",
-        text: t("agentActivity.toolResult", { tool: activity.tool }),
+        text: toolLabel !== void 0 ? t(activity.success ? "agentActivity.toolDone" : "agentActivity.toolFailed", { tool: toolLabel }) : t("agentActivity.toolResult", { tool: activity.tool }),
         details: [
           ...activity.detail !== void 0 ? [activity.detail] : [],
           ...activity.rows !== void 0 ? [t("agentActivity.toolRows", { count: activity.rows })] : []
@@ -6845,6 +7210,10 @@ function describe(activity, t, facts) {
       return { icon: "circle-x", color: "muted", text: activity.message || t("agentActivity.cancelled"), details: [] };
     case "llm_response":
       return { icon: "cpu", color: "muted", text: t("agentActivity.llmResponse"), details: [activity.content] };
+    default: {
+      const unhandled = activity;
+      throw new Error(`describe: unhandled activity ${JSON.stringify(unhandled)}`);
+    }
   }
 }
 function llmSummary(activity, t) {
@@ -6886,8 +7255,14 @@ function LlmResponseRow({ activity }) {
     }
   ) });
 }
-function AgentActivityRow({ activity, onJump, facts }) {
+function AgentActivityRow({ activity, onJump, facts, toolLabel }) {
   const { t } = useTranslate();
+  if (!KNOWN_ACTIVITY_TYPES.has(activity.type)) {
+    return /* @__PURE__ */ jsxs(Box, { className: "flex items-start gap-2 w-full", "data-testid": "agent-activity-unknown", children: [
+      /* @__PURE__ */ jsx(Icon, { name: "help-circle", size: "sm", color: "muted", className: "mt-0.5 shrink-0" }),
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "muted", className: "break-words", children: t("agentActivity.unknown", { kind: activity.type }) })
+    ] });
+  }
   if (activity.type === "llm_response") return /* @__PURE__ */ jsx(LlmResponseRow, { activity });
   if (activity.type === "message" && activity.role !== "system") {
     const mine = activity.role === "user";
@@ -6900,7 +7275,7 @@ function AgentActivityRow({ activity, onJump, facts }) {
       }
     );
   }
-  const spec = describe(activity, t, facts);
+  const spec = describe(activity, t, facts, toolLabel);
   const target = jumpTargetOf(activity);
   return /* @__PURE__ */ jsxs(Box, { className: "flex items-start gap-2 w-full", "data-testid": `agent-activity-${activity.type}`, children: [
     /* @__PURE__ */ jsx(Icon, { name: spec.icon, size: "sm", color: spec.color, animation: spec.animation, className: "mt-0.5 shrink-0" }),
@@ -7077,11 +7452,12 @@ function CopyReply({ text }) {
     }
   );
 }
-function StepRows({ steps }) {
-  const facts = activityRowFacts(steps, (a) => a);
-  return /* @__PURE__ */ jsx(VStack, { gap: "xs", className: "w-full", children: steps.map((step, i) => /* @__PURE__ */ jsx(AgentActivityRow, { activity: step, facts: facts[i] }, `${step.type}-${step.timestamp}-${i}`)) });
+function StepRows({ steps, labelOf }) {
+  const shown = steps.filter((step) => !(step.type === "tool_result" && step.success && labelOf(step) !== void 0));
+  const facts = activityRowFacts(shown, (a) => a);
+  return /* @__PURE__ */ jsx(VStack, { gap: "xs", className: "w-full", children: shown.map((step, i) => /* @__PURE__ */ jsx(AgentActivityRow, { activity: step, facts: facts[i], toolLabel: labelOf(step) }, `${step.type}-${step.timestamp}-${i}`)) });
 }
-function TurnSteps({ steps, showRawLlm, onToggleRaw, idPrefix, index }) {
+function TurnSteps({ steps, showRawLlm, onToggleRaw, idPrefix, index, labelOf }) {
   const { t } = useTranslate();
   const [open, setOpen] = useState(false);
   const visible = showRawLlm ? steps : steps.filter((s) => s.type !== "llm_response");
@@ -7106,12 +7482,16 @@ function TurnSteps({ steps, showRawLlm, onToggleRaw, idPrefix, index }) {
     ),
     open ? /* @__PURE__ */ jsxs(VStack, { gap: "xs", className: "w-full border-s-[length:var(--border-width)] border-[var(--color-border)] ps-3", children: [
       hasRaw ? /* @__PURE__ */ jsx(Switch, { checked: showRawLlm, onChange: onToggleRaw, label: t("agentActivity.showRawLlm"), id: `${idPrefix}-show-raw-llm-${index}` }) : null,
-      /* @__PURE__ */ jsx(StepRows, { steps: visible })
+      /* @__PURE__ */ jsx(StepRows, { steps: visible, labelOf })
     ] }) : null
   ] });
 }
-function AgentChatFeed({ activities, emptyTitle, rawLlmPreferenceKey, idPrefix, working = false, className }) {
+function AgentChatFeed({ activities, emptyTitle, rawLlmPreferenceKey, idPrefix, working = false, toolLabels, className }) {
   const { t } = useTranslate();
+  const labelOf = useMemo(() => {
+    const labels = new Map((toolLabels ?? []).map((entry) => [entry.tool, entry.label]));
+    return (activity) => activity.type === "tool_call" || activity.type === "tool_result" ? labels.get(activity.tool) : void 0;
+  }, [toolLabels]);
   const [showRawLlm, setShowRawLlm] = useState(() => readFlag(rawLlmPreferenceKey));
   const scrollerRef = useRef(null);
   const endRef = useRef(null);
@@ -7165,7 +7545,7 @@ function AgentChatFeed({ activities, emptyTitle, rawLlmPreferenceKey, idPrefix,
                 /* @__PURE__ */ jsx(AgentActivityRow, { activity: turn.request, facts: activityRowFacts([turn.request], (a) => a)[0] }),
                 /* @__PURE__ */ jsx(Time, { ts: turn.request.timestamp, align: "end" })
               ] }) : null,
-              live ? /* @__PURE__ */ jsx(StepRows, { steps: showRawLlm ? turn.steps : turn.steps.filter((s) => s.type !== "llm_response") }) : /* @__PURE__ */ jsx(TurnSteps, { steps: turn.steps, showRawLlm, onToggleRaw: handleToggle, idPrefix, index: i }),
+              live ? /* @__PURE__ */ jsx(StepRows, { steps: showRawLlm ? turn.steps : turn.steps.filter((s) => s.type !== "llm_response"), labelOf }) : /* @__PURE__ */ jsx(TurnSteps, { steps: turn.steps, showRawLlm, onToggleRaw: handleToggle, idPrefix, index: i, labelOf }),
               turn.replies.map((reply, r) => /* @__PURE__ */ jsxs(VStack, { gap: "none", className: "w-full", children: [
                 /* @__PURE__ */ jsx(AgentActivityRow, { activity: reply, facts: activityRowFacts([reply], (a) => a)[0] }),
                 /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-1 self-start", children: [
@@ -8535,6 +8915,32 @@ var BiologyCanvas = ({
     /* @__PURE__ */ jsx(OrbitalSceneCanvas, { pattern: "biology-canvas", config, width: width ?? 600, height: height ?? 400, callbacks, keyMap, keyUpMap })
   ] }) });
 };
+
+// src/lib/lessonSegmentUtils.ts
+function parseMarkdownWithCodeBlocks(content) {
+  const segments = [];
+  const codeBlockRegex = /```([^\n\r]*)\r?\n([\s\S]*?)```/g;
+  let lastIndex = 0;
+  let match;
+  while ((match = codeBlockRegex.exec(content)) !== null) {
+    const before2 = content.slice(lastIndex, match.index);
+    if (before2.trim()) {
+      segments.push({ type: "markdown", content: before2 });
+    }
+    const tokens = match[1].trim().split(/\s+/).filter(Boolean);
+    let rawLanguage = tokens[0] ?? "text";
+    const suffixRunnable = rawLanguage.endsWith("-runnable");
+    const runnable = suffixRunnable || tokens.includes("run");
+    const baseLanguage = suffixRunnable ? rawLanguage.slice(0, -"-runnable".length) || "text" : rawLanguage;
+    segments.push({ type: "code", language: baseLanguage, content: match[2].trim(), runnable });
+    lastIndex = codeBlockRegex.lastIndex;
+  }
+  const remaining = content.slice(lastIndex);
+  if (remaining.trim()) {
+    segments.push({ type: "markdown", content: remaining });
+  }
+  return segments;
+}
 var BLOOM_CONFIG = {
   remember: { color: "bg-secondary text-secondary-foreground", bgColor: "bg-muted", labelKey: "bloomQuiz.level.remember" },
   understand: { color: "bg-info text-info-foreground", bgColor: "bg-info/10", labelKey: "bloomQuiz.level.understand" },
@@ -9708,8 +10114,8 @@ function MiniMap({
   ...rest
 }) {
   const { t } = useTranslate();
-  const canvasRef = React51.useRef(null);
-  const imgCacheRef = React51.useRef(/* @__PURE__ */ new Map());
+  const canvasRef = React52.useRef(null);
+  const imgCacheRef = React52.useRef(/* @__PURE__ */ new Map());
   function loadImg(url) {
     const cached = imgCacheRef.current.get(url);
     if (cached) return cached.complete ? cached : null;
@@ -9725,7 +10131,7 @@ function MiniMap({
     imgCacheRef.current.set(url, img);
     return null;
   }
-  React51.useEffect(() => {
+  React52.useEffect(() => {
     const canvas = canvasRef.current;
     if (!canvas) return;
     const ctx = canvas.getContext("2d");
@@ -11333,14 +11739,14 @@ function Canvas2D({
   description,
   ...rest
 }) {
-  const descId = React51.useId();
+  const descId = React52.useId();
   const instanceId = useMemo(() => Math.random().toString(36).slice(2, 8), []);
   const childDrawablesRef = useRef([]);
   childDrawablesRef.current = [];
   const registerChildDrawable = useCallback((node) => {
     childDrawablesRef.current.push(node);
   }, []);
-  const hasJsxChildren = React51.Children.count(children) > 0;
+  const hasJsxChildren = React52.Children.count(children) > 0;
   function isDrawableLayer(node) {
     return node.type === "draw-sprite-layer" || node.type === "draw-shape-layer" || node.type === "draw-text-layer";
   }
@@ -11934,6 +12340,7 @@ function Canvas({
   selectEvent,
   moveEvent,
   children,
+  description,
   ...rest
 }) {
   canvasLog.debug("Canvas render", { mode, drawablesCount: drawables?.length, projection, camera: camera ? JSON.stringify(camera) : void 0 });
@@ -11948,12 +12355,13 @@ function Canvas({
     if (mode !== "3d") return;
     const next = childDrawablesRef.current;
     canvasLog.debug("children:adopt", { registered: next.length, adopted: childDrawables.length });
-    if (next.length === 0 && React51.Children.count(children) > 0) return;
+    if (next.length === 0 && React52.Children.count(children) > 0) return;
     setChildDrawables(
       (prev) => prev.length === next.length && JSON.stringify(prev) === JSON.stringify(next) ? prev : [...next]
     );
   });
   const { t } = useTranslate();
+  const descId = React52.useId();
   const config3d = useMemo(
     () => ({
       type: "canvas",
@@ -11992,7 +12400,8 @@ function Canvas({
   );
   const allDrawables = useMemo(() => [...drawables ?? [], ...childDrawables], [drawables, childDrawables]);
   if (mode === "3d") {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
+    return /* @__PURE__ */ jsxs("div", { role: "img", "aria-label": t("aria.canvasScene"), ...description ? { "aria-describedby": descId } : {}, ...domPassthrough(rest), className: "contents", children: [
+      description && /* @__PURE__ */ jsx(Box, { id: descId, className: "sr-only", children: description }),
       isLoading ? /* @__PURE__ */ jsx("div", { className: cn("game-canvas-3d game-canvas-3d--loading", className), children: /* @__PURE__ */ jsx("div", { className: "game-canvas-3d__loading", children: t("canvas3d.loadingScene") }) }) : /* @__PURE__ */ jsx(
         OrbitalCanvas3D,
         {
@@ -12010,13 +12419,14 @@ function Canvas({
           ...moveEvent !== void 0 ? { moveEvent } : {}
         }
       ),
-      React51.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 }) })
+      React52.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(
     Canvas2D,
     {
       ...domPassthrough(rest),
+      ...description !== void 0 ? { description } : {},
       className,
       drawables,
       isLoading,
@@ -13377,11 +13787,13 @@ function ChatBar({
   const focus = editFocus ?? null;
   const requestId = focusRequest?.id;
   const requestPlaceholder = focusRequest?.placeholder;
+  const requestText = focusRequest?.text;
   useEffect(() => {
     if (requestId === void 0) return;
     if (requestPlaceholder !== void 0 && requestPlaceholder.length > 0) setRequestedPlaceholder(requestPlaceholder);
+    if (requestText !== void 0) setInputValue(requestText);
     inputRef.current?.focus();
-  }, [requestId, requestPlaceholder]);
+  }, [requestId, requestPlaceholder, requestText]);
   useLayoutEffect(() => {
     const el = inputRef.current;
     if (!el) return;
@@ -14228,7 +14640,7 @@ var Container = ({
   ...rest
 }) => {
   const resolvedSize = maxWidth ?? size ?? "lg";
-  return React51__default.createElement(
+  return React52__default.createElement(
     Component,
     {
       ...domPassthrough(rest),
@@ -14514,9 +14926,9 @@ function ControlButton({
   ...rest
 }) {
   const eventBus = useEventBus();
-  const [isPressed, setIsPressed] = React51.useState(false);
+  const [isPressed, setIsPressed] = React52.useState(false);
   const actualPressed = pressed ?? isPressed;
-  const handlePointerDown = React51.useCallback(
+  const handlePointerDown = React52.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -14526,7 +14938,7 @@ function ControlButton({
     },
     [disabled, pressEvent, eventBus, onPress]
   );
-  const handlePointerUp = React51.useCallback(
+  const handlePointerUp = React52.useCallback(
     (e) => {
       e.preventDefault();
       if (disabled) return;
@@ -14536,7 +14948,7 @@ function ControlButton({
     },
     [disabled, releaseEvent, eventBus, onRelease]
   );
-  const handlePointerLeave = React51.useCallback(
+  const handlePointerLeave = React52.useCallback(
     (e) => {
       if (isPressed) {
         setIsPressed(false);
@@ -14626,18 +15038,18 @@ function ControlGrid({
   const eventBus = useEventBus();
   const { t } = useTranslate();
   const buttons = buttonsProp ?? DEFAULT_BUTTON_KEYS.map(({ labelKey, ...rest2 }) => ({ ...rest2, label: t(labelKey) }));
-  const [active, setActive] = React51.useState(/* @__PURE__ */ new Set());
-  const [coarse, setCoarse] = React51.useState(
+  const [active, setActive] = React52.useState(/* @__PURE__ */ new Set());
+  const [coarse, setCoarse] = React52.useState(
     () => typeof window !== "undefined" && window.matchMedia("(pointer: coarse)").matches
   );
-  React51.useEffect(() => {
+  React52.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 = React51.useCallback(
+  const handlePress = React52.useCallback(
     (id) => {
       setActive((prev) => new Set(prev).add(id));
       if (actionEvent) eventBus.emit(`UI:${actionEvent}`, { id, pressed: true });
@@ -14651,7 +15063,7 @@ function ControlGrid({
     },
     [kind, actionEvent, directionEvent, directionEvents, eventBus, onAction, onDirection]
   );
-  const handleRelease = React51.useCallback(
+  const handleRelease = React52.useCallback(
     (id) => {
       setActive((prev) => {
         const next = new Set(prev);
@@ -15277,7 +15689,7 @@ function SubMenu({
             ),
             children: [
               item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, size: "sm", className: cn("flex-shrink-0", isDanger && "text-error") }) : /* @__PURE__ */ jsx(Icon, { icon: item.icon, size: "sm", className: cn("flex-shrink-0", isDanger && "text-error") })),
-              /* @__PURE__ */ jsx(Typography, { variant: "small", className: "flex-1", children: item.label }),
+              /* @__PURE__ */ jsx(MenuItemText, { item }),
               item.badge !== void 0 && /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs font-medium", children: item.badge })
             ]
           },
@@ -15288,6 +15700,15 @@ function SubMenu({
   );
   return typeof document !== "undefined" ? /* @__PURE__ */ jsx(ThemedPortal, { children: panel }) : panel;
 }
+function MenuItemText({ item }) {
+  if (item.description === void 0 || item.description === "") {
+    return /* @__PURE__ */ jsx(Typography, { variant: "small", className: "flex-1", children: item.label });
+  }
+  return /* @__PURE__ */ jsxs(Box, { className: "flex flex-1 min-w-0 flex-col", children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "small", weight: "semibold", children: item.label }),
+    /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "muted", children: item.description })
+  ] });
+}
 function MenuItemRow({
   item,
   itemId,
@@ -15346,14 +15767,7 @@ function MenuItemRow({
         ),
         children: /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-3 flex-1 min-w-0", children: [
           item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, size: "sm", className: cn("flex-shrink-0", isDanger && "text-error") }) : /* @__PURE__ */ jsx(Icon, { icon: item.icon, size: "sm", className: cn("flex-shrink-0", isDanger && "text-error") })),
-          /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "small",
-              className: "flex-1",
-              children: item.label
-            }
-          ),
+          /* @__PURE__ */ jsx(MenuItemText, { item }),
           item.badge !== void 0 && /* @__PURE__ */ jsx(Badge, { variant: "default", size: "sm", children: item.badge }),
           hasSubMenu && /* @__PURE__ */ jsx(
             Icon,
@@ -15401,7 +15815,8 @@ var Menu = ({
   const [subMenuAutoFocus, setSubMenuAutoFocus] = useState(false);
   const [triggerRect, setTriggerRect] = useState(null);
   const triggerRef = useRef(null);
-  const [innerControl, setInnerControl] = useState(null);
+  const innerControlRef = useRef(null);
+  const [hasInnerControl, setHasInnerControl] = useState(false);
   const focusReturnRef = useRef(null);
   const menuRef = useRef(null);
   const menuId = useId();
@@ -15447,7 +15862,7 @@ var Menu = ({
     updatePosition();
     setIsOpen(true);
   };
-  focusReturnRef.current = innerControl ?? triggerRef.current;
+  focusReturnRef.current = innerControlRef.current ?? triggerRef.current;
   useDialogBehavior({ open: isOpen, containerRef: menuRef, onEscape: closeMenu, modal: false, returnFocusRef: focusReturnRef });
   const panelMounted = isOpen && triggerRect !== null;
   useEffect(() => {
@@ -15464,17 +15879,18 @@ var Menu = ({
     "aria-expanded": isOpen,
     ...isOpen ? { "aria-controls": menuId } : void 0
   };
-  const wrapsTrigger = !React51__default.isValidElement(trigger);
-  useLayoutEffect(() => {
-    setInnerControl(wrapsTrigger ? triggerRef.current?.querySelector(TRIGGER_CONTROL_SELECTOR) ?? null : null);
-  }, [wrapsTrigger, trigger]);
+  const wrapsTrigger = !React52__default.isValidElement(trigger);
   useLayoutEffect(() => {
-    if (!innerControl) return;
-    innerControl.setAttribute("aria-haspopup", "menu");
-    innerControl.setAttribute("aria-expanded", String(isOpen));
-    if (isOpen) innerControl.setAttribute("aria-controls", menuId);
-    else innerControl.removeAttribute("aria-controls");
-  }, [innerControl, isOpen, menuId]);
+    const control = wrapsTrigger ? triggerRef.current?.querySelector(TRIGGER_CONTROL_SELECTOR) ?? null : null;
+    innerControlRef.current = control;
+    focusReturnRef.current = control ?? triggerRef.current;
+    if (control !== null !== hasInnerControl) setHasInnerControl(control !== null);
+    if (!control) return;
+    control.setAttribute("aria-haspopup", "menu");
+    control.setAttribute("aria-expanded", String(isOpen));
+    if (isOpen) control.setAttribute("aria-controls", menuId);
+    else control.removeAttribute("aria-controls");
+  });
   useEffect(() => {
     if (isOpen) {
       updatePosition();
@@ -15502,7 +15918,7 @@ var Menu = ({
     "bottom-end": "bottom-start"
   };
   const effectivePosition = direction === "rtl" ? rtlMirror[position] ?? position : position;
-  const triggerElement = React51__default.isValidElement(trigger) ? React51__default.cloneElement(trigger, {
+  const triggerElement = React52__default.isValidElement(trigger) ? React52__default.cloneElement(trigger, {
     ref: triggerRef,
     onClick: handleToggle,
     onKeyDown: onTriggerKeyDown,
@@ -15515,9 +15931,9 @@ var Menu = ({
         triggerRef.current = el;
       },
       onClick: handleToggle,
-      ...innerControl ? void 0 : { role: "button", tabIndex: 0, ...triggerA11y },
+      ...hasInnerControl ? void 0 : { role: "button", tabIndex: 0, ...triggerA11y },
       onKeyDown: (e) => {
-        if (!innerControl && (e.key === "Enter" || e.key === " ")) {
+        if (!hasInnerControl && (e.key === "Enter" || e.key === " ")) {
           e.preventDefault();
           handleToggle();
         } else {
@@ -15692,6 +16108,12 @@ var DashboardLayout = ({
     onSignOutProp?.();
   };
   const showSidebar = layoutMode === "sidebar" || isDrawer;
+  const sidebarRef = useRef(null);
+  useDialogBehavior({
+    open: showSidebar && offCanvas && sidebarOpen,
+    containerRef: sidebarRef,
+    onEscape: () => setSidebarOpen(false)
+  });
   const showHeader = layoutMode !== "minimal";
   const showBottomNav = layoutMode === "bottomnav";
   const isTopNav = layoutMode === "topnav";
@@ -15726,6 +16148,7 @@ var DashboardLayout = ({
           Box,
           {
             as: "aside",
+            ref: sidebarRef,
             inert: offCanvas && !sidebarOpen ? true : void 0,
             className: cn(
               "z-30 flex-shrink-0 bg-card surface-material border-e-[length:var(--border-width)] border-border",
@@ -16490,7 +16913,7 @@ var almadarDndCollisionDetection = (args) => {
   return closestCorners(args);
 };
 var dndLog = createLogger("almadar:ui:dnd");
-var RootCtx = React51__default.createContext(null);
+var RootCtx = React52__default.createContext(null);
 function useDataDnd(args) {
   const {
     dragGroup,
@@ -16507,14 +16930,14 @@ function useDataDnd(args) {
   const isZone = Boolean(dragGroup || accepts2 || sortable);
   const enabled = isZone || Boolean(dndRoot);
   const eventBus = useEventBus();
-  const parentRoot = React51__default.useContext(RootCtx);
+  const parentRoot = React52__default.useContext(RootCtx);
   const isRoot = enabled && parentRoot === null;
-  const zoneId = React51__default.useId();
+  const zoneId = React52__default.useId();
   const ownGroup = dragGroup ?? accepts2 ?? zoneId;
-  const [optimisticOrders, setOptimisticOrders] = React51__default.useState(() => /* @__PURE__ */ new Map());
-  const optimisticOrdersRef = React51__default.useRef(optimisticOrders);
+  const [optimisticOrders, setOptimisticOrders] = React52__default.useState(() => /* @__PURE__ */ new Map());
+  const optimisticOrdersRef = React52__default.useRef(optimisticOrders);
   optimisticOrdersRef.current = optimisticOrders;
-  const clearOptimisticOrder = React51__default.useCallback((group) => {
+  const clearOptimisticOrder = React52__default.useCallback((group) => {
     setOptimisticOrders((prev) => {
       if (!prev.has(group)) return prev;
       const next = new Map(prev);
@@ -16539,7 +16962,7 @@ function useDataDnd(args) {
     const raw = it[dndItemIdField];
     return raw != null ? String(raw) : `__idx_${idx}`;
   }).join("|");
-  const itemIds = React51__default.useMemo(
+  const itemIds = React52__default.useMemo(
     () => orderedItems.map((it, idx) => {
       const raw = it[dndItemIdField];
       return raw != null ? String(raw) : `__idx_${idx}`;
@@ -16550,7 +16973,7 @@ function useDataDnd(args) {
     const raw = it[dndItemIdField];
     return raw != null ? String(raw) : `__${idx}`;
   }).join("|");
-  React51__default.useEffect(() => {
+  React52__default.useEffect(() => {
     const root = isRoot ? null : parentRoot;
     if (root) {
       root.clearOptimisticOrder(ownGroup);
@@ -16558,20 +16981,20 @@ function useDataDnd(args) {
       clearOptimisticOrder(ownGroup);
     }
   }, [itemsContentSig, ownGroup]);
-  const zonesRef = React51__default.useRef(/* @__PURE__ */ new Map());
-  const registerZone = React51__default.useCallback((zoneId2, meta2) => {
+  const zonesRef = React52__default.useRef(/* @__PURE__ */ new Map());
+  const registerZone = React52__default.useCallback((zoneId2, meta2) => {
     zonesRef.current.set(zoneId2, meta2);
   }, []);
-  const unregisterZone = React51__default.useCallback((zoneId2) => {
+  const unregisterZone = React52__default.useCallback((zoneId2) => {
     zonesRef.current.delete(zoneId2);
   }, []);
-  const [activeDrag, setActiveDrag] = React51__default.useState(null);
-  const [overZoneGroup, setOverZoneGroup] = React51__default.useState(null);
-  const meta = React51__default.useMemo(
+  const [activeDrag, setActiveDrag] = React52__default.useState(null);
+  const [overZoneGroup, setOverZoneGroup] = React52__default.useState(null);
+  const meta = React52__default.useMemo(
     () => ({ group: ownGroup, dropEvent, reorderEvent, positionEvent, itemIds, rawItems: items, idField: dndItemIdField }),
     [ownGroup, dropEvent, reorderEvent, positionEvent, itemIds, items, dndItemIdField]
   );
-  React51__default.useEffect(() => {
+  React52__default.useEffect(() => {
     const target = isRoot ? null : parentRoot;
     if (!target) {
       zonesRef.current.set(zoneId, meta);
@@ -16590,7 +17013,7 @@ function useDataDnd(args) {
   }, [parentRoot, isRoot, zoneId, meta]);
   const sensors = useAlmadarDndSensors(true);
   const collisionDetection = almadarDndCollisionDetection;
-  const findZoneByItem = React51__default.useCallback(
+  const findZoneByItem = React52__default.useCallback(
     (id) => {
       for (const z of zonesRef.current.values()) {
         if (z.itemIds.includes(id)) return z;
@@ -16599,7 +17022,7 @@ function useDataDnd(args) {
     },
     []
   );
-  React51__default.useCallback(
+  React52__default.useCallback(
     (group) => {
       for (const z of zonesRef.current.values()) {
         if (z.group === group) return z;
@@ -16608,7 +17031,7 @@ function useDataDnd(args) {
     },
     []
   );
-  const handleDragEnd = React51__default.useCallback(
+  const handleDragEnd = React52__default.useCallback(
     (event) => {
       const { active, over } = event;
       const activeIdStr = String(active.id);
@@ -16699,8 +17122,8 @@ function useDataDnd(args) {
     },
     [eventBus]
   );
-  const sortableData = React51__default.useMemo(() => ({ dndGroup: ownGroup }), [ownGroup]);
-  const SortableItem = React51__default.useCallback(
+  const sortableData = React52__default.useMemo(() => ({ dndGroup: ownGroup }), [ownGroup]);
+  const SortableItem = React52__default.useCallback(
     ({ id, children }) => {
       const {
         attributes,
@@ -16742,7 +17165,7 @@ function useDataDnd(args) {
       id: droppableId,
       data: sortableData
     });
-    const ctx = React51__default.useContext(RootCtx);
+    const ctx = React52__default.useContext(RootCtx);
     const activeDrag2 = ctx?.activeDrag ?? null;
     const overZoneGroup2 = ctx?.overZoneGroup ?? null;
     const isThisZoneOver = overZoneGroup2 === ownGroup;
@@ -16757,7 +17180,7 @@ function useDataDnd(args) {
       showForeignPlaceholder,
       ctxAvailable: ctx != null
     });
-    React51__default.useEffect(() => {
+    React52__default.useEffect(() => {
       dndLog.info("dropzone:isOver:change", { droppableId, group: ownGroup, isOver, isThisZoneOver, showForeignPlaceholder, activeDragSourceGroup: activeDrag2?.sourceGroup ?? null });
     }, [droppableId, isOver, isThisZoneOver, showForeignPlaceholder]);
     return /* @__PURE__ */ jsx(
@@ -16771,11 +17194,11 @@ function useDataDnd(args) {
       }
     );
   };
-  const rootContextValue = React51__default.useMemo(
+  const rootContextValue = React52__default.useMemo(
     () => ({ registerZone, unregisterZone, activeDrag, overZoneGroup, optimisticOrders, clearOptimisticOrder }),
     [registerZone, unregisterZone, activeDrag, overZoneGroup, optimisticOrders, clearOptimisticOrder]
   );
-  const handleDragStart = React51__default.useCallback((event) => {
+  const handleDragStart = React52__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;
@@ -16794,7 +17217,7 @@ function useDataDnd(args) {
       isRoot
     });
   }, [findZoneByItem, isRoot, zoneId]);
-  const handleDragOver = React51__default.useCallback((event) => {
+  const handleDragOver = React52__default.useCallback((event) => {
     const { active, over } = event;
     const overData = over?.data?.current;
     const overGroup = overData?.dndGroup ?? null;
@@ -16864,7 +17287,7 @@ function useDataDnd(args) {
       return next;
     });
   }, []);
-  const handleDragCancel = React51__default.useCallback((event) => {
+  const handleDragCancel = React52__default.useCallback((event) => {
     setActiveDrag(null);
     setOverZoneGroup(null);
     dndLog.warn("dragCancel", {
@@ -16872,12 +17295,12 @@ function useDataDnd(args) {
       reason: "dnd-kit cancelled the drag (escape key, pointer interrupted, or external)"
     });
   }, []);
-  const handleDragEndWithCleanup = React51__default.useCallback((event) => {
+  const handleDragEndWithCleanup = React52__default.useCallback((event) => {
     handleDragEnd(event);
     setActiveDrag(null);
     setOverZoneGroup(null);
   }, [handleDragEnd]);
-  const wrapContainer = React51__default.useCallback(
+  const wrapContainer = React52__default.useCallback(
     (children) => {
       if (!enabled) return children;
       const strategy = layout === "grid" ? rectSortingStrategy : verticalListSortingStrategy;
@@ -17156,6 +17579,7 @@ function DataGrid({
         {
           "data-grid-layout": asRows ? "rows" : "cards",
           "data-item-move-root": nestedMoves.id,
+          ...scrollX ? { role: "region", tabIndex: 0, "aria-label": t("aria.scrollableBoard") } : {},
           className: cn(
             asRows ? cn("flex flex-col divide-y divide-border", contentSurface.className && cn(contentSurface.className, "overflow-hidden")) : cn("grid", gapStyles3[gap], scrollX ? "grid-flow-col overflow-x-auto snap-x snap-mandatory [&>*]:snap-start pb-2" : colsClass, lookStyles3[look]),
             className
@@ -17512,7 +17936,7 @@ function DataList({
   const { t } = useTranslate();
   const fmt = useFormatContext();
   const contentSurface = useContentSurface(look === "card-rows" ? "none" : surface);
-  const [visibleCount, setVisibleCount] = React51__default.useState(pageSize || Infinity);
+  const [visibleCount, setVisibleCount] = React52__default.useState(pageSize || Infinity);
   const fieldDefs = fields ?? columns ?? [];
   const allDataRaw = entityRows(entity);
   const dnd = useDataDnd({
@@ -17528,7 +17952,7 @@ function DataList({
     dndRoot
   });
   const orderedData = dnd.orderedItems;
-  const allData = React51__default.useMemo(
+  const allData = React52__default.useMemo(
     () => sortRows(orderedData, sortBy, sortDirection),
     [orderedData, sortBy, sortDirection]
   );
@@ -17537,7 +17961,7 @@ function DataList({
   const renderItemFn = typeof schemaRenderItem === "function" ? schemaRenderItem : void 0;
   const itemRenderer = typeof children === "function" ? children : renderItemFn;
   const hasRenderProp = typeof itemRenderer === "function";
-  React51__default.useEffect(() => {
+  React52__default.useEffect(() => {
     const renderItemTypeOf = typeof schemaRenderItem;
     const childrenTypeOf = typeof children;
     if (data.length > 0 && !hasRenderProp) {
@@ -17670,7 +18094,7 @@ function DataList({
       return v === void 0 || v === null || v === "" ? raw : String(v);
     };
     return /* @__PURE__ */ jsxs(VStack, { gap: "sm", className: cn("py-2", className), "data-item-move-root": moves.root, children: [
-      groups2.map((group, gi) => /* @__PURE__ */ jsxs(React51__default.Fragment, { children: [
+      groups2.map((group, gi) => /* @__PURE__ */ jsxs(React52__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}`;
@@ -17956,7 +18380,7 @@ function DataList({
           className
         ),
         children: [
-          groups.map((group, gi) => /* @__PURE__ */ jsxs(React51__default.Fragment, { children: [
+          groups.map((group, gi) => /* @__PURE__ */ jsxs(React52__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)
@@ -18339,12 +18763,12 @@ var MapViewImpl = lazy(async () => {
     shadowSize: [41, 41]
   });
   L.Marker.prototype.options.icon = defaultIcon;
-  const { useEffect: useEffect73, useRef: useRef62, useCallback: useCallback85, useState: useState98 } = React51__default;
+  const { useEffect: useEffect73, useRef: useRef63, useCallback: useCallback86, useState: useState99 } = React52__default;
   const { Typography: Typography2 } = await import('./core.js');
   const { useEventBus: useEventBus2 } = await import('./core.js');
   function MapUpdater({ centerLat, centerLng, zoom }) {
     const map = useMap();
-    const prevRef = useRef62({ centerLat, centerLng, zoom });
+    const prevRef = useRef63({ centerLat, centerLng, zoom });
     useEffect73(() => {
       const prev = prevRef.current;
       if (prev.centerLat !== centerLat || prev.centerLng !== centerLng || prev.zoom !== zoom) {
@@ -18389,8 +18813,8 @@ var MapViewImpl = lazy(async () => {
     const centerLng = centerLngProp ?? DEFAULT_CENTER_LNG;
     const contentSurface = useContentSurface(surface);
     const eventBus = useEventBus2();
-    const [clickedPosition, setClickedPosition] = useState98(null);
-    const handleMapClick = useCallback85((lat, lng) => {
+    const [clickedPosition, setClickedPosition] = useState99(null);
+    const handleMapClick = useCallback86((lat, lng) => {
       if (showClickedPin) {
         setClickedPosition({ lat, lng });
       }
@@ -18399,7 +18823,7 @@ var MapViewImpl = lazy(async () => {
         eventBus.emit(`UI:${mapClickEvent}`, { latitude: lat, longitude: lng });
       }
     }, [onMapClick, mapClickEvent, eventBus, showClickedPin]);
-    const handleMarkerClick = useCallback85((marker) => {
+    const handleMarkerClick = useCallback86((marker) => {
       onMarkerClick?.(marker);
       if (markerClickEvent) {
         eventBus.emit(`UI:${markerClickEvent}`, { ...marker });
@@ -18526,7 +18950,7 @@ var WizardProgress = ({
         const isActive = index === currentStep;
         const isCompleted = index < currentStep;
         const canNavigate = isCompleted && allowNavigation;
-        return /* @__PURE__ */ jsxs(React51__default.Fragment, { children: [
+        return /* @__PURE__ */ jsxs(React52__default.Fragment, { children: [
           /* @__PURE__ */ jsx(
             Button,
             {
@@ -19050,8 +19474,8 @@ function TableView({
   const rowActions = useRowActions();
   const { t } = useTranslate();
   const fmt = useFormatContext();
-  const [visibleCount, setVisibleCount] = React51__default.useState(pageSize > 0 ? pageSize : Infinity);
-  const [localSelected, setLocalSelected] = React51__default.useState(/* @__PURE__ */ new Set());
+  const [visibleCount, setVisibleCount] = React52__default.useState(pageSize > 0 ? pageSize : Infinity);
+  const [localSelected, setLocalSelected] = React52__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 { fire: fireRowAction, isRowPending } = useRowActionFire();
@@ -19073,7 +19497,7 @@ function TableView({
   const hasMore = pageSize > 0 && visibleCount < ordered.length;
   const hasRenderProp = typeof children === "function";
   const idField = dndItemIdField ?? "id";
-  React51__default.useEffect(() => {
+  React52__default.useEffect(() => {
     tableViewLog.debug("render", {
       rowCount: data.length,
       colCount: colDefs.length,
@@ -19122,7 +19546,7 @@ function TableView({
     };
     eventBus.emit(`UI:${itemClickEvent}`, payload);
   };
-  const colFloors = React51__default.useMemo(
+  const colFloors = React52__default.useMemo(
     () => colDefs.map((col) => {
       const longest = data.reduce((widest, row) => {
         const cell = formatCell(asFieldValue(getNestedValue(row, col.field ?? col.key)), col.format, relationsData?.[col.field ?? col.key], fmt);
@@ -19270,7 +19694,7 @@ function TableView({
               const label = relationDisplay ?? col.labels?.[String(raw)] ?? (typeof raw === "boolean" ? formatValue(raw, "boolean", fmt) : valueLabelFor(String(raw), col.labels));
               return /* @__PURE__ */ jsxs(Box, { role: "cell", className: cellBase, children: [
                 stackedLabel,
-                asControl(/* @__PURE__ */ jsx(Badge, { variant: badgeVariantFor(String(raw), col.colorMap), size: "sm", className: "whitespace-nowrap", children: label }))
+                asControl(/* @__PURE__ */ jsx(Badge, { variant: badgeVariantFor(String(raw), col.colorMap), size: "sm", icon: col.iconMap?.[String(raw)], className: "whitespace-nowrap", children: label }))
               ] }, col.key);
             }
             return /* @__PURE__ */ jsxs(Box, { role: "cell", className: cellBase, children: [
@@ -19314,12 +19738,12 @@ function TableView({
         ]
       }
     );
-    return dnd.isZone ? /* @__PURE__ */ jsx(dnd.SortableItem, { id: row[idField] ?? id, children: rowInner }, id) : /* @__PURE__ */ jsx(React51__default.Fragment, { children: rowInner }, id);
+    return dnd.isZone ? /* @__PURE__ */ jsx(dnd.SortableItem, { id: row[idField] ?? id, children: rowInner }, id) : /* @__PURE__ */ jsx(React52__default.Fragment, { children: rowInner }, id);
   };
   const items = Array.from(data);
   const groups = groupBy ? groupRows(items, groupBy) : [{ label: "", items }];
   let runningIndex = 0;
-  const body = /* @__PURE__ */ jsx(Box, { role: "rowgroup", children: groups.map((group, gi) => /* @__PURE__ */ jsxs(React51__default.Fragment, { children: [
+  const body = /* @__PURE__ */ jsx(Box, { role: "rowgroup", children: groups.map((group, gi) => /* @__PURE__ */ jsxs(React52__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)) });
@@ -19396,7 +19820,7 @@ var Timeline = ({
   const { t } = useTranslate();
   const fmt = useFormatContext();
   const entityData = entityRows(entity);
-  const items = React51__default.useMemo(() => {
+  const items = React52__default.useMemo(() => {
     if (propItems && propItems.length > 0) return propItems;
     if (entityData.length === 0) return [];
     return entityData.map((record, idx) => {
@@ -20076,7 +20500,7 @@ var DetailPanel = ({
   const fmt = useFormatContext();
   const ctx = { locale, t, fmt };
   const contained = useContext(SlotContainedContext);
-  const [titleDraft, setTitleDraft] = React51__default.useState(null);
+  const [titleDraft, setTitleDraft] = React52__default.useState(null);
   const isFieldDefArray = (arr) => {
     if (!arr || arr.length === 0) return false;
     const first = arr[0];
@@ -20491,7 +20915,7 @@ var DocBreadcrumb = ({
       "aria-label": rest["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(React51__default.Fragment, { children: [
+        return /* @__PURE__ */ jsxs(React52__default.Fragment, { children: [
           idx > 0 && /* @__PURE__ */ jsx(
             Icon,
             {
@@ -21920,7 +22344,7 @@ var DocumentViewer = ({
 };
 DocumentViewer.displayName = "DocumentViewer";
 function extractTitle(children) {
-  if (!React51__default.isValidElement(children)) return void 0;
+  if (!React52__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -21960,14 +22384,6 @@ var DrawerSlot = ({
   );
 };
 DrawerSlot.displayName = "DrawerSlot";
-var colorTokenVars = {
-  primary: "var(--color-primary)",
-  secondary: "var(--color-secondary)",
-  success: "var(--color-success)",
-  warning: "var(--color-warning)",
-  error: "var(--color-error)",
-  muted: "var(--color-muted)"
-};
 function ArchSVG({
   facing,
   w,
@@ -22105,7 +22521,7 @@ var EdgeDecoration = ({
 }) => {
   const id = useId();
   const Variant = VARIANT_MAP[variant];
-  const resolvedColor = color in colorTokenVars ? colorTokenVars[color] : color;
+  const resolvedColor = resolveColorToken(color);
   const sides = side === "both" ? ["left", "right"] : [side];
   return /* @__PURE__ */ jsx(Fragment, { children: sides.map((s) => /* @__PURE__ */ jsx(
     "svg",
@@ -23099,7 +23515,7 @@ var Flex = ({
       flexStyle.flexBasis = typeof basis === "number" ? `${basis}px` : basis;
     }
   }
-  return React51__default.createElement(Component, {
+  return React52__default.createElement(Component, {
     ...domPassthrough(rest),
     className: cn(
       inline ? "inline-flex" : "flex",
@@ -23559,8 +23975,8 @@ var FormField = ({
   children,
   ...rest
 }) => {
-  const generatedId = React51__default.useId();
-  const field = React51__default.Children.count(children) === 1 && React51__default.isValidElement(children) ? children : null;
+  const generatedId = React52__default.useId();
+  const field = React52__default.Children.count(children) === 1 && React52__default.isValidElement(children) ? children : null;
   const fieldId = field ? field.props.id ?? generatedId : void 0;
   const baseId = fieldId ?? generatedId;
   const hintId = `${baseId}-hint`;
@@ -23568,7 +23984,7 @@ var FormField = ({
   const describedBy = [field?.props["aria-describedby"], error ? errorId : hint ? hintId : void 0].filter(Boolean).join(" ") || void 0;
   return /* @__PURE__ */ jsxs(VStack, { ...domPassthrough(rest), gap: "xs", className, children: [
     /* @__PURE__ */ jsx(Label, { required, htmlFor: fieldId, children: label }),
-    field ? React51__default.cloneElement(field, {
+    field ? React52__default.cloneElement(field, {
       id: fieldId,
       "aria-describedby": describedBy,
       "aria-invalid": error ? true : field.props["aria-invalid"]
@@ -23724,7 +24140,7 @@ var Form = ({
   const isSchemaEntity = isOrbitalEntitySchema(entity);
   const resolvedEntity = isSchemaEntity ? entity : void 0;
   const entityName = typeof entity === "string" ? entity : resolvedEntity?.name;
-  const normalizedInitialData = React51__default.useMemo(() => {
+  const normalizedInitialData = React52__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;
@@ -23744,7 +24160,7 @@ var Form = ({
     }
     return normalized;
   }, [entity, initialData]);
-  const entityDerivedFields = React51__default.useMemo(() => {
+  const entityDerivedFields = React52__default.useMemo(() => {
     if (fields && fields.length > 0) return void 0;
     if (!resolvedEntity) return void 0;
     return resolvedEntity.fields.map(
@@ -23765,18 +24181,18 @@ var Form = ({
   const conditionalFields = typeof conditionalFieldsRaw === "boolean" ? {} : conditionalFieldsRaw;
   const hiddenCalculations = typeof hiddenCalculationsRaw === "boolean" ? [] : hiddenCalculationsRaw;
   const violationTriggers = typeof violationTriggersRaw === "boolean" ? [] : violationTriggersRaw;
-  const [formData, setFormData] = React51__default.useState(
+  const [formData, setFormData] = React52__default.useState(
     normalizedInitialData
   );
-  const [collapsedSections, setCollapsedSections] = React51__default.useState(
+  const [collapsedSections, setCollapsedSections] = React52__default.useState(
     /* @__PURE__ */ new Set()
   );
-  const [submitError, setSubmitError] = React51__default.useState(null);
-  const formRef = React51__default.useRef(null);
-  const formUid = React51__default.useId();
+  const [submitError, setSubmitError] = React52__default.useState(null);
+  const formRef = React52__default.useRef(null);
+  const formUid = React52__default.useId();
   const fieldDomId = (name) => `${formUid}-${name}`;
-  const [fieldErrors, setFieldErrors] = React51__default.useState({});
-  const [invalidFields, setInvalidFields] = React51__default.useState([]);
+  const [fieldErrors, setFieldErrors] = React52__default.useState({});
+  const [invalidFields, setInvalidFields] = React52__default.useState([]);
   const fieldElement = (name) => formRef.current?.querySelector(
     `[data-field-name=${JSON.stringify(name)}]`
   ) ?? null;
@@ -23796,7 +24212,7 @@ var Form = ({
     if (message === null) setInvalidFields((prev) => prev.includes(name) ? prev.filter((n) => n !== name) : prev);
   };
   const formMode = props.mode;
-  const mountedRef = React51__default.useRef(false);
+  const mountedRef = React52__default.useRef(false);
   if (!mountedRef.current) {
     mountedRef.current = true;
     debug("forms", "mount", {
@@ -23809,7 +24225,7 @@ var Form = ({
     });
   }
   const shouldShowCancel = showCancel ?? (fields && fields.length > 0);
-  const evalContext = React51__default.useMemo(
+  const evalContext = React52__default.useMemo(
     () => ({
       formValues: formData,
       globalVariables: externalContext?.globalVariables ?? {},
@@ -23818,7 +24234,7 @@ var Form = ({
     }),
     [formData, externalContext]
   );
-  React51__default.useEffect(() => {
+  React52__default.useEffect(() => {
     debug("forms", "initialData-sync", {
       mode: formMode,
       normalizedInitialData,
@@ -23829,7 +24245,7 @@ var Form = ({
       setFormData(normalizedInitialData);
     }
   }, [normalizedInitialData]);
-  const processCalculations = React51__default.useCallback(
+  const processCalculations = React52__default.useCallback(
     (changedFieldId, newFormData) => {
       if (!hiddenCalculations.length) return;
       const context = {
@@ -23859,7 +24275,7 @@ var Form = ({
     },
     [hiddenCalculations, externalContext, eventBus]
   );
-  const checkViolations = React51__default.useCallback(
+  const checkViolations = React52__default.useCallback(
     (changedFieldId, newFormData) => {
       if (!violationTriggers.length) return;
       const context = {
@@ -23903,7 +24319,7 @@ var Form = ({
     processCalculations(name, newFormData);
     checkViolations(name, newFormData);
   };
-  const conditionVerdicts = React51__default.useMemo(() => {
+  const conditionVerdicts = React52__default.useMemo(() => {
     const keyed = [];
     for (const [name, condition] of Object.entries(conditionalFields)) {
       keyed.push({ key: `field:${name}`, condition });
@@ -23914,14 +24330,14 @@ var Form = ({
     const holds = guardsHold(toEvalContext(evalContext), keyed.map((k) => k.condition));
     return new Map(keyed.map((k, i) => [k.key, holds[i]]));
   }, [conditionalFields, sections, evalContext]);
-  const isFieldVisible = React51__default.useCallback(
+  const isFieldVisible = React52__default.useCallback(
     (fieldName2) => {
       if (!conditionalFields[fieldName2]) return true;
       return conditionVerdicts.get(`field:${fieldName2}`) ?? true;
     },
     [conditionalFields, conditionVerdicts]
   );
-  const isSectionVisible = React51__default.useCallback(
+  const isSectionVisible = React52__default.useCallback(
     (section) => {
       if (!section.condition) return true;
       return conditionVerdicts.get(`section:${section.id}`) ?? true;
@@ -23962,7 +24378,7 @@ var Form = ({
       }
     });
   };
-  const invalidScheduled = React51__default.useRef(false);
+  const invalidScheduled = React52__default.useRef(false);
   const handleInvalid = (e) => {
     const target = e.target;
     if (!(target instanceof HTMLElement)) return;
@@ -23996,9 +24412,9 @@ var Form = ({
       });
     });
   };
-  const handleInvalidRef = React51__default.useRef(handleInvalid);
+  const handleInvalidRef = React52__default.useRef(handleInvalid);
   handleInvalidRef.current = handleInvalid;
-  React51__default.useEffect(() => {
+  React52__default.useEffect(() => {
     const form = formRef.current;
     if (!form) return;
     const listener = (e) => handleInvalidRef.current(e);
@@ -24013,7 +24429,7 @@ var Form = ({
       eventBus.emit(`UI:${onCancel}`);
     }
   };
-  const renderField = React51__default.useCallback(
+  const renderField = React52__default.useCallback(
     (field) => {
       const fieldName2 = field.name || field.field;
       if (!fieldName2) return null;
@@ -24037,7 +24453,7 @@ var Form = ({
     [formData, fieldErrors, isFieldVisible, relationsData, relationsLoading, isLoading]
   );
   const effectiveFields = entityDerivedFields ?? fields;
-  const normalizedFields = React51__default.useMemo(() => {
+  const normalizedFields = React52__default.useMemo(() => {
     if (!effectiveFields || effectiveFields.length === 0) return [];
     return effectiveFields.map((field) => {
       if (typeof field === "string") {
@@ -24072,7 +24488,7 @@ var Form = ({
       };
     });
   }, [effectiveFields, resolvedEntity, fieldOverrides]);
-  const schemaFields = React51__default.useMemo(() => {
+  const schemaFields = React52__default.useMemo(() => {
     if (normalizedFields.length === 0) return null;
     if (isDebugEnabled()) {
       debugGroup(`Form: ${entityName || "unknown"}`);
@@ -24082,7 +24498,7 @@ var Form = ({
     }
     return normalizedFields.map(renderField).filter(Boolean);
   }, [normalizedFields, renderField, entityName, conditionalFields]);
-  const sectionElements = React51__default.useMemo(() => {
+  const sectionElements = React52__default.useMemo(() => {
     if (!sections || sections.length === 0) return null;
     return sections.map((section) => {
       if (!isSectionVisible(section)) {
@@ -24458,7 +24874,7 @@ var FormSection = ({
   className,
   ...rest
 }) => {
-  const [collapsed, setCollapsed] = React51__default.useState(defaultCollapsed);
+  const [collapsed, setCollapsed] = React52__default.useState(defaultCollapsed);
   const { t } = useTranslate();
   const eventBus = useEventBus();
   const gridClass = {
@@ -24466,7 +24882,7 @@ var FormSection = ({
     2: "grid-cols-1 md:grid-cols-2",
     3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
   }[columns];
-  React51__default.useCallback(() => {
+  React52__default.useCallback(() => {
     if (collapsible) {
       setCollapsed((prev) => !prev);
       eventBus.emit("UI:TOGGLE_COLLAPSE", { collapsed: !collapsed });
@@ -24814,49 +25230,40 @@ var FxOverlay = ({ items, tickMs = DEFAULT_TICK_MS2, children, className, ...res
   return overlay;
 };
 FxOverlay.displayName = "FxOverlay";
-function pickPath(entry) {
-  if (Array.isArray(entry.path)) {
-    return entry.path[Math.floor(Math.random() * entry.path.length)];
-  }
-  return entry.path;
-}
 function useGameAudio({
-  manifest,
-  baseUrl = "",
   initialMuted = false,
-  initialVolume = 1
+  initialVolume = 1,
+  autostart
 }) {
   const [muted, setMutedState] = useState(initialMuted);
   const [masterVolume, setMasterVolumeState] = useState(initialVolume);
   const mutedRef = useRef(muted);
   const volumeRef = useRef(masterVolume);
-  const manifestRef = useRef(manifest);
   mutedRef.current = muted;
   volumeRef.current = masterVolume;
-  manifestRef.current = manifest;
   const poolsRef = useRef(/* @__PURE__ */ new Map());
-  const getOrCreateElement = useCallback((key) => {
-    const entry = manifestRef.current[key];
-    if (!entry) return null;
+  const poolPlansRef = useRef(/* @__PURE__ */ new Map());
+  const getOrCreateElement = useCallback((plan) => {
+    const key = plan.key;
+    poolPlansRef.current.set(key, plan);
     let pool = poolsRef.current.get(key);
     if (!pool) {
       pool = [];
       poolsRef.current.set(key, pool);
     }
-    const maxSize = entry.poolSize ?? 1;
+    const maxSize = Math.max(1, plan.poolSize);
     for (const audio of pool) {
       if (audio.paused && (audio.ended || audio.currentTime === 0)) {
         return audio;
       }
     }
     if (pool.length < maxSize) {
-      const src = baseUrl + pickPath(entry);
-      const audio = new Audio(src);
-      audio.loop = entry.loop ?? false;
+      const audio = new Audio(plan.source);
+      audio.loop = plan.loop;
       pool.push(audio);
       return audio;
     }
-    if (!entry.loop) {
+    if (!plan.loop) {
       let oldest = pool[0];
       for (const audio of pool) {
         if (audio.currentTime > oldest.currentTime) {
@@ -24865,18 +25272,17 @@ function useGameAudio({
       }
       oldest.pause();
       oldest.currentTime = 0;
+      oldest.src = plan.source;
       return oldest;
     }
     return null;
-  }, [baseUrl]);
-  const play = useCallback((key) => {
-    if (mutedRef.current) return;
-    const entry = manifestRef.current[key];
-    if (!entry) return;
-    const audio = getOrCreateElement(key);
+  }, []);
+  const playPlan = useCallback((plan) => {
+    if (mutedRef.current || !plan.key) return;
+    const audio = getOrCreateElement(plan);
     if (!audio) return;
-    audio.volume = Math.min(1, (entry.volume ?? 1) * volumeRef.current);
-    if (!entry.loop) {
+    audio.volume = Math.min(1, plan.volume * volumeRef.current);
+    if (!plan.loop) {
       audio.currentTime = 0;
     }
     const promise = audio.play();
@@ -24894,36 +25300,37 @@ function useGameAudio({
     }
   }, []);
   const currentMusicKeyRef = useRef(null);
+  const currentMusicPlanRef = useRef(null);
   const currentMusicElRef = useRef(null);
   const musicFadeRef = useRef(null);
-  const pendingMusicKeyRef = useRef(null);
+  const pendingMusicRef = useRef(null);
   const clearMusicFade = useCallback(() => {
     if (musicFadeRef.current) {
       clearInterval(musicFadeRef.current);
       musicFadeRef.current = null;
     }
   }, []);
-  const playMusic = useCallback((key) => {
-    if (key === currentMusicKeyRef.current) return;
-    pendingMusicKeyRef.current = key;
-    const entry = manifestRef.current[key];
-    if (!entry) return;
-    const fadeDurationMs = entry.crossfadeDurationMs ?? 1500;
+  const startMusicPlan = useCallback((plan) => {
+    if (plan.key === currentMusicKeyRef.current) return;
+    pendingMusicRef.current = plan;
     const stepMs = 50;
-    const totalSteps = Math.max(1, fadeDurationMs / stepMs);
-    const targetVolume = Math.min(1, (entry.volume ?? 1) * volumeRef.current);
+    const totalSteps = Math.max(1, plan.fadeMs / stepMs);
+    const targetVolume = Math.min(1, plan.volume * volumeRef.current);
     clearMusicFade();
-    const src = baseUrl + (Array.isArray(entry.path) ? entry.path[0] : entry.path);
-    const incoming = new Audio(src);
+    const incoming = new Audio(plan.source);
     incoming.loop = true;
     incoming.volume = 0;
     const outgoing = currentMusicElRef.current;
     const outgoingStartVol = outgoing?.volume ?? 0;
-    currentMusicKeyRef.current = key;
+    const outgoingKey = currentMusicKeyRef.current;
+    const outgoingPlan = currentMusicPlanRef.current;
+    currentMusicKeyRef.current = plan.key;
+    currentMusicPlanRef.current = plan;
     currentMusicElRef.current = incoming;
     if (!mutedRef.current) {
       incoming.play().catch(() => {
-        currentMusicKeyRef.current = null;
+        currentMusicKeyRef.current = outgoingKey;
+        currentMusicPlanRef.current = outgoingPlan;
         currentMusicElRef.current = outgoing;
       });
     }
@@ -24943,13 +25350,14 @@ function useGameAudio({
         }
       }
     }, stepMs);
-  }, [baseUrl, clearMusicFade]);
-  const stopMusic = useCallback((fadeDurationMs = 1e3) => {
+  }, [clearMusicFade]);
+  const stopMusic = useCallback((fadeDurationMs) => {
+    pendingMusicRef.current = null;
     const outgoing = currentMusicElRef.current;
     if (!outgoing) return;
     currentMusicKeyRef.current = null;
+    currentMusicPlanRef.current = null;
     currentMusicElRef.current = null;
-    pendingMusicKeyRef.current = null;
     clearMusicFade();
     const startVolume = outgoing.volume;
     const stepMs = 50;
@@ -24966,6 +25374,10 @@ function useGameAudio({
       }
     }, stepMs);
   }, [clearMusicFade]);
+  const playMusicPlan = useCallback((plan) => {
+    if (plan.key) startMusicPlan(plan);
+    else stopMusic(plan.fadeMs);
+  }, [startMusicPlan, stopMusic]);
   const stopAll = useCallback(() => {
     for (const pool of poolsRef.current.values()) {
       for (const audio of pool) {
@@ -24979,7 +25391,7 @@ function useGameAudio({
     setMutedState(value);
     if (value) {
       for (const [key, pool] of poolsRef.current.entries()) {
-        if (manifestRef.current[key]?.loop) {
+        if (poolPlansRef.current.get(key)?.loop) {
           for (const audio of pool) {
             if (!audio.paused) audio.pause();
           }
@@ -24988,8 +25400,7 @@ function useGameAudio({
       currentMusicElRef.current?.pause();
     } else {
       for (const [key, pool] of poolsRef.current.entries()) {
-        const entry = manifestRef.current[key];
-        if (entry?.loop && entry?.autostart) {
+        if (poolPlansRef.current.get(key)?.loop && autostartKeysRef.current.has(key)) {
           for (const audio of pool) {
             if (audio.paused) audio.play().catch(() => {
             });
@@ -25007,33 +25418,37 @@ function useGameAudio({
     const clamped = Math.max(0, Math.min(1, volume));
     setMasterVolumeState(clamped);
     for (const [key, pool] of poolsRef.current.entries()) {
-      const entryVol = manifestRef.current[key]?.volume ?? 1;
+      const entryVol = poolPlansRef.current.get(key)?.volume ?? 1;
       for (const audio of pool) {
         audio.volume = Math.min(1, entryVol * clamped);
       }
     }
     if (!musicFadeRef.current && currentMusicElRef.current) {
-      const key = currentMusicKeyRef.current;
-      const entryVol = key ? manifestRef.current[key]?.volume ?? 1 : 1;
+      const entryVol = currentMusicPlanRef.current?.volume ?? 1;
       currentMusicElRef.current.volume = Math.min(1, entryVol * clamped);
     }
   }, []);
   const unlockedRef = useRef(false);
+  const autostartPlans = autostart ?? [];
+  const autostartKeysRef = useRef(/* @__PURE__ */ new Set());
+  autostartKeysRef.current = new Set(autostartPlans.map((p) => p.key));
+  const autostartRef = useRef(autostartPlans);
+  autostartRef.current = autostartPlans;
+  const autostartSignature = autostartPlans.map((p) => p.key + "\0" + p.source).join("
");
   useEffect(() => {
-    const autoKeys = Object.keys(manifest).filter((k) => manifest[k].autostart);
-    const hasPendingMusic = () => pendingMusicKeyRef.current !== null;
-    const hasAutoStart = autoKeys.length > 0;
+    const hasPendingMusic = () => pendingMusicRef.current !== null;
+    const hasAutoStart = autostartRef.current.length > 0;
     if (!hasAutoStart && !hasPendingMusic()) return;
     const unlock = () => {
       if (unlockedRef.current) return;
       unlockedRef.current = true;
       if (!mutedRef.current) {
-        for (const key of autoKeys) {
-          play(key);
+        for (const plan of autostartRef.current) {
+          playPlan(plan);
         }
-        const pending = pendingMusicKeyRef.current;
-        if (pending && pending !== currentMusicKeyRef.current) {
-          playMusic(pending);
+        const pending = pendingMusicRef.current;
+        if (pending && pending.key !== currentMusicKeyRef.current) {
+          startMusicPlan(pending);
         }
       }
     };
@@ -25045,7 +25460,7 @@ function useGameAudio({
       document.removeEventListener("keydown", unlock);
       document.removeEventListener("touchstart", unlock);
     };
-  }, [manifest, play, playMusic]);
+  }, [autostartSignature, playPlan, startMusicPlan]);
   useEffect(() => {
     return () => {
       clearMusicFade();
@@ -25064,10 +25479,10 @@ function useGameAudio({
     };
   }, [clearMusicFade]);
   return {
-    play,
     stop,
     stopAll,
-    playMusic,
+    playPlan,
+    playMusicPlan,
     stopMusic,
     muted,
     setMuted,
@@ -25079,31 +25494,32 @@ useGameAudio.displayName = "useGameAudio";
 
 // src/components/game/atoms/GameAudioCue.tsx
 function GameAudioCue({
-  cue,
   cueSeq,
-  music,
+  cuePlay,
+  musicPlay,
+  autostart,
   muted,
-  volume,
-  manifest,
-  baseUrl
+  volume
 }) {
-  const { play, playMusic, stopMusic, setMuted, setMasterVolume } = useGameAudio({
-    manifest,
-    baseUrl,
+  const { playPlan, playMusicPlan, setMuted, setMasterVolume } = useGameAudio({
     initialMuted: muted,
-    initialVolume: volume
+    initialVolume: volume,
+    autostart: autostart ?? []
   });
   const prevCueSeqRef = useRef(cueSeq);
   useEffect(() => {
-    if (cue && cueSeq !== void 0 && cueSeq !== prevCueSeqRef.current) {
-      play(cue);
+    if (cuePlay && cueSeq !== void 0 && cueSeq !== prevCueSeqRef.current) {
+      playPlan(cuePlay);
     }
     prevCueSeqRef.current = cueSeq;
-  }, [cue, cueSeq, play]);
+  }, [cuePlay, cueSeq, playPlan]);
+  const musicKey = musicPlay?.key ?? "";
+  const musicSource = musicPlay?.source ?? "";
+  const musicRef = useRef(musicPlay);
+  musicRef.current = musicPlay;
   useEffect(() => {
-    if (music) playMusic(music);
-    else stopMusic();
-  }, [music, playMusic, stopMusic]);
+    if (musicRef.current) playMusicPlan(musicRef.current);
+  }, [musicKey, musicSource, playMusicPlan]);
   useEffect(() => {
     if (muted !== void 0) setMuted(muted);
   }, [muted, setMuted]);
@@ -25126,23 +25542,19 @@ function useGameAudioContextOptional() {
   return useContext(GameAudioContext);
 }
 function GameAudioProvider({
-  manifest,
-  baseUrl = "",
   children,
   initialMuted = false
 }) {
-  const { play, stop, stopAll, playMusic, stopMusic, muted, setMuted, masterVolume, setMasterVolume } = useGameAudio({ manifest, baseUrl, initialMuted });
+  const { playPlan, playMusicPlan, stop, stopAll, stopMusic, muted, setMuted, masterVolume, setMasterVolume } = useGameAudio({ initialMuted });
   useEffect(() => registerHostAudio((ask) => {
-    if (ask.op === "audio/play-sound") play(ask.key);
+    if (ask.op === "audio/play-sound") playPlan(ask.play);
     else if (ask.op === "audio/stop-sound") {
       if (ask.key !== void 0) stop(ask.key);
       else stopAll();
-    } else if (ask.op === "audio/change-music") {
-      if (ask.key !== void 0) playMusic(ask.key);
-      else stopMusic();
-    } else stopMusic();
-  }), [play, stop, stopAll, playMusic, stopMusic]);
-  const value = { muted, setMuted, masterVolume, setMasterVolume, play, playMusic, stopMusic };
+    } else if (ask.op === "audio/change-music") playMusicPlan(ask.play);
+    else stopMusic(ask.fadeMs);
+  }), [playPlan, playMusicPlan, stop, stopAll, stopMusic]);
+  const value = { muted, setMuted, masterVolume, setMasterVolume, playPlan, playMusicPlan, stopMusic };
   return /* @__PURE__ */ jsx(GameAudioContext.Provider, { value, children });
 }
 GameAudioProvider.displayName = "GameAudioProvider";
@@ -25539,7 +25951,7 @@ function GameHud({
   );
 }
 GameHud.displayName = "GameHud";
-var GameOverlayContext = React51.createContext(false);
+var GameOverlayContext = React52.createContext(false);
 var DEFAULT_MENU_OPTION_KEYS = [
   { labelKey: "gameMenu.newGame", event: "NEW_GAME", variant: "primary" },
   { labelKey: "gameMenu.continue", event: "CONTINUE", variant: "secondary" },
@@ -25566,8 +25978,8 @@ function GameMenu({
   const resolvedOptions = options ?? menuItems ?? defaultOptions;
   const eventBus = useEventBus();
   const navStack = useNavStack();
-  const inOverlay = React51.useContext(GameOverlayContext);
-  const handleOptionClick = React51.useCallback(
+  const inOverlay = React52.useContext(GameOverlayContext);
+  const handleOptionClick = React52.useCallback(
     (option) => {
       if (option.event) {
         eventBus.emit(`UI:${option.event}`, { option });
@@ -26458,20 +26870,12 @@ var GeometricPattern = ({
   );
 };
 GeometricPattern.displayName = "GeometricPattern";
-var colorTokenVars2 = {
-  primary: "var(--color-primary)",
-  secondary: "var(--color-secondary)",
-  success: "var(--color-success)",
-  warning: "var(--color-warning)",
-  error: "var(--color-error)",
-  muted: "var(--color-muted)"
-};
 var GradientDivider = ({
   color,
   className,
   ...rest
 }) => {
-  const centerColor = color ? color in colorTokenVars2 ? colorTokenVars2[color] : color : "var(--color-primary)";
+  const centerColor = color ? resolveColorToken(color) : "var(--color-primary)";
   return /* @__PURE__ */ jsx(
     Box,
     {
@@ -26560,7 +26964,7 @@ var GraphCanvas = ({
   description,
   ...rest
 }) => {
-  const descId = React51__default.useId();
+  const descId = React52__default.useId();
   const selectedNode = selectedNodeId === void 0 ? void 0 : propNodes.find((n) => n.id === selectedNodeId);
   const eventBus = useEventBus();
   const { t } = useTranslate();
@@ -27414,10 +27818,10 @@ function layoutRadial(nodeIds, adjacency, roots, width, height, margin) {
   const cy = height / 2;
   const maxRadius = Math.min(width, height) / 2 - margin;
   if (roots.length === 0) {
-    const order = edgeWalkOrder(nodeIds, adjacency);
-    const k = order.length;
+    const order2 = edgeWalkOrder(nodeIds, adjacency);
+    const k = order2.length;
     const positions2 = /* @__PURE__ */ new Map();
-    order.forEach((id, i) => {
+    order2.forEach((id, i) => {
       const angle = i / k * 2 * Math.PI;
       positions2.set(id, { id, x: cx + maxRadius * Math.cos(angle), y: cy + maxRadius * Math.sin(angle) });
     });
@@ -27425,19 +27829,39 @@ function layoutRadial(nodeIds, adjacency, roots, width, height, margin) {
   }
   const { depth, visitOrder } = bfsDepthAndOrder(nodeIds, adjacency, roots);
   const maxDepth = Math.max(...Array.from(depth.values()));
-  const ringGroups = groupByTier(nodeIds, depth, maxDepth);
+  const order = (a, b) => (visitOrder.get(a) ?? 0) - (visitOrder.get(b) ?? 0);
+  const children = new Map(nodeIds.map((id) => [id, []]));
+  const tops = [];
+  for (const id of [...nodeIds].sort(order)) {
+    const d = depth.get(id) ?? 0;
+    const parent = (adjacency.in.get(id) ?? []).filter((p) => (depth.get(p) ?? 0) === d - 1).sort(order)[0];
+    if (d > 0 && parent !== void 0) children.get(parent)?.push(id);
+    else tops.push(id);
+  }
+  const weight = /* @__PURE__ */ new Map();
+  const weigh = (id) => {
+    const own = (children.get(id) ?? []).reduce((sum, child) => sum + weigh(child), 0);
+    const w = Math.max(1, own);
+    weight.set(id, w);
+    return w;
+  };
+  tops.forEach(weigh);
+  const centred = tops.length === 1;
+  const radiusAt = (d) => centred ? d * maxRadius / Math.max(1, maxDepth) : (d + 1) * maxRadius / (maxDepth + 1);
   const positions = /* @__PURE__ */ new Map();
-  for (let d = 0; d <= maxDepth; d++) {
-    const ordered = [...ringGroups[d]].sort(
-      (a, b) => (visitOrder.get(a) ?? 0) - (visitOrder.get(b) ?? 0)
-    );
-    const radius = d * maxRadius / Math.max(1, maxDepth);
-    const k = ordered.length;
-    ordered.forEach((id, i) => {
-      const angle = i / k * 2 * Math.PI;
+  const place = (ids, from, to) => {
+    const total = ids.reduce((sum, id) => sum + (weight.get(id) ?? 1), 0);
+    let at = from;
+    for (const id of ids) {
+      const span = (to - from) * (weight.get(id) ?? 1) / total;
+      const angle = at + span / 2;
+      const radius = radiusAt(depth.get(id) ?? 0);
       positions.set(id, { id, x: cx + radius * Math.cos(angle), y: cy + radius * Math.sin(angle) });
-    });
-  }
+      place(children.get(id) ?? [], at, at + span);
+      at += span;
+    }
+  };
+  place(tops, -Math.PI / 2, 3 * Math.PI / 2);
   return nodeIds.map((id) => positions.get(id));
 }
 function computeStaticLayout(mode, input) {
@@ -27472,6 +27896,21 @@ function edgeEndpoints(source, target) {
     y2: target.y - uy * (target.size + EDGE_ARROW_GAP)
   };
 }
+function radialEdgePath(center, source, target) {
+  const rs = Math.hypot(source.x - center.x, source.y - center.y);
+  const rt = Math.hypot(target.x - center.x, target.y - center.y);
+  if (rs < 1 || rt < 1) return `M${source.x},${source.y} L${target.x},${target.y}`;
+  const mid = (rs + rt) / 2;
+  const toward = (p, r) => {
+    const a = Math.atan2(p.y - center.y, p.x - center.x);
+    return `${center.x + r * Math.cos(a)},${center.y + r * Math.sin(a)}`;
+  };
+  return `M${source.x},${source.y} C${toward(source, mid)} ${toward(target, mid)} ${target.x},${target.y}`;
+}
+function radialRings(center, points) {
+  const radii = points.map((p) => Math.round(Math.hypot(p.x - center.x, p.y - center.y))).filter((r) => r > 1);
+  return [...new Set(radii)].sort((a, b) => a - b);
+}
 function resolveNodeColor(node, groups) {
   if (node.color) return node.color;
   if (node.group) {
@@ -27640,6 +28079,7 @@ var GraphView = ({
       cancelAnimationFrame(animRef.current);
     };
   }, [nodes, edges, w, h, groups, layout]);
+  const center = useMemo(() => ({ x: w / 2, y: h / 2 }), [w, h]);
   const viewBox = useMemo(() => {
     if (!zoomToFit || !settled || simNodes.length === 0) {
       return `0 0 ${w} ${h}`;
@@ -27655,10 +28095,17 @@ var GraphView = ({
       maxX = Math.max(maxX, node.x + node.size);
       maxY = Math.max(maxY, node.y + node.size);
     }
+    if (layout === "radial") {
+      const outer = radialRings(center, simNodes).at(-1) ?? 0;
+      minX = Math.min(minX, center.x - outer);
+      minY = Math.min(minY, center.y - outer);
+      maxX = Math.max(maxX, center.x + outer);
+      maxY = Math.max(maxY, center.y + outer);
+    }
     const fitW = maxX - minX + pad * 2;
     const fitH = maxY - minY + pad * 2;
     return `${minX - pad} ${minY - pad} ${fitW} ${fitH}`;
-  }, [zoomToFit, settled, simNodes, w, h]);
+  }, [zoomToFit, settled, simNodes, w, h, layout, center]);
   const nodeMap = useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     for (const n of simNodes) {
@@ -27718,7 +28165,7 @@ var GraphView = ({
             viewBox,
             preserveAspectRatio: "xMidYMid meet",
             children: [
-              layout !== "force" && /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx(
+              (layout === "flow" || layout === "tree") && /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx(
                 "marker",
                 {
                   id: arrowMarkerId,
@@ -27731,25 +28178,53 @@ var GraphView = ({
                   children: /* @__PURE__ */ jsx("path", { d: "M0,0 L10,5 L0,10 z", fill: "currentColor" })
                 }
               ) }),
+              layout === "radial" && radialRings(center, simNodes).map((r) => /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: center.x,
+                  cy: center.y,
+                  r,
+                  fill: "none",
+                  stroke: "var(--color-border)",
+                  strokeWidth: 1,
+                  strokeDasharray: "2 5",
+                  opacity: 0.7
+                },
+                `ring-${r}`
+              )),
               edges.map((edge, idx) => {
                 const source = nodeMap.get(edge.source);
                 const target = nodeMap.get(edge.target);
                 if (!source || !target) return null;
                 const isHighlighted = hoveredId ? connectedIds.has(edge.source) && connectedIds.has(edge.target) : true;
-                const ends = layout !== "force" ? edgeEndpoints(source, target) : { x1: source.x, y1: source.y, x2: target.x, y2: target.y };
+                const directed = layout === "flow" || layout === "tree";
+                const ends = directed ? edgeEndpoints(source, target) : { x1: source.x, y1: source.y, x2: target.x, y2: target.y };
+                const stroke = edge.color ?? (layout === "radial" ? target.color : DEFAULT_EDGE_COLOR);
+                const lit = Boolean(hoveredId) && isHighlighted;
                 return /* @__PURE__ */ jsxs("g", { children: [
-                  /* @__PURE__ */ jsx(
+                  layout === "radial" ? /* @__PURE__ */ jsx(
+                    "path",
+                    {
+                      d: radialEdgePath(center, source, target),
+                      fill: "none",
+                      stroke,
+                      strokeWidth: lit ? 2 : 1.25,
+                      strokeLinecap: "round",
+                      opacity: hoveredId ? isHighlighted ? 0.9 : 0.08 : 0.45
+                    }
+                  ) : /* @__PURE__ */ jsx(
                     "line",
                     {
                       x1: ends.x1,
                       y1: ends.y1,
                       x2: ends.x2,
                       y2: ends.y2,
-                      stroke: edge.color ?? DEFAULT_EDGE_COLOR,
-                      color: edge.color ?? DEFAULT_EDGE_COLOR,
-                      strokeWidth: 1.5,
-                      opacity: isHighlighted ? 0.8 : 0.15,
-                      markerEnd: layout !== "force" ? `url(#${arrowMarkerId})` : void 0
+                      stroke,
+                      color: stroke,
+                      strokeWidth: lit ? 2 : 1.25,
+                      strokeLinecap: "round",
+                      opacity: hoveredId ? isHighlighted ? 0.9 : 0.1 : 0.6,
+                      markerEnd: directed ? `url(#${arrowMarkerId})` : void 0
                     }
                   ),
                   showLabels && edge.label && /* @__PURE__ */ jsx(
@@ -27759,7 +28234,10 @@ var GraphView = ({
                       y: (source.y + target.y) / 2 - 6,
                       textAnchor: "middle",
                       fill: "var(--color-muted-foreground)",
-                      fontSize: 9,
+                      fontSize: 10,
+                      stroke: "var(--color-card)",
+                      strokeWidth: 3,
+                      paintOrder: "stroke",
                       opacity: isHighlighted ? 0.9 : 0.2,
                       children: edge.label
                     }
@@ -27769,10 +28247,12 @@ var GraphView = ({
               simNodes.map((node) => {
                 const isHighlighted = hoveredId ? connectedIds.has(node.id) : true;
                 const isHovered = hoveredId === node.id;
+                const r = isHovered ? node.size * 1.25 : node.size;
                 return /* @__PURE__ */ jsxs(
                   "g",
                   {
                     style: { cursor: onNodeClick ? "pointer" : "default" },
+                    opacity: isHighlighted ? 1 : 0.3,
                     onMouseEnter: () => handleNodeMouseEnter(node),
                     onMouseLeave: handleNodeMouseLeave,
                     ...pressableProps(onNodeClick ? () => handleNodeClickInternal(node) : void 0),
@@ -27788,23 +28268,37 @@ var GraphView = ({
                         {
                           cx: node.x,
                           cy: node.y,
-                          r: isHovered ? node.size * 1.4 : node.size,
+                          r: r + Math.max(4, node.size * 0.45),
                           fill: node.color,
-                          opacity: isHighlighted ? 1 : 0.3,
-                          stroke: isHovered ? "var(--color-background)" : "none",
-                          strokeWidth: isHovered ? 2 : 0
+                          opacity: isHovered ? 0.28 : 0.14,
+                          style: { transition: "r 160ms ease, opacity 160ms ease" }
                         }
                       ),
-                      showLabels && /* @__PURE__ */ jsx(
+                      /* @__PURE__ */ jsx(
+                        "circle",
+                        {
+                          cx: node.x,
+                          cy: node.y,
+                          r,
+                          fill: node.color,
+                          stroke: "var(--color-card)",
+                          strokeWidth: 2,
+                          style: { transition: "r 160ms ease" }
+                        }
+                      ),
+                      showLabels && (node.label ?? node.id) !== "" && /* @__PURE__ */ jsx(
                         "text",
                         {
                           x: node.x,
-                          y: node.y + node.size + 12,
+                          y: node.y + r + Math.max(4, node.size * 0.45) + 12,
                           textAnchor: "middle",
                           fill: "var(--color-foreground)",
-                          fontSize: 11,
-                          fontWeight: isHovered ? "bold" : "normal",
-                          opacity: isHighlighted ? 0.9 : 0.2,
+                          fontSize: 11.5,
+                          fontWeight: isHovered ? 600 : 500,
+                          stroke: "var(--color-card)",
+                          strokeWidth: 3.5,
+                          strokeLinejoin: "round",
+                          paintOrder: "stroke",
                           children: node.label ?? node.id
                         }
                       )
@@ -27980,7 +28474,7 @@ var Grid = ({
   ...rest
 }) => {
   const mergedStyle = rows ? { gridTemplateRows: `repeat(${rows}, minmax(0, 1fr))`, ...style } : style;
-  return React51__default.createElement(
+  return React52__default.createElement(
     Component,
     {
       ...domPassthrough(rest),
@@ -28008,7 +28502,7 @@ function readsI18n(value) {
     const arr = value;
     return arr[0] === "i18n/t" || arr.some((v) => readsI18n(v));
   }
-  if (value !== null && typeof value === "object" && !React51__default.isValidElement(value) && !(value instanceof Date) && typeof value !== "function") {
+  if (value !== null && typeof value === "object" && !React52__default.isValidElement(value) && !(value instanceof Date) && typeof value !== "function") {
     return Object.values(value).some((v) => readsI18n(v));
   }
   return false;
@@ -28076,7 +28570,7 @@ function substituteLambdaBindings(body, params, item, index) {
     const arr = body;
     return arr.map((b) => recur(b));
   }
-  if (body !== null && typeof body === "object" && !React51__default.isValidElement(body) && !(body instanceof Date) && typeof body !== "function") {
+  if (body !== null && typeof body === "object" && !React52__default.isValidElement(body) && !(body instanceof Date) && typeof body !== "function") {
     const out = {};
     for (const [k, v] of Object.entries(body)) {
       out[k] = recur(v);
@@ -28089,7 +28583,7 @@ function evaluableCall(node) {
   return isOperatorCall(node) && isSExpr(node) && !needsRenderContext(node);
 }
 function isPlainContainer(body) {
-  return body !== null && typeof body === "object" && !Array.isArray(body) && !React51__default.isValidElement(body) && !(body instanceof Date) && typeof body !== "function";
+  return body !== null && typeof body === "object" && !Array.isArray(body) && !React52__default.isValidElement(body) && !(body instanceof Date) && typeof body !== "function";
 }
 function gatherCalls(body, sink) {
   if (Array.isArray(body)) {
@@ -28125,8 +28619,8 @@ function evaluateStandaloneCalls(body) {
   const values = evaluateBindings({}, calls).map((evaluated) => isEventPayloadValue(evaluated) ? evaluated : String(evaluated));
   return replaceCalls(body, values[Symbol.iterator]());
 }
-var LazySlotContentRenderer2 = React51__default.lazy(
-  () => import('./UISlotRenderer-PY7FIJXN.js').then((m) => ({ default: m.SlotContentRenderer }))
+var LazySlotContentRenderer2 = React52__default.lazy(
+  () => import('./UISlotRenderer-5OURMAP2.js').then((m) => ({ default: m.SlotContentRenderer }))
 );
 function deferLambdaEntityExprs(value) {
   if (typeof value === "string") {
@@ -28145,7 +28639,7 @@ function deferLambdaEntityExprs(value) {
     }
     return arr.map((v) => deferLambdaEntityExprs(v));
   }
-  if (value !== null && typeof value === "object" && !React51__default.isValidElement(value) && !(value instanceof Date) && typeof value !== "function" && !isRenderBindingMarker(value)) {
+  if (value !== null && typeof value === "object" && !React52__default.isValidElement(value) && !(value instanceof Date) && typeof value !== "function" && !isRenderBindingMarker(value)) {
     const out = {};
     for (const [k, v] of Object.entries(value)) {
       out[k] = deferLambdaEntityExprs(v);
@@ -28159,7 +28653,7 @@ function makeLambdaFn(params, lambdaBody, callerKey) {
     const resolvedBody = deferLambdaEntityExprs(
       resolveLambdaBindings(lambdaBody, params, item, index)
     );
-    if (resolvedBody === null || typeof resolvedBody !== "object" || Array.isArray(resolvedBody) || typeof resolvedBody === "function" || React51__default.isValidElement(resolvedBody) || resolvedBody instanceof Date) {
+    if (resolvedBody === null || typeof resolvedBody !== "object" || Array.isArray(resolvedBody) || typeof resolvedBody === "function" || React52__default.isValidElement(resolvedBody) || resolvedBody instanceof Date) {
       return null;
     }
     const record = resolvedBody;
@@ -28177,10 +28671,10 @@ function makeLambdaFn(params, lambdaBody, callerKey) {
       props: childProps,
       priority: 0
     };
-    return React51__default.createElement(
-      React51__default.Suspense,
+    return React52__default.createElement(
+      React52__default.Suspense,
       { fallback: null },
-      React51__default.createElement(LazySlotContentRenderer2, { content: childContent, onDismiss: () => void 0 })
+      React52__default.createElement(LazySlotContentRenderer2, { content: childContent, onDismiss: () => void 0 })
     );
   };
 }
@@ -28201,7 +28695,7 @@ function convertNode(node, callerKey, def) {
     });
     return anyChanged ? mapped : node;
   }
-  if (typeof node === "object" && !React51__default.isValidElement(node) && !(node instanceof Date)) {
+  if (typeof node === "object" && !React52__default.isValidElement(node) && !(node instanceof Date)) {
     return convertObjectProps(node, def?.properties);
   }
   return node;
@@ -28292,7 +28786,7 @@ function useSlotFlush(uiSlots, embeddedTraits, returnHostAsk, traceSource) {
     const { bareTraitRef, patternType, props: unwrapped } = unwrapPattern(last.pattern);
     const rawProps = bareTraitRef !== void 0 ? bareTraitRef : { ...unwrapped ?? {}, ...last.props };
     const props = convertFnFormLambdasInProps(rawProps, typeof patternType === "string" ? patternType : void 0);
-    const isEmbedded = (embedded?.has(traitName) ?? false) && !isNotificationSlot(slot);
+    const isEmbedded = paintsInTraitFrame(embedded?.has(traitName) ?? false, slot);
     if (isEmbedded) {
       const content = {
         pattern: patternType,
@@ -28332,7 +28826,7 @@ function useSlotFlush(uiSlots, embeddedTraits, returnHostAsk, traceSource) {
         const [, slot, pattern] = effect;
         const sourceTrait = traitName ?? "kernel";
         const { bareTraitRef, patternType, props: unwrapped } = unwrapPattern(pattern);
-        const isEmbedded = (embedded?.has(sourceTrait) ?? false) && !isNotificationSlot(slot);
+        const isEmbedded = paintsInTraitFrame(embedded?.has(sourceTrait) ?? false, slot);
         flushLog.debug("apply:render", { trait: sourceTrait, slot, pattern: patternType ?? bareTraitRef ?? null, embedded: isEmbedded, event, fromState });
         const propsValue = bareTraitRef !== void 0 ? bareTraitRef : { ...unwrapped ?? {} };
         const props = convertFnFormLambdasInProps(propsValue, typeof patternType === "string" ? patternType : void 0);
@@ -28390,7 +28884,7 @@ function SeedGuestPaints({ paints }) {
   useLayoutEffect(() => {
     const held = new Set(paints.map((paint) => `${paint.slot}\0${paint.trait}`));
     for (const [key, gone] of seeded.current) {
-      if (!held.has(key)) slotsRef.current.clearBySource(gone.slot, gone.trait);
+      if (!held.has(key) && !isNotificationSlot(gone.slot)) slotsRef.current.clearBySource(gone.slot, gone.trait);
     }
     seeded.current = new Map(paints.map((paint) => [`${paint.slot}\0${paint.trait}`, paint]));
     for (const paint of paints) {
@@ -28402,7 +28896,7 @@ function SeedGuestPaints({ paints }) {
       const propsValue = bareTraitRef !== void 0 ? bareTraitRef : { ...props ?? {} };
       const pattern = patternType;
       const converted = convertFnFormLambdasInProps(propsValue, typeof patternType === "string" ? patternType : void 0);
-      if (paint.embedded) {
+      if (paintsInTraitFrame(paint.embedded, paint.slot)) {
         slotsRef.current.updateTraitContent(paint.trait, { pattern, props: converted, slot: paint.slot, priority: 0 });
       } else {
         slotsRef.current.render({ target: paint.slot, pattern, props: converted, sourceTrait: paint.trait });
@@ -28425,13 +28919,13 @@ var GuestView = ({ guest, source, navigate, route, paints, children }) => {
     [paints]
   );
   const sourceOrbital = orbitalsByTrait.get(source);
-  const roots = React51__default.Children.count(children);
+  const roots = React52__default.Children.count(children);
   if (roots > 1) log8.warn("roots:unscoped", { guest, source, roots });
   const main = roots === 1 && sourceOrbital !== void 0 ? /* @__PURE__ */ jsx(TraitScopeProvider, { orbital: sourceOrbital, trait: source, children }) : children;
   return /* @__PURE__ */ jsx(EntitySchemaProvider, { orbitalsByTrait, children: /* @__PURE__ */ jsxs(UISlotProvider, { children: [
     paints !== void 0 && /* @__PURE__ */ jsx(SeedGuestPaints, { paints }),
     inHostRouter ? /* @__PURE__ */ jsx(HostHrefBaseProbe, { onBase: setHostHrefBase }) : null,
-    /* @__PURE__ */ jsx(Box, { ref: frameRef, fullWidth: true, fullHeight: true, className: "relative overflow-auto", children: route === void 0 ? /* @__PURE__ */ jsx(UISlotRenderer, { hudMode: "inline", includeHud: true, main }) : /* @__PURE__ */ jsx(CurrentPagePathProvider, { value: route, children: /* @__PURE__ */ jsx(UISlotRenderer, { hudMode: "inline", includeHud: true, main }) }) })
+    /* @__PURE__ */ jsx(Box, { "data-guest-frame": "", fullWidth: true, fullHeight: true, className: "relative", style: { contain: "layout" }, children: /* @__PURE__ */ jsx(Box, { ref: frameRef, fullWidth: true, fullHeight: true, className: "relative overflow-auto", children: route === void 0 ? /* @__PURE__ */ jsx(UISlotRenderer, { hudMode: "inline", includeHud: true, main }) : /* @__PURE__ */ jsx(CurrentPagePathProvider, { value: route, children: /* @__PURE__ */ jsx(UISlotRenderer, { hudMode: "inline", includeHud: true, main }) }) }) })
   ] }) });
 };
 GuestView.displayName = "GuestView";
@@ -28694,7 +29188,7 @@ var ImportPreviewTree = ({
   const renderUnit = (unit, childrenByParent, depth) => {
     const summary = fieldSummary(unit);
     const children = childrenByParent.get(unit.ref) ?? [];
-    return /* @__PURE__ */ jsxs(React51__default.Fragment, { children: [
+    return /* @__PURE__ */ jsxs(React52__default.Fragment, { children: [
       /* @__PURE__ */ jsxs(
         Box,
         {
@@ -28784,7 +29278,7 @@ var ImportProgress = ({
       PIPELINE.map((key, index) => {
         const isComplete = index < currentIndex;
         const isActive = index === currentIndex;
-        return /* @__PURE__ */ jsxs(React51__default.Fragment, { children: [
+        return /* @__PURE__ */ jsxs(React52__default.Fragment, { children: [
           index > 0 ? /* @__PURE__ */ jsx(Box, { className: "h-px w-4 bg-border" }) : null,
           /* @__PURE__ */ jsxs(
             Box,
@@ -29007,7 +29501,7 @@ var questionSizes = {
   md: "text-base",
   lg: "text-lg"
 };
-var LikertScale = React51__default.forwardRef(
+var LikertScale = React52__default.forwardRef(
   ({
     question,
     options: optionsProp,
@@ -29020,7 +29514,7 @@ var LikertScale = React51__default.forwardRef(
     className,
     ...rest
   }, ref) => {
-    const groupId = React51__default.useId();
+    const groupId = React52__default.useId();
     const eventBus = useEventBus();
     const { t } = useTranslate();
     const options = optionsProp ?? DEFAULT_LIKERT_OPTION_KEYS.map((o) => ({ value: o.value, label: t(o.labelKey) }));
@@ -29509,6 +30003,7 @@ var AvlOrbitalMachine = ({
   selectedTrait = "",
   selectEvent,
   pickEvent,
+  focusTarget = null,
   maxHeight = "calc(100vh - 9rem)",
   direction = "ltr",
   className,
@@ -29541,24 +30036,38 @@ var AvlOrbitalMachine = ({
   }, [eventBus, selectEvent]);
   const hosts = useTraitScopeChain();
   const pickable = useMemo(() => orbital.traits.map((tr) => tr.trait).filter((name) => !hosts.some((h2) => h2.trait === name)), [orbital, hosts]);
-  const pick = useCallback((trait) => {
-    setInspecting(false);
+  const reveal = useCallback((trait, at) => {
     const chain = [];
     for (let name = trait; name !== null && !chain.includes(name); name = orbital.traits.find((tr) => tr.trait === name)?.parent ?? null) chain.push(name);
     setOpen((s) => /* @__PURE__ */ new Set([...s, ...chain]));
     setClosed((s) => new Set([...s].filter((name) => !chain.includes(name))));
-    setFocus({ trait, after: layoutRef.current });
+    if (at !== null && at.from === at.to) setOpenLoops((s) => toggled(s, loopKey(trait, at.from), true));
+    setFocus({ trait, at, after: layoutRef.current });
+  }, [orbital]);
+  const pick = useCallback((trait) => {
+    setInspecting(false);
+    reveal(trait, null);
     if (pickEvent) eventBus.emit(`UI:${pickEvent}`, { trait });
-  }, [eventBus, pickEvent, orbital]);
+  }, [eventBus, pickEvent, reveal]);
   const stopInspecting = useCallback(() => setInspecting(false), []);
   const inspected = useTraitInspector({ active: inspecting, pickable, exclude: rootRef, onPick: pick, onCancel: stopInspecting });
   useEffect(() => {
     layoutRef.current = layout;
     if (focus === null || layout === null || layout === focus.after) return;
     setFocus(null);
-    const box = hostRef.current?.querySelector(`[data-testid="avl-om-box"][data-trait="${CSS.escape(focus.trait)}"]`);
-    box?.scrollIntoView({ block: "center", inline: "center", behavior: reduceMotion ? "auto" : "smooth" });
+    const host = hostRef.current;
+    if (host === null) return;
+    const trait = CSS.escape(focus.trait);
+    const at = focus.at !== null && focus.at.event !== "" ? focus.at : null;
+    const found = at === null ? null : host.querySelector(`[data-testid="avl-om-label"][data-trait="${trait}"][data-event="${CSS.escape(at.event)}"][data-from="${CSS.escape(at.from)}"][data-to="${CSS.escape(at.to)}"]`) ?? host.querySelector(`[data-testid="avl-om-loop-event"][data-trait="${trait}"][data-state="${CSS.escape(at.from)}"][data-event="${CSS.escape(at.event)}"]`);
+    const target = found ?? host.querySelector(`[data-testid="avl-om-box"][data-trait="${trait}"]`);
+    target?.scrollIntoView({ block: "center", inline: "center", behavior: reduceMotion ? "auto" : "smooth" });
   }, [focus, layout, reduceMotion]);
+  const focusKey = focusTarget === null ? "" : JSON.stringify(focusTarget);
+  useEffect(() => {
+    if (focusTarget === null) return;
+    reveal(focusTarget.trait, { event: focusTarget.event, from: focusTarget.from, to: focusTarget.to });
+  }, [focusKey]);
   const setExpanded = useCallback((trait, expanded) => {
     setOpen((s) => toggled(s, trait, expanded));
     setClosed((s) => toggled(s, trait, !expanded));
@@ -29868,6 +30377,8 @@ var AvlOrbitalMachine = ({
               "data-testid": "avl-om-label",
               "data-trait": e.trait,
               "data-event": e.event,
+              "data-from": e.from,
+              "data-to": e.to,
               "data-next": next ? "true" : "false",
               className: "absolute flex items-center justify-center rounded-md px-2",
               style: {
@@ -29987,6 +30498,10 @@ var AvlOrbitalMachine = ({
                   Box,
                   {
                     as: "span",
+                    "data-testid": "avl-om-loop-event",
+                    "data-trait": s.trait,
+                    "data-state": s.name,
+                    "data-event": ev.event,
                     "data-fired": onRoute(s.trait, ev.index) ? "true" : "false",
                     className: "whitespace-nowrap",
                     style: { lineHeight: `${LOOP_LINE}px`, color: onRoute(s.trait, ev.index) ? AVL_INK.focus : active ? AVL_INK.text : AVL_INK.quiet, fontWeight: onRoute(s.trait, ev.index) ? 600 : 400 },
@@ -30004,13 +30519,13 @@ var AvlOrbitalMachine = ({
   ] });
 };
 AvlOrbitalMachine.displayName = "AvlOrbitalMachine";
-var StateMachineView = ({ trait, description, orbital = null, activeStates, firedTransition, route, expandDepth, selectedTrait, selectEvent, pickEvent, maxHeight, isLoading = false, error = null, className, ...rest }) => {
+var StateMachineView = ({ trait, description, orbital = null, activeStates, firedTransition, route, expandDepth, selectedTrait, selectEvent, pickEvent, focusTarget, maxHeight, isLoading = false, error = null, className, ...rest }) => {
   const { t } = useTranslate();
   const drawn = trait ?? (description ? traitLevelFromDescription(description) : null);
   if (isLoading) return /* @__PURE__ */ jsx(LoadingState, { message: t("stateMachine.loading") });
   if (error) return /* @__PURE__ */ jsx(ErrorState, { message: error instanceof Error ? error.message : String(error) });
   if (orbital !== null && orbital.traits.length > 0) {
-    return /* @__PURE__ */ jsx(AvlOrbitalMachine, { orbital, activeStates, firedTransition, route, expandDepth, selectedTrait, selectEvent, pickEvent, maxHeight, direction: rest.direction, className });
+    return /* @__PURE__ */ jsx(AvlOrbitalMachine, { orbital, activeStates, firedTransition, route, expandDepth, selectedTrait, selectEvent, pickEvent, focusTarget, maxHeight, direction: rest.direction, className });
   }
   if (!drawn) {
     return /* @__PURE__ */ jsx(Box, { "data-testid": "state-machine-view-empty", padding: "lg", className: "text-center", children: /* @__PURE__ */ jsx(Typography, { variant: "body", color: "muted", children: t("stateMachine.noStateMachine") }) });
@@ -30100,7 +30615,7 @@ var TraitCardNodeInner = (props) => {
     }
   );
 };
-var TraitCardNode = React51__default.memo(TraitCardNodeInner);
+var TraitCardNode = React52__default.memo(TraitCardNodeInner);
 TraitCardNode.displayName = "TraitCardNode";
 var SystemMapContext = createContext({});
 function useOpenTraits(map) {
@@ -30175,14 +30690,14 @@ var SystemNodeInner = ({ data }) => {
     }
   );
 };
-var SystemNode = React51__default.memo(SystemNodeInner);
+var SystemNode = React52__default.memo(SystemNodeInner);
 SystemNode.displayName = "SystemNode";
 var SystemBandNodeInner = ({ data }) => {
   const d = data;
   const { t } = useTranslate();
   return /* @__PURE__ */ jsx(Box, { "data-testid": `avl-system-band-${d.bandKind}`, className: "pointer-events-none whitespace-nowrap", children: /* @__PURE__ */ jsx(Typography, { variant: "overline", color: "muted", children: t(d.bandKind === "connected" ? "avl.system.connected" : "avl.system.standalone", { count: d.bandCount ?? 0 }) }) });
 };
-var SystemBandNode = React51__default.memo(SystemBandNodeInner);
+var SystemBandNode = React52__default.memo(SystemBandNodeInner);
 SystemBandNode.displayName = "SystemBandNode";
 var DEPENDENCY_ROLE_CLASS = {
   selected: "border-primary bg-primary/25 text-foreground ring-2 ring-primary/40",
@@ -30240,14 +30755,14 @@ var DependencyNodeInner = ({ id, data }) => {
     }
   );
 };
-var DependencyNode = React51__default.memo(DependencyNodeInner);
+var DependencyNode = React52__default.memo(DependencyNodeInner);
 DependencyNode.displayName = "DependencyNode";
 var DependencyColumnNodeInner = ({ data }) => {
   const d = data;
   const { t } = useTranslate();
   return /* @__PURE__ */ jsx(Box, { "data-testid": `avl-dependency-column-${d.dependencyColumn}`, className: "pointer-events-none whitespace-nowrap", children: /* @__PURE__ */ jsx(Typography, { variant: "overline", color: "muted", children: t(`avl.deps.column.${d.dependencyColumn ?? "unknown"}`) }) });
 };
-var DependencyColumnNode = React51__default.memo(DependencyColumnNodeInner);
+var DependencyColumnNode = React52__default.memo(DependencyColumnNodeInner);
 DependencyColumnNode.displayName = "DependencyColumnNode";
 
 // src/lib/avl-dependency-graph.ts
@@ -30396,7 +30911,7 @@ var EventFlowEdgeInner = (props) => {
     ) })
   ] });
 };
-var EventFlowEdge = React51__default.memo(EventFlowEdgeInner);
+var EventFlowEdge = React52__default.memo(EventFlowEdgeInner);
 EventFlowEdge.displayName = "EventFlowEdge";
 var AVL_GRAPH_NODE_TYPES = {
   dependency: DependencyNode,
@@ -30574,19 +31089,19 @@ function FlowCanvasInner({
   const fitPadding = systemLevel || flowLens ? 0.08 : 0.25;
   const compact = useCompactLayout();
   const [scope, setScope] = useState("local");
-  const scopeRef = React51__default.useRef(scope);
+  const scopeRef = React52__default.useRef(scope);
   scopeRef.current = scope;
   const [focusRequest, setFocusRequest] = useState(focusedOrbitalProp ?? initialOrbital);
   const [stateByOrbital, setStateByOrbital] = useState({});
-  const fitFocusedRef = React51__default.useRef(false);
-  const pendingFitRef = React51__default.useRef(null);
-  const fittedViewRef = React51__default.useRef(null);
+  const fitFocusedRef = React52__default.useRef(false);
+  const pendingFitRef = React52__default.useRef(null);
+  const fittedViewRef = React52__default.useRef(null);
   useEffect(() => {
     if (focusedOrbitalProp === void 0) return;
     fitFocusedRef.current = true;
     setFocusRequest(focusedOrbitalProp);
   }, [focusedOrbitalProp]);
-  const screenSizeUserOverrideRef = React51__default.useRef(false);
+  const screenSizeUserOverrideRef = React52__default.useRef(false);
   const [screenSize, setScreenSize] = useState(
     () => typeof window === "undefined" ? "laptop" : detectScreenSize(window.innerWidth)
   );
@@ -30743,9 +31258,9 @@ function FlowCanvasInner({
   const [edges, setEdges, onEdgesChange] = useEdgesState(activeEdges);
   const reactFlow = useReactFlow();
   const cameraMs = usePrefersReducedMotion() ? 0 : 300;
-  const savedPositionsRef = React51__default.useRef(nodePositions);
+  const savedPositionsRef = React52__default.useRef(nodePositions);
   savedPositionsRef.current = nodePositions;
-  const nodesRef = React51__default.useRef(nodes);
+  const nodesRef = React52__default.useRef(nodes);
   nodesRef.current = nodes;
   useEffect(() => {
     setEdges([]);
@@ -30765,7 +31280,7 @@ function FlowCanvasInner({
     }
     fitFocusedRef.current = false;
   }, [activeNodes, activeEdges, setNodes, setEdges, scope, focusedOrbital, screenSize, systemLevel, wiresOnly, dependencyLens, traitLevel, flowLens, traitFilter]);
-  const frameRef = React51__default.useRef(null);
+  const frameRef = React52__default.useRef(null);
   useEffect(() => {
     const frame = frameRef.current;
     if (!fitOnResize || !frame) return;
@@ -30905,7 +31420,7 @@ function FlowCanvasInner({
       targetTraitName: tgtData.traitName
     });
   }, [nodes, onEventWire, eventBus]);
-  const worldPositionsRef = React51__default.useRef(canvas.worldPositions);
+  const worldPositionsRef = React52__default.useRef(canvas.worldPositions);
   worldPositionsRef.current = canvas.worldPositions;
   const placementsOf = useCallback((list) => {
     const positions = { ...savedPositionsRef.current };
@@ -31254,23 +31769,23 @@ var FLOW_COLUMN = "min-w-0 min-h-0 w-auto basis-0 grow-[1.6] transition-[flex-gr
 var FLOW_ONLY = { lens: "flow", filter: null };
 function MachinePanel({ schema, transitions, describe: describe2, descriptions, behavior, replayStepMs = 800, dependencies }) {
   const { t } = useTranslate();
-  const entries = React51.useMemo(() => programTraits(schema), [schema]);
-  const ran = React51.useMemo(() => {
+  const entries = React52.useMemo(() => programTraits(schema), [schema]);
+  const ran = React52.useMemo(() => {
     const names = new Set(entries.map((e) => e.level.name));
     return transitions.filter((h) => names.has(h.traitName));
   }, [entries, transitions]);
-  const [pinned, setPinned] = React51.useState(null);
-  const [replay, setReplay] = React51.useState(null);
-  const [described, setDescribed] = React51.useState(/* @__PURE__ */ new Map());
+  const [pinned, setPinned] = React52.useState(null);
+  const [replay, setReplay] = React52.useState(null);
+  const [described, setDescribed] = React52.useState(/* @__PURE__ */ new Map());
   const latest = ran[ran.length - 1]?.traitName;
   const name = pinned ?? latest ?? entries[0]?.level.name;
   const entry = entries.find((e) => e.level.name === name);
-  const selectedUnit = React51.useMemo(() => entry ? traitFlowGraph(schema, entry.orbital).units.find((unit) => [...unit.traits, ...unit.renderPieces].includes(entry.level.name)) : void 0, [schema, entry]);
-  const hops = React51.useMemo(() => ran.filter((h) => h.traitName === name), [ran, name]);
+  const selectedUnit = React52.useMemo(() => entry ? traitFlowGraph(schema, entry.orbital).units.find((unit) => [...unit.traits, ...unit.renderPieces].includes(entry.level.name)) : void 0, [schema, entry]);
+  const hops = React52.useMemo(() => ran.filter((h) => h.traitName === name), [ran, name]);
   const value = entry ? describedValue(entry, behavior) : null;
   const key = value ? `${value.behavior}.traits.${value.trait}` : null;
   const source = key && descriptions?.[key] ? { status: "ready", description: descriptions[key] } : key ? described.get(key) : void 0;
-  React51.useEffect(() => {
+  React52.useEffect(() => {
     if (!describe2 || !value || !key || descriptions?.[key] || described.has(key)) return;
     setDescribed((prev) => new Map(prev).set(key, { status: "loading" }));
     describe2(value).then(
@@ -31278,7 +31793,7 @@ function MachinePanel({ schema, transitions, describe: describe2, descriptions,
       (error) => setDescribed((prev) => new Map(prev).set(key, { status: "failed", error: error.message }))
     );
   }, [describe2, descriptions, value, key, described]);
-  React51.useEffect(() => {
+  React52.useEffect(() => {
     if (!replay?.playing) return;
     const timer = setTimeout(() => {
       setReplay((r) => r ? r.step + 1 < hops.length ? { step: r.step + 1, playing: r.step + 2 < hops.length } : { ...r, playing: false } : r);
@@ -31723,7 +32238,7 @@ var MediaGallery = ({
     [selectable, selectedItems, selectionEvent, eventBus]
   );
   const entityData = Array.isArray(entity) ? entity : [];
-  const items = React51__default.useMemo(() => {
+  const items = React52__default.useMemo(() => {
     if (propItems && propItems.length > 0) return propItems;
     if (entityData.length === 0) return [];
     return entityData.map((record, idx) => {
@@ -32087,7 +32602,7 @@ var Meter = ({
 };
 Meter.displayName = "Meter";
 function extractTitle2(children) {
-  if (!React51__default.isValidElement(children)) return void 0;
+  if (!React52__default.isValidElement(children)) return void 0;
   const props = children.props;
   if (typeof props.title === "string") {
     return props.title;
@@ -34130,7 +34645,7 @@ var RepeatableFormSection = ({
 };
 RepeatableFormSection.displayName = "RepeatableFormSection";
 function useDebugData() {
-  const [data, setData] = React51.useState(() => ({
+  const [data, setData] = React52.useState(() => ({
     traits: [],
     ticks: [],
     guards: [],
@@ -34144,7 +34659,7 @@ function useDebugData() {
     },
     lastUpdate: Date.now()
   }));
-  React51.useEffect(() => {
+  React52.useEffect(() => {
     const updateData = () => {
       setData({
         traits: getAllTraits(),
@@ -34374,15 +34889,15 @@ var TYPE_BADGES = {
 };
 function EventFlowTab({ events }) {
   const { t, locale } = useTranslate();
-  const [filter, setFilter] = React51.useState("all");
-  const containerRef = React51.useRef(null);
-  const [autoScroll, setAutoScroll] = React51.useState(true);
-  React51.useEffect(() => {
+  const [filter, setFilter] = React52.useState("all");
+  const containerRef = React52.useRef(null);
+  const [autoScroll, setAutoScroll] = React52.useState(true);
+  React52.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
   }, [events.length, autoScroll]);
-  const filteredEvents = React51.useMemo(() => {
+  const filteredEvents = React52.useMemo(() => {
     if (filter === "all") return events;
     return events.filter((e) => e.type === filter);
   }, [events, filter]);
@@ -34478,7 +34993,7 @@ function EventFlowTab({ events }) {
 EventFlowTab.displayName = "EventFlowTab";
 function GuardsPanel({ guards }) {
   const { t, locale } = useTranslate();
-  const [filter, setFilter] = React51.useState("all");
+  const [filter, setFilter] = React52.useState("all");
   if (guards.length === 0) {
     return /* @__PURE__ */ jsx(
       EmptyState,
@@ -34491,7 +35006,7 @@ function GuardsPanel({ guards }) {
   }
   const passedCount = guards.filter((g) => g.result).length;
   const failedCount = guards.length - passedCount;
-  const filteredGuards = React51.useMemo(() => {
+  const filteredGuards = React52.useMemo(() => {
     if (filter === "all") return guards;
     if (filter === "passed") return guards.filter((g) => g.result);
     return guards.filter((g) => !g.result);
@@ -34618,10 +35133,10 @@ function EffectBadge({ effect }) {
 }
 function TransitionTimeline({ transitions }) {
   const { t, locale } = useTranslate();
-  const containerRef = React51.useRef(null);
-  const [autoScroll, setAutoScroll] = React51.useState(true);
-  const [expandedId, setExpandedId] = React51.useState(null);
-  React51.useEffect(() => {
+  const containerRef = React52.useRef(null);
+  const [autoScroll, setAutoScroll] = React52.useState(true);
+  const [expandedId, setExpandedId] = React52.useState(null);
+  React52.useEffect(() => {
     if (autoScroll && containerRef.current) {
       containerRef.current.scrollTop = containerRef.current.scrollHeight;
     }
@@ -34877,9 +35392,9 @@ function getAllEvents(traits) {
 function EventDispatcherTab({ traits, schema }) {
   const eventBus = useEventBus();
   const { t } = useTranslate();
-  const [log16, setLog] = React51.useState([]);
-  const prevStatesRef = React51.useRef(/* @__PURE__ */ new Map());
-  React51.useEffect(() => {
+  const [log16, setLog] = React52.useState([]);
+  const prevStatesRef = React52.useRef(/* @__PURE__ */ new Map());
+  React52.useEffect(() => {
     for (const trait of traits) {
       const prev = prevStatesRef.current.get(trait.id);
       if (prev && prev !== trait.currentState) {
@@ -34968,7 +35483,7 @@ function VerifyModePanel({
   dependencies
 }) {
   const { t } = useTranslate();
-  const [expanded, setExpanded] = React51.useState(true);
+  const [expanded, setExpanded] = React52.useState(true);
   const hudBottom = typeof document !== "undefined" ? document.getElementById("runtime-debugger-portal") : null;
   const panel = /* @__PURE__ */ jsxs(
     "div",
@@ -35023,10 +35538,10 @@ function RuntimeDebugger({
 }) {
   const a11y = domPassthrough(rest);
   const { t } = useTranslate();
-  const [isCollapsed, setIsCollapsed] = React51.useState(mode === "verify" ? true : defaultCollapsed);
-  const [isVisible, setIsVisible] = React51.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
+  const [isCollapsed, setIsCollapsed] = React52.useState(mode === "verify" ? true : defaultCollapsed);
+  const [isVisible, setIsVisible] = React52.useState(mode === "inline" || mode === "verify" || isDebugEnabled2());
   const debugData = useDebugData();
-  React51.useEffect(() => {
+  React52.useEffect(() => {
     if (mode === "inline") return;
     return onDebugToggle((enabled) => {
       setIsVisible(enabled);
@@ -35035,7 +35550,7 @@ function RuntimeDebugger({
       }
     });
   }, [mode]);
-  React51.useEffect(() => {
+  React52.useEffect(() => {
     if (mode === "inline") return;
     const handleKeyDown = (e) => {
       if (e.key === "`" && isVisible) {
@@ -35369,7 +35884,7 @@ var Section = ({
 }) => {
   const hasHeader = title || description || action;
   const wrap = (node) => variant === "card" ? /* @__PURE__ */ jsx(SurfaceBoundary, { children: node }) : node;
-  return React51__default.createElement(
+  return React52__default.createElement(
     Component,
     {
       ...domPassthrough(rest),
@@ -35420,7 +35935,6 @@ var Section = ({
 Section.displayName = "Section";
 var SegmentRenderer = ({
   segments: segmentsProp,
-  lesson,
   activationSaveEvent,
   reflectionSaveEvent,
   bloomAnswerEvent,
@@ -35440,10 +35954,7 @@ var SegmentRenderer = ({
   onRenderVisualization,
   ...rest
 }) => {
-  const segments = useMemo(
-    () => lesson !== void 0 ? parseLessonSegments(lesson) : segmentsProp ?? [],
-    [lesson, segmentsProp]
-  );
+  const segments = useMemo(() => segmentsProp ?? [], [segmentsProp]);
   const annotationOwner = useMemo(() => {
     const owner = /* @__PURE__ */ new Map();
     for (const annotation of annotations ?? []) {
@@ -35638,7 +36149,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(React51__default.Fragment, { children: [
+      return /* @__PURE__ */ jsxs(React52__default.Fragment, { children: [
         i > 0 && /* @__PURE__ */ jsx(
           Typography,
           {
@@ -36075,7 +36586,7 @@ function SequenceBar({
     onSlotRemove?.(index);
   }, [emit, slotRemoveEvent, onSlotRemove, playing]);
   const paddedSlots = Array.from({ length: maxSlots }, (_, i) => slots[i]);
-  return /* @__PURE__ */ jsx(HStack, { ...domPassthrough(rest), className: cn("items-center", className), gap: "sm", children: paddedSlots.map((slot, i) => /* @__PURE__ */ jsxs(React51__default.Fragment, { children: [
+  return /* @__PURE__ */ jsx(HStack, { ...domPassthrough(rest), className: cn("items-center", className), gap: "sm", children: paddedSlots.map((slot, i) => /* @__PURE__ */ jsxs(React52__default.Fragment, { children: [
     i > 0 && /* @__PURE__ */ jsx(
       Typography,
       {
@@ -36913,7 +37424,7 @@ var StatCard = ({
   const eventBus = useEventBus();
   const { t, locale } = useTranslate();
   const fmt = useFormatContext();
-  const handleActionClick = React51__default.useCallback(() => {
+  const handleActionClick = React52__default.useCallback(() => {
     if (action?.event) {
       eventBus.emit(`UI:${action.event}`, {});
     }
@@ -36924,7 +37435,7 @@ var StatCard = ({
   const data = Array.isArray(entity) ? entity : entity ? [entity] : [];
   const isLoading = externalLoading ?? false;
   const error = externalError;
-  const computeMetricValue = React51__default.useCallback(
+  const computeMetricValue = React52__default.useCallback(
     (metric, items) => {
       if (metric.value !== void 0) return metric.value;
       const rows = metric.filter ? items.filter((item) => item[metric.filter.field] === metric.filter.equals) : items;
@@ -36938,7 +37449,7 @@ var StatCard = ({
     },
     []
   );
-  const schemaStats = React51__default.useMemo(() => {
+  const schemaStats = React52__default.useMemo(() => {
     if (!metrics || metrics.length === 0) return null;
     return metrics.map((metric) => ({
       label: metric.label,
@@ -36946,7 +37457,7 @@ var StatCard = ({
       format: metric.format
     }));
   }, [metrics, data, computeMetricValue]);
-  const calculatedTrend = React51__default.useMemo(() => {
+  const calculatedTrend = React52__default.useMemo(() => {
     if (manualTrend !== void 0) return manualTrend;
     if (previousValue === void 0 || currentValue === void 0)
       return void 0;
@@ -37185,7 +37696,7 @@ function StateGraph({
   className,
   ...rest
 }) {
-  const trait = React51.useMemo(() => ({
+  const trait = React52.useMemo(() => ({
     name: "StateGraph",
     linkedEntity: "",
     states: (states ?? []).map((name) => ({ name, isInitial: name === initialState, isTerminal: false })),
@@ -37446,8 +37957,8 @@ var InlineActivityRow = ({ activity }) => {
   ] });
 };
 var InlineActivityStream = ({ activities, autoScroll = true, className }) => {
-  const endRef = React51__default.useRef(null);
-  React51__default.useEffect(() => {
+  const endRef = React52__default.useRef(null);
+  React52__default.useEffect(() => {
     if (!autoScroll) return;
     endRef.current?.scrollIntoView({ behavior: "smooth", block: "end" });
   }, [activities.length, autoScroll]);
@@ -37559,7 +38070,7 @@ var OrbitalGroup = ({ orbitalName, subagents }) => {
 };
 var SubagentRichCard = ({ subagent }) => {
   const { t } = useTranslate();
-  const activities = React51__default.useMemo(
+  const activities = React52__default.useMemo(
     () => subagentMessagesToActivities(subagent.messages),
     [subagent.messages]
   );
@@ -37636,8 +38147,8 @@ var ChatMessageRow = ({ message, index }) => {
   ] });
 };
 var CoordinatorConversation = ({ messages, autoScroll = true, className }) => {
-  const endRef = React51__default.useRef(null);
-  React51__default.useEffect(() => {
+  const endRef = React52__default.useRef(null);
+  React52__default.useEffect(() => {
     if (!autoScroll) return;
     endRef.current?.scrollIntoView({ behavior: "smooth", block: "end" });
   }, [messages.length, autoScroll]);
@@ -38319,7 +38830,7 @@ function TimerDisplay({
 }
 TimerDisplay.displayName = "TimerDisplay";
 function extractToastProps(children) {
-  if (!React51__default.isValidElement(children)) {
+  if (!React52__default.isValidElement(children)) {
     if (typeof children === "string") {
       return { message: children };
     }
@@ -38357,7 +38868,7 @@ var ToastSlot = ({
     eventBus.emit(`${prefix}CLOSE`);
   };
   if (!isVisible) return null;
-  const isCustomContent = React51__default.isValidElement(children) && !message;
+  const isCustomContent = React52__default.isValidElement(children) && !message;
   const toast = /* @__PURE__ */ jsx(Box, { ...domPassthrough(rest), className: contained ? "absolute bottom-4 right-4 z-50" : "fixed bottom-4 right-4 z-50", children: isCustomContent ? children : /* @__PURE__ */ jsx(
     Toast,
     {
@@ -38679,7 +39190,7 @@ var VersionDiffInner = ({
     }) }) })
   ] }) });
 };
-var VersionDiff = React51__default.memo(VersionDiffInner);
+var VersionDiff = React52__default.memo(VersionDiffInner);
 VersionDiff.displayName = "VersionDiff";
 var actionTypeLabelKeys = {
   measure: "violationAlert.actionType.measure",
@@ -38971,7 +39482,7 @@ function isComponentType(value) {
   return typeof value === "function";
 }
 function lazyChunk(name, loader) {
-  const Lazy = React51__default.lazy(
+  const Lazy = React52__default.lazy(
     () => loader().then((m) => {
       const raw = m[name];
       if (!isComponentType(raw)) {
@@ -38981,20 +39492,20 @@ function lazyChunk(name, loader) {
     })
   );
   function ChunkWrapper(props) {
-    return React51__default.createElement(React51__default.Suspense, { fallback: null }, React51__default.createElement(Lazy, props));
+    return React52__default.createElement(React52__default.Suspense, { fallback: null }, React52__default.createElement(Lazy, props));
   }
   ChunkWrapper.displayName = `Lazy(${name})`;
   return ChunkWrapper;
 }
-var AvlGlyph2 = lazyChunk("AvlGlyph", () => import('./AvlGlyph-PIXU6QH5.js'));
-var AvlStateMachine2 = lazyChunk("AvlStateMachine", () => import('./AvlStateMachine-CKGMECMG.js'));
-var AvlTransitionDetail = lazyChunk("AvlTransitionDetail", () => import('./AvlTransitionDetail-QZX6G5KJ.js'));
-var AvlTransitionExplainer = lazyChunk("AvlTransitionExplainer", () => import('./AvlTransitionExplainer-26WLEIC6.js'));
-var BehaviorView = lazyChunk("BehaviorView", () => import('./BehaviorView-JLZ4PKWY.js'));
-var FlowCanvas2 = lazyChunk("FlowCanvas", () => import('./FlowCanvas-RPII4V24.js'));
-var LayersPanel = lazyChunk("LayersPanel", () => import('./LayersPanel-M2LHWUFF.js'));
-var ModuleCard = lazyChunk("ModuleCard", () => import('./ModuleCard-NJD6JQGD.js'));
-var OrbInspector2 = lazyChunk("OrbInspector", () => import('./OrbInspector-OWWKPOBF.js'));
+var AvlGlyph2 = lazyChunk("AvlGlyph", () => import('./AvlGlyph-KZMJDBEB.js'));
+var AvlStateMachine2 = lazyChunk("AvlStateMachine", () => import('./AvlStateMachine-KVZMFHFU.js'));
+var AvlTransitionDetail = lazyChunk("AvlTransitionDetail", () => import('./AvlTransitionDetail-7DVGV27I.js'));
+var AvlTransitionExplainer = lazyChunk("AvlTransitionExplainer", () => import('./AvlTransitionExplainer-RMJ5LQLK.js'));
+var BehaviorView = lazyChunk("BehaviorView", () => import('./BehaviorView-EYRPME67.js'));
+var FlowCanvas2 = lazyChunk("FlowCanvas", () => import('./FlowCanvas-J54627TC.js'));
+var LayersPanel = lazyChunk("LayersPanel", () => import('./LayersPanel-PSXI4EHG.js'));
+var ModuleCard = lazyChunk("ModuleCard", () => import('./ModuleCard-TNRLL45H.js'));
+var OrbInspector2 = lazyChunk("OrbInspector", () => import('./OrbInspector-UBEQWWZ2.js'));
 var COMPONENT_REGISTRY = {
   get "Accordion"() {
     return Accordion;
@@ -39809,7 +40320,7 @@ function SuspenseConfigProvider({
   config,
   children
 }) {
-  return React51__default.createElement(
+  return React52__default.createElement(
     SuspenseConfigContext.Provider,
     { value: config },
     children
@@ -39999,7 +40510,10 @@ function UISlotComponent(props) {
   const inner = /* @__PURE__ */ jsx(RenderSlotProvider, { slot: props.slot, children: /* @__PURE__ */ jsx(PendingScopeContext.Provider, { value: pendingScope, children: /* @__PURE__ */ jsx(UISlotComponentInner, { ...props }) }) });
   return props.slot === "system" ? /* @__PURE__ */ jsx(Box, { className: "sr-only", children: inner }) : inner;
 }
-function UISlotComponentInner({
+function UISlotComponentInner(props) {
+  return /* @__PURE__ */ jsx(ErrorBoundary, { children: /* @__PURE__ */ jsx(ResolvedSlotContent, { ...props }) });
+}
+function ResolvedSlotContent({
   slot,
   portal = false,
   position,
@@ -40506,10 +41020,10 @@ function renderPatternChildren(children, onDismiss, parentId = "root", parentPat
         const key = `${parentId}-${index}-trait:${traitName}`;
         return /* @__PURE__ */ jsx(TraitFrame, { traitName }, key);
       }
-      return /* @__PURE__ */ jsx(React51__default.Fragment, { children: child }, `${parentId}-${index}`);
+      return /* @__PURE__ */ jsx(React52__default.Fragment, { children: child }, `${parentId}-${index}`);
     }
     if (!child || typeof child !== "object") return null;
-    if (React51__default.isValidElement(child)) return /* @__PURE__ */ jsx(React51__default.Fragment, { children: child }, `${parentId}-${index}`);
+    if (React52__default.isValidElement(child)) return /* @__PURE__ */ jsx(React52__default.Fragment, { children: child }, `${parentId}-${index}`);
     const childId = `${parentId}-${index}`;
     const childPath = parentPath === "root" ? `root.children.${index}` : `${parentPath}.children.${index}`;
     const childAsRecord = child;
@@ -40569,7 +41083,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 (React51__default.isValidElement(value)) return false;
+  if (React52__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   if (typeof value === "function") return false;
   const record = value;
@@ -40586,9 +41100,9 @@ function renderPatternValue(value) {
   if (typeof value === "string") return renderPatternChildren(value, () => {
   });
   if (value instanceof Date) return /* @__PURE__ */ jsx(PatternDate, { value });
-  if (React51__default.isValidElement(value)) return value;
+  if (React52__default.isValidElement(value)) return value;
   if (Array.isArray(value)) {
-    return value.map((item, index) => /* @__PURE__ */ jsx(React51__default.Fragment, { children: renderPatternValue(item) }, index));
+    return value.map((item, index) => /* @__PURE__ */ jsx(React52__default.Fragment, { children: renderPatternValue(item) }, index));
   }
   if (isPatternConfig(value)) {
     const { type, ...props } = value;
@@ -40598,7 +41112,7 @@ function renderPatternValue(value) {
   return null;
 }
 function isPlainConfigObject(value) {
-  if (React51__default.isValidElement(value)) return false;
+  if (React52__default.isValidElement(value)) return false;
   if (value instanceof Date) return false;
   const proto = Object.getPrototypeOf(value);
   return proto === Object.prototype || proto === null;
@@ -40795,7 +41309,7 @@ function SlotContentRenderer({
     for (const slotKey of CONTENT_NODE_SLOTS) {
       const slotVal = restProps[slotKey];
       if (slotVal === void 0 || slotVal === null) continue;
-      if (React51__default.isValidElement(slotVal) || typeof slotVal === "string" || typeof slotVal === "number" || typeof slotVal === "boolean") continue;
+      if (React52__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(
@@ -40849,7 +41363,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) && !React51__default.isValidElement(sample) && !(sample instanceof Date)) {
+      if (sample && typeof sample === "object" && !Array.isArray(sample) && !React52__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" }));
       }
@@ -41314,7 +41828,7 @@ function memoryTraitDefinitions(surface) {
 // src/lib/kernel-client-lazy.ts
 function createLazyKernelClient(opts) {
   let loaded;
-  const client = import('./kernel-client-JW6OH5FX.js').then((m) => loaded = m.createKernelClient(opts));
+  const client = import('./kernel-client-NMZ56JVU.js').then((m) => loaded = m.createKernelClient(opts));
   client.catch(() => void 0);
   return {
     store: opts.store,
@@ -41881,11 +42395,17 @@ function useTraitStateMachine(uiSlots, options) {
       const { traitIndex: shown, kernel: running, settleOutcome: settle } = pushRef.current;
       const traitName = request.targetTrait;
       const ownsFrame = (frame) => [...shown.byName.values()].some((entry) => entry.frameKey === frame);
-      if (traitName === void 0 || !hostDispatchInView(request, response, (t2) => shown.byName.has(t2), ownsFrame)) return;
+      if (traitName === void 0 || !hostDispatchInView(request, response, (t2) => shown.byName.has(t2), ownsFrame)) {
+        for (const emitted of response.success ? response.emittedEvents : []) void running.deliverToListeners(emitted);
+        return;
+      }
       void running.foldHostDispatch(request, response).then((outcome) => settle(traitName, request.event, request.payload, outcome));
     }, { clientId: getTabClientId() });
   }, [transport]);
+  const crumbRef = useRef(options.crumb);
+  crumbRef.current = options.crumb;
   const mountAndSettle = useCallback(async (seeds, payload, route) => {
+    const crumb = crumbRef.current;
     let beforeLocalPaint;
     let outcome;
     try {
@@ -41894,7 +42414,7 @@ function useTraitStateMachine(uiSlots, options) {
           if (beforeLocalPaint === void 0) beforeLocalPaint = slotFlush.checkpoint();
           slotFlush.applyClientEffects(local.clientEffectsByTrait, options.navigate, options.navigateBack, activeTraitNamesRef.current);
         }
-      }, { payload, ...route !== void 0 ? { route } : {} });
+      }, { payload, ...route !== void 0 ? { route } : {}, ...crumb !== void 0 ? { crumb } : {} });
     } catch (err) {
       if (beforeLocalPaint !== void 0) slotFlush.rollback(beforeLocalPaint);
       for (const seed of seeds) {
@@ -41931,6 +42451,10 @@ function useTraitStateMachine(uiSlots, options) {
       aliveRef.current = false;
     };
   }, []);
+  const pageTraits = circuit.status === "ready" ? circuit.page.traits : void 0;
+  useEffect(() => {
+    if (pageTraits !== void 0) uiSlots.setDeclaredTraitOrder(pageTraits);
+  }, [pageTraits, uiSlots]);
   const kernelClientRef = useRef(kernelClient);
   kernelClientRef.current = kernelClient;
   useEffect(() => () => {
@@ -41958,10 +42482,15 @@ function useTraitStateMachine(uiSlots, options) {
         const cause = err instanceof TraitMountError ? err.original : err;
         stateLog.warn("mount:failed", { traits, failed, error: message, stack: cause instanceof Error ? cause.stack : void 0 });
         if (!aliveRef.current) return;
+        const refused = err instanceof TransportStatusError ? err : void 0;
         uiSlots.render({
           target: "main",
           pattern: "error-state",
-          props: { title: t("error.traitMountFailed", { trait: failed }), message, "data-testid": TRAIT_MOUNT_ERROR_TESTID },
+          props: {
+            title: refused !== void 0 ? t("error.serverRefused") : t("error.traitMountFailed", { trait: failed }),
+            message: refused?.refusal?.error ?? message,
+            "data-testid": TRAIT_MOUNT_ERROR_TESTID
+          },
           sourceTrait: MOUNT_ERROR_SOURCE
         });
       });
@@ -42064,7 +42593,7 @@ function PageAccessHost({
   if (access === "public") return /* @__PURE__ */ jsx(Fragment, { children });
   if (!gated) return authority === "pending" ? null : /* @__PURE__ */ jsx(Fragment, { children });
   if (authority !== "authenticated") return null;
-  return /* @__PURE__ */ jsx(React51__default.Fragment, { children }, viewerId);
+  return /* @__PURE__ */ jsx(React52__default.Fragment, { children }, viewerId);
 }
 PageAccessHost.displayName = "PageAccessHost";
 function useBrowserStore(appName, orbitals, locale) {
@@ -42239,7 +42768,7 @@ function NavStackRefBridge({ apiRef }) {
   }, [api, apiRef]);
   return null;
 }
-function TraitInitializer({ pageName, routeParams, mountKey, orbitals, metadata, stamp, onNavigate, onNavigateBack, onLocalFallback, localFallbackTimeoutMs, browserStore, hasBridge, children }) {
+function TraitInitializer({ pageName, routePath, crumb, routeParams, mountKey, orbitals, metadata, stamp, onNavigate, onNavigateBack, onLocalFallback, localFallbackTimeoutMs, browserStore, hasBridge, children }) {
   const bridge = useServerBridge();
   const uiSlots = useUISlots();
   useEffect(() => {
@@ -42252,6 +42781,8 @@ function TraitInitializer({ pageName, routeParams, mountKey, orbitals, metadata,
   const { entityBindingSource, awaitingSkeletonSource, circuit, sessionTheme } = useTraitStateMachine(uiSlots, {
     orbitals,
     ...pageName !== void 0 ? { page: pageName } : {},
+    ...routePath !== void 0 ? { routePath } : {},
+    ...crumb !== void 0 ? { crumb } : {},
     ...metadata !== void 0 ? { metadata } : {},
     ...stamp !== void 0 ? { stamp } : {},
     ...onNavigate !== void 0 ? { navigate: onNavigate } : {},
@@ -42344,7 +42875,7 @@ function FitToBox({ children, mode = "box" }) {
     }
   ) });
 }
-function SchemaRunner({ schema, serverUrl, transport, getAccessToken, mockData, pageName, routeParams, onNavigate, onNavigateBack, onLocalFallback, localFallbackTimeoutMs, themeOverride, frame }) {
+function SchemaRunner({ schema, serverUrl, transport, getAccessToken, mockData, pageName, routePath, crumb, routeParams, onNavigate, onNavigateBack, onLocalFallback, localFallbackTimeoutMs, themeOverride, frame }) {
   const stamp = useMemo(() => programStamp(schema), [schema]);
   const activeOrbitalTheme = useMemo(() => resolvePreviewTheme(schema, pageName), [schema, pageName]);
   const { locale } = useTranslate();
@@ -42369,6 +42900,8 @@ function SchemaRunner({ schema, serverUrl, transport, getAccessToken, mockData,
     TraitInitializer,
     {
       pageName,
+      ...routePath !== void 0 ? { routePath } : {},
+      ...crumb !== void 0 ? { crumb } : {},
       routeParams,
       mountKey: pageName,
       orbitals: schema.orbitals,
@@ -42546,6 +43079,8 @@ function OrbPreview({
     return pattern.replace(/:([A-Za-z0-9_]+)/g, (whole, key) => routeParams[key] ?? whole);
   }, [currentPagePath, routeParams]);
   const navStackRef = useRef(null);
+  const [crumbedNavigate, setCrumbedNavigate] = useState(null);
+  const openedCrumb = crumbedNavigate !== null && crumbedNavigate.path === concreteCurrentPath ? crumbedNavigate.crumb : void 0;
   const announcePage = useCallback((path) => {
     if (onPageChange) {
       onPageChange(path);
@@ -42624,6 +43159,7 @@ function OrbPreview({
   const handleNavigateEffect = useCallback(
     (path, params, crumb) => {
       navStackRef.current?.beginNavigate(path, crumb);
+      setCrumbedNavigate(crumb !== void 0 && crumb !== "" ? { path, crumb } : null);
       handleNavigate(path, params);
     },
     [handleNavigate]
@@ -42714,6 +43250,8 @@ function OrbPreview({
                           getAccessToken,
                           mockData: effectiveMockData,
                           pageName: currentPage,
+                          routePath: concreteCurrentPath,
+                          ...openedCrumb !== void 0 ? { crumb: openedCrumb } : {},
                           routeParams,
                           onNavigate: handleNavigateEffect,
                           onNavigateBack: handleNavigateBack,
@@ -42731,6 +43269,8 @@ function OrbPreview({
                           getAccessToken,
                           mockData: effectiveMockData,
                           pageName: currentPage,
+                          routePath: concreteCurrentPath,
+                          ...openedCrumb !== void 0 ? { crumb: openedCrumb } : {},
                           routeParams,
                           onNavigate: handleNavigateEffect,
                           onNavigateBack: handleNavigateBack,
@@ -42752,9 +43292,9 @@ function OrbPreview({
 }
 OrbPreview.displayName = "OrbPreview";
 var log15 = createLogger("almadar:ui:canvas-dnd");
-var CanvasDragKindContext = React51__default.createContext(null);
+var CanvasDragKindContext = React52__default.createContext(null);
 function useCanvasDragKind() {
-  return React51__default.useContext(CanvasDragKindContext);
+  return React52__default.useContext(CanvasDragKindContext);
 }
 function useCanvasDraggable({
   id,
@@ -42843,12 +43383,12 @@ function CanvasDndProvider({
 }) {
   const eventBus = useEventBus();
   const sensors = useAlmadarDndSensors(false);
-  const [activePayload, setActivePayload] = React51__default.useState(null);
-  const lastPointerRef = React51__default.useRef(null);
-  const trackPointer = React51__default.useCallback((ev) => {
+  const [activePayload, setActivePayload] = React52__default.useState(null);
+  const lastPointerRef = React52__default.useRef(null);
+  const trackPointer = React52__default.useCallback((ev) => {
     lastPointerRef.current = { x: ev.clientX, y: ev.clientY };
   }, []);
-  const handleDragStart = React51__default.useCallback((e) => {
+  const handleDragStart = React52__default.useCallback((e) => {
     const data = e.active.data.current;
     const payload = data?.payload;
     const activator = e.activatorEvent;
@@ -42861,7 +43401,7 @@ function CanvasDndProvider({
       log15.warn("dragStart:missing-payload", { id: e.active.id });
     }
   }, [trackPointer]);
-  const handleDragEnd = React51__default.useCallback((e) => {
+  const handleDragEnd = React52__default.useCallback((e) => {
     setActivePayload(null);
     document.removeEventListener("pointermove", trackPointer);
     const activeData = e.active.data.current;
@@ -42894,7 +43434,7 @@ function CanvasDndProvider({
     const suppressed = onDrop ? onDrop(drop) === true : false;
     if (!suppressed) defaultEmit(eventBus, drop);
   }, [eventBus, onDrop, trackPointer]);
-  const handleDragCancel = React51__default.useCallback(() => {
+  const handleDragCancel = React52__default.useCallback(() => {
     setActivePayload(null);
     document.removeEventListener("pointermove", trackPointer);
     log15.info("dragCancel");
@@ -43950,7 +44490,7 @@ var OrbPreviewNodeInner = (props) => {
     const targets = [...siblings, parent.box];
     const moved = layoutBoxOf(el);
     const painted = moved instanceof HTMLElement ? moved : null;
-    const before = painted?.style.translate ?? "";
+    const before2 = painted?.style.translate ?? "";
     let current = start;
     let dragging = false;
     const move = (ev) => {
@@ -43970,7 +44510,7 @@ var OrbPreviewNodeInner = (props) => {
       window.removeEventListener("pointerup", up);
       setGuides([]);
       if (!dragging) return;
-      if (painted) painted.style.translate = before;
+      if (painted) painted.style.translate = before2;
       suppressClickRef.current = true;
       const position = positionOf(classes);
       const offset = offsetWithin(current, parent.box);
@@ -44382,7 +44922,7 @@ var OrbPreviewNodeInner = (props) => {
     }
   );
 };
-var OrbPreviewNode = React51__default.memo(OrbPreviewNodeInner);
+var OrbPreviewNode = React52__default.memo(OrbPreviewNodeInner);
 OrbPreviewNode.displayName = "OrbPreviewNode";
 orbPreviewLog.debug("export-resolved", () => ({
   type: typeof OrbPreviewNode,
@@ -45918,4 +46458,4 @@ function AppearanceSection({ patternConfig, themeManifest, onPropChange, onToken
   ] });
 }
 
-export { AVL_GRAPH_NODE_TYPES, ActionPalette, ActionTile, ActivationBlock, ActivityRail, AgentActivityFeed, AgentActivityRow, AgentChatFeed, AgentThinkingRow, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AuthLayout, AvlGraphCanvas, AwaitingSkeletonContext, BiologyCanvas, BloomQuizBlock, BranchingLogicBuilder, Breadcrumb, ButtonGroup, CANVAS_TOOLS, COMPACT_MEDIA_QUERY, CalendarGrid, Canvas, Canvas2D, CanvasDndProvider, CanvasVerifyContext, Card2 as Card, Carousel, ChangeList, Chart, ChartLegend, ChatBar, ChemistryCanvas, ChoiceButton, CodeBlock, CodeRunnerPanel, CommandPalette, CommitRow, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTION_KEYS, DEFAULT_MATRIX_COLUMN_KEYS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DateRangePicker, DateRangeSelector, DependencyColumnNode, DependencyNode, DetailPanel, DialogueBubble, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, DrawFxLayer, DrawGroup, DrawMesh, DrawShape, DrawShapeLayer, DrawSkinnedMesh, DrawSprite, DrawSpriteLayer, DrawText, DrawTextLayer, Drawer, DrawerSlot, EDITABLE, ELEMENT_SELECTED_EVENT, EdgeDecoration, ElementEditAccessContext, EmojiPicker, EntityBindingContext, EntitySchemaProvider, ErrorBoundary, ErrorState, EventFlowEdge, FEATURE_COLORS, FLOOR_HEIGHT, FeatureCard, FeatureGrid, FilterGroup, Flex, FlipCard, FloatingActionButton, FloatingToolbar, FlowCanvas, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioContext, GameAudioCue, GameAudioProvider, GameAudioToggle, GameHud, GameMenu, GameShell, Gantt, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, GuestView, Header, HealthBar, IconButton, ImportPreviewTree, ImportProgress, ImportSourcePicker, InputGroup, JazariStateMachine, KernelEngineContext, KernelEngineProvider, KernelLoaderMissingError, KnobField, KnobSettingRow, LIVE_STATE, LearningCanvas, Lightbox, LikertScale, LineChart2 as LineChart, LoadingState, MachinePanel, MapView, MarkdownContent, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, Navigation, NumberStepper, OptionConstraintGroup, OrbInspector, OrbPreview, OrbPreviewNode, OrbitalProvider, OrbitalVisualization, PageAccessHost, PageHeader, PageTransition, Pagination, PhysicsCanvas, PositionedCanvas, ProgressDots, PullToRefresh, QrScanner, QuizBlock, ReflectionBlock, RelationSelect, RenderSlotProvider, RepeatableFormSection, ReplyTree, RichTextEditor, RowSetResolverProvider, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SegmentRenderer, SelectionContext, SelectionProvider, SequenceBar, ServerBridgeProvider, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SkeletonTree, SlotContainedContext, SlotContentRenderer, SocialProof, SortableList, Split, SplitPane, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, SubagentTracePanel, SuspenseConfigProvider, SwipeableRow, SystemBandNode, SystemMapContext, SystemNode, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagInput, Timeline, TimerDisplay, Toast, ToastSlot, TopNavItem, TraitFrame, TraitSlot, TraitStateViewer, UISlotComponent, UISlotRenderer, UploadDropZone, VerificationProvider, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, activityRowFacts, applyCompletion, applySuggestions, canvasViewGraph, createUnitAnimationState, dependencyReach, deriveEditFocusFromElement, dispatchCommandPaletteCommand, dropBusEvent, flowNeighbors, frameRect, getCurrentFrame, groupIntoConversations, hasCanvasTool, inferDirection, initialStateOf, isoToScreen, layeredGraph, mapServerEffectResults, optionForPlayedStep, parseEditFocus, preloadCodeHighlighter, propAccessAt, registerCodeLanguageLoader, renderPatternProps, renderPatternValue, resolveFrame, resolveSheetDirection, sanitizeRichHtml, schemaToDependencyGraph, schemaToOverviewGraph, screenToIso, stateOptionsOf, tickAnimationState, toCodeLanguage, traitFlowGraph, transitionAnimation, useAwaitingSkeleton, useCamera, useCanvasDraggable, useCanvasDroppable, useCompactLayout, useDockLayout, useEntityBindingSnapshot, useEntitySchema, useEntitySchemaOptional, useGameAudio, useGameAudioContext, useGameAudioContextOptional, useImageCache, useInlineTextEdit, useKernelEngine, useRenderSlot, useRowSetResolver, useRowSetResolverHandle, useSelection, useSelectionOptional, useServerBridge, useTraitStateMachine };
+export { AVL_GRAPH_NODE_TYPES, ActionPalette, ActionTile, ActivationBlock, ActivityRail, AgentActivityFeed, AgentActivityRow, AgentChatFeed, AgentThinkingRow, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AuthLayout, AvlGraphCanvas, AwaitingSkeletonContext, BiologyCanvas, BloomQuizBlock, BranchingLogicBuilder, Breadcrumb, ButtonGroup, CANVAS_TOOLS, COMPACT_MEDIA_QUERY, CalendarGrid, Canvas, Canvas2D, CanvasDndProvider, CanvasVerifyContext, Card2 as Card, Carousel, ChangeList, Chart, ChartLegend, ChatBar, ChemistryCanvas, ChoiceButton, CodeBlock, CodeRunnerPanel, CommandPalette, CommitRow, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTION_KEYS, DEFAULT_MATRIX_COLUMN_KEYS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DateRangePicker, DateRangeSelector, DependencyColumnNode, DependencyNode, DetailPanel, DialogueBubble, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, DrawFxLayer, DrawGroup, DrawMesh, DrawShape, DrawShapeLayer, DrawSkinnedMesh, DrawSprite, DrawSpriteLayer, DrawText, DrawTextLayer, Drawer, DrawerSlot, EDITABLE, ELEMENT_SELECTED_EVENT, EdgeDecoration, ElementEditAccessContext, EmojiPicker, EntityBindingContext, EntitySchemaProvider, ErrorBoundary, ErrorState, EventFlowEdge, FEATURE_COLORS, FLOOR_HEIGHT, FeatureCard, FeatureGrid, FilterGroup, Flex, FlipCard, FloatingActionButton, FloatingToolbar, FlowCanvas, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioContext, GameAudioCue, GameAudioProvider, GameAudioToggle, GameHud, GameMenu, GameShell, Gantt, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, GuestView, Header, HealthBar, IconButton, ImportPreviewTree, ImportProgress, ImportSourcePicker, InputGroup, JazariStateMachine, KernelEngineContext, KernelEngineProvider, KernelLoaderMissingError, KnobField, KnobSettingRow, LIVE_STATE, LearningCanvas, Lightbox, LikertScale, LineChart2 as LineChart, LoadingState, MachinePanel, MapView, MarkdownContent, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, Navigation, NumberStepper, OptionConstraintGroup, OrbInspector, OrbPreview, OrbPreviewNode, OrbitalProvider, OrbitalVisualization, PageAccessHost, PageHeader, PageTransition, Pagination, PhysicsCanvas, PositionedCanvas, ProgressDots, PullToRefresh, QrScanner, QuizBlock, ReflectionBlock, RelationSelect, RenderSlotProvider, RepeatableFormSection, ReplyTree, RichTextEditor, RowSetResolverProvider, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SegmentRenderer, SelectionContext, SelectionProvider, SequenceBar, ServerBridgeProvider, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SkeletonTree, SlotContainedContext, SlotContentRenderer, SocialProof, SortableList, Split, SplitPane, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, SubagentTracePanel, SuspenseConfigProvider, SwipeableRow, SystemBandNode, SystemMapContext, SystemNode, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagInput, Timeline, TimerDisplay, Toast, ToastSlot, TopNavItem, TraitFrame, TraitSlot, TraitStateViewer, UISlotComponent, UISlotRenderer, UploadDropZone, VerificationProvider, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, activityRowFacts, applyCompletion, applySuggestions, canvasViewGraph, createUnitAnimationState, dependencyReach, deriveEditFocusFromElement, dispatchCommandPaletteCommand, dropBusEvent, flowNeighbors, frameRect, getCurrentFrame, groupIntoConversations, hasCanvasTool, inferDirection, initialStateOf, isoToScreen, layeredGraph, mapServerEffectResults, optionForPlayedStep, parseEditFocus, parseMarkdownWithCodeBlocks, preloadCodeHighlighter, propAccessAt, registerCodeLanguageLoader, renderPatternProps, renderPatternValue, resolveFrame, resolveSheetDirection, sanitizeRichHtml, schemaToDependencyGraph, schemaToOverviewGraph, screenToIso, stateOptionsOf, tickAnimationState, toCodeLanguage, traitFlowGraph, transitionAnimation, useAwaitingSkeleton, useCamera, useCanvasDraggable, useCanvasDroppable, useCompactLayout, useDockLayout, useEntityBindingSnapshot, useEntitySchema, useEntitySchemaOptional, useGameAudio, useGameAudioContext, useGameAudioContextOptional, useImageCache, useInlineTextEdit, useKernelEngine, useRenderSlot, useRowSetResolver, useRowSetResolverHandle, useSelection, useSelectionOptional, useServerBridge, useTraitStateMachine };