fix(player): a chosen tab's underline and an open or pressed icon read the scope's chosen colour

The underline named `--color-chosen`, which is resolved once on :root, so it stayed the accent under
`media-marks` (seen in the browser: fuchsia on Slate light); it reads `--chosen` where it is used
now. An icon button pressed or with its menu open tinted its glyph with the accent; it takes the
chosen colour — the accent everywhere but the player chrome, where it is the media amber.

frontend/src/components/ui/Tabs.dom.test.tsx

@@ -68,6 +68,9 @@ describe("Tabs", () => {
     const on = tab("Alpha").className;
     expect(on).not.toMatch(/\btext-accent\b/);
     expect(on).toMatch(/\btext-white\b/);
-    expect(on).toMatch(/--color-chosen/);
+    // The scope's own `--chosen`, read where it is used: `--color-chosen` is resolved once on :root
+    // and would stay the accent under `media-marks`.
+    expect(on).toMatch(/var\(--chosen,/);
+    expect(on).not.toMatch(/--color-chosen/);
   });
 });