fix(ui): E31 S2 — the tab names the object, the channel header wraps, the player fits a short window

- The browser tab names the place and the object: PageHeading reports the
  view's own title (lib/documentTitle), so a channel, playlist or any Plex
  view reads "<object> · <module> · Siftlode" however it was opened; the
  Feed is named too; a season adds its show (tabTitle).
- The channel page's tab + action row wraps and lets the tag lane fold into
  "+N": at 1024 it ran past the edge and the page scrolled sideways.
- The YouTube player card's width is capped from the window height less the
  chrome measured under the video: at 133% zoom (685px) it cut its channel row.
- Plex certificate words (Not Rated, Approved, Passed) are named through the
  vocabulary on the info badge, show page, collection, filter and chips.
- DESIGN.md: the zoom target is 125% and 133%, not 200% (decision log).

frontend/src/components/PlayerModal.dom.test.tsx

@@ -443,3 +443,28 @@ describe("PlayerModal — the side arrows", () => {
     expect(arrow.parentElement!.className).toMatch(/sm:px-14/);
   });
 });
+
+// E31 S1: at 133% zoom (a 685px window) a full-width card ran 20px past the bottom and cut its channel
+// row. The card's width is capped from the window height less what sits under the video, measured.
+describe("PlayerModal — fits the window's height", () => {
+  it("caps the card's width by the chrome measured under the video", () => {
+    vi.spyOn(api, "videoDetail").mockReturnValue(new Promise(() => {}));
+    vi.spyOn(HTMLElement.prototype, "offsetHeight", "get").mockImplementation(function (
+      this: HTMLElement,
+    ) {
+      return this.classList.contains("player-stage") ? 470 : 0;
+    });
+    vi.spyOn(HTMLElement.prototype, "scrollHeight", "get").mockImplementation(function (
+      this: HTMLElement,
+    ) {
+      return this.querySelector(":scope > .player-stage") ? 630 : 0;
+    });
+    const A = vid("A", 0);
+    const B = vid("B", 0);
+    renderModal(
+      <PlayerModal video={A} queue={[A, B]} startIndex={0} onClose={() => {}} onState={() => {}} />,
+    );
+    const row = document.querySelector<HTMLElement>(".player-stage")!.parentElement!.parentElement!;
+    expect(row.style.maxWidth).toBe("min(63rem, calc((100dvh - 3rem - 160px) * 16 / 9 + 7rem))");
+  });
+});