diff --git a/frontend/src/pages/Watch.jsx b/frontend/src/pages/Watch.jsx
index a810efe..ec2a6b2 100644
--- a/frontend/src/pages/Watch.jsx
+++ b/frontend/src/pages/Watch.jsx
@@ -660,11 +660,13 @@ export default function Watch() {
     staleTime: sidebarMode === "random" ? 0 : 5 * 60_000,
   });
 
+  const [subsRequested, setSubsRequested] = useState(false);
+  useEffect(() => { setSubsRequested(false); setSelectedSubLang(""); }, [youtubeVideoId]);
   const { data: availableSubs, isLoading: subsLoading } = useQuery({
     queryKey: ["available-subs", youtubeVideoId],
     queryFn: () => getAvailableSubs(youtubeVideoId).then(r => r.data),
-    enabled: !!youtubeVideoId,
-    staleTime: 10 * 60_000,
+    enabled: subsRequested && !!youtubeVideoId,
+    staleTime: 30 * 60_000,
   });
 
   const { data: dlStatus } = useQuery({
@@ -967,16 +969,26 @@ export default function Watch() {
               )}
 
               {!dlComplete && (() => {
-                const manual = new Set(availableSubs?.manual ?? []);
-                const auto   = (availableSubs?.auto ?? []).filter(l => !manual.has(l));
-                const allLangs = [...manual, ...auto];
+                if (!subsRequested) return (
+                  <button
+                    onClick={() => setSubsRequested(true)}
+                    className="flex items-center gap-1 px-3 py-1.5 rounded-full text-xs font-medium bg-zinc-800 text-zinc-400 hover:bg-zinc-700 transition-colors"
+                    title="Check available subtitles"
+                  >
+                    CC
+                  </button>
+                );
                 if (subsLoading) return (
                   <span className="flex items-center gap-1.5 px-3 py-1.5 rounded-full bg-zinc-800 text-zinc-500 text-xs">
                     <span className="w-3 h-3 border border-zinc-600 border-t-transparent rounded-full animate-spin inline-block" />
                     CC
                   </span>
                 );
-                if (!allLangs.length) return null;
+                const manual = new Set(availableSubs?.manual ?? []);
+                const auto   = (availableSubs?.auto ?? []).filter(l => !manual.has(l));
+                if (!manual.size && !auto.length) return (
+                  <span className="px-3 py-1.5 rounded-full bg-zinc-800 text-zinc-600 text-xs">No CC</span>
+                );
                 return (
                   <select
                     value={selectedSubLang}