Shayan Rais
13f7ca9e48
Title and subtitle removed from the SVG (now promoted to the slide-level heading and caption). Iteration counter relocated from the top of the SVG (y=85) to the bottom (y=480), just above the feedback caption, with font size increased from 13 to 20 for projector readability. The whole diagram (panels, LLM box, arrows, animated circles, feedback path) shifted upward by 80px to reclaim the space freed by the removed title and subtitle — the diagram now fills more of its viewBox rather than leaving empty space at the top. ViewBox extended 500 → 530 at the bottom to accommodate the relocated iteration counter and pushed-down feedback caption (y=488 → y=510). Background rect height bumped to 530 to match (otherwise the new bottom strip would render transparent). All 7 <animate> blocks on iteration elements preserved verbatim — only the parent <text> y and font-size attributes changed. Co-Authored-By: Claude <noreply@anthropic.com>
117 lines
20 KiB
XML
117 lines
20 KiB
XML
<?xml version="1.0" encoding="UTF-8"?>
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 530" width="1200" height="530"
|
|
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="530" fill="#fafbfc"/>
|
|
|
|
<text x="600" y="480" text-anchor="middle" font-size="20" 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="480" text-anchor="middle" font-size="20" 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="480" text-anchor="middle" font-size="20" 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="480" text-anchor="middle" font-size="20" 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="480" text-anchor="middle" font-size="20" 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="480" text-anchor="middle" font-size="20" 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="480" text-anchor="middle" font-size="20" 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="20" text-anchor="middle" font-size="11" font-weight="700"
|
|
fill="#777" letter-spacing="1.5">INPUT (CONTEXT)</text>
|
|
<rect x="30" y="30" width="400" height="280" rx="10"
|
|
fill="#fff" stroke="#c5cee0" stroke-width="2"/>
|
|
|
|
<text x="42" y="68" font-size="11" font-weight="600" fill="#888"
|
|
letter-spacing="0.5">Original prompt</text>
|
|
<g opacity="0"><rect x="42" y="85" width="52" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="68.0" y="104" 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="85" width="36" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="118.0" y="104" 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="85" width="44" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="164.0" y="104" 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="85" width="76" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="230.0" y="104" 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="85" width="36" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="292.0" y="104" 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="85" width="60" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="346.0" y="104" 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="85" width="28" height="28" rx="6" fill="#e3f2fd" stroke="#1976d2" stroke-width="1.5"/><text x="396.0" y="104" 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="148" font-size="11" font-weight="600" fill="#bf360c"
|
|
letter-spacing="0.5">Generated tokens (autoregressive)</text>
|
|
<g opacity="0"><rect x="42" y="165" width="44" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="64.0" y="184" 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="165" width="76" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="130.0" y="184" 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="165" width="36" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="192.0" y="184" 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="165" width="60" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="246.0" y="184" 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="165" width="36" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="300.0" y="184" 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="165" width="60" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="354.0" y="184" 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="165" width="28" height="28" rx="6" fill="#fff3e0" stroke="#e65100" stroke-width="1.5"/><text x="404.0" y="184" 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="190" x2="475" y2="190" stroke="#333" stroke-width="2.5"
|
|
marker-end="url(#arrow)"/>
|
|
<circle cx="435" cy="190" 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="135" width="240" height="120" rx="12" fill="#0d0d0d" stroke="#000"/>
|
|
<text x="600" y="190" text-anchor="middle" fill="#fff"
|
|
font-size="40" font-weight="bold" font-family="ui-monospace,Menlo,monospace">LLM</text>
|
|
<text x="600" y="213" text-anchor="middle" fill="#888" font-size="11"
|
|
letter-spacing="0.5">(black box)</text>
|
|
<circle cx="580" cy="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="232" 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="133" 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="190" x2="765" y2="190" stroke="#333" stroke-width="2.5"
|
|
marker-end="url(#arrow)"/>
|
|
<circle cx="725" cy="190" 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="20" text-anchor="middle" font-size="11" font-weight="700"
|
|
fill="#777" letter-spacing="1.5">PREDICTED NEXT TOKEN</text>
|
|
<rect x="770" y="30" width="400" height="280" rx="10"
|
|
fill="#fff" stroke="#ffc107" stroke-width="2"/>
|
|
<text x="970" y="120" text-anchor="middle" font-size="12" fill="#888"
|
|
font-style="italic">argmax P(next token | input)</text>
|
|
<g opacity="0"><rect x="845" y="145" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="185" 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="145" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="185" 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="145" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="185" 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="145" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="185" 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="145" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="185" 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="145" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="185" 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="145" width="250" height="60" rx="10" fill="#fff3e0" stroke="#e65100" stroke-width="2.5"/><text x="970" y="185" 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 315 Q 600 390 230 315"
|
|
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="510" text-anchor="middle" fill="#9c27b0" font-size="13"
|
|
font-style="italic" font-weight="600">
|
|
predicted token appended to input → next iteration
|
|
</text>
|
|
</svg>
|
