diff --git a/README.md b/README.md
index c9f02c4..4e9240a 100644
--- a/README.md
+++ b/README.md
@@ -106,6 +106,10 @@ You might have encountered this error:
 
 If you didn't specify storage yet, you can do it using [this tutorial](./docs/storage.md).
 
+### Docs
+
+For more information visit [docs](./docs).
+
 ### Roadmap:
  - [x] add GUI
  - [x] add HTTPS support
diff --git a/docs/README.md b/docs/README.md
new file mode 100644
index 0000000..04fdd09
--- /dev/null
+++ b/docs/README.md
@@ -0,0 +1,13 @@
+# Docs
+
+Case study: having 2 rooms, every with max 5 users, they only need 10 ports to be forwarded so the range can be `59000-59009`.
+
+![architecture](./architecture.svg)
+
+All clients visit `https://neko-rooms/room-name/`. Once they logged in, they get one of the ports allocated where the RTC data flows. It happens inside SDP negotiation and is completly transparent to the clients. Therefore those ports needs to remain open, but they will never be actually visited directly in the browser.
+
+`NEKO_ROOMS_NAT1TO1` must be the IP where the mentioned UDP ports are forwarded. If this setting is not present, it will get automatically servers public IP at start of every room that will be sent to clients.
+
+## Connection timeout
+
+Neko room loads but you don't see the screen and it gives you `connection timeout` or `disconnected error`? [Validate](https://neko.m1k1o.net/#/getting-started/troubleshooting?id=validate-udp-ports-reachability) that your UDP ports are reachable.
diff --git a/docs/architecture.drawio b/docs/architecture.drawio
new file mode 100644
index 0000000..2d02821
--- /dev/null
+++ b/docs/architecture.drawio
@@ -0,0 +1 @@
+<mxfile host="app.diagrams.net" modified="2022-02-12T12:21:05.035Z" agent="5.0 (X11)" etag="vVCYmo1eawPDjs-xukiW" version="16.5.6" type="device"><diagram id="e7aEsMLIEvFOf0PZvSqS" name="Page-1">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</diagram></mxfile>
\ No newline at end of file
diff --git a/docs/architecture.svg b/docs/architecture.svg
new file mode 100644
index 0000000..b56395e
--- /dev/null
+++ b/docs/architecture.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Do not edit this file with editors other than diagrams.net -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" style="background-color: rgb(255, 255, 255);" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="634px" height="321px" viewBox="-0.5 -0.5 634 321" content="&lt;mxfile host=&quot;app.diagrams.net&quot; modified=&quot;2022-02-12T12:21:24.841Z&quot; agent=&quot;5.0 (X11)&quot; etag=&quot;3hnOOoO3RyjqY9GiwuYa&quot; version=&quot;16.5.6&quot;&gt;&lt;diagram id=&quot;e7aEsMLIEvFOf0PZvSqS&quot; name=&quot;Page-1&quot;&gt;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&lt;/diagram&gt;&lt;/mxfile&gt;"><defs/><g><rect x="0" y="20" width="370" height="300" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><path d="M 90 235 L 140 235 L 140 205 L 183.63 205" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 188.88 205 L 181.88 208.5 L 183.63 205 L 181.88 201.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 245px; margin-left: 126px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">:8080/tcp</div></div></div></foreignObject><text x="126" y="249" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">:8080/tcp</text></switch></g><rect x="10" y="50" width="80" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 78px; height: 1px; padding-top: 80px; margin-left: 11px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><div>room 1</div><div><font size="1" face="Courier New" color="#999999"><i style="font-size: 8px">container</i></font><br /></div></div></div></div></foreignObject><text x="50" y="84" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">room 1...</text></switch></g><path d="M 109.5 70 L 109.5 80.5 L 90.5 65 L 109.5 49.5 L 109.5 60 L 550.5 60 L 550.5 49.5 L 569.5 65 L 550.5 80.5 L 550.5 70 Z" fill="#d5e8d4" stroke="#82b366" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 50px; margin-left: 500px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; background-color: rgb(255, 255, 255); white-space: nowrap;">59000-59004/udp</div></div></div></foreignObject><text x="500" y="54" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">59000-59004/udp</text></switch></g><rect x="10" y="120" width="80" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 78px; height: 1px; padding-top: 150px; margin-left: 11px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><div>room 2</div><div><font size="1" face="Courier New" color="#999999"><i style="font-size: 8px">container</i></font></div></div></div></div></foreignObject><text x="50" y="154" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">room 2...</text></switch></g><rect x="190" y="160" width="80" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 78px; height: 1px; padding-top: 190px; margin-left: 191px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><div>traefik</div><div><font size="1" face="Courier New" color="#999999"><i style="font-size: 8px">container</i></font></div></div></div></div></foreignObject><text x="230" y="194" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">traefik...</text></switch></g><path d="M 289.5 185 L 289.5 195.5 L 270.5 180 L 289.5 164.5 L 289.5 175 L 550.5 175 L 550.5 164.5 L 569.5 180 L 550.5 195.5 L 550.5 185 Z" fill="#d5e8d4" stroke="#82b366" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 160px; margin-left: 510px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; background-color: rgb(255, 255, 255); white-space: nowrap;"><div>80/tcp, 443/tcp</div></div></div></div></foreignObject><text x="510" y="164" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">80/tcp, 443/tcp</text></switch></g><path d="M 90 263 L 328 263 L 328 240 M 332 240 L 332 267 L 90 267 M 332 240" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="1.42" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 250px; margin-left: 219px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">docker socket</div></div></div></foreignObject><text x="219" y="254" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">docker socket</text></switch></g><rect x="10" y="220" width="80" height="60" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 78px; height: 1px; padding-top: 250px; margin-left: 11px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><div>neko-rooms</div><div><font size="1" face="Courier New" color="#999999"><i style="font-size: 8px">container</i></font></div></div></div></div></foreignObject><text x="50" y="254" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">neko-rooms...</text></switch></g><path d="M 90 165 L 140 165 L 140 190.03 L 183.63 190" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 188.88 190 L 181.88 193.5 L 183.63 190 L 181.88 186.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 155px; margin-left: 125px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">:8080/tcp</div></div></div></foreignObject><text x="125" y="159" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">:8080/tcp</text></switch></g><path d="M 90 95 L 170 95 L 170 175 L 183.63 175" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 188.88 175 L 181.88 178.5 L 183.63 175 L 181.88 171.5 Z" fill="rgb(0, 0, 0)" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 85px; margin-left: 139px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;">:8080/tcp</div></div></div></foreignObject><text x="139" y="89" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">:8080/tcp</text></switch></g><path d="M 109.5 135 L 109.5 145.5 L 90.5 130 L 109.5 114.5 L 109.5 125 L 550.5 125 L 550.5 114.5 L 569.5 130 L 550.5 145.5 L 550.5 135 Z" fill="#d5e8d4" stroke="#82b366" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 110px; margin-left: 500px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; background-color: rgb(255, 255, 255); white-space: nowrap;">59005-59009/udp</div></div></div></foreignObject><text x="500" y="114" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="11px" text-anchor="middle">59005-59009/udp</text></switch></g><rect x="10" y="280" width="120" height="40" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 118px; height: 1px; padding-top: 287px; margin-left: 12px;"><div style="box-sizing: border-box; font-size: 0px; text-align: left;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><i>allocated range: 59000-59009/udp</i></div></div></div></foreignObject><text x="12" y="299" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px">allocated range: 590...</text></switch></g><rect x="310" y="30" width="50" height="210" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 135px; margin-left: 311px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><div>docker</div><div><font size="1" face="Courier New" color="#999999"><i style="font-size: 8px">service</i></font></div></div></div></div></foreignObject><text x="335" y="139" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">docker...</text></switch></g><path d="M 270 203 L 290 203 L 309.99 202.93 M 310.01 206.93 L 290 207 L 270 207 M 310.01 206.93" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="1.42" pointer-events="all"/><rect x="380" y="30" width="50" height="210" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 48px; height: 1px; padding-top: 135px; margin-left: 381px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><div>firewall/</div><div>router</div></div></div></div></foreignObject><text x="405" y="139" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">firewall...</text></switch></g><rect x="155" y="0" width="60" height="20" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 58px; height: 1px; padding-top: 10px; margin-left: 156px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: rgb(0, 0, 0); "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">Host</div></div></div></foreignObject><text x="185" y="14" fill="rgb(0, 0, 0)" font-family="Helvetica" font-size="12px" text-anchor="middle">Host</text></switch></g><rect x="20" y="180" width="60" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 58px; height: 1px; padding-top: 195px; margin-left: 21px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: #999999; "><div style="display: inline-block; font-size: 8px; font-family: Courier New; color: rgb(153, 153, 153); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 12px"><b>...</b></font></div></div></div></foreignObject><text x="50" y="197" fill="#999999" font-family="Courier New" font-size="8px" text-anchor="middle">...</text></switch></g><ellipse cx="615" cy="97.5" rx="7.5" ry="7.5" fill="rgb(255, 255, 255)" stroke="rgb(0, 0, 0)" pointer-events="all"/><path d="M 615 105 L 615 130 M 615 110 L 600 110 M 615 110 L 630 110 M 615 130 L 600 150 M 615 130 L 630 150" fill="none" stroke="rgb(0, 0, 0)" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 157px; margin-left: 615px;"><div style="box-sizing: border-box; font-size: 0px; text-align: center;" data-drawio-colors="color: #000000; "><div style="display: inline-block; font-size: 12px; font-family: Courier New; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: all; white-space: nowrap;"><font face="Helvetica">Clients</font></div></div></div></foreignObject><text x="615" y="169" fill="#000000" font-family="Courier New" font-size="12px" text-anchor="middle">Clien...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
\ No newline at end of file