refactor(edges): use CSS animations for snake/flow edges instead of SVG SMIL

Snake and flow edge animations used SVG SMIL <animate repeatCount="indefinite">.
SMIL keeps running while a tab is hidden (CSS animations pause) and grows memory
in Chrome over long-lived background tabs. Convert both to CSS @keyframes
(homelable-snake / homelable-flow), matching the existing basic-dash pattern.

Identical visuals and timings; bidirectional snake yo-yos via `alternate`.
Adds a regression test asserting animated edges emit zero <animate> nodes and a
CSS animation instead.

ha-relevant: yes

frontend/src/index.css

@@ -11,6 +11,18 @@
   to   { stroke-dashoffset: 0; }
 }
 
+/* Edge flow animations — CSS (not SVG SMIL) so the browser pauses them when the
+   tab is hidden. SMIL <animate> keeps running in background tabs and leaks
+   memory in Chrome over time; CSS animations do neither. */
+@keyframes homelable-snake {
+  from { stroke-dashoffset: -10000; }
+  to   { stroke-dashoffset: 0; }
+}
+@keyframes homelable-flow {
+  from { stroke-dashoffset: 0; }
+  to   { stroke-dashoffset: 18; }
+}
+
 /* Disable React Flow's built-in edgeupdater entirely — HomelableEdge renders
    its own interactive endpoint dots in EdgeLabelRenderer (above the node
    layer) so the node Handle DOM cannot steal the reconnection drag. */