feat: highlight triggered error handler sections

When an onException/error handler section has any executed processors
(overlay entries), it renders with a stronger red tint (8% vs 3%),
a solid red border frame, and a solid divider line. This makes it
easy to identify which handler was triggered when multiple exist.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

ui/src/components/ProcessDiagram/ErrorSection.tsx

@@ -42,6 +42,20 @@ export function ErrorSection({
   onNodeClick, onNodeDoubleClick, onNodeEnter, onNodeLeave,
 }: ErrorSectionProps) {
   const color = VARIANT_COLORS[section.variant ?? 'error'] ?? VARIANT_COLORS.error;
+
+  // Check if any node in this section was executed (has overlay entry)
+  const wasTriggered = useMemo(() => {
+    if (!executionOverlay || executionOverlay.size === 0) return false;
+    function checkNodes(nodes: DiagramNodeType[]): boolean {
+      for (const n of nodes) {
+        if (n.id && executionOverlay!.has(n.id)) return true;
+        if (n.children && checkNodes(n.children)) return true;
+      }
+      return false;
+    }
+    return checkNodes(section.nodes);
+  }, [executionOverlay, section.nodes]);
+
   const boxHeight = useMemo(() => {
     let maxY = 0;
     for (const n of section.nodes) {
@@ -65,28 +79,41 @@ export function ErrorSection({
         {section.label}
       </text>
 
-      {/* Divider line */}
+      {/* Divider line — solid when triggered */}
       <line
         x1={0}
         y1={0}
         x2={totalWidth}
         y2={0}
         stroke={color}
-        strokeWidth={1}
-        strokeDasharray="6 3"
-        opacity={0.5}
+        strokeWidth={wasTriggered ? 1.5 : 1}
+        strokeDasharray={wasTriggered ? undefined : '6 3'}
+        opacity={wasTriggered ? 0.8 : 0.5}
       />
 
-      {/* Subtle red tint background — sized to actual content */}
+      {/* Background — stronger when this handler was triggered during execution */}
       <rect
         x={0}
         y={4}
         width={totalWidth}
         height={boxHeight}
         fill={color}
-        opacity={0.03}
+        opacity={wasTriggered ? 0.08 : 0.03}
         rx={4}
       />
+      {wasTriggered && (
+        <rect
+          x={0}
+          y={4}
+          width={totalWidth}
+          height={boxHeight}
+          fill="none"
+          stroke={color}
+          strokeWidth={1.5}
+          rx={4}
+          opacity={0.5}
+        />
+      )}
 
       {/* Content group with margin from top-left */}
       <g transform={`translate(${CONTENT_PADDING_LEFT}, ${CONTENT_PADDING_Y})`}>