.knot-board{display:block;width:min(100%,480px);aspect-ratio:1;margin:auto;border:1px solid #e5eaf1;border-radius:12px;background:#f8faff;touch-action:none;overflow:visible;outline-offset:2px}
.knot-edge{stroke:#9fb8da;stroke-width:4;stroke-linecap:round;pointer-events:none}
.knot-edge.crossing{stroke:#e08c86;stroke-width:5}
.knot-node{stroke:#fff;stroke-width:3;cursor:grab;touch-action:none;filter:drop-shadow(0 2px 3px #37537535)}
.knot-node:active{cursor:grabbing}.knot-node.hub{fill:#efa959}.knot-node.normal{fill:#5889d3}
.knot-number{font-size:14px;font-weight:800;fill:#fff;text-anchor:middle;dominant-baseline:central;pointer-events:none;user-select:none}
.knot-ring{fill:none;stroke:#e3eaf7;stroke-width:2;stroke-dasharray:6 10;pointer-events:none}
@media(max-width:410px){.knot-edge{stroke-width:5}.knot-edge.crossing{stroke-width:6}}