Use consistent AppBadge colors in command palette search results

Replace hardcoded purple badge and plain text with AppBadge component
so agent names show the same deterministic color across the UI.

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

ui/src/components/command-palette/ResultItem.tsx

@@ -1,6 +1,7 @@
 import type { ExecutionSummary, AgentInstance } from '../../api/schema';
 import type { PaletteResult, RouteInfo } from './use-palette-search';
 import { highlightMatch, formatRelativeTime } from './utils';
+import { AppBadge } from '../shared/AppBadge';
 import styles from './CommandPalette.module.css';
 
 interface ResultItemProps {
@@ -59,7 +60,7 @@ function ExecutionResult({ data, query }: { data: ExecutionSummary; query: strin
           <span className={styles.badgeDuration}>{data.durationMs}ms</span>
         </div>
         <div className={styles.resultMeta}>
-          <span className={styles.badgeRoute}>{data.agentId}</span>
+          <AppBadge name={data.agentId} />
           <span className={styles.sep} />
           <HighlightedText text={data.executionId.slice(0, 16)} query={query} />
           {data.errorMessage && (
@@ -124,7 +125,7 @@ function RouteResult({ data, query }: { data: RouteInfo; query: string }) {
         <div className={styles.resultMeta}>
           <span>{data.agentIds.length} {data.agentIds.length === 1 ? 'application' : 'applications'}</span>
           <span className={styles.sep} />
-          <span>{data.agentIds.join(', ')}</span>
+          {data.agentIds.map((id) => <AppBadge key={id} name={id} />)}
         </div>
       </div>
       <div className={styles.resultRight}>