web: one line per node pair and RTT/loss on the link board

A pair of nodes now has a single line, dialed by the non-listening side or by the smaller id when both listen, so RTT is measured once. The board draws it undirected and colours it by RTT and loss; a manual setting applies to the pair.

web/admin/src/admin.css

@@ -375,15 +375,30 @@
 }
 
 .link-board-edge.connected,
-.link-board-legend .connected {
+.link-board-edge.good,
+.link-board-legend .good {
   color: var(--app-ok);
 }
 
+.link-board-edge.fair,
+.link-board-legend .fair {
+  color: var(--app-warn);
+}
+
+.link-board-edge.poor,
+.link-board-legend .poor {
+  color: var(--app-bad);
+}
+
 .link-board-edge.pending,
 .link-board-legend .pending {
   color: var(--app-warn);
 }
 
+.link-board-edge.dim {
+  opacity: 0.2;
+}
+
 .link-board-edge.selected,
 .link-board-edge:focus-visible {
   color: var(--app-accent);
@@ -400,6 +415,11 @@
   stroke-dasharray: 6 6;
 }
 
+.link-board-edge.pending .link-board-edge-line {
+  stroke-dasharray: 2 6;
+  stroke-linecap: round;
+}
+
 .link-board-edge.selected .link-board-edge-line,
 .link-board-edge:hover .link-board-edge-line,
 .link-board-edge:focus-visible .link-board-edge-line {
@@ -413,22 +433,6 @@
   pointer-events: stroke;
 }
 
-.link-board-arrow.connected {
-  fill: var(--app-ok);
-}
-
-.link-board-arrow.pending {
-  fill: var(--app-warn);
-}
-
-.link-board-arrow.disabled {
-  fill: var(--app-ink-faint);
-}
-
-.link-board-arrow.selected {
-  fill: var(--app-accent);
-}
-
 .link-board-edge-label rect {
   fill: var(--app-card);
   stroke: var(--app-outline-soft);
@@ -563,6 +567,10 @@
   border-top-style: dashed;
 }
 
+.link-board-legend .pending::before {
+  border-top-style: dotted;
+}
+
 .link-board-empty {
   position: absolute;
   inset: 0;