fix: reduce ClickHouse CPU by increasing flush interval, rename LIVE→AUTO labels

- Increase ingestion flush interval from 500ms to 5000ms to reduce MV merge storms
- Reduce ClickHouse background_schedule_pool_size from 8 to 4
- Rename LIVE/PAUSED badge labels to AUTO/MANUAL across all pages
- Update design system to v0.1.29

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

ui/src/api/queries/use-refresh-interval.ts

@@ -10,9 +10,9 @@ export function useRefreshInterval(intervalMs: number): number | false {
 }
 
 /**
- * Returns `enabled` and `refetchInterval` tied to the LIVE/PAUSED toggle.
- * - LIVE: enabled=true, refetchInterval=intervalMs (fetch + poll)
- * - PAUSED: enabled=true, refetchInterval=false (fetch once, no polling)
+ * Returns `enabled` and `refetchInterval` tied to the AUTO/MANUAL toggle.
+ * - AUTO: enabled=true, refetchInterval=intervalMs (fetch + poll)
+ * - MANUAL: enabled=true, refetchInterval=false (fetch once, no polling)
  */
 export function useLiveQuery(intervalMs: number) {
   const { autoRefresh } = useGlobalFilters();

ui/src/pages/Admin/AuditLogPage.tsx

@@ -124,7 +124,7 @@ export default function AuditLogPage() {
             <span className={styles.tableMeta}>
               {totalCount} events
             </span>
-            <Badge label="LIVE" color="success" />
+            <Badge label="AUTO" color="success" />
           </div>
         </div>
         <DataTable

ui/src/pages/Dashboard/Dashboard.tsx

@@ -265,7 +265,7 @@ export default function Dashboard({ onExchangeSelect, activeExchangeId }: Dashbo
           <span className={styles.tableMeta}>
             {rows.length.toLocaleString()} of {(searchResult?.total ?? 0).toLocaleString()} exchanges
           </span>
-          {!textFilter && <Badge label="LIVE" color="success" />}
+          {!textFilter && <Badge label="AUTO" color="success" />}
         </div>
       </div>
 

ui/src/pages/DashboardTab/DashboardL2.tsx

@@ -378,7 +378,7 @@ export default function DashboardL2() {
           <span className={styles.tableTitle}>Route Performance</span>
           <div className={styles.tableRight}>
             <span className={styles.tableMeta}>{routeRows.length} routes</span>
-            <Badge label="LIVE" color="success" />
+            <Badge label="AUTO" color="success" />
           </div>
         </div>
         <DataTable

ui/src/pages/Routes/RouteDetail.tsx

@@ -718,7 +718,7 @@ export default function RouteDetail() {
           <span className={styles.tableTitle}>Processor Performance</span>
           <div className={styles.tableRight}>
             <span className={styles.tableMeta}>{processorRows.length} processors</span>
-            <Badge label="LIVE" color="success" />
+            <Badge label="AUTO" color="success" />
           </div>
         </div>
         <DataTable

ui/src/pages/Routes/RoutesMetrics.tsx

@@ -295,7 +295,7 @@ export default function RoutesMetrics() {
           <span className={styles.tableTitle}>Per-Route Performance</span>
           <div className={styles.tableRight}>
             <span className={styles.tableMeta}>{rows.length} routes</span>
-            <Badge label="LIVE" color="success" />
+            <Badge label="AUTO" color="success" />
           </div>
         </div>
         <DataTable