<svg xmlns="http://www.w3.org/2000/svg" width="960" height="708" viewBox="0 0 960 708" role="img" aria-labelledby="title desc">
<style data-site-theme="n3wth">
  [fill="#6e6e73"] { fill: #6e6e73; }
  [fill="#f5f5f7"] { fill: #f5f5f7; }
  [fill="#1d1d1f"] { fill: #1d1d1f; }
  [stroke="#6e6e73"] { stroke: #6e6e73; }
  [fill="#ffffff"] { fill: #ffffff; }
  [stroke="#0071a4"] { stroke: #054a6b; }
  [stroke="#e8e8ed"] { stroke: #e8e8ed; }
@media (prefers-color-scheme: dark) {
  [fill="#6e6e73"] { fill: #9aa0a8; }
  [fill="#f5f5f7"] { fill: #08090b; }
  [fill="#1d1d1f"] { fill: #f2f3f5; }
  [stroke="#6e6e73"] { stroke: #9aa0a8; }
  [fill="#ffffff"] { fill: #0d0e10; }
  [stroke="#0071a4"] { stroke: #a9e5ff; }
  [stroke="#e8e8ed"] { stroke: #131316; }
}
</style>
<title id="title">Addresses and links do different jobs</title>
<desc id="desc">An illustrative keyword index points to card 12/1. A branch card 12/1a extends it between 12/1 and 12/2. A cross-reference reaches card 7/3 in another sequence. Stable addresses allow both ordered neighbors and links to distant ideas.</desc>
<defs><marker id="arrow" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="8" markerHeight="8" orient="auto"><path d="M 0 0 L 10 5 L 0 10 Z" fill="#6e6e73"/></marker></defs>
<g font-family="system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif">
<rect width="960" height="708" fill="#f5f5f7"/>
<text x="40" y="54" font-size="34" font-weight="600" fill="#1d1d1f" text-anchor="start">Addresses and links do different jobs</text><text x="62" y="152" font-size="28" font-weight="600" fill="#1d1d1f" text-anchor="start">Keyword index</text><text x="62" y="191" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start">A topic points to</text><text x="62" y="227" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start">an entry card.</text><line x1="303" y1="180" x2="419" y2="180" stroke="#6e6e73" stroke-width="2.5" marker-end="url(#arrow)"/><rect x="424" y="115" width="251" height="131" rx="0" fill="#ffffff" stroke="#0071a4" stroke-width="2.5"/><text x="449" y="157" font-size="30" font-weight="600" fill="#1d1d1f" text-anchor="start">12/1</text><text x="449" y="209" font-size="26" font-weight="400" fill="#1d1d1f" text-anchor="start">Initial idea</text><line x1="549" y1="248" x2="549" y2="289" stroke="#6e6e73" stroke-width="2.5" marker-end="url(#arrow)"/><rect x="424" y="293" width="251" height="109" rx="0" fill="#ffffff" stroke="#6e6e73" stroke-width="1.5"/><text x="449" y="335" font-size="30" font-weight="600" fill="#1d1d1f" text-anchor="start">12/1a</text><text x="449" y="376" font-size="24" font-weight="400" fill="#1d1d1f" text-anchor="start">An added branch</text><line x1="549" y1="405" x2="549" y2="450" stroke="#6e6e73" stroke-width="2.5" marker-end="url(#arrow)"/><rect x="424" y="454" width="251" height="108" rx="0" fill="#ffffff" stroke="#6e6e73" stroke-width="1.5"/><text x="449" y="496" font-size="30" font-weight="600" fill="#1d1d1f" text-anchor="start">12/2</text><text x="449" y="537" font-size="26" font-weight="400" fill="#1d1d1f" text-anchor="start">Next idea</text><path d="M 677 180 H 793 V 321" fill="none" stroke="#6e6e73" stroke-width="2.5" stroke-dasharray="8 7" marker-end="url(#arrow)"/><rect x="725" y="325" width="195" height="125" rx="0" fill="#ffffff" stroke="#6e6e73" stroke-width="1.5"/><text x="749" y="369" font-size="30" font-weight="600" fill="#1d1d1f" text-anchor="start">7/3</text><text x="749" y="407" font-size="23" font-weight="400" fill="#1d1d1f" text-anchor="start">A related idea</text><text x="714" y="258" font-size="22" font-weight="600" fill="#1d1d1f" text-anchor="start">Cross-reference</text><text x="40" y="348" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start">Stable addresses</text><text x="40" y="384" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start">make notes findable.</text><text x="40" y="420" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start"></text><text x="40" y="456" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start">Links cross the</text><text x="40" y="492" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start">physical sequence.</text><text x="40" y="597" font-size="24" font-weight="600" fill="#1d1d1f" text-anchor="start">Card identifiers and note content here are illustrative.</text>
<line x1="40" y1="645" x2="920" y2="645" stroke="#e8e8ed" stroke-width="2.5"/><text x="40" y="681" font-size="22" font-weight="400" fill="#6e6e73" text-anchor="start">Conceptual schematic · examples are illustrative</text>
</g>
</svg>
