fix(tui): the selected-row highlight shows in 16-colour mode (#2506)

In 16-colour mode, `rig tui`'s selected row is highlighted again. The `selection` token's 16-colour value was already a background code (`40`), and the background path adds 10, so it painted SGR `50`, which isn't a colour and terminals ignore. It's now `30`, so the highlight paints black (`40`), which keeps the row's bright-blue accent text readable and is the colour nearest the truecolor and 256-colour selection. A new cell checks that every token used as a background paints a real background code. Limit: on a dark terminal whose own background is that black, the band blends in, and the selected row is still marked by its arrow, accent colour and bold. Found in the review of #2499.

packages/tui/src/theme.ts

@@ -57,7 +57,7 @@ const PALETTE: Record<Token, [[number, number, number], number, number]> = {
   bright: [[232, 234, 240], 254, 97],
   // S19 MR5b: one-step contrast bump (founder: 'a little more noticeable')
   chrome: [[78, 105, 145], 60, 90],
-  selection: [[34, 52, 82], 236, 40],
+  selection: [[34, 52, 82], 236, 30], // black, painted as background 40
   actActive: [[152, 195, 121], 108, 32],
   actIdle: [[110, 142, 170], 109, 34],
   actDetached: [[109, 116, 128], 243, 90],

packages/tui/test/theme.test.ts

@@ -22,3 +22,12 @@ describe("light ink reads on light and dark terminals", () => {
     expect(createStyle("none").paint("bright", "intent")).toBe("intent");
   });
 });
+
+// Found in #2499's review: a 16-colour background is the token's colour code plus 10, so each token used as a
+// background must store a colour code (30-37, 90-97) for the band to show at all.
+describe("16-colour backgrounds", () => {
+  it.each(["selection", "markBg", "clawd", "accent"] as const)("paints a real background code for %s", (bg) => {
+    const code = Number(/^\x1b\[([0-9;]+)m/.exec(createStyle("16").paint("bright", "x", { bg }))![1]!.split(";").at(-1));
+    expect((code >= 40 && code <= 47) || (code >= 100 && code <= 107), `background SGR ${code}`).toBe(true);
+  });
+});