feat(plan-13): read-only Ops Console (NestJS API + React UI) — Track 1

Real web Control Panel over CASAN harness telemetry (Level-3 casan-platform component).
Read-only ("Đọc ≠ Ghi"): no settings writes, no gate bypass. Management/RBAC/approval are
Track 2/3 (future, Plan-14). Additive — harness gate untouched (64/0/3).

packages/casan-control-panel/
- backend/ (NestJS, ESM, /api/v1 + ok() envelope): TelemetryReader (jsonl/json, missing→[],
  never fabricates) + TelemetryService (aggregations mirroring generate-agentops-dashboard.py)
  + endpoints overview/runs(+:traceId)/governance/security/incidents/tools/traceability/
  drift/cost, and /healthz (stale-aware 200/503, fail-loud like dashboard-server.py). App
  root + telemetry paths resolve via casan-paths-style marker walk-up (.specify OR
  packages/casan-harness) + honor CASAN_DASHBOARD_* env. Binds 127.0.0.1; refuses
  non-loopback under CASAN_PROFILE=prod. @Inject token so DI works under tsc AND tsx.
  Tests (node native runner) 7/0: reader parse/missing, app-root, overview shape on real
  repo state, freshness/stale fail-loud.
- frontend/ (React+Vite+Tailwind+TanStack, port 5174, proxies to :3010): AppLayout +
  Sidebar + Header (LIVE/STALE badge from /healthz) + pages Overview/Runs/Governance/
  Security/Incidents/Traceability. axios client unwraps ok() envelope. build green.

Wiring: root workspaces + `console:*` scripts. packaging/levels.json + casan-platform
README: platform preview now lists the Ops Console as an implemented component.

Verified: backend build + test 7/0; frontend tsc + vite build; API serves REAL data
(runs=6, provider_tokens=5556, action_blocks=7); /healthz 503 stale → 200 after touch.

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

packages/casan-control-panel/frontend/src/pages/Runs.tsx

@@ -0,0 +1,31 @@
+import { useQuery } from '@tanstack/react-query';
+import { api } from '../lib/api';
+import { Card, StatusBadge } from '../components/ui/Card';
+
+export function Runs() {
+  const { data, isLoading } = useQuery({ queryKey: ['runs'], queryFn: () => api.runs(100) });
+  if (isLoading || !data) return <div className="text-gray-500">Loading…</div>;
+  return (
+    <Card title={`Recent runs (${data.count})`}>
+      <div className="overflow-x-auto">
+        <table className="w-full text-sm">
+          <thead><tr className="text-left text-gray-500 border-b border-gray-200">
+            <th className="py-2">time</th><th>step</th><th>status</th><th>latency</th><th>tokens</th><th>cost</th>
+          </tr></thead>
+          <tbody>
+            {data.runs.map((r: any, i: number) => (
+              <tr key={i} className="border-b border-gray-100">
+                <td className="py-2 text-gray-500">{r.timestamp?.replace('T', ' ').replace('Z', '')}</td>
+                <td className="text-gray-700">{r.step ?? r.harness}</td>
+                <td><StatusBadge value={r.status ?? '—'} /></td>
+                <td>{r.latency_ms ?? '—'} ms</td>
+                <td>{r.total_tokens ?? '—'}</td>
+                <td>${Number(r.cost_estimate ?? 0).toFixed(5)}</td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </div>
+    </Card>
+  );
+}