<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; }
  [fill="#ffffff"] { fill: #ffffff; }
  [stroke="#6e6e73"] { stroke: #6e6e73; }
  [fill="#e8e8ed"] { fill: #e8e8ed; }
  [stroke="#e8e8ed"] { stroke: #e8e8ed; }
  [fill="#0071a4"] { fill: #054a6b; }
@media (prefers-color-scheme: dark) {
  [fill="#6e6e73"] { fill: #9aa0a8; }
  [fill="#f5f5f7"] { fill: #08090b; }
  [fill="#1d1d1f"] { fill: #f2f3f5; }
  [fill="#ffffff"] { fill: #0d0e10; }
  [stroke="#6e6e73"] { stroke: #9aa0a8; }
  [fill="#e8e8ed"] { fill: #131316; }
  [stroke="#e8e8ed"] { stroke: #131316; }
  [fill="#0071a4"] { fill: #a9e5ff; }
}
</style>
<title id="title">Keep a short route back to context</title>
<desc id="desc">An illustrative layered note places an own-word summary above selected passages and a retained source. Side annotations explain quick scanning, selective emphasis and checking the original context. A branch points to a new piece of writing when there is a use for the note.</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">Keep a short route back to context</text><rect x="40" y="118" width="584" height="425" rx="0" fill="#ffffff" stroke="#6e6e73" stroke-width="1.5"/><rect x="60" y="138" width="544" height="115" rx="0" fill="#e8e8ed" stroke="#e8e8ed" stroke-width="1.5"/><text x="82" y="177" font-size="27" font-weight="600" fill="#1d1d1f" text-anchor="start">Summary in your own words</text><text x="82" y="214" font-size="25" font-weight="400" fill="#1d1d1f" text-anchor="start">State the takeaway and its boundary.</text><text x="82" y="304" font-size="27" font-weight="600" fill="#1d1d1f" text-anchor="start">Selected passages</text><rect x="79" y="323" width="421" height="37" rx="0" fill="#e8e8ed" stroke="#e8e8ed" stroke-width="0"/><text x="82" y="351" font-size="25" font-weight="600" fill="#1d1d1f" text-anchor="start">Emphasize only what matters here.</text><text x="82" y="399" font-size="24" font-weight="400" fill="#1d1d1f" text-anchor="start">Keep surrounding explanation readable.</text><line x1="82" y1="432" x2="584" y2="432" stroke="#e8e8ed" stroke-width="2.5"/><text x="82" y="476" font-size="25" font-weight="400" fill="#0071a4" text-anchor="start">Source: author, work and location</text><text x="82" y="517" font-size="24" font-weight="400" fill="#6e6e73" text-anchor="start">Earlier layers remain available.</text><line x1="633" y1="194" x2="680" y2="194" stroke="#6e6e73" stroke-width="2.5" marker-end="url(#arrow)"/><text x="696" y="182" font-size="24" font-weight="600" fill="#1d1d1f" text-anchor="start">Scan for</text><text x="696" y="218" font-size="24" font-weight="600" fill="#1d1d1f" text-anchor="start">the gist</text><line x1="633" y1="346" x2="680" y2="346" stroke="#6e6e73" stroke-width="2.5" marker-end="url(#arrow)"/><text x="696" y="335" font-size="24" font-weight="600" fill="#1d1d1f" text-anchor="start">Select</text><text x="696" y="371" font-size="24" font-weight="600" fill="#1d1d1f" text-anchor="start">sparingly</text><line x1="633" y1="478" x2="680" y2="478" stroke="#6e6e73" stroke-width="2.5" marker-end="url(#arrow)"/><text x="696" y="462" font-size="24" font-weight="600" fill="#1d1d1f" text-anchor="start">Check original</text><text x="696" y="498" font-size="24" font-weight="600" fill="#1d1d1f" text-anchor="start">context</text><line x1="335" y1="545" x2="335" y2="585" stroke="#6e6e73" stroke-width="2.5" marker-end="url(#arrow)"/><text x="335" y="619" font-size="25" font-weight="600" fill="#1d1d1f" text-anchor="middle">Use the insight in new work when needed.</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>
