From 4adb1d5efb3c4cd0dd85fb6ba2a022e09a3a4993 Mon Sep 17 00:00:00 2001
From: "Mikhail [azalio] Petrov" <azalio@yandex-team.ru>
Date: Thu, 23 Jul 2026 22:22:45 +0300
Subject: [PATCH] polish hero.svg: vertical gate stack, fix value-line
 collision
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Redesign the hero right rail from the crammed 2-row mini-loop + return arc
into a clean vertical gate stack (SPEC, PLAN, TEST, CODE, REVIEW, LEARN) on
a 248-unit rail separated by a divider. PLAN stays the amber approval gate,
LEARN the green loop-back. Moves the value line fully clear of the rail —
the old layout let "You approve the plan..." (≈715 units) crowd the 740px
rail boundary. Font-metric verified: value2 715 ≤ 770 avail; title 544 ≤ 772.
---
 assets/readme/hero.svg | 87 +++++++++++++++++++-----------------------
 1 file changed, 39 insertions(+), 48 deletions(-)

diff --git a/assets/readme/hero.svg b/assets/readme/hero.svg
index 40e9e1c4..67de0ba8 100644
--- a/assets/readme/hero.svg
+++ b/assets/readme/hero.svg
@@ -1,6 +1,6 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="1200" height="360" viewBox="0 0 1200 360" role="img" aria-labelledby="heroTitle heroDesc">
   <title id="heroTitle">MAP Framework — Plan-then-build AI coding for Claude Code &amp; Codex CLI</title>
-  <desc id="heroDesc">Title block: MAP Framework, Modular Agentic Planner. One-line value and the five-stage loop SPEC, PLAN, TEST, CODE, REVIEW, LEARN ending in an approval gate.</desc>
+  <desc id="heroDesc">Title block: MAP Framework, Modular Agentic Planner. One-line value and the loop SPEC, PLAN, TEST, CODE, REVIEW, LEARN. PLAN is the approval gate; LEARN feeds the next run.</desc>
 
   <defs>
     <pattern id="grid" width="32" height="32" patternUnits="userSpaceOnUse">
@@ -16,71 +16,62 @@
   <rect x="0" y="0" width="7" height="360" fill="#F0B429"/>
 
   <!-- eyebrow -->
-  <g font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" fill="#8B949E" font-size="20" letter-spacing="3" font-weight="600">
-    <text x="64" y="78">MODULAR AGENTIC PLANNER</text>
-    <circle cx="48" cy="71" r="5" fill="#F0B429"/>
+  <g font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" fill="#8B949E" font-size="19" letter-spacing="3" font-weight="600">
+    <circle cx="50" cy="66" r="5" fill="#F0B429"/>
+    <text x="66" y="73">MODULAR AGENTIC PLANNER</text>
   </g>
 
   <!-- title -->
-  <text x="62" y="148" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="78" font-weight="800" fill="#E6EDF3" letter-spacing="-1.5">MAP Framework</text>
+  <text x="64" y="146" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="76" font-weight="800" fill="#E6EDF3" letter-spacing="-1.5">MAP Framework</text>
 
   <!-- value line -->
-  <text x="64" y="196" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="27" fill="#C9D1D9" font-weight="500">Plan-then-build AI coding.</text>
-  <text x="64" y="230" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="27" fill="#8B949E" font-weight="500">You approve the plan before the model writes a line of code.</text>
+  <text x="66" y="198" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="26" fill="#C9D1D9" font-weight="500">Plan-then-build AI coding.</text>
+  <text x="66" y="232" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="26" fill="#8B949E" font-weight="500">You approve the plan before the model writes a line of code.</text>
 
   <!-- providers -->
   <g font-family="ui-monospace,SFMono-Regular,Menlo,monospace" font-size="19" fill="#8B949E">
-    <text x="64" y="284">claude code</text>
-    <text x="180" y="284" fill="#3A4451">/</text>
-    <text x="196" y="284">codex cli</text>
-    <text x="286" y="284" fill="#3A4451">/</text>
-    <text x="302" y="284">python 3.11+</text>
-    <text x="430" y="284" fill="#3A4451">/</text>
-    <text x="446" y="284">v3.23.0</text>
+    <text x="66" y="292">claude code</text>
+    <text x="182" y="292" fill="#3A4451">/</text>
+    <text x="198" y="292">codex cli</text>
+    <text x="288" y="292" fill="#3A4451">/</text>
+    <text x="304" y="292">python 3.11+</text>
+    <text x="432" y="292" fill="#3A4451">/</text>
+    <text x="448" y="292">v3.23.0</text>
   </g>
 
-  <!-- right: the loop as a gate sequence -->
-  <g transform="translate(740 56)">
-    <text x="0" y="0" font-family="ui-monospace,SFMono-Regular,Menlo,monospace" font-size="16" fill="#6E7681" letter-spacing="1.5">THE LOOP</text>
+  <!-- divider -->
+  <line x1="836" y1="56" x2="836" y2="304" stroke="#232A33" stroke-width="1"/>
 
-    <!-- stage row -->
-    <g font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="22" font-weight="700">
-      <!-- SPEC -->
-      <rect x="0" y="20" width="120" height="48" rx="10" fill="#161B22" stroke="#30363D"/>
-      <text x="60" y="50" text-anchor="middle" fill="#E6EDF3">SPEC</text>
+  <!-- right rail: the loop as a vertical gate stack -->
+  <g transform="translate(872 48)">
+    <text x="0" y="0" font-family="ui-monospace,SFMono-Regular,Menlo,monospace" font-size="15" fill="#6E7681" letter-spacing="2">THE LOOP</text>
 
-      <path d="M124 44 l20 0 m-8 -8 l8 8 l-8 8" stroke="#3A4451" stroke-width="2.5" fill="none"/>
+    <g font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="19" font-weight="700">
+      <!-- SPEC -->
+      <rect x="0" y="14" width="248" height="36" rx="9" fill="#161B22" stroke="#30363D"/>
+      <text x="18" y="38" fill="#E6EDF3">SPEC</text>
 
-      <!-- PLAN (highlighted — the approval gate) -->
-      <rect x="150" y="20" width="120" height="48" rx="10" fill="#1C1503" stroke="#F0B429" stroke-width="2"/>
-      <text x="210" y="50" text-anchor="middle" fill="#F0B429">PLAN</text>
-      <text x="210" y="86" text-anchor="middle" font-family="ui-monospace,SFMono-Regular,Menlo,monospace" font-size="14" fill="#F0B429" font-weight="500">✓ you approve</text>
+      <!-- PLAN (the approval gate) -->
+      <rect x="0" y="56" width="248" height="38" rx="9" fill="#1C1503" stroke="#F0B429" stroke-width="1.6"/>
+      <text x="18" y="81" fill="#F0B429">PLAN</text>
+      <text x="230" y="80" text-anchor="end" font-family="ui-monospace,SFMono-Regular,Menlo,monospace" font-size="13" fill="#F0B429" font-weight="500">✓ you approve</text>
 
-      <path d="M274 44 l20 0 m-8 -8 l8 8 l-8 8" stroke="#3A4451" stroke-width="2.5" fill="none"/>
+      <!-- TEST -->
+      <rect x="0" y="100" width="248" height="36" rx="9" fill="#161B22" stroke="#30363D"/>
+      <text x="18" y="124" fill="#E6EDF3">TEST</text>
 
       <!-- CODE -->
-      <rect x="300" y="20" width="120" height="48" rx="10" fill="#161B22" stroke="#30363D"/>
-      <text x="360" y="50" text-anchor="middle" fill="#E6EDF3">CODE</text>
-    </g>
-
-    <!-- closing loop -->
-    <g transform="translate(0 96)">
-      <rect x="0" y="0" width="120" height="44" rx="10" fill="#161B22" stroke="#30363D"/>
-      <text x="60" y="28" text-anchor="middle" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="19" font-weight="700" fill="#E6EDF3">REVIEW</text>
+      <rect x="0" y="142" width="248" height="36" rx="9" fill="#161B22" stroke="#30363D"/>
+      <text x="18" y="166" fill="#E6EDF3">CODE</text>
 
-      <path d="M124 22 l20 0 m-8 -8 l8 8 l-8 8" stroke="#3A4451" stroke-width="2.5" fill="none"/>
+      <!-- REVIEW -->
+      <rect x="0" y="184" width="248" height="36" rx="9" fill="#161B22" stroke="#30363D"/>
+      <text x="18" y="208" fill="#E6EDF3">REVIEW</text>
 
-      <rect x="150" y="0" width="120" height="44" rx="10" fill="#0D1F14" stroke="#3FB950"/>
-      <text x="210" y="28" text-anchor="middle" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="19" font-weight="700" fill="#3FB950">LEARN</text>
-
-      <path d="M274 22 l20 0 m-8 -8 l8 8 l-8 8" stroke="#3A4451" stroke-width="2.5" fill="none"/>
-
-      <rect x="300" y="0" width="120" height="44" rx="10" fill="#161B22" stroke="#30363D"/>
-      <text x="360" y="28" text-anchor="middle" font-family="-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif" font-size="19" font-weight="700" fill="#8B949E">next run</text>
+      <!-- LEARN (feeds next run) -->
+      <rect x="0" y="226" width="248" height="36" rx="9" fill="#0D1F14" stroke="#3FB950" stroke-width="1.4"/>
+      <text x="18" y="250" fill="#3FB950">LEARN</text>
+      <text x="230" y="249" text-anchor="end" font-family="ui-monospace,SFMono-Regular,Menlo,monospace" font-size="13" fill="#3FB950" font-weight="500">↻ next run</text>
     </g>
-
-    <!-- return arc -->
-    <path d="M360 110 q40 30 0 60 q-30 22 -300 22" stroke="#3FB950" stroke-width="2" fill="none" stroke-dasharray="5 6" opacity="0.55"/>
-    <text x="210" y="184" text-anchor="middle" font-family="ui-monospace,SFMono-Regular,Menlo,monospace" font-size="14" fill="#3FB950" opacity="0.8">gotchas survive the session</text>
   </g>
 </svg>