Use the brand loading mark instead of lucide's spinner

Copies index/frontend's FluksioLoader component and its
`.fluksio-loader-line` rule into the app (the shadcn duplication model, so
the CSS travels with the component) and swaps every Loader2 pending state
over: the router's pending screen, the flow dock's Run and Publish, the
dashboard editor's Publish, the overview toolbar's Publish-all and
LoadingButton. One loading mark across both shells.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01K1moruzue2kTJd3uVisgNk

frontend/src/index.css

@@ -211,3 +211,36 @@
   font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
   letter-spacing: -0.01em;
 }
+
+/* ── Loading mark (FluksioLoader) ───────────────────────────────────── */
+/*
+ * The brand ring is a single subpath with `pathLength="1"`, so a `1 1` dash is
+ * exactly one lap of it: offset 1 hides the mark, 0 completes it, and -1 wipes
+ * it off the same end it was drawn from. The hold in the middle is what makes
+ * the mark legible once per lap instead of only flashing through.
+ */
+@keyframes fluksio-draw {
+  0% {
+    stroke-dashoffset: 1;
+  }
+  45%,
+  55% {
+    stroke-dashoffset: 0;
+  }
+  100% {
+    stroke-dashoffset: -1;
+  }
+}
+
+.fluksio-loader-line {
+  stroke-dasharray: 1 1;
+  animation: fluksio-draw 1.6s var(--ease-standard) infinite;
+}
+
+/* `MotionConfig reducedMotion="user"` reaches JS animations only. */
+@media (prefers-reduced-motion: reduce) {
+  .fluksio-loader-line {
+    stroke-dasharray: none;
+    animation: none;
+  }
+}