dashboard: replace <hive-jobq-graph> with a shared Preact component

Ports the shadow-DOM <hive-jobq-graph> custom element
(frontend/packages/shared/src/jobq-graph/) to a Preact component
(JobqGraph.js) shared by the dashboard and swarm-ui, per hyperhive#3310.

- JobqGraph.js: written with plain h() calls (no JSX) so the same file
  compiles unmodified under both the dashboard's text-loader CSS config
  and swarm-ui's JSX config. Exports `JobqGraph` for JSX use and
  `mountJobqGraph(container, props)` for the dashboard's non-JSX
  imperative mount, returning a `{refresh(), update()}` handle matching
  the old custom element's public surface. Same rendering contract as
  before: indented state tree, payload.label verbatim, payload.data as
  a generic key/value list, "waits on: <label>" text for Node-kind deps,
  per-state filter checkboxes, optional cancel button.
- jobq-graph.css: light-DOM adaptation of the old shadow-scoped
  stylesheet (:host -> .jg-root, otherwise unchanged).
- dashboard/src/builds.js: local mountJobqGraph() renamed to
  mountRebuildQueue() to avoid colliding with the newly-imported shared
  mountJobqGraph; cancel handling is now a plain onCancel callback
  instead of a DOM CustomEvent listener (no shadow boundary to cross
  anymore).
- dashboard + shared package.json: added preact as a dependency (matches
  swarm-ui's existing pin, 10.29.8) - the dashboard was a vanilla-JS MPA
  with no Preact/JSX pipeline before this.
- Removed the old hive-jobq-graph.js/.css entirely (confirmed via grep
  it had exactly one consumer, dashboard/src/builds.js, so this is a
  clean swap, not parallel maintenance of two implementations).
- Updated stale doc-comment references to the old element name in
  builds.html, tabs.js, swarm.js, docs/web-ui/dashboard.md, and
  hive-c0re/src/job_queue/mod.rs.

Verified: npm run build (whole frontend workspace) and npm run
typecheck (swarm-ui) both clean; cargo build/clippy/test -p hive-c0re
all clean (331 tests, 0 failures); headless-chromium screenshot of
/builds.html against a mock GET /api/jobq/graph payload confirms full
visual/behavioral parity with the old custom element (tree, filter
checkboxes, cancel buttons, error text, waits-on line, data list, live
build log panel).

This covers the dashboard-replacement half of hyperhive#3310 only. The
swarm-ui half (rendering the CreateAgent DAG on the agent-creation page)
is downstream of hyperhive#3306/#3124 landing - no swarm-ui page exists
yet to mount it in.

frontend/packages/shared/src/jobq-graph/jobq-graph.css

@@ -0,0 +1,134 @@
+/* jobq-graph.css — styles for the `JobqGraph` Preact component
+   (`./JobqGraph.js`). Light-DOM adaptation of the former shadow-scoped
+   `<hive-jobq-graph>` stylesheet — `:host` became `.jg-root`, everything
+   else unchanged. `@import` this from a page-level CSS file (dashboard)
+   or a component-level one (swarm-ui), matching how every other
+   `@hive/shared` stylesheet is consumed — see JobqGraph.js's top comment
+   for why this file is never imported from JS. Theme custom properties
+   (--fg, --red, ...) are plain inherited custom properties here, same as
+   any other light-DOM rule — no shadow boundary to pierce anymore. */
+
+.jg-root {
+  display: block;
+  font-family: inherit;
+  font-size: inherit;
+  color: var(--fg);
+}
+
+.jg-filter {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.15em 0.9em;
+  margin: 0 0 0.5em;
+  font-size: 0.85em;
+}
+
+.jg-filter-label {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.3em;
+  color: var(--muted);
+  cursor: pointer;
+  user-select: none;
+}
+.jg-filter-label:has(input:checked) {
+  color: var(--fg);
+}
+
+.jg-body {
+  display: flex;
+  flex-direction: column;
+  gap: 0.15em;
+}
+
+.jg-node {
+  margin: 0;
+}
+
+/* Nested groups indent + get a guide line, rather than a hand-rolled
+   connector-glyph tree — cheaper to build and reads fine at any depth. */
+.jg-node .jg-node {
+  margin-left: 1.1em;
+  padding-left: 0.6em;
+  border-left: 1px solid var(--muted);
+  margin-top: 0.15em;
+}
+
+.jg-row {
+  display: flex;
+  align-items: baseline;
+  gap: 0.35em;
+  flex-wrap: wrap;
+}
+
+.jg-state {
+  font-weight: bold;
+  min-width: 1.2em;
+  text-align: center;
+}
+.jg-state-pending { color: var(--muted); }
+.jg-state-running { color: var(--cyan); }
+.jg-state-finishing { color: var(--cyan); opacity: 0.75; }
+.jg-state-done { color: var(--green); }
+.jg-state-failed { color: var(--red); }
+.jg-state-cancelled { color: var(--muted); text-decoration: line-through; }
+.jg-state-skipped { color: var(--muted); opacity: 0.5; }
+
+.jg-label {
+  color: var(--fg);
+}
+
+.jg-cancel-btn {
+  margin-left: auto;
+  background: transparent;
+  border: 1px solid var(--muted);
+  color: var(--muted);
+  border-radius: 999px;
+  width: 1.4em;
+  height: 1.4em;
+  font-size: 0.8em;
+  line-height: 1;
+  padding: 0;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  transition: color 0.15s ease, border-color 0.15s ease;
+}
+.jg-cancel-btn:hover,
+.jg-cancel-btn:focus-visible {
+  color: var(--red);
+  border-color: var(--red);
+  outline: none;
+}
+
+.jg-data {
+  margin: 0.1em 0 0 1.6em;
+  font-size: 0.85em;
+  color: var(--muted);
+  display: grid;
+  grid-template-columns: auto 1fr;
+  gap: 0 0.5em;
+}
+.jg-data dt { font-weight: 600; }
+.jg-data dd { margin: 0; word-break: break-word; }
+
+.jg-waits-on {
+  margin: 0.1em 0 0 1.6em;
+  font-size: 0.85em;
+  color: var(--cyan);
+}
+
+.jg-error {
+  color: var(--red);
+  font-size: 0.85em;
+  margin: 0.2em 0 0.2em 1.6em;
+  white-space: pre-wrap;
+}
+
+.jg-empty,
+.jg-error-msg {
+  color: var(--muted);
+  font-style: italic;
+  margin: 0;
+}