feat: add RouteFlow component and replace tabbed exchange detail with stacked layout

Replace the 4-tab DetailPanel (Overview/Processors/Exchange/Error) with a
single scrollable view: overview, errors (limited to 1 with +N indicator),
route flow diagram, and processor timeline. DetailPanel now supports
children as an alternative to tabs.

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

src/pages/Dashboard/Dashboard.module.css

@@ -146,12 +146,46 @@
   margin-top: 3px;
 }
 
-/* Detail panel: overview tab */
-.overviewTab {
-  padding: 16px;
+/* Detail panel sections */
+.panelSection {
+  padding-bottom: 16px;
+  margin-bottom: 16px;
+  border-bottom: 1px solid var(--border-subtle);
+}
+
+.panelSection:last-child {
+  border-bottom: none;
+  margin-bottom: 0;
+  padding-bottom: 0;
+}
+
+.panelSectionTitle {
+  font-size: 11px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  color: var(--text-muted);
+  margin-bottom: 10px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.panelSectionMeta {
+  margin-left: auto;
+  font-family: var(--font-mono);
+  font-size: 10px;
+  font-weight: 500;
+  text-transform: none;
+  letter-spacing: 0;
+  color: var(--text-faint);
+}
+
+/* Overview grid */
+.overviewGrid {
   display: flex;
   flex-direction: column;
-  gap: 12px;
+  gap: 8px;
 }
 
 .overviewRow {
@@ -166,17 +200,17 @@
   text-transform: uppercase;
   letter-spacing: 0.6px;
   color: var(--text-muted);
-  width: 100px;
+  width: 90px;
   flex-shrink: 0;
   padding-top: 2px;
 }
 
+/* Error block */
 .errorBlock {
   background: var(--error-bg);
   border: 1px solid var(--error-border);
   border-radius: var(--radius-sm);
   padding: 10px 12px;
-  margin-top: 4px;
 }
 
 .errorClass {
@@ -184,7 +218,7 @@
   font-size: 10px;
   font-weight: 600;
   color: var(--error);
-  margin-bottom: 6px;
+  margin-bottom: 4px;
 }
 
 .errorMessage {
@@ -192,40 +226,5 @@
   color: var(--text-secondary);
   line-height: 1.5;
   font-family: var(--font-mono);
-}
-
-/* Detail panel: processors tab */
-.processorsTab {
-  padding: 16px;
-}
-
-/* Detail panel: exchange tab */
-.exchangeTab {
-  padding: 16px;
-}
-
-/* Detail panel: error tab */
-.errorTab {
-  padding: 16px;
-}
-
-.emptyTabMsg {
-  font-size: 12px;
-  color: var(--text-muted);
-  text-align: center;
-  padding: 40px 0;
-}
-
-.errorPre {
-  font-family: var(--font-mono);
-  font-size: 11px;
-  color: var(--error);
-  background: var(--error-bg);
-  border: 1px solid var(--error-border);
-  border-radius: var(--radius-sm);
-  padding: 12px;
-  white-space: pre-wrap;
   word-break: break-word;
-  line-height: 1.5;
-  margin-top: 8px;
 }