SVG diagrams for fips-intro: architecture, mesh topology, transport abstraction

Replace three ASCII art diagrams in fips-intro.md with SVG images:
- Architecture overview: 5-node 4-hop path with layered node boxes
- Mesh topology: 8-node network with spanning tree highlighted
- Transport abstraction: full node stack with 10 transport plugins
This commit is contained in:
Johnathan Corgan
2026-02-13 14:21:40 +00:00
parent 4a882ab591
commit 28af84d2f2
4 changed files with 444 additions and 35 deletions
+122
View File
@@ -0,0 +1,122 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 420" font-family="monospace" font-size="13">
<style>
rect.node { fill: #1a1a2e; stroke: #e0e0e0; stroke-width: 1.5; rx: 4; }
rect.app { fill: #2a2a4e; stroke: #e0e0e0; stroke-width: 1; rx: 2; }
rect.fips { fill: #2e3a5e; stroke: #e0e0e0; stroke-width: 1; rx: 2; }
rect.xport { fill: #3a2e2e; stroke: #e0e0e0; stroke-width: 1; rx: 2; }
text { fill: #e0e0e0; }
text.label { font-size: 14px; font-weight: bold; }
text.npub { font-size: 11px; fill: #90a0b0; }
text.role { font-size: 11px; fill: #90a0b0; }
text.layer { font-size: 12px; }
text.transport-label { font-size: 11px; fill: #c0c0c0; }
line.link { stroke: #70a0d0; stroke-width: 2; }
line.session { stroke: #d0a040; stroke-width: 2; stroke-dasharray: 6,3; }
text.link-label { font-size: 11px; fill: #70a0d0; }
text.session-label { font-size: 12px; fill: #d0a040; }
</style>
<!-- Background -->
<rect width="900" height="420" fill="#0d1117" rx="8"/>
<!-- Node positions: x = 60, 230, 400, 570, 740 width=100 -->
<!-- Node A -->
<text x="110" y="30" text-anchor="middle" class="label">Node A</text>
<text x="110" y="46" text-anchor="middle" class="npub">npub1aaa...</text>
<text x="110" y="60" text-anchor="middle" class="role">(source)</text>
<rect x="60" y="70" width="100" height="130" class="node"/>
<rect x="70" y="80" width="80" height="30" class="app"/>
<text x="110" y="100" text-anchor="middle" class="layer">App</text>
<rect x="70" y="118" width="80" height="30" class="fips"/>
<text x="110" y="138" text-anchor="middle" class="layer">FIPS</text>
<rect x="70" y="156" width="80" height="30" class="xport"/>
<text x="110" y="176" text-anchor="middle" class="layer">WiFi</text>
<!-- Node B -->
<text x="280" y="30" text-anchor="middle" class="label">Node B</text>
<text x="280" y="46" text-anchor="middle" class="npub">npub1bbb...</text>
<text x="280" y="60" text-anchor="middle" class="role">(relay)</text>
<rect x="230" y="70" width="100" height="130" class="node"/>
<rect x="240" y="118" width="80" height="30" class="fips"/>
<text x="280" y="138" text-anchor="middle" class="layer">FIPS</text>
<rect x="240" y="156" width="37" height="30" class="xport"/>
<text x="258" y="176" text-anchor="middle" class="layer">WiFi</text>
<rect x="283" y="156" width="37" height="30" class="xport"/>
<text x="302" y="176" text-anchor="middle" class="layer">Eth</text>
<!-- Node C -->
<text x="450" y="30" text-anchor="middle" class="label">Node C</text>
<text x="450" y="46" text-anchor="middle" class="npub">npub1ccc...</text>
<text x="450" y="60" text-anchor="middle" class="role">(relay)</text>
<rect x="400" y="70" width="100" height="130" class="node"/>
<rect x="410" y="118" width="80" height="30" class="fips"/>
<text x="450" y="138" text-anchor="middle" class="layer">FIPS</text>
<rect x="410" y="156" width="37" height="30" class="xport"/>
<text x="428" y="176" text-anchor="middle" class="layer">Eth</text>
<rect x="453" y="156" width="37" height="30" class="xport"/>
<text x="472" y="176" text-anchor="middle" class="layer">UDP</text>
<!-- Node D -->
<text x="620" y="30" text-anchor="middle" class="label">Node D</text>
<text x="620" y="46" text-anchor="middle" class="npub">npub1ddd...</text>
<text x="620" y="60" text-anchor="middle" class="role">(relay)</text>
<rect x="570" y="70" width="100" height="130" class="node"/>
<rect x="580" y="118" width="80" height="30" class="fips"/>
<text x="620" y="138" text-anchor="middle" class="layer">FIPS</text>
<rect x="580" y="156" width="37" height="30" class="xport"/>
<text x="598" y="176" text-anchor="middle" class="layer">UDP</text>
<rect x="623" y="156" width="37" height="30" class="xport"/>
<text x="642" y="176" text-anchor="middle" class="layer">Tor</text>
<!-- Node E -->
<text x="790" y="30" text-anchor="middle" class="label">Node E</text>
<text x="790" y="46" text-anchor="middle" class="npub">npub1eee...</text>
<text x="790" y="60" text-anchor="middle" class="role">(dest)</text>
<rect x="740" y="70" width="100" height="130" class="node"/>
<rect x="750" y="80" width="80" height="30" class="app"/>
<text x="790" y="100" text-anchor="middle" class="layer">App</text>
<rect x="750" y="118" width="80" height="30" class="fips"/>
<text x="790" y="138" text-anchor="middle" class="layer">FIPS</text>
<rect x="750" y="156" width="80" height="30" class="xport"/>
<text x="790" y="176" text-anchor="middle" class="layer">Tor</text>
<!-- Link lines (from bottom of transport boxes) -->
<!-- WiFi: A(110) -> B-WiFi(258) -->
<line x1="110" y1="200" x2="110" y2="240" class="link"/>
<line x1="110" y1="240" x2="258" y2="240" class="link"/>
<line x1="258" y1="240" x2="258" y2="200" class="link"/>
<text x="184" y="256" text-anchor="middle" class="link-label">WiFi</text>
<!-- Ethernet: B-Eth(302) -> C-Eth(428) -->
<line x1="302" y1="200" x2="302" y2="270" class="link"/>
<line x1="302" y1="270" x2="428" y2="270" class="link"/>
<line x1="428" y1="270" x2="428" y2="200" class="link"/>
<text x="365" y="286" text-anchor="middle" class="link-label">Ethernet</text>
<!-- UDP/IP: C-UDP(472) -> D-UDP(598) -->
<line x1="472" y1="200" x2="472" y2="300" class="link"/>
<line x1="472" y1="300" x2="598" y2="300" class="link"/>
<line x1="598" y1="300" x2="598" y2="200" class="link"/>
<text x="535" y="316" text-anchor="middle" class="link-label">UDP/IP</text>
<!-- Tor: D-Tor(642) -> E(790) -->
<line x1="642" y1="200" x2="642" y2="330" class="link"/>
<line x1="642" y1="330" x2="790" y2="330" class="link"/>
<line x1="790" y1="330" x2="790" y2="200" class="link"/>
<text x="716" y="346" text-anchor="middle" class="link-label">Tor</text>
<!-- End-to-end session (dashed) -->
<line x1="110" y1="380" x2="790" y2="380" class="session"/>
<text x="450" y="375" text-anchor="middle" class="session-label">End-to-end encrypted session (A ↔ E)</text>
<!-- Link labels -->
<text x="184" y="405" text-anchor="middle" class="link-label">Link</text>
<line x1="110" y1="395" x2="258" y2="395" class="link" stroke-dasharray="3,2"/>
<text x="365" y="405" text-anchor="middle" class="link-label">Link</text>
<line x1="302" y1="395" x2="428" y2="395" class="link" stroke-dasharray="3,2"/>
<text x="535" y="405" text-anchor="middle" class="link-label">Link</text>
<line x1="472" y1="395" x2="598" y2="395" class="link" stroke-dasharray="3,2"/>
<text x="716" y="405" text-anchor="middle" class="link-label">Link</text>
<line x1="642" y1="395" x2="790" y2="395" class="link" stroke-dasharray="3,2"/>
</svg>

After

Width:  |  Height:  |  Size: 6.6 KiB

+9 -35
View File
@@ -65,23 +65,12 @@ routing logic works regardless of the underlying transport mix.
## Architecture Overview
```
┌─────────────────────────────────────────────────────────────┐
│ Application Layer │
│ (native FIPS API, or IPv6 via TUN adapter) │
├─────────────────────────────────────────────────────────────┤
│ FIPS Router │
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────────────┐ │
│ │ Identity │ │ Spanning │ │ Bloom Filter │ │
│ │ (npub) │ │ Tree │ │ Routing Table │ │
│ └─────────────┘ └─────────────┘ └─────────────────────┘ │
├─────────────────────────────────────────────────────────────┤
│ Transport Abstraction │
│ ┌────────┐ ┌──────────┐ ┌────────┐ ┌────────┐ ┌────────┐ │
│ │ UDP │ │ Ethernet │ │ WiFi │ │ Radio │ │ Onion │ │
│ └────────┘ └──────────┘ └────────┘ └────────┘ └────────┘ │
└─────────────────────────────────────────────────────────────┘
```
![Architecture Overview](fips-architecture-overview.svg)
Each link uses a different transport, but the end-to-end session encryption
is independent of the transport mix. Intermediate nodes decrypt the link
layer to make routing decisions, then re-encrypt for the next hop. They
cannot read the session-layer payload.
Applications can use the native FIPS datagram service directly, or access the
mesh through an IPv6 adaptation layer (TUN device) for compatibility with
@@ -255,6 +244,8 @@ See [fips-wire-protocol.md](fips-wire-protocol.md) for link encryption and
## Spanning Tree Protocol
![Mesh Topology](fips-mesh-topology.svg)
The spanning tree is a subset of the full mesh network that connects all nodes,
forming a tree structure rooted at a deterministically-elected node. Each node
selects a single parent, and the resulting tree serves as the routing backbone.
@@ -411,24 +402,7 @@ A **transport** is a physical or logical interface: a UDP socket, an Ethernet
NIC, a Tor client, a radio modem. A **link** is a connection instance to a
specific peer over a transport.
```
┌─────────────────────────────────────────┐
│ FIPS Node │
│ ┌─────────────────────────────────┐ │
│ │ Router Core │ │
│ └──────────┬──────────┬───────────┘ │
│ │ │ │
│ ┌──────┴────┐ ┌───┴─────┐ │
│ │ UDP │ │ LoRa │ │
│ │ Transport │ │Transport│ │
│ └────┬──────┘ └────┬────┘ │
└───────────┼─────────────┼──────────────┘
│ │
┌────┴────┐ ┌─────┴────┐
│Internet │ │ Radio │
│ Peers │ │ Peers │
└─────────┘ └──────────┘
```
![Transport Abstraction](fips-transport-abstraction.svg)
### Multi-Transport Bridging
+139
View File
@@ -0,0 +1,139 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 580" font-family="monospace" font-size="13">
<style>
circle.node { fill: #1a1a2e; stroke: #e0e0e0; stroke-width: 2; }
circle.root { fill: #1a1a2e; stroke: #d0a040; stroke-width: 2.5; }
text { fill: #e0e0e0; }
text.name { font-size: 13px; font-weight: bold; }
text.npub { font-size: 10px; fill: #808890; }
text.transport { font-size: 10px; fill: #909090; }
text.legend { font-size: 12px; }
text.title { font-size: 16px; font-weight: bold; }
text.subtitle { font-size: 12px; fill: #909090; }
line.mesh { stroke: #404860; stroke-width: 1.5; }
line.tree { stroke: #d0a040; stroke-width: 3; }
rect.legend-box { fill: #151520; stroke: #404060; stroke-width: 1; rx: 4; }
</style>
<!-- Background -->
<rect width="800" height="580" fill="#0d1117" rx="8"/>
<!-- Title -->
<text x="400" y="30" text-anchor="middle" class="title">FIPS Mesh Network</text>
<text x="400" y="48" text-anchor="middle" class="subtitle">Spanning tree highlighted — root elected by smallest node_addr</text>
<!--
Topology:
Nodes: A(root), B, C, D, E, F, G, H
Tree (gold): A→B (WiFi), A→C (WiFi), C→D (UDP), B→E (Bluetooth), D→F (UDP), F→G (Ethernet), F→H (Tor)
Mesh (gray): B-D (UDP), C-F (Satellite), E-G (UDP), D-G (Tor)
-->
<!-- === Mesh links (gray, drawn first — under everything) === -->
<!-- B-D UDP -->
<line x1="280" y1="290" x2="500" y2="210" class="mesh"/>
<text x="400" y="240" text-anchor="middle" class="transport">UDP</text>
<!-- C-F Satellite -->
<line x1="420" y1="120" x2="640" y2="290" class="mesh"/>
<text x="550" y="190" text-anchor="middle" class="transport">Satellite</text>
<!-- E-G UDP -->
<line x1="330" y1="420" x2="520" y2="420" class="mesh"/>
<text x="425" y="412" text-anchor="middle" class="transport">UDP</text>
<!-- D-G Tor -->
<line x1="500" y1="210" x2="520" y2="420" class="mesh"/>
<text x="525" y="320" text-anchor="middle" class="transport">Tor</text>
<!-- === Spanning tree links (gold, drawn on top of mesh) === -->
<!-- A→B WiFi (tree) -->
<line x1="140" y1="170" x2="280" y2="290" class="tree"/>
<text x="192" y="240" text-anchor="middle" class="transport" fill="#d0a040">WiFi</text>
<!-- A→C WiFi (tree) -->
<line x1="140" y1="170" x2="420" y2="120" class="tree"/>
<text x="270" y="132" text-anchor="middle" class="transport" fill="#d0a040">WiFi</text>
<!-- C→D UDP (tree) -->
<line x1="420" y1="120" x2="500" y2="210" class="tree"/>
<text x="475" y="155" text-anchor="middle" class="transport" fill="#d0a040">UDP</text>
<!-- B→E Bluetooth (tree) -->
<line x1="280" y1="290" x2="330" y2="420" class="tree"/>
<text x="285" y="365" text-anchor="middle" class="transport" fill="#d0a040">Bluetooth</text>
<!-- D→F UDP (tree) -->
<line x1="500" y1="210" x2="640" y2="290" class="tree"/>
<text x="585" y="240" text-anchor="middle" class="transport" fill="#d0a040">UDP</text>
<!-- F→G Ethernet (tree) -->
<line x1="640" y1="290" x2="520" y2="420" class="tree"/>
<text x="595" y="365" text-anchor="middle" class="transport" fill="#d0a040">Ethernet</text>
<!-- F→H Tor (tree) -->
<line x1="640" y1="290" x2="710" y2="420" class="tree"/>
<text x="692" y="362" text-anchor="middle" class="transport" fill="#d0a040">Tor</text>
<!-- === Nodes (drawn on top of links) === -->
<!-- Node A (root) -->
<circle cx="140" cy="170" r="30" class="root"/>
<text x="140" y="166" text-anchor="middle" class="name">A</text>
<text x="140" y="179" text-anchor="middle" class="npub">npub1aaa...</text>
<text x="140" y="133" text-anchor="middle" class="transport" fill="#d0a040">★ root</text>
<!-- Node B -->
<circle cx="280" cy="290" r="30" class="node"/>
<text x="280" y="286" text-anchor="middle" class="name">B</text>
<text x="280" y="299" text-anchor="middle" class="npub">npub1bbb...</text>
<!-- Node C -->
<circle cx="420" cy="120" r="30" class="node"/>
<text x="420" y="116" text-anchor="middle" class="name">C</text>
<text x="420" y="129" text-anchor="middle" class="npub">npub1ccc...</text>
<!-- Node D -->
<circle cx="500" cy="210" r="30" class="node"/>
<text x="500" y="206" text-anchor="middle" class="name">D</text>
<text x="500" y="219" text-anchor="middle" class="npub">npub1ddd...</text>
<!-- Node E -->
<circle cx="330" cy="420" r="30" class="node"/>
<text x="330" y="416" text-anchor="middle" class="name">E</text>
<text x="330" y="429" text-anchor="middle" class="npub">npub1eee...</text>
<!-- Node F -->
<circle cx="640" cy="290" r="30" class="node"/>
<text x="640" y="286" text-anchor="middle" class="name">F</text>
<text x="640" y="299" text-anchor="middle" class="npub">npub1fff...</text>
<!-- Node G -->
<circle cx="520" cy="420" r="30" class="node"/>
<text x="520" y="416" text-anchor="middle" class="name">G</text>
<text x="520" y="429" text-anchor="middle" class="npub">npub1ggg...</text>
<!-- Node H -->
<circle cx="710" cy="420" r="30" class="node"/>
<text x="710" y="416" text-anchor="middle" class="name">H</text>
<text x="710" y="429" text-anchor="middle" class="npub">npub1hhh...</text>
<!-- === Legend === -->
<rect x="30" y="490" width="740" height="70" class="legend-box"/>
<!-- Tree edge legend -->
<line x1="50" y1="515" x2="90" y2="515" stroke="#d0a040" stroke-width="3"/>
<text x="100" y="519" class="legend">Spanning tree link (parent → child)</text>
<!-- Mesh edge legend -->
<line x1="50" y1="540" x2="90" y2="540" stroke="#404860" stroke-width="1.5"/>
<text x="100" y="544" class="legend">Additional mesh link (peer connection)</text>
<!-- Root legend -->
<circle cx="470" cy="515" r="8" fill="none" stroke="#d0a040" stroke-width="2"/>
<text x="485" y="519" class="legend">★ Elected root (smallest node_addr)</text>
<!-- Transport legend -->
<text x="470" y="544" class="legend" fill="#909090">Labels show transport type per link</text>
</svg>

After

Width:  |  Height:  |  Size: 5.9 KiB

+174
View File
@@ -0,0 +1,174 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 520" font-family="monospace" font-size="12">
<style>
rect.outer { fill: #151525; stroke: #505070; stroke-width: 2; rx: 6; }
rect.layer { rx: 4; }
rect.api { fill: #1a3a2a; stroke: #40a060; stroke-width: 1.5; }
rect.tun { fill: #1a2a3a; stroke: #4080c0; stroke-width: 1.5; }
rect.router { fill: #2a2040; stroke: #8060c0; stroke-width: 1.5; }
rect.xport { fill: #2a1a1a; stroke: #c06040; stroke-width: 1.5; }
rect.cat { fill: none; stroke: #404060; stroke-width: 1; stroke-dasharray: 4,3; rx: 3; }
text { fill: #e0e0e0; }
text.label { font-size: 13px; font-weight: bold; }
text.sub { font-size: 10px; fill: #909090; }
text.cat { font-size: 9px; fill: #707090; font-style: italic; }
text.title { font-size: 16px; font-weight: bold; }
text.subtitle{ font-size: 12px; fill: #909090; }
line.conn { stroke: #606080; stroke-width: 1.5; }
line.peer { stroke: #505060; stroke-width: 1; stroke-dasharray: 3,3; }
</style>
<!-- Background -->
<rect width="800" height="520" fill="#0d1117" rx="8"/>
<!-- Title -->
<text x="400" y="28" text-anchor="middle" class="title">FIPS Node Architecture</text>
<text x="400" y="46" text-anchor="middle" class="subtitle">Application interfaces, router core, and transport abstraction layer</text>
<!-- Outer node box -->
<rect x="40" y="60" width="720" height="310" class="outer"/>
<text x="56" y="80" class="sub">FIPS Node</text>
<!-- === Application layer (centered) === -->
<!-- Router core center = 390, gap = 20, each box = 200 wide -->
<!-- Left box: 390 - 10 - 200 = 180..380, center = 280 -->
<!-- Right box: 390 + 10 = 400..600, center = 500 -->
<!-- FIPS-native API (left) -->
<rect x="180" y="90" width="200" height="50" class="layer api"/>
<text x="280" y="108" text-anchor="middle" class="label">FIPS-Native API</text>
<text x="280" y="121" text-anchor="middle" class="sub">Datagram service</text>
<text x="280" y="133" text-anchor="middle" class="sub">Addressed by npub</text>
<!-- IPv6 TUN adapter (right) -->
<rect x="400" y="90" width="200" height="50" class="layer tun"/>
<text x="500" y="108" text-anchor="middle" class="label">IPv6 TUN Adapter</text>
<text x="500" y="121" text-anchor="middle" class="sub">fips0 + DNS (.fips)</text>
<text x="500" y="133" text-anchor="middle" class="sub">npub → fd::/8 IPv6</text>
<!-- External app labels -->
<text x="280" y="74" text-anchor="middle" class="sub">FIPS-aware apps</text>
<text x="500" y="74" text-anchor="middle" class="sub">Legacy IP apps (ping, curl, ...)</text>
<!-- Arrows from apps down to API/TUN -->
<line x1="280" y1="78" x2="280" y2="90" class="conn"/>
<line x1="500" y1="78" x2="500" y2="90" class="conn"/>
<!-- === Router Core === -->
<rect x="80" y="170" width="620" height="60" class="layer router"/>
<text x="390" y="196" text-anchor="middle" class="label">Router Core</text>
<text x="390" y="212" text-anchor="middle" class="sub">Spanning tree · Bloom filters · Greedy routing · Session management · Noise IK</text>
<!-- Connections: API/TUN → Router -->
<line x1="280" y1="140" x2="280" y2="170" class="conn"/>
<line x1="500" y1="140" x2="500" y2="170" class="conn"/>
<!-- === Router → Transport connections (single trunk, branching to groups) === -->
<!-- Single vertical trunk from router bottom center -->
<line x1="390" y1="230" x2="390" y2="252" class="conn"/>
<!-- Horizontal bar at branch point -->
<line x1="160" y1="252" x2="690" y2="252" class="conn"/>
<!-- Vertical drops to each category group outline -->
<line x1="160" y1="252" x2="160" y2="276" class="conn"/>
<line x1="400" y1="252" x2="400" y2="276" class="conn"/>
<line x1="580" y1="252" x2="580" y2="276" class="conn"/>
<line x1="690" y1="252" x2="690" y2="276" class="conn"/>
<!-- === Transport layer === -->
<!-- Overlay transports -->
<rect x="60" y="276" width="200" height="80" class="cat"/>
<text x="160" y="289" text-anchor="middle" class="cat">Overlay</text>
<rect x="72" y="296" width="56" height="36" class="layer xport"/>
<text x="100" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">UDP</text>
<text x="100" y="324" text-anchor="middle" class="sub">IP</text>
<rect x="134" y="296" width="56" height="36" class="layer xport"/>
<text x="162" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">QUIC</text>
<text x="162" y="324" text-anchor="middle" class="sub">IP</text>
<rect x="196" y="296" width="56" height="36" class="layer xport"/>
<text x="224" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">WS</text>
<text x="224" y="324" text-anchor="middle" class="sub">TCP</text>
<!-- Shared medium transports -->
<rect x="270" y="276" width="260" height="80" class="cat"/>
<text x="400" y="289" text-anchor="middle" class="cat">Shared Medium</text>
<rect x="282" y="296" width="56" height="36" class="layer xport"/>
<text x="310" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">Ether</text>
<text x="310" y="324" text-anchor="middle" class="sub">802.3</text>
<rect x="344" y="296" width="56" height="36" class="layer xport"/>
<text x="372" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">WiFi</text>
<text x="372" y="324" text-anchor="middle" class="sub">802.11</text>
<rect x="406" y="296" width="56" height="36" class="layer xport"/>
<text x="434" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">BT</text>
<text x="434" y="324" text-anchor="middle" class="sub">RFCOMM</text>
<rect x="468" y="296" width="56" height="36" class="layer xport"/>
<text x="496" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">LoRa</text>
<text x="496" y="324" text-anchor="middle" class="sub">radio</text>
<!-- Point-to-point transports -->
<rect x="540" y="276" width="80" height="80" class="cat"/>
<text x="580" y="289" text-anchor="middle" class="cat">P-to-P</text>
<rect x="552" y="296" width="56" height="36" class="layer xport"/>
<text x="580" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">Serial</text>
<text x="580" y="324" text-anchor="middle" class="sub">UART</text>
<!-- Anonymity transports -->
<rect x="630" y="276" width="120" height="80" class="cat"/>
<text x="690" y="289" text-anchor="middle" class="cat">Anonymity</text>
<rect x="642" y="296" width="46" height="36" class="layer xport"/>
<text x="665" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">Tor</text>
<text x="665" y="324" text-anchor="middle" class="sub">.onion</text>
<rect x="694" y="296" width="46" height="36" class="layer xport"/>
<text x="717" y="312" text-anchor="middle" font-size="10" font-weight="bold" fill="#e0e0e0">I2P</text>
<text x="717" y="324" text-anchor="middle" class="sub">tunnel</text>
<!-- === Peer networks below node box === -->
<!-- Overlay peers -->
<text x="160" y="396" text-anchor="middle" class="sub">Internet Peers</text>
<line x1="160" y1="370" x2="160" y2="386" class="peer"/>
<!-- Shared medium peers -->
<text x="400" y="396" text-anchor="middle" class="sub">Local / Radio Peers</text>
<line x1="400" y1="370" x2="400" y2="386" class="peer"/>
<!-- Point-to-point peers -->
<text x="580" y="396" text-anchor="middle" class="sub">Wired Peer</text>
<line x1="580" y1="370" x2="580" y2="386" class="peer"/>
<!-- Anonymity peers -->
<text x="690" y="396" text-anchor="middle" class="sub">Anonymous Peers</text>
<line x1="690" y1="370" x2="690" y2="386" class="peer"/>
<!-- === Legend === -->
<rect x="40" y="420" width="720" height="85" fill="#151520" stroke="#404060" stroke-width="1" rx="4"/>
<rect x="60" y="438" width="24" height="14" class="layer api"/>
<text x="92" y="450" class="sub">Application interface</text>
<rect x="60" y="460" width="24" height="14" class="layer tun"/>
<text x="92" y="472" class="sub">IPv6 compatibility layer</text>
<rect x="60" y="482" width="24" height="14" class="layer router"/>
<text x="92" y="494" class="sub">Router core (protocol engine)</text>
<rect x="300" y="438" width="24" height="14" class="layer xport"/>
<text x="332" y="450" class="sub">Transport plugin</text>
<rect x="300" y="460" width="24" height="14" fill="none" stroke="#404060" stroke-width="1" stroke-dasharray="4,3" rx="2"/>
<text x="332" y="472" class="sub">Transport category grouping</text>
<text x="300" y="494" class="sub">All transports use the same Router Core interface</text>
</svg>

After

Width:  |  Height:  |  Size: 8.6 KiB