<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 920 380" font-family="Consolas, 'Courier New', monospace">
  <defs>
    <marker id="ah" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
      <path d="M0 0L10 5L0 10z" fill="#888"/>
    </marker>
    <marker id="ah-blue" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
      <path d="M0 0L10 5L0 10z" fill="#4a8fd4"/>
    </marker>
    <marker id="ah-purple" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
      <path d="M0 0L10 5L0 10z" fill="#9a6be8"/>
    </marker>
    <marker id="ah-orange" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="7" markerHeight="7" orient="auto-start-reverse">
      <path d="M0 0L10 5L0 10z" fill="#e8a46b"/>
    </marker>
  </defs>

  <!-- ===== CLUSTER POOL (flat array) ===== -->
  <text x="20" y="18" fill="#d4d4d4" font-size="12" font-weight="bold">Cluster Pool</text>
  <text x="145" y="18" fill="#666" font-size="10">(backing array, unordered)</text>

  <rect x="110" y="30" width="100" height="38" rx="3" fill="#2a2a2a" stroke="#555" stroke-width="1"/>
  <text x="160" y="48" fill="#d4d4d4" font-size="11" text-anchor="middle">A</text>
  <text x="160" y="62" fill="#555" font-size="8" text-anchor="middle">pool[0]</text>

  <rect x="220" y="30" width="100" height="38" rx="3" fill="#2a2a2a" stroke="#555" stroke-width="1"/>
  <text x="270" y="48" fill="#d4d4d4" font-size="11" text-anchor="middle">B</text>
  <text x="270" y="62" fill="#555" font-size="8" text-anchor="middle">pool[1]</text>

  <rect x="330" y="30" width="100" height="38" rx="3" fill="#2a2a2a" stroke="#555" stroke-width="1"/>
  <text x="380" y="48" fill="#d4d4d4" font-size="11" text-anchor="middle">C</text>
  <text x="380" y="62" fill="#555" font-size="8" text-anchor="middle">pool[2]</text>

  <rect x="440" y="30" width="100" height="38" rx="3" fill="#2a2a2a" stroke="#555" stroke-width="1"/>
  <text x="490" y="48" fill="#d4d4d4" font-size="11" text-anchor="middle">D</text>
  <text x="490" y="62" fill="#555" font-size="8" text-anchor="middle">pool[3]</text>

  <rect x="550" y="30" width="100" height="38" rx="3" fill="#2a2a2a" stroke="#555" stroke-width="1"/>
  <text x="600" y="48" fill="#d4d4d4" font-size="11" text-anchor="middle">E</text>
  <text x="600" y="62" fill="#555" font-size="8" text-anchor="middle">pool[4]</text>

  <rect x="660" y="30" width="100" height="38" rx="3" fill="#2a2a2a" stroke="#555" stroke-width="1"/>
  <text x="710" y="48" fill="#d4d4d4" font-size="11" text-anchor="middle">F</text>
  <text x="710" y="62" fill="#555" font-size="8" text-anchor="middle">pool[5]</text>

  <!-- Divider -->
  <line x1="20" y1="82" x2="900" y2="82" stroke="#444" stroke-width="0.6" stroke-dasharray="4"/>

  <!-- ===== LINKED LIST (category-ordered) ===== -->
  <text x="20" y="102" fill="#d4d4d4" font-size="12" font-weight="bold">Linked List</text>
  <text x="115" y="102" fill="#666" font-size="10">(ordered by category via prev/next pointers)</text>

  <!-- Category group backgrounds -->
  <rect x="28" y="116" width="270" height="76" rx="6" fill="#1e3a5f" fill-opacity="0.2" stroke="#4a8fd4" stroke-width="0.7" stroke-dasharray="4"/>
  <rect x="306" y="116" width="396" height="76" rx="6" fill="#3a1e5f" fill-opacity="0.2" stroke="#9a6be8" stroke-width="0.7" stroke-dasharray="4"/>
  <rect x="710" y="116" width="180" height="76" rx="6" fill="#5f3a1e" fill-opacity="0.2" stroke="#e8a46b" stroke-width="0.7" stroke-dasharray="4"/>

  <!-- Category labels -->
  <text x="163" y="112" fill="#4a8fd4" font-size="11" text-anchor="middle">Category 0</text>
  <text x="504" y="112" fill="#9a6be8" font-size="11" text-anchor="middle">Category 1</text>
  <text x="800" y="112" fill="#e8a46b" font-size="11" text-anchor="middle">Category 2</text>

  <!-- Cluster D (cat 0, partial — head) -->
  <rect x="45" y="130" width="112" height="48" rx="5" fill="#1a3050" stroke="#4a8fd4" stroke-width="1.2"/>
  <text x="101" y="150" fill="#d4d4d4" font-size="11" text-anchor="middle">Cluster D</text>
  <text x="101" y="168" fill="#7ab0e0" font-size="10" text-anchor="middle">47 / 128</text>

  <!-- Cluster B (cat 0, full — tail) -->
  <rect x="172" y="130" width="112" height="48" rx="5" fill="#1a3050" stroke="#3a6a9f" stroke-width="1.2"/>
  <text x="228" y="150" fill="#d4d4d4" font-size="11" text-anchor="middle">Cluster B</text>
  <text x="228" y="168" fill="#888" font-size="10" text-anchor="middle">128 / 128</text>

  <!-- Cluster E (cat 1, partial — head) -->
  <rect x="320" y="130" width="112" height="48" rx="5" fill="#2a1a40" stroke="#9a6be8" stroke-width="1.2"/>
  <text x="376" y="150" fill="#d4d4d4" font-size="11" text-anchor="middle">Cluster E</text>
  <text x="376" y="168" fill="#b88ae8" font-size="10" text-anchor="middle">93 / 128</text>

  <!-- Cluster F (cat 1, full) -->
  <rect x="447" y="130" width="112" height="48" rx="5" fill="#2a1a40" stroke="#7a3aaf" stroke-width="1.2"/>
  <text x="503" y="150" fill="#d4d4d4" font-size="11" text-anchor="middle">Cluster F</text>
  <text x="503" y="168" fill="#888" font-size="10" text-anchor="middle">128 / 128</text>

  <!-- Cluster A (cat 1, full — tail) -->
  <rect x="574" y="130" width="112" height="48" rx="5" fill="#2a1a40" stroke="#7a3aaf" stroke-width="1.2"/>
  <text x="630" y="150" fill="#d4d4d4" font-size="11" text-anchor="middle">Cluster A</text>
  <text x="630" y="168" fill="#888" font-size="10" text-anchor="middle">128 / 128</text>

  <!-- Cluster C (cat 2, partial — head + tail) -->
  <rect x="727" y="130" width="146" height="48" rx="5" fill="#40301a" stroke="#e8a46b" stroke-width="1.2"/>
  <text x="800" y="150" fill="#d4d4d4" font-size="11" text-anchor="middle">Cluster C</text>
  <text x="800" y="168" fill="#d4a46b" font-size="10" text-anchor="middle">61 / 128</text>

  <!-- Global chain arrows -->
  <line x1="157" y1="154" x2="170" y2="154" stroke="#888" stroke-width="1.2" marker-end="url(#ah)"/>
  <line x1="284" y1="154" x2="318" y2="154" stroke="#888" stroke-width="1.2" marker-end="url(#ah)"/>
  <line x1="432" y1="154" x2="445" y2="154" stroke="#888" stroke-width="1.2" marker-end="url(#ah)"/>
  <line x1="559" y1="154" x2="572" y2="154" stroke="#888" stroke-width="1.2" marker-end="url(#ah)"/>
  <line x1="686" y1="154" x2="725" y2="154" stroke="#888" stroke-width="1.2" marker-end="url(#ah)"/>

  <!-- Head/tail annotations -->
  <text x="101" y="208" fill="#4a8fd4" font-size="10" text-anchor="middle" font-style="italic">head</text>
  <text x="228" y="208" fill="#4a8fd4" font-size="10" text-anchor="middle" font-style="italic">tail</text>
  <text x="376" y="208" fill="#9a6be8" font-size="10" text-anchor="middle" font-style="italic">head</text>
  <text x="630" y="208" fill="#9a6be8" font-size="10" text-anchor="middle" font-style="italic">tail</text>
  <text x="800" y="208" fill="#e8a46b" font-size="10" text-anchor="middle" font-style="italic">head + tail</text>

  <!-- Divider -->
  <line x1="20" y1="222" x2="900" y2="222" stroke="#444" stroke-width="0.6" stroke-dasharray="4"/>

  <!-- ===== CATEGORY HEADS / TAILS (per-category endpoint references) ===== -->
  <text x="20" y="242" fill="#d4d4d4" font-size="12" font-weight="bold">Category Heads / Tails</text>
  <text x="200" y="242" fill="#666" font-size="10">(per-category references to chain endpoints)</text>

  <!-- heads[0] → Cluster D (x=101) -->
  <rect x="61" y="252" width="80" height="36" rx="4" fill="#1a3050" stroke="#4a8fd4" stroke-width="1"/>
  <text x="101" y="274" fill="#7ab0e0" font-size="10" text-anchor="middle">heads[0]</text>

  <!-- tails[0] → Cluster B (x=228) -->
  <rect x="188" y="252" width="80" height="36" rx="4" fill="#1a3050" stroke="#3a6a9f" stroke-width="1"/>
  <text x="228" y="274" fill="#7ab0e0" font-size="10" text-anchor="middle">tails[0]</text>

  <!-- heads[1] → Cluster E (x=376) -->
  <rect x="336" y="252" width="80" height="36" rx="4" fill="#2a1a40" stroke="#9a6be8" stroke-width="1"/>
  <text x="376" y="274" fill="#b88ae8" font-size="10" text-anchor="middle">heads[1]</text>

  <!-- tails[1] → Cluster A (x=630) -->
  <rect x="590" y="252" width="80" height="36" rx="4" fill="#2a1a40" stroke="#7a3aaf" stroke-width="1"/>
  <text x="630" y="274" fill="#b88ae8" font-size="10" text-anchor="middle">tails[1]</text>

  <!-- heads[2] + tails[2] → Cluster C (x=800), same cluster -->
  <rect x="750" y="252" width="100" height="36" rx="4" fill="#40301a" stroke="#e8a46b" stroke-width="1"/>
  <text x="800" y="274" fill="#d4a46b" font-size="10" text-anchor="middle">heads + tails[2]</text>

  <!-- Arrows from pointer boxes up to their clusters -->
  <line x1="101" y1="252" x2="101" y2="181" stroke="#4a8fd4" stroke-width="1" stroke-dasharray="3" marker-end="url(#ah-blue)"/>
  <line x1="228" y1="252" x2="228" y2="181" stroke="#4a8fd4" stroke-width="1" stroke-dasharray="3" marker-end="url(#ah-blue)"/>
  <line x1="376" y1="252" x2="376" y2="181" stroke="#9a6be8" stroke-width="1" stroke-dasharray="3" marker-end="url(#ah-purple)"/>
  <line x1="630" y1="252" x2="630" y2="181" stroke="#9a6be8" stroke-width="1" stroke-dasharray="3" marker-end="url(#ah-purple)"/>
  <line x1="800" y1="252" x2="800" y2="181" stroke="#e8a46b" stroke-width="1" stroke-dasharray="3" marker-end="url(#ah-orange)"/>

  <!-- Legend -->
  <text x="460" y="350" fill="#555" font-size="10" text-anchor="middle">Partial clusters at head (available for insert) - full clusters at tail</text>
  <text x="460" y="370" fill="#555" font-size="10" text-anchor="middle">Pool order and linked list order are independent</text>
</svg>
