polish(ui): tighter header gap, stronger row hover, readable tag chips (R13 S3)

- Channel-manager tab row: pt-4 -> pt-2, closing the too-wide gap under the
  fixed header.
- Row hover was barely visible (--card sits close to --bg in dark schemes). New
  shared --hover token (a 9% foreground mix, clear in every scheme + theme,
  auto-adapting via --fg); the .selectable recipe and the DataTable row both use
  it, so every hoverable row app-wide (tables, nav rail, menu rows) reads.
- Channel tag chips: text-3xs -> text-2xs + font-medium, so the tiny labels stay
  legible on the accent fill across all colour schemes.

Self-E2E'd: tighter gap, a table-row hover now clearly visible. gate green
(tsc/eslint-0/vitest 147/knip/prettier/build).

frontend/src/index.css

@@ -294,6 +294,11 @@ html {
      jitter at DPR=1. round() keeps the font-scale feature but quantises to crisp integer metrics. */
   font-size: round(calc(16px * var(--font-scale)), 1px);
   background: var(--bg);
+  /* Shared interactive-row hover tint. `--card` reads faint in dark schemes (it sits close to `--bg`),
+     so hover was barely visible; a foreground-mix reads clearly in every scheme + theme (it lightens
+     on dark, darkens on light) and adapts automatically since --fg is per-scheme. One source for every
+     hoverable row (the .selectable recipe + DataTable rows). */
+  --hover: color-mix(in srgb, var(--fg) 9%, transparent);
 }
 
 body {
@@ -414,7 +419,7 @@ body {
       color 0.15s ease;
   }
   .selectable:hover {
-    background-color: var(--card);
+    background-color: var(--hover);
   }
   .selectable:focus-visible {
     /* outline (not a box-shadow ring) so it never fights a glass surface's box-shadow and never gets