web: monospace content in Menlo (the Alacritty font)

Content surfaces (raw windows, log windows, jobs, node/container
names, dialog code) now use --mono: Menlo, ui-monospace, SFMono-Regular,
monospace — Alacritty's macOS default (the operator's terminal font).
UI chrome (body, window titles, buttons) stays sans-serif. One
computed-font Playwright check added (39 total).

src/web/ui.html

@@ -8,6 +8,8 @@
   :root[data-theme="dark"] {
     --bg: #0d1117; --panel: #161b22; --fg: #e6edf3; --muted: #8b949e;
     --border: #30363d; --accent: #58a6ff;
+    /* monospace content (raw/logs/jobs/node names) — Alacritty's macOS default */
+    --mono: Menlo, ui-monospace, SFMono-Regular, monospace;
     --led-on: #3fb950; --led-off: #f85149; --led-busy: #d29922; --led-free: #30363d;
     --glow-on: 0 0 8px 2px rgba(63,185,80,.55); --glow-busy: 0 0 8px 2px rgba(210,153,34,.55);
     --btn: #21262d; --btn-hover: #30363d;
@@ -15,6 +17,7 @@
   :root[data-theme="light"] {
     --bg: #f6f8fa; --panel: #ffffff; --fg: #1f2328; --muted: #656d76;
     --border: #d0d7de; --accent: #0969da;
+    --mono: Menlo, ui-monospace, SFMono-Regular, monospace;
     --led-on: #1a7f37; --led-off: #cf222e; --led-busy: #9a6700; --led-free: #d0d7de;
     --glow-on: 0 0 8px 2px rgba(26,127,55,.35); --glow-busy: 0 0 8px 2px rgba(154,103,0,.35);
     --btn: #f6f8fa; --btn-hover: #eaeef2;
@@ -103,12 +106,12 @@
   .led.b { background: var(--led-busy); box-shadow: var(--glow-busy); }
   .led.off { background: var(--led-off); }
   .led.flip { animation: flip .45s ease; }
-  .nname { width: 64px; font-family: ui-monospace, monospace; font-size: 12.5px; }
+  .nname { width: 64px; font-family: var(--mono); font-size: 12.5px; }
   .nmeta { color: var(--muted); font-size: 12px; flex: 1; overflow: hidden; text-overflow: ellipsis; }
   .containers { width: 100%; margin-top: 2px; }
   .crow { display: flex; align-items: center; gap: 8px; padding: 2px 0 2px 21px; font-size: 12px; color: var(--muted); }
   .cled { width: 7px; height: 7px; border-radius: 50%; background: var(--led-busy); box-shadow: var(--glow-busy); flex-shrink: 0; }
-  .cname { font-family: ui-monospace, monospace; color: var(--fg); }
+  .cname { font-family: var(--mono); color: var(--fg); }
   .actions { display: flex; gap: 8px; align-items: center; margin: 6px 0 0 21px; flex-wrap: wrap; }
   .actions select { font: inherit; }
   .actions input[type=checkbox] {
@@ -146,7 +149,7 @@
   .abtn:hover:not(:disabled) { background: var(--btn-hover); }
   .abtn:disabled { opacity: .45; cursor: default; }
   .abtn.danger { color: var(--led-off); }
-  .jobs { font-family: ui-monospace, monospace; font-size: 12px; }
+  .jobs { font-family: var(--mono); font-size: 12px; }
   .job { display: flex; gap: 8px; align-items: baseline; padding: 4px 0; border-bottom: 1px solid var(--border); }
   .job.new { animation: winIn .3s ease both; }
   .job:last-child { border-bottom: none; }
@@ -184,7 +187,7 @@
   .lognote.dead { color: var(--led-busy); }
   .logpre {
     flex: 1; margin: 0; padding: 10px 12px; overflow: auto;
-    font: 11.5px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap;
+    font: 11.5px/1.5 var(--mono); white-space: pre-wrap;
     word-break: break-word; color: var(--fg);
   }
 
@@ -261,8 +264,8 @@
   }
   .dlg h3 { margin: 0 0 10px; font-size: 14px; }
   .dlg .body { font-size: 13px; color: var(--fg); margin-bottom: 12px; }
-  .dlg .body code { font-family: ui-monospace, monospace; font-size: 12px; background: var(--btn); padding: 1px 5px; border-radius: 4px; }
-  .dlg .cbox { font-family: ui-monospace, monospace; font-size: 12px; color: var(--muted); margin: 8px 0 0; padding: 8px; background: var(--btn); border-radius: 6px; }
+  .dlg .body code { font-family: var(--mono); font-size: 12px; background: var(--btn); padding: 1px 5px; border-radius: 4px; }
+  .dlg .cbox { font-family: var(--mono); font-size: 12px; color: var(--muted); margin: 8px 0 0; padding: 8px; background: var(--btn); border-radius: 6px; }
   .dlg .cbox li { margin: 2px 0; }
   .dlg input {
     width: 100%; background: var(--btn); color: var(--fg); border: 1px solid var(--border);

src/web/ui.playwright.mjs

@@ -263,6 +263,14 @@ ok(
   "skeleton shimmer cleared after first state",
   (await page.locator(".skeleton").count()) === 0,
 );
+const monoFont = await page.evaluate(
+  () => getComputedStyle(document.querySelector(".rawwin .logpre")).fontFamily,
+);
+ok(
+  "monospace content uses the alacritty font (Menlo)",
+  monoFont.startsWith("Menlo"),
+  monoFont,
+);
 
 // --- no page JS errors across the whole flow -------------------------------------
 ok("no page JS errors", pageErrors.length === 0, pageErrors.join("; "));