refactor(ui): CardHeading primitive for icon+title card/dialog headings (DRY pattern sweep)

The icon+title v-card-title heading (d-flex align-center + gap + <v-icon size=small> +
<span>) was hand-rolled identically in 13 cards/dialogs (15 heading instances).
Consolidate to <CardHeading icon title> (components/common) with an iconColor
prop (error headings) and a default slot for trailing content (spacer+actions,
inline status chip). Adopted everywhere the pattern appears — all-or-nothing per
the hardened DRY process.

Over-DRY guard: plain text-only <v-card-title> one-liners are NOT this pattern
and stay; DownloadDetailModal leads with a status CHIP (not an icon), a different
concept, left alone. §8b: the only remaining d-flex align-center v-card-title is
that intentional variant. Catalog updated.

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

frontend/src/components/settings/SystemActivityTab.vue

@@ -2,14 +2,12 @@
   <div class="fc-activity">
     <!-- Queues + workers pane -->
     <v-card class="mb-4">
-      <v-card-title class="d-flex align-center" style="gap: 10px;">
-        <v-icon icon="mdi-pulse" size="small" />
-        <span>Queues + workers</span>
+      <CardHeading icon="mdi-pulse" title="Queues + workers">
         <v-spacer />
         <span class="text-caption fc-muted">
           updated {{ formatRelative(store.queues?.fetched_at) }}
         </span>
-      </v-card-title>
+      </CardHeading>
       <v-card-text>
         <QueuesTable
           :queues="store.queues"
@@ -21,14 +19,12 @@
 
     <!-- Recent failures pane -->
     <v-card class="mb-4">
-      <v-card-title class="d-flex align-center" style="gap: 10px;">
-        <v-icon icon="mdi-alert-circle-outline" size="small" />
-        <span>Recent failures (last 24h)</span>
+      <CardHeading icon="mdi-alert-circle-outline" title="Recent failures (last 24h)">
         <v-spacer />
         <span class="text-caption fc-muted">
           {{ failureCount }} failures
         </span>
-      </v-card-title>
+      </CardHeading>
       <v-card-text>
         <div v-if="errorTypes.length" class="mb-3 fc-pills">
           <v-chip
@@ -79,9 +75,7 @@
 
     <!-- All activity pane -->
     <v-card>
-      <v-card-title class="d-flex align-center" style="gap: 10px;">
-        <v-icon icon="mdi-format-list-bulleted" size="small" />
-        <span>All recent activity</span>
+      <CardHeading icon="mdi-format-list-bulleted" title="All recent activity">
         <v-spacer />
         <v-select
           v-model="filterQueue"
@@ -102,7 +96,7 @@
           <v-icon start size="small">mdi-refresh</v-icon>
           Refresh
         </v-btn>
-      </v-card-title>
+      </CardHeading>
       <v-card-text>
         <v-table density="compact">
           <thead>
@@ -157,6 +151,7 @@ import { useSystemActivityStore } from '../../stores/systemActivity.js'
 import { formatRelative as fmtRelative } from '../../utils/date.js'
 import ErrorDetailModal from '../common/ErrorDetailModal.vue'
 import QueuesTable from './QueuesTable.vue'
+import CardHeading from '../common/CardHeading.vue'
 
 // Click-to-open modal for full error text. Replaces the unusable
 // :title="..." tooltip (operator-flagged 2026-05-26: SQLAlchemy