diff --git a/frontend/src/components/RunsView.jsx b/frontend/src/components/RunsView.jsx
index 4d88f2f..21b4028 100644
--- a/frontend/src/components/RunsView.jsx
+++ b/frontend/src/components/RunsView.jsx
@@ -13,9 +13,10 @@ function fmtDate(iso) {
 function StatusBadge({ status }) {
   const cls = status === 'completed' ? 'run-status--completed'
     : status === 'failed' ? 'run-status--failed'
-    : status === 'running' ? 'run-status--running'
+    : status === 'in_progress' ? 'run-status--in-progress'
     : '';
-  return <span className={`run-status ${cls}`}>{status || '—'}</span>;
+  const label = status ? status.replace(/_/g, ' ') : '—';
+  return <span className={`run-status ${cls}`}>{label}</span>;
 }
 
 export default function RunsView({ runs }) {
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index e0d5c2f..a61b4df 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -1309,7 +1309,7 @@ select {
 }
 .run-status--completed { background: #d8eddf; color: #235c35; border: 1px solid #b4d9be; }
 .run-status--failed { background: #f5ddd8; color: #8d3f30; border: 1px solid #e0b8b0; }
-.run-status--running { background: #dde8f5; color: #245f72; border: 1px solid #b8cde0; }
+.run-status--in-progress { background: #fdefd8; color: #8a4f10; border: 1px solid #f0cfa0; }
 
 /* ── Token created banner ────────────────────────────────────────────────── */
 .token-banner {