fix: edge selection highlighting and group-chat connection rules

- Add CSS styling for selected edges (indigo highlight with glow)
- Enable orchestrator↔agent connections in group-chat mode
- Downgrade disconnected-agent validation from error to warning
- Rename addHandoffEdge to addEdge (generic for all modes)
- Add tests for group-chat connection rules

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

src/renderer/components/pattern-graph/PatternGraphCanvas.tsx

@@ -22,7 +22,7 @@ import type { OrchestrationMode, PatternDefinition, PatternGraph } from '@shared
 import { resolvePatternGraph } from '@shared/domain/pattern';
 import type { ModelDefinition } from '@shared/domain/models';
 import {
-  addHandoffEdge,
+  addEdge,
   autoLayoutGraph,
   fromCanvasPositions,
   isConnectionAllowed,
@@ -143,7 +143,7 @@ function PatternGraphCanvasInner({
       }
 
       if (connection.source && connection.target) {
-        const updatedGraph = addHandoffEdge(graph, connection.source, connection.target);
+        const updatedGraph = addEdge(graph, connection.source, connection.target);
         onGraphChange(updatedGraph);
       }
     },

src/renderer/lib/patternGraph.ts

@@ -208,8 +208,10 @@ export function isConnectionAllowed(
       return false;
     case 'handoff':
       return sourceNode.kind === 'agent' && targetNode.kind === 'agent';
-    case 'group-chat':
-      return false;
+    case 'group-chat': {
+      const kinds = new Set([sourceNode.kind, targetNode.kind]);
+      return kinds.has('orchestrator') && kinds.has('agent');
+    }
     default:
       return false;
   }
@@ -226,7 +228,7 @@ function edgeId(source: string, target: string): string {
   return `edge-${source}-to-${target}`;
 }
 
-export function addHandoffEdge(graph: PatternGraph, source: string, target: string): PatternGraph {
+export function addEdge(graph: PatternGraph, source: string, target: string): PatternGraph {
   const newEdge: PatternGraphEdge = {
     id: edgeId(source, target),
     source,

src/renderer/styles.css

@@ -150,6 +150,12 @@ textarea {
   stroke-width: 1.5;
 }
 
+.react-flow__edge.selected .react-flow__edge-path {
+  stroke: #818cf8;
+  stroke-width: 2.5;
+  filter: drop-shadow(0 0 4px rgba(129, 140, 248, 0.4));
+}
+
 .react-flow__edge.animated .react-flow__edge-path {
   stroke-dasharray: 5;
   animation: reactflow-dash 0.5s linear infinite;