diff --git a/workshop/images/15-conditional-flow-dark.svg b/workshop/images/15-conditional-flow-dark.svg
index d65a8f60..3e2a9020 100644
--- a/workshop/images/15-conditional-flow-dark.svg
+++ b/workshop/images/15-conditional-flow-dark.svg
@@ -1,84 +1,88 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="560" viewBox="0 0 1200 560" role="img" aria-label="Conditional logic flow: shell step writes commit count to GITHUB_OUTPUT, the if condition evaluates it, then either skips or runs the agent job">
+<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="560" viewBox="0 0 1200 560"
+  role="img"
+  aria-label="Conditional logic flow: shell step writes commit count to GITHUB_OUTPUT, the if condition evaluates it, then either skips or runs the agent job"
+  data-visual-kind="diagram"
+  data-visual-id="15-conditional-flow-dark">
+
+  <defs>
+    <marker id="arrow" markerWidth="10" markerHeight="8" refX="9" refY="4" orient="auto">
+      <path d="M0,0 L0,8 L10,4 z" fill="#b6bfb8"/>
+    </marker>
+  </defs>
 
   <!-- Background -->
-  <rect width="1200" height="560" fill="#0d1117"/>
+  <rect width="1200" height="560" fill="#101411"/>
 
   <!-- Title -->
-  <text x="600" y="42" font-family="Arial,sans-serif" font-size="18" font-weight="bold" fill="#f0f6fc" text-anchor="middle">Conditional Logic Flow</text>
-  <text x="600" y="64" font-family="Arial,sans-serif" font-size="13" fill="#8b949e" text-anchor="middle">How a deterministic shell step gates the agentic job</text>
-
-  <!-- Step 1: Shell step box -->
-  <rect x="60" y="120" width="220" height="110" rx="8" fill="#161b22" stroke="#30363d" stroke-width="1.5"/>
-  <rect x="60" y="120" width="220" height="32" rx="8" fill="#2f81f7"/>
-  <rect x="60" y="136" width="220" height="16" fill="#2f81f7"/>
-  <text x="170" y="140" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">Shell Step</text>
-  <text x="170" y="165" font-family="monospace" font-size="11" fill="#f0f6fc" text-anchor="middle">git log --since="24h"</text>
-  <text x="170" y="182" font-family="monospace" font-size="11" fill="#f0f6fc" text-anchor="middle">| wc -l</text>
-  <text x="170" y="203" font-family="Arial,sans-serif" font-size="11" fill="#8b949e" text-anchor="middle">id: recent</text>
+  <text x="600" y="44" font-family="'Mona Sans',system-ui,sans-serif" font-size="20" font-weight="700" fill="#f2f5f3" text-anchor="middle">Conditional Logic Flow</text>
+  <text x="600" y="70" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" fill="#b6bfb8" text-anchor="middle">How a deterministic shell step gates the agentic job</text>
+
+  <!-- Step badges -->
+  <circle cx="130" cy="100" r="14" fill="#5fed83"/>
+  <text x="130" y="105" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="700" fill="#101411" text-anchor="middle">1</text>
+  <text x="130" y="122" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="middle">Gather context</text>
+
+  <circle cx="450" cy="100" r="14" fill="#5fed83"/>
+  <text x="450" y="105" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="700" fill="#101411" text-anchor="middle">2</text>
+  <text x="450" y="122" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="middle">Expose as output</text>
+
+  <circle cx="760" cy="100" r="14" fill="#5fed83"/>
+  <text x="760" y="105" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="700" fill="#101411" text-anchor="middle">3</text>
+  <text x="760" y="122" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="middle">Evaluate condition</text>
+
+  <!-- Shell Step node -->
+  <rect x="30" y="145" width="200" height="120" rx="8" fill="#0a241b" stroke="#909692" stroke-width="1.5" data-node="shell-step"/>
+  <rect x="30" y="145" width="200" height="36" rx="8" fill="#5fed83"/>
+  <rect x="30" y="163" width="200" height="18" fill="#5fed83"/>
+  <text x="130" y="168" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#101411" text-anchor="middle">Shell Step</text>
+  <text x="130" y="198" font-family="'Mona Sans Mono',monospace" font-size="14" fill="#f2f5f3" text-anchor="middle">git log --since="24h"</text>
+  <text x="130" y="218" font-family="'Mona Sans Mono',monospace" font-size="14" fill="#f2f5f3" text-anchor="middle">| wc -l</text>
+  <text x="130" y="244" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="middle">id: recent</text>
 
   <!-- Arrow 1 -->
-  <line x1="280" y1="175" x2="365" y2="175" stroke="#8b949e" stroke-width="1.5" marker-end="url(#arrow-dark)"/>
+  <line x1="230" y1="205" x2="308" y2="205" stroke="#b6bfb8" stroke-width="2" marker-end="url(#arrow)"/>
 
   <!-- GITHUB_OUTPUT box -->
-  <rect x="365" y="140" width="200" height="70" rx="8" fill="#161b22" stroke="#30363d" stroke-width="1.5"/>
-  <rect x="365" y="140" width="200" height="28" rx="8" fill="#21262d"/>
-  <rect x="365" y="154" width="200" height="14" fill="#21262d"/>
-  <text x="465" y="157" font-family="Arial,sans-serif" font-size="11" font-weight="bold" fill="#8b949e" text-anchor="middle">$GITHUB_OUTPUT</text>
-  <text x="465" y="182" font-family="monospace" font-size="12" fill="#2f81f7" text-anchor="middle">commit_count=3</text>
-  <text x="465" y="200" font-family="Arial,sans-serif" font-size="10" fill="#8b949e" text-anchor="middle">steps.recent.outputs.commit_count</text>
+  <rect x="310" y="160" width="200" height="88" rx="8" fill="#0a241b" stroke="#909692" stroke-width="1.5" data-node="github-output"/>
+  <rect x="310" y="160" width="200" height="32" rx="8" fill="#232925"/>
+  <rect x="310" y="178" width="200" height="14" fill="#232925"/>
+  <text x="410" y="181" font-family="'Mona Sans Mono',monospace" font-size="14" font-weight="600" fill="#b6bfb8" text-anchor="middle">$GITHUB_OUTPUT</text>
+  <text x="410" y="214" font-family="'Mona Sans Mono',monospace" font-size="16" fill="#5fed83" text-anchor="middle">commit_count=3</text>
+  <text x="410" y="237" font-family="'Mona Sans',system-ui,sans-serif" font-size="13" fill="#b6bfb8" text-anchor="middle">steps.recent.outputs.commit_count</text>
 
   <!-- Arrow 2 -->
-  <line x1="565" y1="175" x2="650" y2="175" stroke="#8b949e" stroke-width="1.5" marker-end="url(#arrow-dark)"/>
+  <line x1="510" y1="205" x2="618" y2="205" stroke="#b6bfb8" stroke-width="2" marker-end="url(#arrow)"/>
 
   <!-- if: condition diamond -->
-  <polygon points="760,130 870,175 760,220 650,175" fill="#161b22" stroke="#30363d" stroke-width="1.5"/>
-  <text x="760" y="169" font-family="Arial,sans-serif" font-size="12" font-weight="bold" fill="#f0f6fc" text-anchor="middle">if: condition</text>
-  <text x="760" y="187" font-family="monospace" font-size="10" fill="#2f81f7" text-anchor="middle">count != '0'</text>
+  <polygon points="760,148 882,205 760,262 638,205" fill="#0a241b" stroke="#909692" stroke-width="1.5" data-node="if-condition"/>
+  <text x="760" y="199" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#f2f5f3" text-anchor="middle">if: condition</text>
+  <text x="760" y="220" font-family="'Mona Sans Mono',monospace" font-size="14" fill="#5fed83" text-anchor="middle">count != '0'</text>
 
-  <!-- Arrow 3a: true -->
-  <line x1="870" y1="175" x2="960" y2="175" stroke="#8b949e" stroke-width="1.5" marker-end="url(#arrow-dark)"/>
-  <text x="915" y="167" font-family="Arial,sans-serif" font-size="11" fill="#3fb950" text-anchor="middle">true</text>
+  <!-- Arrow true → agent job -->
+  <line x1="882" y1="205" x2="960" y2="205" stroke="#b6bfb8" stroke-width="2" marker-end="url(#arrow)"/>
+  <text x="921" y="196" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#5fed83" text-anchor="middle">true</text>
 
   <!-- Agent job box -->
-  <rect x="960" y="130" width="190" height="90" rx="8" fill="#161b22" stroke="#30363d" stroke-width="1.5"/>
-  <rect x="960" y="130" width="190" height="30" rx="8" fill="#238636"/>
-  <rect x="960" y="146" width="190" height="14" fill="#238636"/>
-  <text x="1055" y="149" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">✅ Agent Job Runs</text>
-  <text x="1055" y="178" font-family="Arial,sans-serif" font-size="12" fill="#f0f6fc" text-anchor="middle">AI processes commits</text>
-  <text x="1055" y="196" font-family="Arial,sans-serif" font-size="12" fill="#f0f6fc" text-anchor="middle">and posts report</text>
+  <rect x="962" y="155" width="200" height="100" rx="8" fill="#0a241b" stroke="#909692" stroke-width="1.5" data-node="agent-job-runs"/>
+  <rect x="962" y="155" width="200" height="34" rx="8" fill="#3fb950" data-state="done"/>
+  <rect x="962" y="171" width="200" height="18" fill="#3fb950"/>
+  <text x="1062" y="177" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#101411" text-anchor="middle">Agent Job Runs</text>
+  <text x="1062" y="208" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#f2f5f3" text-anchor="middle">AI processes commits</text>
+  <text x="1062" y="228" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#f2f5f3" text-anchor="middle">and posts report</text>
 
-  <!-- Arrow 3b: false -->
-  <line x1="760" y1="220" x2="760" y2="300" stroke="#8b949e" stroke-width="1.5" marker-end="url(#arrow-dark)"/>
-  <text x="773" y="265" font-family="Arial,sans-serif" font-size="11" fill="#d29922" text-anchor="start">false</text>
+  <!-- Arrow false → skip box -->
+  <line x1="760" y1="262" x2="760" y2="338" stroke="#b6bfb8" stroke-width="2" marker-end="url(#arrow)"/>
+  <text x="772" y="305" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="start">false</text>
 
   <!-- Skip box -->
-  <rect x="660" y="300" width="200" height="80" rx="8" fill="#161b22" stroke="#30363d" stroke-width="1.5"/>
-  <rect x="660" y="300" width="200" height="28" rx="8" fill="#3d444d"/>
-  <rect x="660" y="314" width="200" height="14" fill="#3d444d"/>
-  <text x="760" y="320" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#f0f6fc" text-anchor="middle">⏭ Agent Job Skipped</text>
-  <text x="760" y="350" font-family="Arial,sans-serif" font-size="12" fill="#8b949e" text-anchor="middle">No commits — no report</text>
-  <text x="760" y="368" font-family="Arial,sans-serif" font-size="12" fill="#8b949e" text-anchor="middle">saved AI tokens</text>
-
-  <!-- Step numbering badges -->
-  <circle cx="106" cy="90" r="13" fill="#2f81f7"/>
-  <text x="106" y="95" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">1</text>
-  <circle cx="465" cy="90" r="13" fill="#2f81f7"/>
-  <text x="465" y="95" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">2</text>
-  <circle cx="760" cy="90" r="13" fill="#2f81f7"/>
-  <text x="760" y="95" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">3</text>
-
-  <!-- Step labels -->
-  <text x="106" y="113" font-family="Arial,sans-serif" font-size="11" fill="#8b949e" text-anchor="middle">Gather context</text>
-  <text x="465" y="113" font-family="Arial,sans-serif" font-size="11" fill="#8b949e" text-anchor="middle">Expose as output</text>
-  <text x="760" y="113" font-family="Arial,sans-serif" font-size="11" fill="#8b949e" text-anchor="middle">Evaluate condition</text>
+  <rect x="640" y="340" width="240" height="90" rx="8" fill="#0a241b" stroke="#909692" stroke-width="1.5" data-node="agent-job-skipped"/>
+  <rect x="640" y="340" width="240" height="34" rx="8" fill="#8b949e" data-state="skipped"/>
+  <rect x="640" y="356" width="240" height="18" fill="#8b949e"/>
+  <text x="760" y="362" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#f2f5f3" text-anchor="middle">Agent Job Skipped</text>
+  <text x="760" y="394" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="middle">No commits — no report</text>
+  <text x="760" y="414" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="middle">saves AI tokens</text>
 
   <!-- Bottom annotation -->
-  <text x="600" y="470" font-family="Arial,sans-serif" font-size="12" fill="#8b949e" text-anchor="middle">Deterministic steps run first; the agent job is gated by the evaluated output value.</text>
+  <text x="600" y="490" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#b6bfb8" text-anchor="middle">Deterministic steps run first; the agent job is gated by the evaluated output value.</text>
 
-  <!-- Arrow marker -->
-  <defs>
-    <marker id="arrow-dark" markerWidth="8" markerHeight="8" refX="6" refY="3" orient="auto">
-      <path d="M0,0 L0,6 L8,3 z" fill="#8b949e"/>
-    </marker>
-  </defs>
 </svg>
diff --git a/workshop/images/15-conditional-flow-light.svg b/workshop/images/15-conditional-flow-light.svg
index 77accb05..1168d12e 100644
--- a/workshop/images/15-conditional-flow-light.svg
+++ b/workshop/images/15-conditional-flow-light.svg
@@ -1,84 +1,88 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="560" viewBox="0 0 1200 560" role="img" aria-label="Conditional logic flow: shell step writes commit count to GITHUB_OUTPUT, the if condition evaluates it, then either skips or runs the agent job">
+<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="560" viewBox="0 0 1200 560"
+  role="img"
+  aria-label="Conditional logic flow: shell step writes commit count to GITHUB_OUTPUT, the if condition evaluates it, then either skips or runs the agent job"
+  data-visual-kind="diagram"
+  data-visual-id="15-conditional-flow-light">
+
+  <defs>
+    <marker id="arrow" markerWidth="10" markerHeight="8" refX="9" refY="4" orient="auto">
+      <path d="M0,0 L0,8 L10,4 z" fill="#232925"/>
+    </marker>
+  </defs>
 
   <!-- Background -->
-  <rect width="1200" height="560" fill="#f6f8fa"/>
+  <rect width="1200" height="560" fill="#f2f5f3"/>
 
   <!-- Title -->
-  <text x="600" y="42" font-family="Arial,sans-serif" font-size="18" font-weight="bold" fill="#24292f" text-anchor="middle">Conditional Logic Flow</text>
-  <text x="600" y="64" font-family="Arial,sans-serif" font-size="13" fill="#57606a" text-anchor="middle">How a deterministic shell step gates the agentic job</text>
+  <text x="600" y="44" font-family="'Mona Sans',system-ui,sans-serif" font-size="20" font-weight="700" fill="#101411" text-anchor="middle">Conditional Logic Flow</text>
+  <text x="600" y="70" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" fill="#232925" text-anchor="middle">How a deterministic shell step gates the agentic job</text>
+
+  <!-- Step badges -->
+  <circle cx="130" cy="100" r="14" fill="#08872b"/>
+  <text x="130" y="105" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="700" fill="#f2f5f3" text-anchor="middle">1</text>
+  <text x="130" y="122" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="middle">Gather context</text>
 
-  <!-- Step 1: Shell step box -->
-  <rect x="60" y="120" width="220" height="110" rx="8" fill="#ffffff" stroke="#d0d7de" stroke-width="1.5"/>
-  <rect x="60" y="120" width="220" height="32" rx="8" fill="#0969da"/>
-  <rect x="60" y="136" width="220" height="16" fill="#0969da"/>
-  <text x="170" y="140" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">Shell Step</text>
-  <text x="170" y="165" font-family="monospace" font-size="11" fill="#24292f" text-anchor="middle">git log --since="24h"</text>
-  <text x="170" y="182" font-family="monospace" font-size="11" fill="#24292f" text-anchor="middle">| wc -l</text>
-  <text x="170" y="203" font-family="Arial,sans-serif" font-size="11" fill="#57606a" text-anchor="middle">id: recent</text>
+  <circle cx="450" cy="100" r="14" fill="#08872b"/>
+  <text x="450" y="105" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="700" fill="#f2f5f3" text-anchor="middle">2</text>
+  <text x="450" y="122" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="middle">Expose as output</text>
 
-  <!-- Arrow 1: shell step → GITHUB_OUTPUT -->
-  <line x1="280" y1="175" x2="365" y2="175" stroke="#57606a" stroke-width="1.5" marker-end="url(#arrow-light)"/>
+  <circle cx="760" cy="100" r="14" fill="#08872b"/>
+  <text x="760" y="105" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="700" fill="#f2f5f3" text-anchor="middle">3</text>
+  <text x="760" y="122" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="middle">Evaluate condition</text>
+
+  <!-- Shell Step node -->
+  <rect x="30" y="145" width="200" height="120" rx="8" fill="#ffffff" stroke="#b6bfb8" stroke-width="1.5" data-node="shell-step"/>
+  <rect x="30" y="145" width="200" height="36" rx="8" fill="#08872b"/>
+  <rect x="30" y="163" width="200" height="18" fill="#08872b"/>
+  <text x="130" y="168" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#f2f5f3" text-anchor="middle">Shell Step</text>
+  <text x="130" y="198" font-family="'Mona Sans Mono',monospace" font-size="14" fill="#101411" text-anchor="middle">git log --since="24h"</text>
+  <text x="130" y="218" font-family="'Mona Sans Mono',monospace" font-size="14" fill="#101411" text-anchor="middle">| wc -l</text>
+  <text x="130" y="244" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="middle">id: recent</text>
+
+  <!-- Arrow 1 -->
+  <line x1="230" y1="205" x2="308" y2="205" stroke="#232925" stroke-width="2" marker-end="url(#arrow)"/>
 
   <!-- GITHUB_OUTPUT box -->
-  <rect x="365" y="140" width="200" height="70" rx="8" fill="#ffffff" stroke="#d0d7de" stroke-width="1.5"/>
-  <rect x="365" y="140" width="200" height="28" rx="8" fill="#f6f8fa"/>
-  <rect x="365" y="154" width="200" height="14" fill="#f6f8fa"/>
-  <text x="465" y="157" font-family="Arial,sans-serif" font-size="11" font-weight="bold" fill="#57606a" text-anchor="middle">$GITHUB_OUTPUT</text>
-  <text x="465" y="182" font-family="monospace" font-size="12" fill="#0969da" text-anchor="middle">commit_count=3</text>
-  <text x="465" y="200" font-family="Arial,sans-serif" font-size="10" fill="#57606a" text-anchor="middle">steps.recent.outputs.commit_count</text>
+  <rect x="310" y="160" width="200" height="88" rx="8" fill="#ffffff" stroke="#b6bfb8" stroke-width="1.5" data-node="github-output"/>
+  <rect x="310" y="160" width="200" height="32" rx="8" fill="#e4ebe6"/>
+  <rect x="310" y="178" width="200" height="14" fill="#e4ebe6"/>
+  <text x="410" y="181" font-family="'Mona Sans Mono',monospace" font-size="14" font-weight="600" fill="#232925" text-anchor="middle">$GITHUB_OUTPUT</text>
+  <text x="410" y="214" font-family="'Mona Sans Mono',monospace" font-size="16" fill="#08872b" text-anchor="middle">commit_count=3</text>
+  <text x="410" y="237" font-family="'Mona Sans',system-ui,sans-serif" font-size="13" fill="#232925" text-anchor="middle">steps.recent.outputs.commit_count</text>
 
-  <!-- Arrow 2: output → if condition -->
-  <line x1="565" y1="175" x2="650" y2="175" stroke="#57606a" stroke-width="1.5" marker-end="url(#arrow-light)"/>
+  <!-- Arrow 2 -->
+  <line x1="510" y1="205" x2="618" y2="205" stroke="#232925" stroke-width="2" marker-end="url(#arrow)"/>
 
   <!-- if: condition diamond -->
-  <polygon points="760,130 870,175 760,220 650,175" fill="#ffffff" stroke="#d0d7de" stroke-width="1.5"/>
-  <text x="760" y="169" font-family="Arial,sans-serif" font-size="12" font-weight="bold" fill="#24292f" text-anchor="middle">if: condition</text>
-  <text x="760" y="187" font-family="monospace" font-size="10" fill="#0969da" text-anchor="middle">count != '0'</text>
+  <polygon points="760,148 882,205 760,262 638,205" fill="#ffffff" stroke="#b6bfb8" stroke-width="1.5" data-node="if-condition"/>
+  <text x="760" y="199" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#101411" text-anchor="middle">if: condition</text>
+  <text x="760" y="220" font-family="'Mona Sans Mono',monospace" font-size="14" fill="#08872b" text-anchor="middle">count != '0'</text>
 
-  <!-- Arrow 3a: true → agent job -->
-  <line x1="870" y1="175" x2="960" y2="175" stroke="#57606a" stroke-width="1.5" marker-end="url(#arrow-light)"/>
-  <text x="915" y="167" font-family="Arial,sans-serif" font-size="11" fill="#1a7f37" text-anchor="middle">true</text>
+  <!-- Arrow true → agent job -->
+  <line x1="882" y1="205" x2="960" y2="205" stroke="#232925" stroke-width="2" marker-end="url(#arrow)"/>
+  <text x="921" y="196" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#08872b" text-anchor="middle">true</text>
 
   <!-- Agent job box -->
-  <rect x="960" y="130" width="190" height="90" rx="8" fill="#ffffff" stroke="#d0d7de" stroke-width="1.5"/>
-  <rect x="960" y="130" width="190" height="30" rx="8" fill="#1a7f37"/>
-  <rect x="960" y="146" width="190" height="14" fill="#1a7f37"/>
-  <text x="1055" y="149" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">✅ Agent Job Runs</text>
-  <text x="1055" y="178" font-family="Arial,sans-serif" font-size="12" fill="#24292f" text-anchor="middle">AI processes commits</text>
-  <text x="1055" y="196" font-family="Arial,sans-serif" font-size="12" fill="#24292f" text-anchor="middle">and posts report</text>
+  <rect x="962" y="155" width="200" height="100" rx="8" fill="#ffffff" stroke="#b6bfb8" stroke-width="1.5" data-node="agent-job-runs"/>
+  <rect x="962" y="155" width="200" height="34" rx="8" fill="#1a7f37" data-state="done"/>
+  <rect x="962" y="171" width="200" height="18" fill="#1a7f37"/>
+  <text x="1062" y="177" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#f2f5f3" text-anchor="middle">Agent Job Runs</text>
+  <text x="1062" y="208" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#101411" text-anchor="middle">AI processes commits</text>
+  <text x="1062" y="228" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#101411" text-anchor="middle">and posts report</text>
 
-  <!-- Arrow 3b: false → skip -->
-  <line x1="760" y1="220" x2="760" y2="300" stroke="#57606a" stroke-width="1.5" marker-end="url(#arrow-light)"/>
-  <text x="773" y="265" font-family="Arial,sans-serif" font-size="11" fill="#9a6700" text-anchor="start">false</text>
+  <!-- Arrow false → skip box -->
+  <line x1="760" y1="262" x2="760" y2="338" stroke="#232925" stroke-width="2" marker-end="url(#arrow)"/>
+  <text x="772" y="305" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="start">false</text>
 
   <!-- Skip box -->
-  <rect x="660" y="300" width="200" height="80" rx="8" fill="#ffffff" stroke="#d0d7de" stroke-width="1.5"/>
-  <rect x="660" y="300" width="200" height="28" rx="8" fill="#6e7781"/>
-  <rect x="660" y="314" width="200" height="14" fill="#6e7781"/>
-  <text x="760" y="320" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">⏭ Agent Job Skipped</text>
-  <text x="760" y="350" font-family="Arial,sans-serif" font-size="12" fill="#57606a" text-anchor="middle">No commits — no report</text>
-  <text x="760" y="368" font-family="Arial,sans-serif" font-size="12" fill="#57606a" text-anchor="middle">saved AI tokens</text>
-
-  <!-- Step numbering badges -->
-  <circle cx="106" cy="90" r="13" fill="#0969da"/>
-  <text x="106" y="95" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">1</text>
-  <circle cx="465" cy="90" r="13" fill="#0969da"/>
-  <text x="465" y="95" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">2</text>
-  <circle cx="760" cy="90" r="13" fill="#0969da"/>
-  <text x="760" y="95" font-family="Arial,sans-serif" font-size="13" font-weight="bold" fill="#ffffff" text-anchor="middle">3</text>
-
-  <!-- Step labels -->
-  <text x="106" y="113" font-family="Arial,sans-serif" font-size="11" fill="#57606a" text-anchor="middle">Gather context</text>
-  <text x="465" y="113" font-family="Arial,sans-serif" font-size="11" fill="#57606a" text-anchor="middle">Expose as output</text>
-  <text x="760" y="113" font-family="Arial,sans-serif" font-size="11" fill="#57606a" text-anchor="middle">Evaluate condition</text>
+  <rect x="640" y="340" width="240" height="90" rx="8" fill="#ffffff" stroke="#b6bfb8" stroke-width="1.5" data-node="agent-job-skipped"/>
+  <rect x="640" y="340" width="240" height="34" rx="8" fill="#57606a" data-state="skipped"/>
+  <rect x="640" y="356" width="240" height="18" fill="#57606a"/>
+  <text x="760" y="362" font-family="'Mona Sans',system-ui,sans-serif" font-size="16" font-weight="600" fill="#f2f5f3" text-anchor="middle">Agent Job Skipped</text>
+  <text x="760" y="394" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="middle">No commits — no report</text>
+  <text x="760" y="414" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="middle">saves AI tokens</text>
 
   <!-- Bottom annotation -->
-  <text x="600" y="470" font-family="Arial,sans-serif" font-size="12" fill="#57606a" text-anchor="middle">Deterministic steps run first; the agent job is gated by the evaluated output value.</text>
+  <text x="600" y="490" font-family="'Mona Sans',system-ui,sans-serif" font-size="14" fill="#232925" text-anchor="middle">Deterministic steps run first; the agent job is gated by the evaluated output value.</text>
 
-  <!-- Arrow marker -->
-  <defs>
-    <marker id="arrow-light" markerWidth="8" markerHeight="8" refX="6" refY="3" orient="auto">
-      <path d="M0,0 L0,6 L8,3 z" fill="#57606a"/>
-    </marker>
-  </defs>
 </svg>