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/ChannelPage.tsx

@@ -414,7 +414,9 @@ export default function ChannelPage({
           {/* Tabs — the channel actions ride along here rather than off in the header's top-right
             corner: there are only ever two tabs, so there's room, and it keeps the things you click
             within a few pixels of each other instead of across the page. */}
-          <div className="flex items-center gap-2 mt-3 border-b border-border pb-2">
+          {/* Wraps rather than overflows: at a tablet width (1024) the actions + tags ran past the edge and
+            the whole page scrolled sideways (E31 S1). The tag lane takes what is left and folds into "+N". */}
+          <div className="flex flex-wrap items-center gap-2 mt-3 border-b border-border pb-2">
             <Tabs
               idBase={panel.idBase}
               className="flex gap-1"
@@ -425,7 +427,7 @@ export default function ChannelPage({
                 { id: "about", label: t("channel.tabAbout") },
               ]}
             />
-            <div className="ml-2 flex items-center gap-2">
+            <div className="ml-2 flex min-w-0 flex-1 items-center gap-2">
               <IconLink
                 href={ytUrl}
                 target="_blank"
@@ -542,14 +544,16 @@ export default function ChannelPage({
                   otherwise), and personal tags are for your subscriptions — so only offer it on a
                   channel you actually follow. */}
               {ch?.subscribed && !me.is_demo && (
-                <ChannelTagsControl
-                  userTags={userTags}
-                  attachedIds={ch.tag_ids}
-                  onToggle={(tagId) => toggleTag(channelId, tagId, ch.tag_ids.includes(tagId))}
-                  onCreate={(name) => createAndAttachTag(channelId, name)}
-                  // The header row has free width — show tags inline instead of collapsing to "+N".
-                  bounded={false}
-                />
+                <div className="min-w-0 flex-1">
+                  <ChannelTagsControl
+                    userTags={userTags}
+                    attachedIds={ch.tag_ids}
+                    onToggle={(tagId) => toggleTag(channelId, tagId, ch.tag_ids.includes(tagId))}
+                    onCreate={(name) => createAndAttachTag(channelId, name)}
+                    // The header row's leftover width: tags inline, "+N" only when they do not fit.
+                    bounded={false}
+                  />
+                </div>
               )}
             </div>
           </div>