1 files changed, 23 insertions, 3 deletions
diff --git a/makima/frontend/src/components/workflow/WorkflowContractCard.tsx b/makima/frontend/src/components/workflow/WorkflowContractCard.tsx
index e6c8a1c..61e6d17 100644
--- a/makima/frontend/src/components/workflow/WorkflowContractCard.tsx
+++ b/makima/frontend/src/components/workflow/WorkflowContractCard.tsx
@@ -1,3 +1,4 @@
+import { useNavigate } from "react-router";
 import type { ContractSummary, ContractStatus } from "../../lib/api";
 
 interface WorkflowContractCardProps {
@@ -17,8 +18,16 @@ export function WorkflowContractCard({
   onClick,
   onDragStart,
 }: WorkflowContractCardProps) {
+  const navigate = useNavigate();
   const status = statusConfig[contract.status] || statusConfig.active;
 
+  const handleSupervisorClick = (e: React.MouseEvent) => {
+    e.stopPropagation();
+    if (contract.supervisorTaskId) {
+      navigate(`/mesh/${contract.supervisorTaskId}`);
+    }
+  };
+
   return (
     <div
       draggable
@@ -26,9 +35,20 @@ export function WorkflowContractCard({
       onClick={onClick}
       className="p-3 bg-[rgba(9,13,20,0.8)] border border-[rgba(117,170,252,0.2)] hover:border-[rgba(117,170,252,0.4)] cursor-pointer transition-colors select-none"
     >
-      {/* Name */}
-      <div className="font-mono text-sm text-[#dbe7ff] truncate mb-1">
-        {contract.name}
+      {/* Header row with name and supervisor button */}
+      <div className="flex items-center justify-between gap-2 mb-1">
+        <div className="font-mono text-sm text-[#dbe7ff] truncate flex-1">
+          {contract.name}
+        </div>
+        {contract.supervisorTaskId && (
+          <button
+            onClick={handleSupervisorClick}
+            title="Open Supervisor Task"
+            className="flex-shrink-0 px-1.5 py-0.5 font-mono text-[10px] text-[#75aafc] hover:text-[#9bc3ff] border border-[rgba(117,170,252,0.25)] hover:border-[#3f6fb3] hover:bg-[rgba(117,170,252,0.1)] transition-colors"
+          >
+            ▶
+          </button>
+        )}
       </div>
 
       {/* Status and counts row */}