feat(ui): shared <Button> primitive + migrate ShareDialog/VideoEditor/ChannelPage proofs

Introduce frontend/src/components/ui/Button.tsx — the one action-button primitive
(variants primary|danger|outline|ghost|glass|danger-outline; sizes xs|sm|md|lg|icon;
icon/iconOnly/label/loading/fullWidth/forwardRef). No focus-visible (already centralized
in index.css @layer base). Migrate the cleanest proof sites off btnCls, and flip the
channel Subscribe button to the outline variant so it matches Full history (the user's ask).

frontend/src/components/ShareDialog.tsx

@@ -9,7 +9,8 @@ import { useConfirm } from "./ConfirmProvider";
 import { notify } from "../lib/notifications";
 import { copyText } from "../lib/clipboard";
 import { api, type DownloadJob, type ShareLink } from "../lib/api";
-import { inputCls, btnCls } from "./ui/form";
+import { inputCls } from "./ui/form";
+import { Button } from "./ui/Button";
 const EXPIRY_DAYS = [null, 1, 7, 30] as const;
 
 // --- share with a registered user (ACL) -----------------------------------------------------
@@ -343,31 +344,29 @@ function LinkShare({ job }: { job: DownloadJob }) {
             autoComplete="new-password"
           />
           <div className="flex justify-end gap-2">
-            <button
-              onClick={() => setCreating(false)}
-              className={clsx(btnCls, "text-muted hover:text-fg hover:bg-surface")}
-            >
+            <Button variant="ghost" size="sm" onClick={() => setCreating(false)}>
               {t("common.cancel")}
-            </button>
-            <button
+            </Button>
+            <Button
+              variant="primary"
+              size="sm"
               onClick={() => create.mutate()}
               disabled={create.isPending}
-              className={clsx(btnCls, "btn-primary")}
             >
               {t("downloads.share.createLink")}
-            </button>
+            </Button>
           </div>
         </div>
       ) : (
-        <button
+        <Button
+          variant="outline"
+          size="sm"
           onClick={() => setCreating(true)}
-          className={clsx(
-            btnCls,
-            "mt-2 border border-border text-muted hover:text-fg hover:border-muted inline-flex items-center gap-1.5",
-          )}
+          icon={<Link2 className="w-4 h-4" />}
+          className="mt-2"
         >
-          <Link2 className="w-4 h-4" /> {t("downloads.share.newLink")}
-        </button>
+          {t("downloads.share.newLink")}
+        </Button>
       )}
     </div>
   );