fix: accurate elapsed timing and UX polish for activity panel

- Fix useElapsedTimer to use completedAt instead of Date.now() for
  finished runs, preventing wildly inaccurate durations (e.g. 9802m)
  when reopening old sessions
- Extract formatElapsedMs as a shared pure formatter; reuse in
  SubagentActivityCard
- Standardize icon column alignment across all activity row types
  using consistent w-4 + h-[18px] icon containers
- Redesign collapsed header: status dot with pulse animation, bolder
  status label, tabular-nums on elapsed time, cleaner hierarchy
- Polish expanded stream: timeline spine connecting activity items,
  more prominent intent dividers with pill-style background,
  tightened vertical rhythm
- Add unit tests for formatElapsedMs

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

src/renderer/styles.css

@@ -674,6 +674,23 @@ body {
   animation: intent-divider-in 0.2s cubic-bezier(0.16, 1, 0.3, 1) both;
 }
 
+/* Timeline spine connecting activity items */
+.activity-timeline-spine > .turn-activity-row:not([role="separator"]) {
+  position: relative;
+}
+
+.activity-timeline-spine > .turn-activity-row:not([role="separator"]):not(:last-child)::before {
+  content: "";
+  position: absolute;
+  left: 7px; /* center of the 16px (w-4) icon column */
+  top: 22px; /* below the icon center */
+  bottom: 0;
+  width: 1px;
+  background: var(--color-border);
+  opacity: 0.25;
+  pointer-events: none;
+}
+
 /* ── Batch selection animations ──────────────────────────────── */
 
 @keyframes selection-checkbox-in {