fix(theme): R10 S1 review fixes — restore distinctions lost in the codemod

- PlexBrowse PLAYABLE_TINT: transcode was collapsed onto remux's bg-warn; give it
  bg-danger so direct/remux/transcode read as a distinct good->heavy green/amber/red
  gradient again.
- Live indicators (VideoCard row + thumbnail badge, playlistColumns badge): revert to
  fixed live-red + white instead of the --danger token. 'live' is a broadcast marker,
  not an error state, and the badge sits over a thumbnail (no app-bg contrast need);
  restores the conventional red/white LIVE look and decouples it from error retunes.
- ChannelPage exploring badge: drop the redundant dark:text-warn (no-op after the
  token rename — --warn is already theme-scoped).

error/fatal toast shade merge left as-is (both are 'bad'; the 400/500 step was subtle).

frontend/src/components/ChannelPage.tsx

@@ -325,7 +325,7 @@ export default function ChannelPage({
                 ) : (
                   ch?.explored &&
                   !ch?.subscribed && (
-                    <span className="text-xs px-2 py-0.5 rounded-full bg-warn/15 text-warn dark:text-warn">
+                    <span className="text-xs px-2 py-0.5 rounded-full bg-warn/15 text-warn">
                       {t("channel.exploringBadge")}
                     </span>
                   )

frontend/src/components/PlexBrowse.tsx

@@ -430,10 +430,13 @@ export default function PlexBrowse() {
   );
 }
 
+// Playback cost, escalating good→heavy: direct (green) → remux, a light repackage
+// (amber) → transcode, a full re-encode (red). Reuses the status trio as a gradient;
+// all three stay visually distinct.
 const PLAYABLE_TINT: Record<string, string> = {
   direct: "bg-success",
   remux: "bg-warn",
-  transcode: "bg-warn",
+  transcode: "bg-danger",
 };
 
 function PlexPosterCard({

frontend/src/components/VideoCard.tsx

@@ -156,7 +156,8 @@ function RowMetaCells({ video }: { video: Video }) {
   // "live" dot and a "stream" dot would be the same dot.
   const status =
     video.live_status === "live"
-      ? { Icon: Radio, cls: "text-danger", label: t("card.live") }
+      ? // fixed live-red, not the status token — "live" is a broadcast indicator, not an error
+        { Icon: Radio, cls: "text-red-500", label: t("card.live") }
       : video.live_status === "upcoming"
         ? { Icon: Clock, cls: "", label: t("card.upcoming") }
         : video.live_status === "was_live"
@@ -250,7 +251,7 @@ function Thumb({
       ) : video.live_status === "live" || video.live_status === "upcoming" ? (
         <span
           className={`absolute bottom-1.5 right-1.5 text-[10px] font-semibold uppercase tracking-wide px-1.5 py-0.5 rounded ${
-            video.live_status === "live" ? "bg-danger/90 text-danger-fg" : "bg-black/80 text-white"
+            video.live_status === "live" ? "bg-red-500/90 text-white" : "bg-black/80 text-white"
           }`}
         >
           {t(`card.${video.live_status}`)}

frontend/src/components/playlistColumns.tsx

@@ -106,7 +106,7 @@ export function playlistColumns({
           <span
             className={`text-[10px] font-semibold uppercase tracking-wide px-1.5 py-0.5 rounded ${
               v.live_status === "live"
-                ? "bg-danger/90 text-danger-fg"
+                ? "bg-red-500/90 text-white" /* fixed live-red, not the status token */
                 : "bg-card border border-border text-muted"
             }`}
           >