diff --git a/design-refs/mockup/components.html b/design-refs/mockup/components.html
index 28f102f..4d1697b 100644
--- a/design-refs/mockup/components.html
+++ b/design-refs/mockup/components.html
@@ -681,16 +681,16 @@
         <div class="vlabel"><b>step</b> · 直角步进</div>
       </div>
       <div class="linecard">
-        <svg width="240" height="52" viewBox="0 0 240 52"><path class="edge" d="M 20 26 H 54"/><path class="edge" d="M 54 26 A 6 6 0 0 0 60 20 V 14 A 6 6 0 0 1 66 8 H 220"/><path class="edge" d="M 54 26 A 6 6 0 0 1 60 32 V 38 A 6 6 0 0 0 66 44 H 220"/><circle class="station" cx="28" cy="26" r="2.8"/><circle class="station" cx="212" cy="8" r="2.8"/><circle class="station" cx="212" cy="44" r="2.8"/></svg>
+        <svg width="240" height="52" viewBox="0 0 240 52"><path class="edge" d="M 20 26 H 54"/><path class="edge" d="M 54 26 A 6 6 0 0 0 60 20 V 14 A 6 6 0 0 1 66 8 H 220"/><path class="edge" d="M 54 26 A 6 6 0 0 1 60 32 V 38 A 6 6 0 0 0 66 44 H 220"/><circle class="station" cx="20" cy="26" r="2.8"/><circle class="station" cx="220" cy="8" r="2.8"/><circle class="station" cx="220" cy="44" r="2.8"/></svg>
         <div class="vlabel"><b>fork</b> · 分流岔口</div>
       </div>
       <div class="linecard">
-        <svg width="240" height="52" viewBox="0 0 240 52"><path class="edge" d="M 20 8 H 144 A 6 6 0 0 1 150 14 V 20 A 6 6 0 0 0 156 26 H 220"/><path class="edge" d="M 20 44 H 144 A 6 6 0 0 0 150 38 V 32 A 6 6 0 0 1 156 26 H 220"/><circle class="station" cx="28" cy="8" r="2.8"/><circle class="station" cx="28" cy="44" r="2.8"/><circle class="station" cx="212" cy="26" r="2.8"/></svg>
+        <svg width="240" height="52" viewBox="0 0 240 52"><path class="edge" d="M 20 8 H 144 A 6 6 0 0 1 150 14 V 20 A 6 6 0 0 0 156 26 H 220"/><path class="edge" d="M 20 44 H 144 A 6 6 0 0 0 150 38 V 32 A 6 6 0 0 1 156 26 H 220"/><circle class="station" cx="20" cy="8" r="2.8"/><circle class="station" cx="20" cy="44" r="2.8"/><circle class="station" cx="220" cy="26" r="2.8"/></svg>
         <div class="vlabel"><b>merge</b> · 汇合并线</div>
       </div>
       <div class="linecard">
-        <svg width="240" height="52" viewBox="0 0 240 52"><path class="edge" d="M 20 26 H 220"/><circle class="station" cx="34" cy="26" r="3"/><circle class="station" cx="206" cy="26" r="3"/></svg>
-        <div class="vlabel"><b>station</b> · 站点（贴近卡边锚定）</div>
+        <svg width="240" height="52" viewBox="0 0 240 52"><rect x="8" y="12" width="30" height="28" rx="6" fill="#f4f4f2" stroke="#e2e2e0"/><rect x="202" y="12" width="30" height="28" rx="6" fill="#f4f4f2" stroke="#e2e2e0"/><path class="edge" d="M 38 26 H 202"/><circle class="station" cx="38" cy="26" r="3"/><circle class="station" cx="202" cy="26" r="3"/></svg>
+        <div class="vlabel"><b>station</b> · 站点（半嵌卡边）</div>
       </div>
     </div>
   </div>
@@ -705,14 +705,6 @@
       <path class="edge" d="M 535 84 H 557 A 8 8 0 0 1 565 92 V 157 A 8 8 0 0 0 573 165 H 670"/>
       <path class="edge" d="M 535 246 H 557 A 8 8 0 0 0 565 238 V 173 A 8 8 0 0 1 573 165 H 670"/>
       <path class="edge" d="M 860 165 H 872"/>
-      <circle class="station" cx="11"  cy="165" r="2.8"/>
-      <circle class="station" cx="218" cy="165" r="2.8"/>
-      <circle class="station" cx="337" cy="84"  r="2.8"/>
-      <circle class="station" cx="337" cy="246" r="2.8"/>
-      <circle class="station" cx="543" cy="84"  r="2.8"/>
-      <circle class="station" cx="543" cy="246" r="2.8"/>
-      <circle class="station" cx="662" cy="165" r="2.8"/>
-      <circle class="station" cx="866" cy="165" r="2.8"/>
     </svg>
     <div class="rcard" style="left:20px; top:92px;">
       <span class="entry-badge" style="width:20px;height:20px;font-size:11px;">①</span>
@@ -732,6 +724,16 @@
       <div class="rzone" style="background:#d1fae5;"><span>📦</span><i>16:9 · GIF</i></div>
       <div class="rt"><span class="icotile" style="background:#d1fae5;">📦</span><b>更多</b><span class="st done">✓</span></div>
     </div>
+    <svg class="gedges" width="880" height="330" viewBox="0 0 880 330">
+      <circle class="station" cx="20"  cy="165" r="2.8"/>
+      <circle class="station" cx="210" cy="165" r="2.8"/>
+      <circle class="station" cx="345" cy="84"  r="2.8"/>
+      <circle class="station" cx="345" cy="246" r="2.8"/>
+      <circle class="station" cx="535" cy="84"  r="2.8"/>
+      <circle class="station" cx="535" cy="246" r="2.8"/>
+      <circle class="station" cx="670" cy="165" r="2.8"/>
+      <circle class="station" cx="860" cy="165" r="2.8"/>
+    </svg>
     <div style="position:absolute; right:14px; top:250px; font-size:11px; color:#6b6b6b;">→ 下一程：全栈基础 🔒 · ③ 高级教程</div>
     <div style="position:absolute; right:12px; top:10px; font-size:11px; color:#6b6b6b;">分流 ×1 · 并线 ×2 · 站点 ×8</div>
   </div>
@@ -743,14 +745,14 @@
       <tr><td class="k"><code>path</code></td><td>Segment[]</td><td>直段/转角/步进序列</td></tr>
       <tr><td class="k"><code>forks</code></td><td>Fork[]</td><td>分流岔口（分出车道）</td></tr>
       <tr><td class="k"><code>merges</code></td><td>Merge[]</td><td>直角并线点</td></tr>
-      <tr><td class="k"><code>stations</code></td><td>Node[]</td><td>站点圆点，贴近卡边锚定</td></tr>
+      <tr><td class="k"><code>stations</code></td><td>Node[]</td><td>站点圆点，半嵌卡边</td></tr>
       <tr><td class="k"><code>status</code></td><td>无 prop</td><td>不在图上编码</td></tr>
     </table>
   </div>
   <div style="position:absolute; top: 420px; left: 948px; width: 292px;" class="panel">
     <h3 style="margin-bottom:6px;">设计原则</h3>
     <div class="note" style="margin-bottom:4px;"><span class="idx">1</span><span class="txt"><b>线只管顺序</b>：状态交给卡片 ✓ / 🔒。</span></div>
-    <div class="note" style="margin-bottom:4px;"><span class="idx">2</span><span class="txt"><b>背景级线条</b>：鼠尾草绿 <code>#A2B49B</code> · 1.4px · 划隙 4:2；站点 <code>#758C72</code> 贴近卡边锚定，直径 ≈ 4× 线宽。</span></div>
+    <div class="note" style="margin-bottom:4px;"><span class="idx">2</span><span class="txt"><b>背景级线条</b>：鼠尾草绿 <code>#A2B49B</code> · 1.4px · 划隙 4:2；站点 <code>#758C72</code> 半嵌卡边（圆点中心落在卡边上），直径 ≈ 4× 线宽。</span></div>
     <div class="note" style="margin-bottom:4px;"><span class="idx">3</span><span class="txt"><b>横平竖直</b>：走向只有水平与垂直，转折用小圆角 R8，全图无斜线。</span></div>
     <div class="note" style="margin-bottom:4px;"><span class="idx">4</span><span class="txt"><b>岔口即分支</b>：快速开始分流出 React 线与示例线，在「更多」并线。</span></div>
     <div class="note" style="margin-bottom:0;"><span class="idx">5</span><span class="txt">顺序为<b>示例占位</b>，填 courses.ts 自动更新。</span></div>
diff --git a/design-refs/mockup/components.pdf b/design-refs/mockup/components.pdf
index 5d0b1fe..0f6f900 100644
Binary files a/design-refs/mockup/components.pdf and b/design-refs/mockup/components.pdf differ