feat: use Toggle switch for metrics setting on AgentHealth config bar

Replaces the plain checkbox with the design system Toggle component
for consistency with the recording toggle on RouteDetail and
AppConfigDetailPage.

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

ui/src/pages/AgentHealth/AgentHealth.tsx

@@ -3,7 +3,7 @@ import { useParams, useNavigate } from 'react-router';
 import {
   StatCard, StatusDot, Badge, MonoText, ProgressBar,
   GroupCard, DataTable, LineChart, EventFeed, DetailPanel,
-  LogViewer, ButtonGroup, SectionHeader, useToast,
+  LogViewer, ButtonGroup, SectionHeader, Toggle, useToast,
 } from '@cameleer/design-system';
 import type { Column, FeedEvent, LogEntry, ButtonGroupItem } from '@cameleer/design-system';
 import styles from './AgentHealth.module.css';
@@ -559,11 +559,8 @@ export default function AgentHealth() {
               </div>
               <div className={styles.configField}>
                 <span className={styles.configLabel}>Metrics</span>
-                <label className={styles.configToggle}>
-                  <input type="checkbox" checked={Boolean(configDraft.metricsEnabled)}
-                    onChange={(e) => setConfigDraft(d => ({ ...d, metricsEnabled: e.target.checked }))} />
-                  <span>{configDraft.metricsEnabled ? 'On' : 'Off'}</span>
-                </label>
+                <Toggle checked={Boolean(configDraft.metricsEnabled)}
+                  onChange={(e) => setConfigDraft(d => ({ ...d, metricsEnabled: (e.target as HTMLInputElement).checked }))} />
               </div>
               <div className={styles.configActions}>
                 <button className={styles.configSaveBtn} onClick={saveConfigEdit} disabled={updateConfig.isPending}>Save</button>