fix(player): what is chosen on the player chrome is marked amber, not written in the accent

A light theme's accent as text on the always-dark chrome was 2.84:1 (Slate). `--chosen` is the accent unless a scope names its own; `media-marks` (was media-focus) points it, with the focus ring, at the media amber. A chosen track stays white with an amber tick (MenuCheck reads `text-chosen`); a chosen settings tab or toggle is white with an amber underline (MEDIA_CHOSEN). The theme contract test holds the token, the tick and the player components free of accent text.
2026-10-10 21:56:47 +02:00
parent e1d325b942
commit 8312c6d592
13 changed files with 85 additions and 49 deletions
@@ -61,4 +61,13 @@ describe("Tabs", () => {
    fireEvent.click(tab("Beta"));
    expect(screen.getByRole("tabpanel", { name: "Beta" })).toBe(panel);
  });
+
+  it("on the media chrome marks the chosen tab in white with the chosen mark, not the accent's text", () => {
+    // A light theme's accent is dark on the always-dark chrome (Slate 2.84:1 as text).
+    render(<Tabs tabs={TABS} active="a" onChange={() => {}} label="Pick" tone="media" />);
+    const on = tab("Alpha").className;
+    expect(on).not.toMatch(/\btext-accent\b/);
+    expect(on).toMatch(/\btext-white\b/);
+    expect(on).toMatch(/--color-chosen/);
+  });
 });