feat(search): live YouTube search UI

Surface live YouTube search in the existing feed, triggered explicitly so the
expensive API call is never per-keystroke.

- Header: the search box still filters the local catalog as you type; Enter or a
  YouTube button escalates the term to a live search (hidden for the demo account).
- Feed: a dedicated infinite query renders results in the same VirtualFeed cards +
  in-app player, under a banner with a back button and a quota note. No auto-paginate
  (each page spends 100 units) — an explicit 'Load more (uses quota)' button instead;
  quota/limit errors (incl. 429) shown inline. The empty local feed offers a
  'Search YouTube for <q>' CTA.
- Library: a 'Search-discovered' toggle reveals search-ingested videos (hidden by
  default); sent as exclude_search_discovered.
- Admin: search_daily_limit_per_user config field; new videos_search quota label.
- All new strings translated in HU/EN/DE.

frontend/src/components/Header.tsx

@@ -1,5 +1,5 @@
 import { useTranslation } from "react-i18next";
-import { Library, Search, User } from "lucide-react";
+import { Library, Search, User, Youtube } from "lucide-react";
 import type { FeedFilters, Me } from "../lib/api";
 import type { Page } from "../lib/urlState";
 import SyncStatus from "./SyncStatus";
@@ -13,14 +13,20 @@ export default function Header({
   setFilters,
   page,
   onGoToFullHistory,
+  onYtSearch,
 }: {
   me: Me;
   filters: FeedFilters;
   setFilters: (f: FeedFilters) => void;
   page: Page;
   onGoToFullHistory: () => void;
+  // Trigger a live YouTube search for the current term (hidden for the demo account, which
+  // can't spend the shared quota).
+  onYtSearch: (q: string) => void;
 }) {
   const { t } = useTranslation();
+  const canSearchYt = !me.is_demo;
+  const trimmedQ = filters.q.trim();
 
   return (
     <header className="glass h-14 shrink-0 border-b border-border flex items-center gap-3 px-4 z-20">
@@ -56,14 +62,31 @@ export default function Header({
       )}
 
       {page === "feed" ? (
-        <div className="flex-1 max-w-xl mx-auto relative">
-          <Search className="w-4 h-4 absolute left-3 top-1/2 -translate-y-1/2 text-muted" />
-          <input
-            value={filters.q}
-            onChange={(e) => setFilters({ ...filters, q: e.target.value })}
-            placeholder={t("header.searchPlaceholder")}
-            className="w-full bg-card border border-border rounded-full pl-9 pr-4 py-2 text-sm outline-none focus:border-accent"
-          />
+        <div className="flex-1 max-w-xl mx-auto flex items-center gap-2">
+          <div className="flex-1 relative">
+            <Search className="w-4 h-4 absolute left-3 top-1/2 -translate-y-1/2 text-muted" />
+            <input
+              value={filters.q}
+              onChange={(e) => setFilters({ ...filters, q: e.target.value })}
+              onKeyDown={(e) => {
+                // Enter runs a live YouTube search for the typed term (the box itself filters
+                // the local catalog as you type; Enter escalates to the YouTube API).
+                if (e.key === "Enter" && trimmedQ && canSearchYt) onYtSearch(trimmedQ);
+              }}
+              placeholder={t("header.searchPlaceholder")}
+              className="w-full bg-card border border-border rounded-full pl-9 pr-4 py-2 text-sm outline-none focus:border-accent"
+            />
+          </div>
+          {trimmedQ && canSearchYt && (
+            <button
+              onClick={() => onYtSearch(trimmedQ)}
+              title={t("header.searchYoutubeTip")}
+              className="shrink-0 inline-flex items-center gap-1.5 rounded-full border border-border bg-card px-3 py-2 text-xs font-medium text-muted hover:text-accent hover:border-accent transition"
+            >
+              <Youtube className="w-4 h-4" />
+              <span className="hidden md:inline">{t("header.searchYoutube")}</span>
+            </button>
+          )}
         </div>
       ) : (
         <div className="flex-1 text-center text-sm font-semibold">