From e53739367ae6053b3ac05ce19ec0cae389521521 Mon Sep 17 00:00:00 2001
From: Shayan Rais <shanraisshan@gmail.com>
Date: Thu, 7 May 2026 11:45:00 +0500
Subject: [PATCH] =?UTF-8?q?add=20llm-basic.svg=20=E2=80=94=20animated=20au?=
 =?UTF-8?q?toregressive=20generation=20diagram?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Three-panel SVG (input context, LLM black box, predicted next token) with
7-iteration loop generating "The capital of Japan is Tokyo." from the prompt
"What is the capital of Japan?". Includes purple feedback loop showing each
predicted token appended back into the input.

Co-Authored-By: Claude <noreply@anthropic.com>
---
 presentation/assets/llm/llm-basic.svg | 123 ++++++++++++++++++++++++++
 1 file changed, 123 insertions(+)
 create mode 100644 presentation/assets/llm/llm-basic.svg

diff --git a/presentation/assets/llm/llm-basic.svg b/presentation/assets/llm/llm-basic.svg
new file mode 100644
index 0000000..1e77767
--- /dev/null
+++ b/presentation/assets/llm/llm-basic.svg
@@ -0,0 +1,123 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 500" width="1200" height="500"
+     font-family="Helvetica, Arial, sans-serif">
+  <defs>
+    <marker id="arrow" viewBox="0 0 10 10" refX="9" refY="5"
+            markerWidth="8" markerHeight="8" orient="auto-start-reverse">
+      <path d="M0,0 L10,5 L0,10 z" fill="#333"/>
+    </marker>
+    <marker id="arrowFB" viewBox="0 0 10 10" refX="9" refY="5"
+            markerWidth="8" markerHeight="8" orient="auto-start-reverse">
+      <path d="M0,0 L10,5 L0,10 z" fill="#9c27b0"/>
+    </marker>
+  </defs>
+
+  <rect width="1200" height="500" fill="#fafbfc"/>
+
+  <text x="600" y="35" text-anchor="middle" font-size="22" font-weight="bold" fill="#1a1a1a">
+    How an LLM generates text (autoregressive)
+  </text>
+  <text x="600" y="58" text-anchor="middle" font-size="13" fill="#666">
+    Each predicted token is appended to the input, then fed back into the LLM
+  </text>
+
+  <text x="600" y="85" text-anchor="middle" font-size="13" font-weight="700" fill="#1976d2" opacity="0" letter-spacing="1">ITERATION 1 / 7<animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.11056;0.11111;0.22222;0.23333;1" dur="18.0s" repeatCount="indefinite"/></text>
+  <text x="600" y="85" text-anchor="middle" font-size="13" font-weight="700" fill="#1976d2" opacity="0" letter-spacing="1">ITERATION 2 / 7<animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.22167;0.22222;0.33333;0.34444;1" dur="18.0s" repeatCount="indefinite"/></text>
+  <text x="600" y="85" text-anchor="middle" font-size="13" font-weight="700" fill="#1976d2" opacity="0" letter-spacing="1">ITERATION 3 / 7<animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.33278;0.33333;0.44444;0.45556;1" dur="18.0s" repeatCount="indefinite"/></text>
+  <text x="600" y="85" text-anchor="middle" font-size="13" font-weight="700" fill="#1976d2" opacity="0" letter-spacing="1">ITERATION 4 / 7<animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.44389;0.44444;0.55556;0.56667;1" dur="18.0s" repeatCount="indefinite"/></text>
+  <text x="600" y="85" text-anchor="middle" font-size="13" font-weight="700" fill="#1976d2" opacity="0" letter-spacing="1">ITERATION 5 / 7<animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.55500;0.55556;0.66667;0.67778;1" dur="18.0s" repeatCount="indefinite"/></text>
+  <text x="600" y="85" text-anchor="middle" font-size="13" font-weight="700" fill="#1976d2" opacity="0" letter-spacing="1">ITERATION 6 / 7<animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.66611;0.66667;0.77778;0.78889;1" dur="18.0s" repeatCount="indefinite"/></text>
+  <text x="600" y="85" text-anchor="middle" font-size="13" font-weight="700" fill="#1976d2" opacity="0" letter-spacing="1">ITERATION 7 / 7<animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.77722;0.77778;0.88889;0.90000;1" dur="18.0s" repeatCount="indefinite"/></text>
+
+  <!-- INPUT PANEL -->
+  <text x="225" y="100" text-anchor="middle" font-size="11" font-weight="700"
+        fill="#777" letter-spacing="1.5">INPUT (CONTEXT)</text>
+  <rect x="30" y="110" width="400" height="280" rx="10"
+        fill="#fff" stroke="#c5cee0" stroke-width="2"/>
+
+  <text x="42" y="148" font-size="11" font-weight="600" fill="#888"
+        letter-spacing="0.5">Original prompt</text>
+  <g opacity="0"><rect x="42" y="165" width="52" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="68.0" y="184" text-anchor="middle" font-size="14" fill="#0d47a1" font-family="ui-monospace,Menlo,Consolas,monospace">What</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.00500;0.01944;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="100" y="165" width="36" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="118.0" y="184" text-anchor="middle" font-size="14" fill="#0d47a1" font-family="ui-monospace,Menlo,Consolas,monospace">is</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.01333;0.02778;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="142" y="165" width="44" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="164.0" y="184" text-anchor="middle" font-size="14" fill="#0d47a1" font-family="ui-monospace,Menlo,Consolas,monospace">the</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.02167;0.03611;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="192" y="165" width="76" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="230.0" y="184" text-anchor="middle" font-size="14" fill="#0d47a1" font-family="ui-monospace,Menlo,Consolas,monospace">capital</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.03000;0.04444;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="274" y="165" width="36" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="292.0" y="184" text-anchor="middle" font-size="14" fill="#0d47a1" font-family="ui-monospace,Menlo,Consolas,monospace">of</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.03833;0.05278;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="316" y="165" width="60" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="346.0" y="184" text-anchor="middle" font-size="14" fill="#0d47a1" font-family="ui-monospace,Menlo,Consolas,monospace">Japan</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.04667;0.06111;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="382" y="165" width="28" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="396.0" y="184" text-anchor="middle" font-size="14" fill="#0d47a1" font-family="ui-monospace,Menlo,Consolas,monospace">?</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.05500;0.06944;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+
+  <text x="42" y="228" font-size="11" font-weight="600" fill="#bf360c"
+        letter-spacing="0.5">Generated tokens (autoregressive)</text>
+  <g opacity="0"><rect x="42" y="245" width="44" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="64.0" y="264" text-anchor="middle" font-size="14" fill="#bf360c" font-family="ui-monospace,Menlo,Consolas,monospace">The</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.19389;0.20833;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="92" y="245" width="76" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="130.0" y="264" text-anchor="middle" font-size="14" fill="#bf360c" font-family="ui-monospace,Menlo,Consolas,monospace">capital</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.30500;0.31944;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="174" y="245" width="36" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="192.0" y="264" text-anchor="middle" font-size="14" fill="#bf360c" font-family="ui-monospace,Menlo,Consolas,monospace">of</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.41611;0.43056;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="216" y="245" width="60" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="246.0" y="264" text-anchor="middle" font-size="14" fill="#bf360c" font-family="ui-monospace,Menlo,Consolas,monospace">Japan</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.52722;0.54167;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="282" y="245" width="36" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="300.0" y="264" text-anchor="middle" font-size="14" fill="#bf360c" font-family="ui-monospace,Menlo,Consolas,monospace">is</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.63833;0.65278;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="324" y="245" width="60" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="354.0" y="264" text-anchor="middle" font-size="14" fill="#bf360c" font-family="ui-monospace,Menlo,Consolas,monospace">Tokyo</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.74944;0.76389;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="390" y="245" width="28" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="404.0" y="264" text-anchor="middle" font-size="14" fill="#bf360c" font-family="ui-monospace,Menlo,Consolas,monospace">.</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.86056;0.87500;0.93333;0.95556;1" dur="18.0s" repeatCount="indefinite"/></g>
+
+  <!-- arrow input -> LLM -->
+  <line x1="430" y1="270" x2="475" y2="270" stroke="#333" stroke-width="2.5"
+        marker-end="url(#arrow)"/>
+  <circle cx="435" cy="270" r="6" fill="#1976d2" opacity="0"><animate attributeName="cx" values="435;435;435;475;475;435;435;475;475;435;435;475;475;435;435;475;475;435;435;475;475;435;435;475;475;435;435;475;475;435" keyTimes="0;0.10833;0.11111;0.13056;0.13333;0.21944;0.22222;0.24167;0.24444;0.33056;0.33333;0.35278;0.35556;0.44167;0.44444;0.46389;0.46667;0.55278;0.55556;0.57500;0.57778;0.66389;0.66667;0.68611;0.68889;0.77500;0.77778;0.79722;0.80000;1" dur="18.0s" repeatCount="indefinite"/><animate attributeName="opacity" values="0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0" keyTimes="0;0.10833;0.11111;0.13056;0.13333;0.21944;0.22222;0.24167;0.24444;0.33056;0.33333;0.35278;0.35556;0.44167;0.44444;0.46389;0.46667;0.55278;0.55556;0.57500;0.57778;0.66389;0.66667;0.68611;0.68889;0.77500;0.77778;0.79722;0.80000;1" dur="18.0s" repeatCount="indefinite"/></circle>
+
+  <!-- LLM black box -->
+  <rect x="480" y="215" width="240" height="120" rx="12" fill="#0d0d0d" stroke="#000"/>
+  <text x="600" y="270" text-anchor="middle" fill="#fff"
+        font-size="40" font-weight="bold" font-family="ui-monospace,Menlo,monospace">LLM</text>
+  <text x="600" y="293" text-anchor="middle" fill="#888" font-size="11"
+        letter-spacing="0.5">(black box)</text>
+  <circle cx="580" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.11333;0.11389;0.13333;0.13611;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="600" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.11889;0.11944;0.13333;0.13611;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="620" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.12444;0.12500;0.13333;0.13611;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="580" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.22444;0.22500;0.24444;0.24722;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="600" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.23000;0.23056;0.24444;0.24722;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="620" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.23556;0.23611;0.24444;0.24722;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="580" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.33556;0.33611;0.35556;0.35833;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="600" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.34111;0.34167;0.35556;0.35833;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="620" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.34667;0.34722;0.35556;0.35833;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="580" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.44667;0.44722;0.46667;0.46944;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="600" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.45222;0.45278;0.46667;0.46944;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="620" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.45778;0.45833;0.46667;0.46944;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="580" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.55778;0.55833;0.57778;0.58056;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="600" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.56333;0.56389;0.57778;0.58056;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="620" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.56889;0.56944;0.57778;0.58056;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="580" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.66889;0.66944;0.68889;0.69167;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="600" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.67444;0.67500;0.68889;0.69167;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="620" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.68000;0.68056;0.68889;0.69167;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="580" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.78000;0.78056;0.80000;0.80278;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="600" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.78556;0.78611;0.80000;0.80278;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <circle cx="620" cy="312" r="3.5" fill="#ffc107" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.79111;0.79167;0.80000;0.80278;1" dur="18.0s" repeatCount="indefinite"/></circle>
+  <rect x="478" y="213" width="244" height="124" rx="12" fill="none" stroke="#ffc107" stroke-width="4" opacity="0"><animate attributeName="opacity" values="0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0" keyTimes="0;0.10833;0.11111;0.13333;0.13611;0.21944;0.22222;0.24444;0.24722;0.33056;0.33333;0.35556;0.35833;0.44167;0.44444;0.46667;0.46944;0.55278;0.55556;0.57778;0.58056;0.66389;0.66667;0.68889;0.69167;0.77500;0.77778;0.80000;0.80278;1" dur="18.0s" repeatCount="indefinite"/></rect>
+
+  <!-- arrow LLM -> output -->
+  <line x1="725" y1="270" x2="765" y2="270" stroke="#333" stroke-width="2.5"
+        marker-end="url(#arrow)"/>
+  <circle cx="725" cy="270" r="6" fill="#e65100" opacity="0"><animate attributeName="cx" values="725;725;725;765;765;725;725;765;765;725;725;765;765;725;725;765;765;725;725;765;765;725;725;765;765;725;725;765;765;725" keyTimes="0;0.13056;0.13333;0.15000;0.15278;0.24167;0.24444;0.26111;0.26389;0.35278;0.35556;0.37222;0.37500;0.46389;0.46667;0.48333;0.48611;0.57500;0.57778;0.59444;0.59722;0.68611;0.68889;0.70556;0.70833;0.79722;0.80000;0.81667;0.81944;1" dur="18.0s" repeatCount="indefinite"/><animate attributeName="opacity" values="0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0;1;1;0;0" keyTimes="0;0.13056;0.13333;0.15000;0.15278;0.24167;0.24444;0.26111;0.26389;0.35278;0.35556;0.37222;0.37500;0.46389;0.46667;0.48333;0.48611;0.57500;0.57778;0.59444;0.59722;0.68611;0.68889;0.70556;0.70833;0.79722;0.80000;0.81667;0.81944;1" dur="18.0s" repeatCount="indefinite"/></circle>
+
+  <!-- OUTPUT PANEL -->
+  <text x="970" y="100" text-anchor="middle" font-size="11" font-weight="700"
+        fill="#777" letter-spacing="1.5">PREDICTED NEXT TOKEN</text>
+  <rect x="770" y="110" width="400" height="280" rx="10"
+        fill="#fff" stroke="#ffc107" stroke-width="2"/>
+  <text x="970" y="200" text-anchor="middle" font-size="12" fill="#888"
+        font-style="italic">argmax  P(next token | input)</text>
+  <g opacity="0"><rect x="845" y="225" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="265" text-anchor="middle" font-size="30" fill="#bf360c" font-weight="700" font-family="ui-monospace,Menlo,Consolas,monospace">The</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.13889;0.15000;0.20556;0.21667;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="845" y="225" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="265" text-anchor="middle" font-size="30" fill="#bf360c" font-weight="700" font-family="ui-monospace,Menlo,Consolas,monospace">capital</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.25000;0.26111;0.31667;0.32778;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="845" y="225" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="265" text-anchor="middle" font-size="30" fill="#bf360c" font-weight="700" font-family="ui-monospace,Menlo,Consolas,monospace">of</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.36111;0.37222;0.42778;0.43889;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="845" y="225" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="265" text-anchor="middle" font-size="30" fill="#bf360c" font-weight="700" font-family="ui-monospace,Menlo,Consolas,monospace">Japan</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.47222;0.48333;0.53889;0.55000;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="845" y="225" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="265" text-anchor="middle" font-size="30" fill="#bf360c" font-weight="700" font-family="ui-monospace,Menlo,Consolas,monospace">is</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.58333;0.59444;0.65000;0.66111;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="845" y="225" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="265" text-anchor="middle" font-size="30" fill="#bf360c" font-weight="700" font-family="ui-monospace,Menlo,Consolas,monospace">Tokyo</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.69444;0.70556;0.76111;0.77222;1" dur="18.0s" repeatCount="indefinite"/></g>
+  <g opacity="0"><rect x="845" y="225" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="265" text-anchor="middle" font-size="30" fill="#bf360c" font-weight="700" font-family="ui-monospace,Menlo,Consolas,monospace">.</text><animate attributeName="opacity" values="0;0;1;1;0;0" keyTimes="0;0.80556;0.81667;0.87222;0.88333;1" dur="18.0s" repeatCount="indefinite"/></g>
+
+  <!-- Feedback loop -->
+  <path d="M 970 395 Q 600 470 230 395"
+        stroke="#9c27b0" stroke-width="2.5" fill="none"
+        stroke-dasharray="6,5" marker-end="url(#arrowFB)">
+    <animate attributeName="stroke-dashoffset" from="0" to="-22"
+             dur="0.8s" repeatCount="indefinite"/>
+  </path>
+  <text x="600" y="488" text-anchor="middle" fill="#9c27b0" font-size="13"
+        font-style="italic" font-weight="600">
+    predicted token appended to input → next iteration
+  </text>
+</svg>