feat(ui): Lumenworks treatment for Inputs / Integrations / Graph tabs

Brings the remaining tabs in line with the Channels-tab visual language:

- .template-card now mirrors .card and .dashboard-target — channel stripe
  on the left edge with glow, silkscreened corner bracket top-right,
  hairline border on --lux-bg-1, hover lift + stripe widen-and-glow.
  Covers streams, capture / pp / cspt / pattern / audio templates and
  every Integrations card (HA / MQTT / weather / value / sync clocks /
  game integrations).

- Channel mapping extended in cards.css. Direct attribute hooks for the
  per-domain ids; section-scoped hooks via [data-card-section="…"] for
  the cards that share a generic data-id (HA / MQTT / weather / value
  → cyan, game-integrations → amber, sync-clocks → violet,
  HA-light-targets → signal). No JS changes — uses the section markup
  CardSection.render already emits.

- Graph editor nodes pick up the studio-console palette: --lux-bg-1
  fill with hairline stroke, hover bold-line, selected/running stroke
  --ch-signal with drop-shadow glow. Title font moved off Big Shoulders
  Display (which read as "stretched" at 12 px) onto --font-body
  (Manrope); subtitle keeps the mono-uppercase caption treatment with a
  conservative letter-spacing. Running gradient now rides the channel
  palette (signal → cyan → signal) rather than the legacy primary /
  success colours. Port labels and grid dots adopt --lux-line tokens.

- Graph node titles get real text-overflow:ellipsis behaviour. SVG
  <text> can't do that natively, so renderNodes runs a post-mount fit
  pass that binary-searches the longest character prefix that fits
  inside the clip rect (with 2 px slack), suffixed with "…". Trailing
  whitespace is stripped before the ellipsis so we never get "Foo …".
  Full text is stashed on data-full-text so the fit can be re-run on
  re-renders.

Also bundles two perf-charts fixes from the same session:

- Hover regression — listener was bound to .perf-charts-grid, which
  rerenderPerfGrid() replaces. Moved to document.body with a guard, and
  the cursor → sample math now uses the same sliceN as the spark
  rendering so the tooltip stays accurate when the user changes the
  window setting.

- Color picker on every perf cell. Patches / Total FPS / Devices now
  expose the same color picker as the spark cells; defaults added to
  METRIC_CSS_VARS. Each card gets an inline --perf-accent on render so
  saved colours apply immediately, including across rerenderPerfGrid.

TODO.md

@@ -114,6 +114,29 @@ Phases are independent and CSS-only where possible — backend untouched.
       tabs.
 - [x] Graph editor — toolbar gets a gradient background + hairline +
       rack shadow + backdrop blur. Canvas and nodes untouched.
+- [x] `.template-card` — Lumenworks treatment (channel stripe on left,
+      corner bracket top-right, hairline border, hover lift + stripe
+      glow). Brings Inputs (streams / capture / pp / cspt / pattern
+      templates) and Integrations (HA / MQTT / weather / value /
+      sync-clock / game-integration cards) up to the same visual
+      language as `.card` and `.dashboard-target`.
+- [x] `cards.css` — channel mapping extended to `.template-card`.
+      Direct attr hooks for `data-stream-id`/`data-template-id`/`data-pp-template-id`
+      (cyan), `data-cspt-id`/`data-pattern-template-id` (signal),
+      `data-audio-template-id`/`data-apt-id` (magenta). Section-scoped
+      hooks via `[data-card-section="…"]` for cards that share a
+      generic `data-id` (HA / MQTT / weather / value → cyan;
+      game-integrations → amber; sync-clocks → violet; HA-light-targets
+      → signal). No JS changes — uses the section markup `CardSection`
+      already emits.
+- [x] Graph editor nodes — body fill `--lux-bg-1` with hairline stroke,
+      hover bold-line, selected/running stroke `--ch-signal` with
+      drop-shadow glow. Title font switched from DM Sans to
+      `--font-display`; subtitle to mono uppercase wide-tracking.
+      Port-drop-target glow recoloured to `--ch-signal`. Port labels
+      adopt the mono caption treatment. Grid dots use `--lux-line`.
+      Running gradient stops switched from `--primary-color`/`--success-color`
+      to channel palette (signal → cyan → signal).
 
 ### Phase 5 — Modal restyle