chore: release v1.1.8

chore(build): add macOS signing secrets and validation
- Introduced new secrets for macOS signing in the build workflow. - Added validation to check for the presence of required secrets before proceeding with code signing setup.
2026-01-12 10:14:49 +08:00 · 2026-01-12 10:13:58 +08:00 · 2026-01-12 09:58:44 +08:00 · 2026-01-11 16:56:34 +08:00 · 2026-01-11 16:34:48 +08:00 · 2026-01-11 16:34:40 +08:00
138 changed files with 22744 additions and 2431 deletions
--- a/.github/ISSUE_TEMPLATE/bug_report.yml
+++ b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -0,0 +1,37 @@
+name: Bug Report
+description: Report a problem or regression
+title: "[Bug]: "
+labels:
+  - bug
+body:
+  - type: input
+    id: app_version
+    attributes:
+      label: App version
+      description: The VidBee version (e.g., 1.2.3)
+      placeholder: 1.2.3
+    validations:
+      required: true
+  - type: input
+    id: os_version
+    attributes:
+      label: OS version
+      description: Your operating system and version (e.g., macOS 14.2, Windows 11 23H2)
+      placeholder: macOS 14.2
+    validations:
+      required: true
+  - type: textarea
+    id: actual
+    attributes:
+      label: Observed behavior
+      placeholder: What actually happened
+    validations:
+      required: true
+  - type: textarea
+    id: logs
+    attributes:
+      label: Logs or screenshots
+      description: Paste relevant logs or add screenshots
+      placeholder: Attach files or paste logs here
+    validations:
+      required: false
--- a/.github/ISSUE_TEMPLATE/feature_request.yml
+++ b/.github/ISSUE_TEMPLATE/feature_request.yml
@@ -0,0 +1,38 @@
+name: Feature Request
+description: Suggest an idea or improvement
+title: "[Feature]: "
+labels:
+  - enhancement
+body:
+  - type: textarea
+    id: problem
+    attributes:
+      label: Problem to solve
+      description: What problem are you trying to solve?
+      placeholder: I want to...
+    validations:
+      required: true
+  - type: textarea
+    id: proposal
+    attributes:
+      label: Proposed solution
+      description: Describe the feature or change you want
+      placeholder: It would be great if...
+    validations:
+      required: true
+  - type: textarea
+    id: alternatives
+    attributes:
+      label: Alternatives considered
+      description: Other solutions or workarounds you considered
+      placeholder: I tried...
+    validations:
+      required: false
+  - type: textarea
+    id: extra
+    attributes:
+      label: Additional context
+      description: Add any other context or screenshots
+      placeholder: Links, screenshots, or related issues
+    validations:
+      required: false
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -8,6 +8,17 @@ on:
        type: boolean
        default: false
        description: 'Whether to upload build artifacts'
+    secrets:
+      MAC_CERT_P12_BASE64:
+        required: false
+      MAC_CERT_P12_PASSWORD:
+        required: false
+      APPLE_API_KEY_ID:
+        required: false
+      APPLE_API_ISSUER:
+        required: false
+      APPLE_API_KEY_P8_BASE64:
+        required: false

 jobs:
  build:
@@ -68,6 +79,8 @@ jobs:
          $source = Join-Path 'ffmpeg' '${{ matrix.ffmpeg_inner_path }}'
          $destination = Join-Path 'resources' '${{ matrix.ffmpeg_output }}'
          Copy-Item -Path $source -Destination $destination -Force
+          Remove-Item ffmpeg.zip -Force
+          Remove-Item ffmpeg -Recurse -Force

      - name: Download ffmpeg binary (macOS)
        if: matrix.platform == 'macos'
@@ -76,10 +89,10 @@ jobs:
          FFMPEG_OUTPUT: ${{ matrix.ffmpeg_output }}
        run: |
          set -euo pipefail
-          curl -L "${{ matrix.ffmpeg_arm_url }}" -o ffmpeg-arm.zip
+          curl -fL --retry 3 --retry-delay 2 --retry-connrefused "${{ matrix.ffmpeg_arm_url }}" -o ffmpeg-arm.zip
          unzip -q ffmpeg-arm.zip -d ffmpeg-arm

-          curl -L "${{ matrix.ffmpeg_x86_url }}" -o ffmpeg-x86.zip
+          curl -fL --retry 3 --retry-delay 2 --retry-connrefused "${{ matrix.ffmpeg_x86_url }}" -o ffmpeg-x86.zip
          unzip -q ffmpeg-x86.zip -d ffmpeg-x86

          arm_bin="ffmpeg-arm/${{ matrix.ffmpeg_inner_path }}"
@@ -103,16 +116,21 @@ jobs:
        shell: bash
        run: |
          set -euo pipefail
-          curl -L "${{ matrix.ffmpeg_url }}" -o ffmpeg.tar.xz
+          curl -fL --retry 3 --retry-delay 2 --retry-connrefused "${{ matrix.ffmpeg_url }}" -o ffmpeg.tar.xz
+          if ! tar -tf ffmpeg.tar.xz >/dev/null 2>&1; then
+            echo "::error::Downloaded ffmpeg archive is not a valid tar.xz"
+            exit 1
+          fi
          mkdir ffmpeg
          tar -xf ffmpeg.tar.xz -C ffmpeg
          cp "ffmpeg/${{ matrix.ffmpeg_inner_path }}" "resources/${{ matrix.ffmpeg_output }}"
          chmod +x "resources/${{ matrix.ffmpeg_output }}"
+          rm -rf ffmpeg.tar.xz ffmpeg

      - name: Download yt-dlp binary
        shell: bash
        run: |
-          curl -L "https://github.com/yt-dlp/yt-dlp/releases/latest/download/${{ matrix.ytdlp_asset }}" -o "resources/${{ matrix.ytdlp_output }}"
+          curl -fL --retry 3 --retry-delay 2 --retry-connrefused "https://github.com/yt-dlp/yt-dlp/releases/latest/download/${{ matrix.ytdlp_asset }}" -o "resources/${{ matrix.ytdlp_output }}"
          if [[ "${{ matrix.platform }}" == "linux" ]] || [[ "${{ matrix.platform }}" == "macos" ]]; then
            chmod +x "resources/${{ matrix.ytdlp_output }}"
          fi
@@ -120,6 +138,46 @@ jobs:
      - name: Lint and format check
        run: pnpm run check && pnpm run typecheck

+      - name: Setup macOS signing
+        if: matrix.platform == 'macos'
+        shell: bash
+        env:
+          MAC_CERT_P12_BASE64: ${{ secrets.MAC_CERT_P12_BASE64 }}
+          MAC_CERT_P12_PASSWORD: ${{ secrets.MAC_CERT_P12_PASSWORD }}
+          APPLE_API_KEY_P8_BASE64: ${{ secrets.APPLE_API_KEY_P8_BASE64 }}
+          APPLE_API_KEY_ID: ${{ secrets.APPLE_API_KEY_ID }}
+          APPLE_API_ISSUER: ${{ secrets.APPLE_API_ISSUER }}
+        run: |
+          set -euo pipefail
+
+          # Check if all required secrets are present
+          if [[ -z "$MAC_CERT_P12_BASE64" ]] || [[ -z "$MAC_CERT_P12_PASSWORD" ]] || \
+             [[ -z "$APPLE_API_KEY_ID" ]] || [[ -z "$APPLE_API_ISSUER" ]] || \
+             [[ -z "$APPLE_API_KEY_P8_BASE64" ]]; then
+            echo "::notice::macOS signing secrets not available, skipping code signing setup"
+            exit 0
+          fi
+
+          CERT_PATH="$RUNNER_TEMP/mac_cert.p12"
+          KEYCHAIN_PATH="$RUNNER_TEMP/build.keychain"
+          API_KEY_PATH="$RUNNER_TEMP/AuthKey.p8"
+
+          echo "$MAC_CERT_P12_BASE64" | base64 --decode > "$CERT_PATH"
+          echo "$APPLE_API_KEY_P8_BASE64" | base64 --decode > "$API_KEY_PATH"
+
+          security create-keychain -p "$MAC_CERT_P12_PASSWORD" "$KEYCHAIN_PATH"
+          security set-keychain-settings -lut 21600 "$KEYCHAIN_PATH"
+          security unlock-keychain -p "$MAC_CERT_P12_PASSWORD" "$KEYCHAIN_PATH"
+          security import "$CERT_PATH" -k "$KEYCHAIN_PATH" -P "$MAC_CERT_P12_PASSWORD" -T /usr/bin/codesign -T /usr/bin/productbuild
+          security list-keychain -d user -s "$KEYCHAIN_PATH"
+          security set-key-partition-list -S apple-tool:,apple:,codesign: -s -k "$MAC_CERT_P12_PASSWORD" "$KEYCHAIN_PATH"
+
+          echo "CSC_KEYCHAIN=$KEYCHAIN_PATH" >> "$GITHUB_ENV"
+          echo "CSC_KEY_PASSWORD=$MAC_CERT_P12_PASSWORD" >> "$GITHUB_ENV"
+          echo "APPLE_API_KEY=$API_KEY_PATH" >> "$GITHUB_ENV"
+          echo "APPLE_API_KEY_ID=$APPLE_API_KEY_ID" >> "$GITHUB_ENV"
+          echo "APPLE_API_ISSUER=$APPLE_API_ISSUER" >> "$GITHUB_ENV"
+
      - name: Build application
        run: ${{ matrix.build_script }}

@@ -130,4 +188,3 @@ jobs:
          name: dist-${{ matrix.os }}
          path: dist/
          retention-days: 1
-
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -10,6 +10,7 @@ jobs:
    uses: ./.github/workflows/build.yml
    with:
      upload_artifacts: true
+    secrets: inherit

  release:
    needs: [build]
@@ -42,3 +43,9 @@ jobs:
            dist/*.blockmap
        env:
          GITHUB_TOKEN: ${{ secrets.ACCESS_TOKEN }}
+
+      - name: Notify Cloudflare Pages
+        env:
+          CLOUDFLARE_WEBHOOK_URL: ${{ secrets.CLOUDFLARE_WEBHOOK_URL }}
+        run: |
+          curl -X POST "$CLOUDFLARE_WEBHOOK_URL"
--- a/.gitignore
+++ b/.gitignore
@@ -1,7 +1,9 @@
 node_modules
-dist
+/dist
 out
+.conductor/
+.wxt
+.output
 .DS_Store
 .eslintcache
 *.log*
-
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -25,5 +25,8 @@
    ["cn\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
  ],
  "i18n-ally.localesPaths": ["src/renderer/src/locales"],
-  "i18n-ally.keystyle": "nested"
+  "i18n-ally.keystyle": "nested",
+  "[css]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  }
 }
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -3,3 +3,4 @@
 3. Support i18n, only translate the English version of en.json
 4. use English for comments&console
 5. Follow the ✅ KISS (Keep It Simple, Stupid) & ✅ YAGNI (You Aren't Gonna Need It) principles
+6. Use Conventional Commits format for commit messages: `type(scope): subject`. Common types: feat, fix, docs, style, refactor, test, chore, perf, ci, build, revert. PR titles should also follow this format.
--- a/README.md
+++ b/README.md
@@ -1,36 +1,34 @@
-# 🐝 VidBee
-
 <div align="center">
-  <img src="build/icon.png" alt="VidBee icon" width="120" />
-  <h3>Download videos from almost any website worldwide</h3>
-  <p>Best-in-class UI interface - Clean, intuitive, and powerful</p>
-  <p>Built with Electron, React, TypeScript, Tailwind CSS, and shadcn/ui.</p>
+  <a href="https://github.com/nexmoe/VidBee">
+    <img src="build/icon.png" alt="Logo" width="80" height="80">
+  </a>
+
+  <h3>VidBee</h3>
+  <p>
+    <a href="https://github.com/nexmoe/VidBee/stargazers"><img src="https://img.shields.io/github/stars/nexmoe/VidBee?color=ffcb47&labelColor=black&logo=github&label=Stars" /></a>
+    <a href="https://github.com/nexmoe/VidBee/graphs/contributors"><img src="https://img.shields.io/github/contributors/nexmoe/VidBee?ogo=github&label=Contributors&labelColor=black" /></a>
+    <a href="https://github.com/nexmoe/VidBee/releases"><img src="https://img.shields.io/github/downloads/nexmoe/VidBee/total?color=369eff&labelColor=black&logo=github&label=Downloads" /></a>
+    <a href="https://github.com/nexmoe/VidBee/releases/latest"><img src="https://img.shields.io/github/v/release/nexmoe/VidBee?color=369eff&labelColor=black&logo=github&label=Latest%20Release" /></a>
+    <a href="https://x.com/intent/follow?screen_name=nexmoex"><img src="https://img.shields.io/badge/Follow-blue?color=1d9bf0&logo=x&labelColor=black" /></a>
+    <a href="https://deepwiki.com/nexmoe/VidBee"><img src="https://deepwiki.com/badge.svg" alt="Ask DeepWiki"></a>
+    <br />
+    <br />
+    <a href="https://github.com/nexmoe/VidBee/releases/latest" target="_blank"><img src="screenshots/main-interface.png" alt="VidBee Desktop" width="46%"/></a>
+    <a href="https://github.com/nexmoe/VidBee/releases/latest" target="_blank"><img src="screenshots/download-queue.png" alt="VidBee Download Queue" width="46%"/></a>
+    <br />
+    <br />
+  </p>
 </div>

-## ✨ Core Features
+VidBee is a modern, open-source video downloader that lets you download videos and audios from 1000+ websites worldwide. Built with Electron and powered by yt-dlp, VidBee offers a clean, intuitive interface with powerful features for all your downloading needs, including RSS auto-download automation that automatically subscribes to feeds and downloads new videos from your favorite creators in the background.

-### 🌍 Global Video Download Support
+## 👋🏻 Getting Started

- **1000+ Sites Supported** - Download videos from almost any website worldwide through yt-dlp engine
- **Smart Platform Detection** - Automatically detect video platforms and optimize download parameters
- **Multi-format Support** - Videos, audio tracks, playlists to meet all download needs
- Localized interface support in many languages
+VidBee is currently under active development, and feedback is welcome for any [issue](https://github.com/nexmoe/VidBee/issues) encountered.

-### 🎨 Best-in-class UI Experience
+Feel free to try it using the following methods:

- **Modern Design** - Clean and beautiful interface
- **Intuitive Operations** - One-click pause/resume/retry
- **Real-time Progress** - Detailed download progress tracking and status management
- **Theme Switching** - Support for system/light/dark themes for comfortable viewing
-
-## 📥 Download & Install
-
-1. **Download the latest release** from [GitHub Releases](https://github.com/nexmoe/VidBee/releases)
-2. **Choose your platform**:
-   - **Windows**: Download `vidbee-x.x.x-setup.exe`
-   - **macOS**: Download `vidbee-x.x.x.dmg`
-   - **Linux**: Download `vidbee-x.x.x.AppImage`
-3. **Install and run** the application
+<a href="https://vidbee.org/download/" target="_blank"><img src="https://img.shields.io/badge/Download-VidBee-369eff?style=flat-square&logo=github&logoColor=white&labelColor=black" height="55"/></a>

 ### 🍎 macOS Installation Notes

@@ -42,49 +40,102 @@ xattr -rd com.apple.quarantine /Applications/VidBee.app/

 This command removes the quarantine attribute that macOS applies to applications downloaded from the internet, allowing VidBee to run properly without the "file is damaged" error.

-## 📸 Screenshots
+### 🌐 Browser Script (Quick Download)
+
+For a more convenient downloading experience, you can install the VidBee browser script to add a quick download button directly on supported video websites.
+
+![VidBee Browser Script](screenshots/browser-script.png)
+
+**Installation:**
+
+1. Install a userscript manager extension:
+   - [Tampermonkey](https://www.tampermonkey.net/) (Recommended)
+   - [Violentmonkey](https://violentmonkey.github.io/)
+   - [Greasemonkey](https://www.greasespot.net/)
+
+2. Install the VidBee Quick Download script:
+   - [Install from Greasy Fork](https://greasyfork.org/zh-CN/scripts/559595-vidbee-quick-download)
+
+**Usage:**
+
+After installation, when you visit supported video websites (YouTube, Bilibili, TikTok, Instagram, Twitter, etc.), a download button will appear on the page. Click the button to quickly send the video URL to VidBee desktop app for downloading.
+
+**Supported Sites:**
+
+The script works on popular video platforms including:
+
+- YouTube, Bilibili, TikTok, Vimeo, Dailymotion
+- Twitch, Twitter/X, Instagram, Facebook
+- Reddit, SoundCloud, Niconico, Kick
+- Bandcamp, Mixcloud, and more
+
+> [!IMPORTANT]
+>
+> **Star Us**, You will receive all release notifications from GitHub without any delay ~
+
+<a href="https://next.ossinsight.io/widgets/official/compose-last-28-days-stats?repo_id=1081230042" target="_blank" style="display: block" align="center">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://next.ossinsight.io/widgets/official/compose-last-28-days-stats/thumbnail.png?repo_id=1081230042&image_size=auto&color_scheme=dark" width="655" height="auto">
+    <img alt="Performance Stats of nexmoe/VidBee - Last 28 days" src="https://next.ossinsight.io/widgets/official/compose-last-28-days-stats/thumbnail.png?repo_id=1081230042&image_size=auto&color_scheme=light" width="655" height="auto">
+  </picture>
+</a>
+
+<!-- Made with [OSS Insight](https://ossinsight.io/) -->
+
+## ✨ Features
+
+### 🌍 Global Video Download Support
+
+Download videos from almost any website worldwide through the powerful yt-dlp engine. Support for 1000+ sites including YouTube, TikTok, Instagram, Twitter, and many more.

 ![VidBee Main Interface](screenshots/main-interface.png)
-*Clean and intuitive interface with download queue management*
+
+### 🎨 Best-in-class UI Experience
+
+Modern, clean interface with intuitive operations. One-click pause/resume/retry, real-time progress tracking, and comprehensive download queue management.

 ![VidBee Download Queue](screenshots/download-queue.png)
-*Comprehensive download queue with progress tracking and status management*
+
+### 📡 RSS Auto Download
+
+Automatically subscribe to RSS feeds and auto-download new videos in the background from your favorite creators across YouTube, TikTok, and more. Set up RSS subscriptions once, and VidBee will automatically download new uploads without manual intervention, perfect for keeping up with your favorite channels and creators.

 ## 🌐 Supported Sites

 VidBee supports hundreds of video and audio platforms through yt-dlp. Here are the most popular platforms:

 | Video Platforms | Audio & Other Platforms |
-| --- | --- |
-| YouTube | YouTube Music |
-| TikTok | SoundCloud |
-| Facebook | Mixcloud |
-| Instagram | Bandcamp |
-| X (Twitter) | Reddit |
-| Vimeo |  |
-| Dailymotion |  |
-| Twitch |  |
-| LinkedIn |  |
-| Pinterest |  |
-| Tumblr |  |
-| Niconico |  |
-| Kick |  |
+| :--------------- | :---------------------- |
+| YouTube          | YouTube Music           |
+| TikTok           | SoundCloud              |
+| Facebook         | Mixcloud                |
+| Instagram        | Bandcamp                |
+| X (Twitter)      | Reddit                  |
+| Vimeo            |                         |
+| Dailymotion      |                         |
+| Twitch           |                         |
+| LinkedIn         |                         |
+| Pinterest        |                         |
+| Tumblr           |                         |
+| Niconico         |                         |
+| Kick             |                         |

 > **💡 Note:** VidBee uses [yt-dlp](https://github.com/yt-dlp/yt-dlp) under the hood, which supports 1000+ sites. For the complete list, visit the [yt-dlp supported sites documentation](https://github.com/yt-dlp/yt-dlp/blob/master/supportedsites.md).

-## ?? Contributing
+## 🤝 Contributing

-Please read [`CONTRIBUTING.md`](CONTRIBUTING.md) for guidelines on reporting issues, proposing features, and opening pull requests. It also covers the tech stack, development workflow, scripts, internationalization notes, configuration guidance, and packaging steps.
+You are welcome to join the open source community to build together. Please check our [Contributing Guide](./CONTRIBUTING.md) for more details.

 ## 📄 License

-This project is distributed under the MIT License. See `LICENSE` for details.
+This project is distributed under the MIT License. See [`LICENSE`](LICENSE) for details.

 ## 🙏 Thanks

- [yt-dlp](https://github.com/yt-dlp/yt-dlp)
- [Electron](https://www.electronjs.org/)
- [React](https://react.dev/)
- [Vite](https://vitejs.dev/)
- [Tailwind CSS](https://tailwindcss.com/)
- [shadcn/ui](https://ui.shadcn.com/)
+- [yt-dlp](https://github.com/yt-dlp/yt-dlp) - The powerful video downloader engine
+- [FFmpeg](https://ffmpeg.org/) - The multimedia framework for video and audio processing
+- [Electron](https://www.electronjs.org/) - Build cross-platform desktop apps
+- [React](https://react.dev/) - The UI library
+- [Vite](https://vitejs.dev/) - Next generation frontend tooling
+- [Tailwind CSS](https://tailwindcss.com/) - Utility-first CSS framework
+- [shadcn/ui](https://ui.shadcn.com/) - Beautifully designed components
--- a/biome.json
+++ b/biome.json
@@ -39,7 +39,18 @@
  },
  "files": {
    "ignoreUnknown": false,
-    "includes": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "**/*.json"]
+    "includes": [
+      "**/*.ts",
+      "**/*.tsx",
+      "**/*.js",
+      "**/*.jsx",
+      "**/*.json",
+      "!monkey/dist",
+      "!dist",
+      "!out",
+      "!build"
+    ],
+    "experimentalScannerIgnores": ["monkey/dist/**", "dist/**", "out/**", "build/**"]
  },
  "vcs": {
    "enabled": true,
--- a/conductor.json
+++ b/conductor.json
@@ -0,0 +1,6 @@
+{
+  "scripts": {
+    "setup": "rm -rf resources && cp -r $CONDUCTOR_ROOT_PATH/resources resources && pnpm install",
+    "run": "pnpm run dev"
+  }
+}
--- a/drizzle.config.ts
+++ b/drizzle.config.ts
@@ -0,0 +1,7 @@
+import { defineConfig } from 'drizzle-kit'
+
+export default defineConfig({
+  schema: './src/main/lib/database/schema.ts',
+  out: './resources/drizzle',
+  dialect: 'sqlite'
+})
--- a/electron-builder.yml
+++ b/electron-builder.yml
@@ -2,13 +2,22 @@ appId: com.vidbee
 productName: VidBee
 directories:
  buildResources: build
+protocols:
+  - name: VidBee
+    schemes:
+      - vidbee
 files:
  - '!**/.vscode/*'
+  - '!**/.context/**'
+  - '!**/.github/**'
  - '!src/*'
  - '!electron.vite.config.{js,ts,mjs,cjs}'
  - '!{.eslintcache,eslint.config.mjs,dev-app-update.yml,CHANGELOG.md}'
  - '!{.env,.env.*,.npmrc,pnpm-lock.yaml}'
  - '!{tsconfig.json,tsconfig.node.json,tsconfig.web.json}'
+  - '!extension/**'
+  - '!monkey/**'
+  - '!screenshots/**'
 asarUnpack:
  - resources/**
 win:
@@ -19,10 +28,16 @@ nsis:
  uninstallDisplayName: ${productName}
  createDesktopShortcut: always
 mac:
+  hardenedRuntime: true
+  entitlements: build/entitlements.mac.plist
  entitlementsInherit: build/entitlements.mac.plist
-  notarize: false
+  notarize: true
  artifactName: ${name}-${version}-${arch}.${ext}
  target:
+    - target: zip
+      arch:
+        - arm64
+        - x64
    - target: dmg
      arch:
        - arm64
@@ -41,3 +56,5 @@ publish:
  url: https://github.com/nexmoe/vidbee/releases/latest/download
 electronDownload:
  mirror: https://npmmirror.com/mirrors/electron/
+electronLanguages:
+  - en
--- a/extension/.gitignore
+++ b/extension/.gitignore
@@ -0,0 +1,26 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.output
+stats.html
+stats-*.json
+.wxt
+web-ext.config.ts
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/extension/README.md
+++ b/extension/README.md
@@ -0,0 +1,3 @@
+# WXT + React
+
+This template should help get you started developing with React in WXT.
--- a/extension/assets/content.css
+++ b/extension/assets/content.css
@@ -0,0 +1,163 @@
+.vidbee-download-container {
+  position: fixed;
+  bottom: 16px;
+  right: 16px;
+  z-index: 9999;
+  transition: all 0.2s ease;
+  overflow: visible;
+}
+
+.vidbee-download-container.vidbee-hidden {
+  opacity: 0;
+  pointer-events: none;
+  transform: scale(0);
+}
+
+.vidbee-download-button {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 36px;
+  height: 36px;
+  padding: 0;
+  background: rgba(0, 0, 0, 0.5);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  color: rgba(255, 255, 255, 0.8);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 50%;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+  cursor: pointer;
+  font-size: 0;
+  transition: all 0.2s ease;
+  opacity: 0.6;
+  overflow: visible;
+}
+
+.vidbee-download-button:hover {
+  opacity: 1;
+  background: rgba(0, 0, 0, 0.7);
+  border-color: rgba(255, 255, 255, 0.2);
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+  transform: scale(1.1);
+}
+
+.vidbee-download-button:active {
+  transform: scale(0.95);
+}
+
+.vidbee-download-button svg {
+  flex-shrink: 0;
+  stroke: currentColor;
+  width: 16px;
+  height: 16px;
+}
+
+.vidbee-tooltip {
+  position: absolute;
+  right: calc(100% + 8px);
+  top: 50%;
+  padding: 6px 10px;
+  background: rgba(0, 0, 0, 0.9);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  color: white;
+  font-size: 12px;
+  font-weight: 500;
+  white-space: nowrap;
+  border-radius: 4px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.2s ease, transform 0.2s ease;
+  transform: translateY(-50%) translateX(4px);
+  z-index: 10000;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
+    sans-serif;
+  line-height: 1;
+}
+
+.vidbee-tooltip::after {
+  content: '';
+  position: absolute;
+  left: 100%;
+  top: 50%;
+  transform: translateY(-50%);
+  border: 4px solid transparent;
+  border-left-color: rgba(0, 0, 0, 0.9);
+}
+
+.vidbee-download-button:hover .vidbee-tooltip {
+  opacity: 1;
+  transform: translateY(-50%) translateX(0);
+}
+
+.vidbee-close-button {
+  position: absolute;
+  top: -6px;
+  right: -6px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 18px;
+  height: 18px;
+  padding: 0;
+  background: rgba(255, 77, 77, 0.9);
+  backdrop-filter: blur(4px);
+  -webkit-backdrop-filter: blur(4px);
+  color: white;
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  border-radius: 50%;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+  cursor: pointer;
+  font-size: 0;
+  transition: all 0.2s ease;
+  z-index: 1;
+  opacity: 0;
+  pointer-events: none;
+  overflow: visible;
+}
+
+.vidbee-download-container:hover .vidbee-close-button {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.vidbee-close-button:hover {
+  background: rgba(255, 77, 77, 1);
+  transform: scale(1.15);
+  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.4);
+}
+
+.vidbee-close-button:active {
+  transform: scale(0.9);
+}
+
+.vidbee-close-button svg {
+  flex-shrink: 0;
+  stroke: currentColor;
+  width: 10px;
+  height: 10px;
+}
+
+.vidbee-close-button .vidbee-tooltip {
+  right: calc(100% + 6px);
+  top: 50%;
+  left: auto;
+  transform: translateY(-50%) translateX(4px);
+}
+
+.vidbee-close-button .vidbee-tooltip::after {
+  left: 100%;
+  top: 50%;
+  right: auto;
+  transform: translateY(-50%);
+  border-left-color: rgba(0, 0, 0, 0.9);
+  border-top-color: transparent;
+}
+
+.vidbee-download-container:hover .vidbee-close-button:hover .vidbee-tooltip {
+  opacity: 1;
+  transform: translateY(-50%) translateX(0);
+}
--- a/extension/entrypoints/background.ts
+++ b/extension/entrypoints/background.ts
@@ -0,0 +1,203 @@
+type VideoFormat = {
+  format_id?: string
+  ext?: string
+  format_note?: string
+  resolution?: string
+  width?: number
+  height?: number
+  fps?: number
+  vcodec?: string
+  acodec?: string
+  filesize?: number
+  filesize_approx?: number
+  tbr?: number
+}
+
+type VideoInfo = {
+  title?: string
+  thumbnail?: string
+  duration?: number
+  formats?: VideoFormat[]
+}
+
+type VideoInfoCacheEntry = {
+  url: string
+  status: 'pending' | 'ready' | 'error'
+  fetchedAt: number
+  info?: VideoInfo
+  error?: string
+}
+
+const PORT_RANGE_START = 27100
+const PORT_RANGE_END = 27120
+const STATUS_TIMEOUT_MS = 800
+const INFO_TIMEOUT_MS = 60000
+const CACHE_TTL_MS = 5 * 60 * 1000
+
+const pendingRequests = new Map<string, Promise<void>>()
+const defaultIconPaths = {
+  16: 'icon/16.png',
+  32: 'icon/32.png',
+  48: 'icon/48.png',
+  128: 'icon/128.png'
+}
+const loadingIconPaths = {
+  16: 'icon/icon-loading-16.png',
+  32: 'icon/icon-loading-32.png',
+  48: 'icon/icon-loading-48.png',
+  128: 'icon/icon-loading-128.png'
+}
+const successIconPaths = {
+  16: 'icon/icon-success-16.png',
+  32: 'icon/icon-success-32.png',
+  48: 'icon/icon-success-48.png',
+  128: 'icon/icon-success-128.png'
+}
+
+const setActionIcon = (status: 'default' | 'loading' | 'success', tabId?: number): void => {
+  const paths =
+    status === 'loading'
+      ? loadingIconPaths
+      : status === 'success'
+        ? successIconPaths
+        : defaultIconPaths
+  const options = tabId ? { path: paths, tabId } : { path: paths }
+  void browser.action.setIcon(options)
+}
+
+const fetchJson = async <T>(url: string, timeoutMs: number): Promise<T> => {
+  const controller = new AbortController()
+  const timeoutId = setTimeout(() => controller.abort('timeout'), timeoutMs)
+
+  try {
+    const response = await fetch(url, { signal: controller.signal })
+    const data = (await response.json().catch(() => null)) as (T & { error?: string }) | null
+    if (!response.ok) {
+      const message = data && typeof data === 'object' && 'error' in data ? data.error : null
+      const details = data && typeof data === 'object' && 'details' in data ? data.details : null
+      const combined = [message, details].filter(Boolean).join('\n\n')
+      throw new Error(combined || `Request failed: ${response.status}`)
+    }
+    return data as T
+  } catch (error) {
+    if (error instanceof DOMException && error.name === 'AbortError') {
+      throw new Error('Request timed out.')
+    }
+    if (error instanceof Error && error.message.includes('signal is aborted')) {
+      throw new Error('Request timed out.')
+    }
+    if (error instanceof Error && error.message.includes('Failed to fetch')) {
+      throw new Error('VidBee app not responding on this port.')
+    }
+    throw error
+  } finally {
+    clearTimeout(timeoutId)
+  }
+}
+
+const findAvailablePort = async (): Promise<number | null> => {
+  for (let port = PORT_RANGE_START; port <= PORT_RANGE_END; port += 1) {
+    const baseUrl = `http://127.0.0.1:${port}`
+    try {
+      await fetchJson<{ ok: boolean }>(`${baseUrl}/status`, STATUS_TIMEOUT_MS)
+      return port
+    } catch {
+      // Keep scanning.
+    }
+  }
+  return null
+}
+
+const requestVideoInfo = async (targetUrl: string): Promise<VideoInfo> => {
+  const port = await findAvailablePort()
+  if (!port) {
+    throw new Error('VidBee app not found on localhost.')
+  }
+
+  const baseUrl = `http://127.0.0.1:${port}`
+  const tokenResponse = await fetchJson<{ token?: string }>(`${baseUrl}/token`, STATUS_TIMEOUT_MS)
+  if (!tokenResponse.token) {
+    throw new Error('Failed to acquire token from VidBee.')
+  }
+
+  return fetchJson<VideoInfo>(
+    `${baseUrl}/video-info?url=${encodeURIComponent(targetUrl)}&token=${encodeURIComponent(
+      tokenResponse.token
+    )}`,
+    INFO_TIMEOUT_MS
+  )
+}
+
+const getCacheMap = async (): Promise<Record<string, VideoInfoCacheEntry>> => {
+  const data = await browser.storage.local.get('videoInfoCacheByUrl')
+  const map = data.videoInfoCacheByUrl as Record<string, VideoInfoCacheEntry> | undefined
+  if (!map) return {}
+  return map
+}
+
+const pruneCache = (map: Record<string, VideoInfoCacheEntry>): void => {
+  const now = Date.now()
+  for (const [key, entry] of Object.entries(map)) {
+    if (now - entry.fetchedAt > CACHE_TTL_MS) {
+      delete map[key]
+    }
+  }
+}
+
+const loadCache = async (url: string): Promise<VideoInfoCacheEntry | null> => {
+  const map = await getCacheMap()
+  pruneCache(map)
+  const cache = map[url]
+  if (!cache) return null
+  return cache
+}
+
+const saveCacheEntry = async (cache: VideoInfoCacheEntry): Promise<void> => {
+  const map = await getCacheMap()
+  pruneCache(map)
+  map[cache.url] = cache
+  await browser.storage.local.set({ videoInfoCacheByUrl: map })
+}
+
+const fetchAndCache = async (url: string, tabId?: number): Promise<void> => {
+  if (pendingRequests.has(url)) {
+    return pendingRequests.get(url) as Promise<void>
+  }
+
+  const task = (async () => {
+    const existing = await loadCache(url)
+    if (existing?.status === 'ready') {
+      setActionIcon('success', tabId)
+      return
+    }
+
+    setActionIcon('loading', tabId)
+    await saveCacheEntry({ url, status: 'pending', fetchedAt: Date.now() })
+
+    try {
+      const info = await requestVideoInfo(url)
+      await saveCacheEntry({ url, status: 'ready', fetchedAt: Date.now(), info })
+      setActionIcon('success', tabId)
+    } catch (error) {
+      const message = error instanceof Error ? error.message : 'Failed to fetch video info.'
+      await saveCacheEntry({ url, status: 'error', fetchedAt: Date.now(), error: message })
+      setActionIcon('default', tabId)
+    }
+  })()
+
+  pendingRequests.set(url, task)
+  try {
+    await task
+  } finally {
+    pendingRequests.delete(url)
+  }
+}
+
+export default defineBackground(() => {
+  browser.runtime.onMessage.addListener((message: { type?: string; url?: string }, sender) => {
+    if (message.type !== 'video-info:fetch' || !message.url) {
+      return
+    }
+    void fetchAndCache(message.url, sender.tab?.id)
+  })
+})
--- a/extension/entrypoints/popup/App.css
+++ b/extension/entrypoints/popup/App.css
@@ -0,0 +1,291 @@
+:root {
+  --bg: #ffffff;
+  --fg: #111111;
+  --fg-secondary: #757575;
+  --border: #f0f0f0;
+  --accent: #000000;
+  --error: #e00000;
+  --success: #00c853;
+  --warning: #ffd600;
+}
+
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  background: var(--bg);
+  color: var(--fg);
+}
+
+#root {
+  width: 360px;
+  min-height: 200px;
+  padding: 24px;
+  box-sizing: border-box;
+}
+
+.app {
+  display: flex;
+  flex-direction: column;
+  gap: 24px;
+}
+
+header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+h1 {
+  font-size: 13px;
+  font-weight: 600;
+  margin: 0;
+  letter-spacing: -0.01em;
+  color: var(--fg);
+}
+
+.status-indicator {
+  font-size: 11px;
+  font-weight: 500;
+  color: var(--fg-secondary);
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.status-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background-color: var(--border);
+}
+.status-dot.loading { background-color: var(--warning); box-shadow: 0 0 4px var(--warning); }
+.status-dot.ok { background-color: var(--success); }
+.status-dot.error { background-color: var(--error); }
+
+.video-info {
+  display: grid;
+  grid-template-columns: 1fr 90px;
+  gap: 20px;
+  align-items: start;
+}
+
+.video-details h2 {
+  font-size: 15px;
+  font-weight: 500;
+  line-height: 1.4;
+  margin: 0 0 8px 0;
+  color: var(--fg);
+}
+
+.meta-row {
+  font-size: 12px;
+  color: var(--fg-secondary);
+  margin: 0 0 4px 0;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.thumbnail {
+  width: 90px;
+  height: 50px;
+  background: var(--border);
+  object-fit: cover;
+  border-radius: 6px;
+  display: block;
+}
+
+.formats-section {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.format-group {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+/* Sticky headers for long lists */
+.sticky-title {
+  position: sticky;
+  top: 0;
+  background: var(--bg);
+  padding: 4px 0;
+  z-index: 10;
+}
+
+.group-title {
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: var(--fg-secondary);
+  font-weight: 600;
+  border-bottom: 2px solid var(--border);
+  padding-bottom: 4px;
+}
+
+.format-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: 12px;
+  table-layout: fixed;
+}
+
+.format-table th {
+  text-align: left;
+  font-weight: 400;
+  color: var(--fg-secondary);
+  padding-bottom: 6px;
+  border-bottom: 1px solid var(--border);
+  font-size: 10px;
+  text-transform: uppercase;
+  padding-top: 6px;
+}
+
+.format-table td {
+  padding: 6px 0;
+  border-bottom: 1px solid var(--border);
+  color: var(--fg);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.format-table tr:last-child td {
+  border-bottom: none;
+}
+
+.col-id { width: 50px; color: var(--fg-secondary); }
+.col-ext { width: 50px; }
+.col-size { width: 60px; text-align: right; }
+.format-table th.col-size { text-align: right; }
+
+.empty-state {
+  font-size: 12px;
+  color: var(--fg-secondary);
+  padding: 12px 0;
+  font-style: italic;
+  text-align: center;
+}
+
+.error-banner {
+  font-size: 12px;
+  color: var(--error);
+  line-height: 1.5;
+  background: rgba(224, 0, 0, 0.05);
+  padding: 12px;
+  border-radius: 6px;
+}
+
+.primary-button {
+  background: var(--fg);
+  color: var(--bg);
+  border: none;
+  border-radius: 8px;
+  padding: 12px;
+  font-size: 13px;
+  font-weight: 500;
+  cursor: pointer;
+  width: 100%;
+  transition: opacity 0.2s;
+}
+
+.primary-button:hover {
+  opacity: 0.9;
+}
+
+.primary-button:active {
+  transform: scale(0.98);
+}
+
+
+.error-container {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.troubleshoot-box {
+  background: var(--border);
+  padding: 12px;
+  border-radius: 6px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.troubleshoot-title {
+  font-size: 11px;
+  font-weight: 600;
+  color: var(--fg-secondary);
+  margin: 0;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+
+.troubleshoot-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+}
+
+.link-button {
+  background: none;
+  border: none;
+  padding: 0;
+  color: var(--accent);
+  text-decoration: none;
+  font-weight: 500;
+  cursor: pointer;
+  font-family: inherit;
+  font-size: inherit;
+}
+
+.link-button:hover {
+  text-decoration: underline;
+}
+
+.divider {
+  color: var(--fg-secondary);
+}
+
+
+.loading-container {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  min-height: 200px;
+  gap: 16px;
+  flex: 1;
+  width: 100%;
+}
+
+.spinner {
+  width: 24px;
+  height: 24px;
+  border: 2.5px solid var(--border);
+  border-top-color: var(--fg);
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+.loading-text {
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--fg-secondary);
+  animation: pulse 1.5s ease-in-out infinite;
+}
+
+@keyframes spin {
+  to { transform: rotate(360deg); }
+}
+
+@keyframes pulse {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.6; }
+}
--- a/extension/entrypoints/popup/App.tsx
+++ b/extension/entrypoints/popup/App.tsx
@@ -0,0 +1,415 @@
+import { useEffect, useMemo, useState } from 'react'
+import './App.css'
+
+type VideoFormat = {
+  format_id?: string
+  ext?: string
+  format_note?: string
+  resolution?: string
+  width?: number
+  height?: number
+  fps?: number
+  vcodec?: string
+  acodec?: string
+  filesize?: number
+  filesize_approx?: number
+  tbr?: number
+}
+
+type VideoInfo = {
+  title?: string
+  thumbnail?: string
+  duration?: number
+  formats?: VideoFormat[]
+}
+
+const CACHE_TTL_MS = 60 * 60 * 1000
+
+const isValidHttpUrl = (value?: string): boolean => {
+  if (!value) return false
+  return value.startsWith('http://') || value.startsWith('https://')
+}
+
+const formatDuration = (value?: number): string => {
+  if (!value || value <= 0) return 'Unknown'
+  const totalSeconds = Math.round(value)
+  const hours = Math.floor(totalSeconds / 3600)
+  const minutes = Math.floor((totalSeconds % 3600) / 60)
+  const seconds = totalSeconds % 60
+  const paddedMinutes = hours > 0 ? String(minutes).padStart(2, '0') : String(minutes)
+  const paddedSeconds = String(seconds).padStart(2, '0')
+  return hours > 0 ? `${hours}:${paddedMinutes}:${paddedSeconds}` : `${minutes}:${paddedSeconds}`
+}
+
+const formatBytes = (value?: number): string => {
+  if (!value || value <= 0) return '-'
+  const units = ['B', 'KB', 'MB', 'GB']
+  let size = value
+  let unitIndex = 0
+  while (size >= 1024 && unitIndex < units.length - 1) {
+    size /= 1024
+    unitIndex += 1
+  }
+  return `${size.toFixed(size >= 100 || unitIndex === 0 ? 0 : 1)} ${units[unitIndex]}`
+}
+
+const isVideoFormat = (format: VideoFormat): boolean => {
+  if (format.vcodec && format.vcodec !== 'none') {
+    return true
+  }
+  return Boolean(format.resolution || format.width || format.height)
+}
+
+const isAudioFormat = (format: VideoFormat): boolean => {
+  return Boolean(format.acodec && format.acodec !== 'none' && !isVideoFormat(format))
+}
+
+type VideoInfoCacheEntry = {
+  url: string
+  status: 'pending' | 'ready' | 'error'
+  fetchedAt: number
+  info?: VideoInfo
+  error?: string
+}
+
+type VideoGroup = {
+  label: string
+  height: number
+  formats: VideoFormat[]
+}
+
+const loadCachedInfo = async (url: string): Promise<VideoInfoCacheEntry | null> => {
+  const data = await browser.storage.local.get('videoInfoCacheByUrl')
+  const map = data.videoInfoCacheByUrl as Record<string, VideoInfoCacheEntry> | undefined
+  if (!map) return null
+  const cached = map[url]
+  if (!cached) return null
+  if (Date.now() - cached.fetchedAt > CACHE_TTL_MS) return null
+  return cached
+}
+
+const sanitizeError = (error: string): string => {
+  const message = error.toLowerCase()
+  if (
+    message.includes('localhost') ||
+    message.includes('fetch') ||
+    message.includes('network') ||
+    message.includes('connect') ||
+    message.includes('failed to request')
+  ) {
+    return 'Client connection failed'
+  }
+  return error
+}
+
+function App() {
+  const [info, setInfo] = useState<VideoInfo | null>(null)
+  const [error, setError] = useState<string | null>(null)
+  const [loading, setLoading] = useState(false)
+  const [currentUrl, setCurrentUrl] = useState<string>('')
+  const [retryTrigger, setRetryTrigger] = useState(0)
+
+  useEffect(() => {
+    let active = true
+    const targetState = { url: '' }
+
+    const handleStorageChange = (
+      changes: Record<string, browser.storage.StorageChange>,
+      areaName: string
+    ) => {
+      if (!active || areaName !== 'local') return
+      const change = changes.videoInfoCacheByUrl
+      if (!change?.newValue) return
+
+      const map = change.newValue as Record<string, VideoInfoCacheEntry>
+      const next = map[targetState.url]
+      if (!next) return
+
+      if (next.status === 'ready' && next.info) {
+        setInfo(next.info)
+        setError(null)
+        setLoading(false)
+      } else if (next.status === 'error' && next.error) {
+        setError(sanitizeError(next.error))
+        setInfo(null)
+        setLoading(false)
+      } else if (next.status === 'pending') {
+        setLoading(true)
+      }
+    }
+
+    browser.storage.onChanged.addListener(handleStorageChange)
+
+    const loadInfo = async () => {
+      setLoading(true)
+      setError(null)
+      setInfo(null)
+
+      const [tab] = await browser.tabs.query({ active: true, currentWindow: true })
+      if (!isValidHttpUrl(tab?.url)) {
+        setError('Please open a valid video page first.')
+        setLoading(false)
+        return
+      }
+
+      const targetUrl = tab.url as string
+      targetState.url = targetUrl
+      setCurrentUrl(targetUrl)
+
+      const cached = await loadCachedInfo(targetUrl)
+      const shouldBypassCache = retryTrigger > 0
+      if (cached && !shouldBypassCache) {
+        if (cached.status === 'ready' && cached.info) {
+          setInfo(cached.info)
+          setLoading(false)
+          return
+        }
+        if (cached.status === 'error' && cached.error) {
+          setError(sanitizeError(cached.error))
+          setLoading(false)
+          return
+        }
+      }
+
+      try {
+        await browser.runtime.sendMessage({
+          type: 'video-info:fetch',
+          url: targetUrl
+        })
+      } catch (err) {
+        const message = err instanceof Error ? err.message : 'Failed to request video info.'
+        setError(sanitizeError(message))
+        setLoading(false)
+      }
+
+      const latest = await loadCachedInfo(targetUrl)
+      if (latest && latest.status === 'ready' && latest.info) {
+        setInfo(latest.info)
+        setError(null)
+        setLoading(false)
+      } else if (latest && latest.status === 'error' && latest.error) {
+        setError(sanitizeError(latest.error))
+        setInfo(null)
+        setLoading(false)
+      }
+    }
+
+    void loadInfo()
+
+    return () => {
+      active = false
+      browser.storage.onChanged.removeListener(handleStorageChange)
+    }
+  }, [retryTrigger])
+
+  const formats = useMemo(() => info?.formats ?? [], [info])
+  const groupedFormats = useMemo(() => {
+    const video: VideoFormat[] = []
+    const audio: VideoFormat[] = []
+    const other: VideoFormat[] = []
+
+    for (const format of formats) {
+      if (isVideoFormat(format)) {
+        video.push(format)
+      } else if (isAudioFormat(format)) {
+        audio.push(format)
+      } else {
+        other.push(format)
+      }
+    }
+
+    return { video, audio, other }
+  }, [formats])
+
+  const groupedVideoFormats = useMemo(() => {
+    const raw = groupedFormats.video
+    if (!raw.length) return []
+
+    const groups: Record<number, VideoFormat[]> = {}
+    const noHeight: VideoFormat[] = []
+
+    for (const f of raw) {
+      const h = f.height || f.resolution?.match(/x(\d+)/)?.[1]
+      const heightVal = h ? Number(h) : 0
+
+      if (heightVal > 0) {
+        if (!groups[heightVal]) groups[heightVal] = []
+        groups[heightVal].push(f)
+      } else {
+        noHeight.push(f)
+      }
+    }
+
+    const sortedLabels = Object.keys(groups)
+      .map(Number)
+      .sort((a, b) => b - a)
+
+    const result: VideoGroup[] = sortedLabels.map((h) => ({
+      label: `${h}p`,
+      height: h,
+      formats: groups[h].sort((a, b) => {
+        const sa = a.filesize || a.filesize_approx || 0
+        const sb = b.filesize || b.filesize_approx || 0
+        return sb - sa
+      })
+    }))
+
+    if (noHeight.length > 0) {
+      result.push({
+        label: 'Other',
+        height: 0,
+        formats: noHeight
+      })
+    }
+
+    return result
+  }, [groupedFormats.video])
+
+  const handleOpenClient = () => {
+    if (!currentUrl) return
+    const deepLink = `vidbee://download?url=${encodeURIComponent(currentUrl)}`
+    window.location.href = deepLink
+  }
+
+  const renderStatus = () => {
+    // if (loading) return null
+    if (error)
+      return (
+        <span className="status-indicator">
+          <div className="status-dot error" /> Error
+        </span>
+      )
+    if (info)
+      return (
+        <span className="status-indicator">
+          <div className="status-dot ok" /> Ready
+        </span>
+      )
+    return (
+      <span className="status-indicator">
+        <div className="status-dot" /> Idle
+      </span>
+    )
+  }
+
+  return (
+    <div className="app">
+      <header>
+        <h1>VidBee</h1>
+        {renderStatus()}
+      </header>
+      {loading && (
+        <div className="loading-container">
+          <div className="spinner" />
+          <div className="loading-text">Analyzing video...</div>
+        </div>
+      )}
+
+      {!loading && error && (
+        <div className="error-container">
+          <div className="error-banner">{error}</div>
+          <div className="troubleshoot-box">
+            <p className="troubleshoot-title">Having trouble?</p>
+            <div className="troubleshoot-actions">
+              <button
+                type="button"
+                className="link-button"
+                onClick={() => {
+                  window.location.href = 'vidbee://'
+                  setTimeout(() => setRetryTrigger((c) => c + 1), 100)
+                }}
+              >
+                Open Client
+              </button>
+              <span className="divider">•</span>
+              <a
+                href="https://vidbee.app"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="link-button"
+              >
+                Download
+              </a>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {!loading && !error && info && (
+        <>
+          <section className="video-info">
+            <div className="video-details">
+              <h2>{info.title || 'Untitled video'}</h2>
+              <div className="meta-row">
+                <span>{formatDuration(info.duration)}</span>
+                <span>•</span>
+                <span>{formats.length} formats</span>
+              </div>
+            </div>
+            {info.thumbnail && <img className="thumbnail" src={info.thumbnail} alt="" />}
+          </section>
+
+          <button type="button" className="primary-button" onClick={handleOpenClient}>
+            Download with VidBee
+          </button>
+
+          <section className="formats-section">
+            {groupedVideoFormats.map((group) => (
+              <div className="format-group" key={group.label}>
+                <div className="group-title sticky-title">{group.label}</div>
+                <table className="format-table">
+                  <thead>
+                    <tr>
+                      <th className="col-id">ID</th>
+                      <th className="col-ext">Ext</th>
+                      <th className="col-size">Size</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {group.formats.map((f) => (
+                      <tr key={`vg-${group.label}-${f.format_id ?? f.ext ?? 'video'}`}>
+                        <td className="col-id">{f.format_id || '-'}</td>
+                        <td className="col-ext">{f.ext || '-'}</td>
+                        <td className="col-size">{formatBytes(f.filesize || f.filesize_approx)}</td>
+                      </tr>
+                    ))}
+                  </tbody>
+                </table>
+              </div>
+            ))}
+
+            {groupedVideoFormats.length === 0 && groupedFormats.audio.length === 0 && (
+              <div className="empty-state">No compatible formats.</div>
+            )}
+
+            {groupedFormats.audio.length > 0 && (
+              <div className="format-group">
+                <div className="group-title">Audio Only</div>
+                <table className="format-table">
+                  <thead>
+                    <tr>
+                      <th className="col-id">ID</th>
+                      <th className="col-ext">Ext</th>
+                      <th className="col-size">Size</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {groupedFormats.audio.map((f) => (
+                      <tr key={`a-${f.format_id ?? f.ext ?? 'audio'}`}>
+                        <td className="col-id">{f.format_id || '-'}</td>
+                        <td className="col-ext">{f.ext || '-'}</td>
+                        <td className="col-size">{formatBytes(f.filesize || f.filesize_approx)}</td>
+                      </tr>
+                    ))}
+                  </tbody>
+                </table>
+              </div>
+            )}
+          </section>
+        </>
+      )}
+    </div>
+  )
+}
+
+export default App
--- a/extension/entrypoints/popup/index.html
+++ b/extension/entrypoints/popup/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Default Popup Title</title>
+    <meta name="manifest.type" content="browser_action" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./main.tsx"></script>
+  </body>
+</html>
--- a/extension/entrypoints/popup/main.tsx
+++ b/extension/entrypoints/popup/main.tsx
@@ -0,0 +1,13 @@
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import App from './App.tsx'
+
+const root = document.getElementById('root')
+
+if (root) {
+  ReactDOM.createRoot(root).render(
+    <React.StrictMode>
+      <App />
+    </React.StrictMode>
+  )
+}
--- a/extension/package.json
+++ b/extension/package.json
@@ -0,0 +1,28 @@
+{
+  "name": "wxt-react-starter",
+  "description": "manifest.json description",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "wxt",
+    "dev:firefox": "wxt -b firefox",
+    "build": "wxt build",
+    "build:firefox": "wxt build -b firefox",
+    "zip": "wxt zip",
+    "zip:firefox": "wxt zip -b firefox",
+    "compile": "tsc --noEmit",
+    "postinstall": "wxt prepare"
+  },
+  "dependencies": {
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "@wxt-dev/module-react": "^1.1.5",
+    "typescript": "^5.9.3",
+    "wxt": "^0.20.6"
+  }
+}
--- a/extension/pnpm-lock.yaml
+++ b/extension/pnpm-lock.yaml
--- a/extension/public/_locales/en/messages.json
+++ b/extension/public/_locales/en/messages.json
@@ -0,0 +1,8 @@
+{
+  "downloadWithVidBee": {
+    "message": "Download with VidBee"
+  },
+  "hideButton": {
+    "message": "Hide"
+  }
+}
--- a/extension/public/icon/128.png
+++ b/extension/public/icon/128.png
--- a/extension/public/icon/16.png
+++ b/extension/public/icon/16.png
--- a/extension/public/icon/32.png
+++ b/extension/public/icon/32.png
--- a/extension/public/icon/48.png
+++ b/extension/public/icon/48.png
--- a/extension/public/icon/icon-loading-128.png
+++ b/extension/public/icon/icon-loading-128.png
--- a/extension/public/icon/icon-loading-16.png
+++ b/extension/public/icon/icon-loading-16.png
--- a/extension/public/icon/icon-loading-32.png
+++ b/extension/public/icon/icon-loading-32.png
--- a/extension/public/icon/icon-loading-48.png
+++ b/extension/public/icon/icon-loading-48.png
--- a/extension/public/icon/icon-success-128.png
+++ b/extension/public/icon/icon-success-128.png
--- a/extension/public/icon/icon-success-16.png
+++ b/extension/public/icon/icon-success-16.png
--- a/extension/public/icon/icon-success-32.png
+++ b/extension/public/icon/icon-success-32.png
--- a/extension/public/icon/icon-success-48.png
+++ b/extension/public/icon/icon-success-48.png
--- a/extension/tsconfig.json
+++ b/extension/tsconfig.json
@@ -0,0 +1,7 @@
+{
+  "extends": "./.wxt/tsconfig.json",
+  "compilerOptions": {
+    "allowImportingTsExtensions": true,
+    "jsx": "react-jsx"
+  }
+}
--- a/extension/wxt.config.ts
+++ b/extension/wxt.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'wxt'
+
+// See https://wxt.dev/api/config.html
+export default defineConfig({
+  modules: ['@wxt-dev/module-react'],
+  manifest: {
+    default_locale: 'en',
+    host_permissions: ['http://127.0.0.1/*'],
+    permissions: ['activeTab', 'storage']
+  }
+})
--- a/monkey/.gitignore
+++ b/monkey/.gitignore
@@ -0,0 +1,23 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/monkey/dist/vidbee-quick-download.user.js
+++ b/monkey/dist/vidbee-quick-download.user.js
@@ -0,0 +1,156 @@
+// ==UserScript==
+// @name       vidbee-quick-download
+// @namespace  vidbee
+// @version    0.0.1
+// @icon       https://vidbee.org/favicon.svg
+// @match      https://www.youtube.com/*
+// @match      https://youtube.com/*
+// @match      https://music.youtube.com/*
+// @match      https://www.bilibili.com/*
+// @match      https://bilibili.com/*
+// @match      https://www.tiktok.com/*
+// @match      https://tiktok.com/*
+// @match      https://vimeo.com/*
+// @match      https://www.vimeo.com/*
+// @match      https://www.dailymotion.com/*
+// @match      https://dailymotion.com/*
+// @match      https://www.twitch.tv/*
+// @match      https://twitch.tv/*
+// @match      https://twitter.com/*
+// @match      https://www.twitter.com/*
+// @match      https://x.com/*
+// @match      https://www.x.com/*
+// @match      https://www.instagram.com/*
+// @match      https://instagram.com/*
+// @match      https://www.facebook.com/*
+// @match      https://facebook.com/*
+// @match      https://fb.com/*
+// @match      https://www.fb.com/*
+// @match      https://www.reddit.com/*
+// @match      https://reddit.com/*
+// @match      https://soundcloud.com/*
+// @match      https://www.soundcloud.com/*
+// @match      https://www.nicovideo.jp/*
+// @match      https://nicovideo.jp/*
+// @match      https://kick.com/*
+// @match      https://www.kick.com/*
+// @match      https://bandcamp.com/*
+// @match      https://*.bandcamp.com/*
+// @match      https://www.mixcloud.com/*
+// @match      https://mixcloud.com/*
+// @grant      GM_addStyle
+// ==/UserScript==
+
+(function () {
+  'use strict';
+
+  const d=new Set;const importCSS = async e=>{d.has(e)||(d.add(e),(t=>{typeof GM_addStyle=="function"?GM_addStyle(t):(document.head||document.documentElement).appendChild(document.createElement("style")).append(t);})(e));};
+
+  const styleCss = '.vidbee-download-container{position:fixed;bottom:16px;right:16px;z-index:9999;transition:all .2s ease;overflow:visible}.vidbee-download-container.vidbee-hidden{opacity:0;pointer-events:none;transform:scale(0)}.vidbee-download-button{position:relative;display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:#00000080;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fffc;border:1px solid rgba(255,255,255,.1);border-radius:50%;box-shadow:0 2px 8px #0003;cursor:pointer;font-size:0;transition:all .2s ease;opacity:.6;overflow:visible}.vidbee-download-button:hover{opacity:1;background:#000000b3;border-color:#fff3;box-shadow:0 4px 12px #0000004d;transform:scale(1.1)}.vidbee-download-button:active{transform:scale(.95)}.vidbee-download-button svg{flex-shrink:0;stroke:currentColor;width:16px;height:16px}.vidbee-tooltip{position:absolute;right:calc(100% + 8px);top:50%;padding:6px 10px;background:#000000e6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font-size:12px;font-weight:500;white-space:nowrap;border-radius:4px;box-shadow:0 2px 8px #0000004d;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;transform:translateY(-50%) translate(4px);z-index:10000;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1}.vidbee-tooltip:after{content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);border:4px solid transparent;border-left-color:#000000e6}.vidbee-download-button:hover .vidbee-tooltip{opacity:1;transform:translateY(-50%) translate(0)}.vidbee-close-button{position:absolute;top:-6px;right:-6px;display:flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;background:#ff4d4de6;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:50%;box-shadow:0 2px 4px #0000004d;cursor:pointer;font-size:0;transition:all .2s ease;z-index:1;opacity:0;pointer-events:none;overflow:visible}.vidbee-download-container:hover .vidbee-close-button{opacity:1;pointer-events:auto}.vidbee-close-button:hover{background:#ff4d4d;transform:scale(1.15);box-shadow:0 3px 6px #0006}.vidbee-close-button:active{transform:scale(.9)}.vidbee-close-button svg{flex-shrink:0;stroke:currentColor;width:10px;height:10px}.vidbee-close-button .vidbee-tooltip{right:calc(100% + 6px);top:50%;left:auto;transform:translateY(-50%) translate(4px)}.vidbee-close-button .vidbee-tooltip:after{left:100%;top:50%;right:auto;transform:translateY(-50%);border-left-color:#000000e6;border-top-color:transparent}.vidbee-download-container:hover .vidbee-close-button:hover .vidbee-tooltip{opacity:1;transform:translateY(-50%) translate(0)}';
+  importCSS(styleCss);
+  function getVideoUrl() {
+    return window.location.href;
+  }
+  function hideButtonTemporarily() {
+    const container = document.getElementById("vidbee-download-btn");
+    if (container) {
+      container.classList.add("vidbee-hidden");
+      setTimeout(() => {
+        if (container) {
+          container.classList.remove("vidbee-hidden");
+        }
+      }, 5e3);
+    }
+  }
+  function createVidBeeButton() {
+    if (document.getElementById("vidbee-download-btn")) {
+      return;
+    }
+    const videoUrl = getVideoUrl();
+    if (!videoUrl) {
+      return;
+    }
+    const container = document.createElement("div");
+    container.id = "vidbee-download-btn";
+    container.className = "vidbee-download-container";
+    const button = document.createElement("button");
+    button.className = "vidbee-download-button";
+    button.setAttribute("aria-label", "Download with VidBee");
+    button.innerHTML = `
+    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+      <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+      <polyline points="7 10 12 15 17 10"></polyline>
+      <line x1="12" y1="15" x2="12" y2="3"></line>
+    </svg>
+    <span class="vidbee-tooltip">Download with VidBee</span>
+  `;
+    const closeButton = document.createElement("button");
+    closeButton.className = "vidbee-close-button";
+    closeButton.setAttribute("aria-label", "Hide button");
+    closeButton.innerHTML = `
+    <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3">
+      <line x1="18" y1="6" x2="6" y2="18"></line>
+      <line x1="6" y1="6" x2="18" y2="18"></line>
+    </svg>
+    <span class="vidbee-tooltip">Hide</span>
+  `;
+    closeButton.addEventListener("click", (e) => {
+      e.stopPropagation();
+      hideButtonTemporarily();
+    });
+    let clickTimer = null;
+    let clickCount = 0;
+    button.addEventListener("click", () => {
+      clickCount++;
+      if (clickCount === 1) {
+        clickTimer = window.setTimeout(() => {
+          const vidbeeUrl = `vidbee://download?url=${encodeURIComponent(videoUrl)}`;
+          window.location.href = vidbeeUrl;
+          clickCount = 0;
+        }, 300);
+      } else if (clickCount === 2) {
+        if (clickTimer !== null) {
+          clearTimeout(clickTimer);
+        }
+        clickCount = 0;
+        hideButtonTemporarily();
+      }
+    });
+    container.appendChild(button);
+    container.appendChild(closeButton);
+    document.body.appendChild(container);
+  }
+  function init() {
+    if (document.readyState === "loading") {
+      document.addEventListener("DOMContentLoaded", createVidBeeButton);
+    } else {
+      createVidBeeButton();
+    }
+    let lastUrl = location.href;
+    let urlCheckTimer = null;
+    const checkUrlChange = () => {
+      const currentUrl = location.href;
+      if (currentUrl !== lastUrl) {
+        lastUrl = currentUrl;
+        const oldButton = document.getElementById("vidbee-download-btn");
+        if (oldButton) {
+          oldButton.remove();
+        }
+        const hostname = window.location.hostname;
+        const delay = hostname.includes("bilibili.com") ? 800 : 500;
+        setTimeout(createVidBeeButton, delay);
+      }
+    };
+    new MutationObserver(() => {
+      if (urlCheckTimer !== null) {
+        clearTimeout(urlCheckTimer);
+      }
+      urlCheckTimer = window.setTimeout(checkUrlChange, 100);
+    }).observe(document.body, { childList: true, subtree: true });
+    window.addEventListener("popstate", () => {
+      setTimeout(checkUrlChange, 300);
+    });
+  }
+  init();
+
+})();
--- a/monkey/package.json
+++ b/monkey/package.json
@@ -0,0 +1,16 @@
+{
+  "name": "vidbee-quick-download",
+  "private": true,
+  "version": "0.0.1",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview"
+  },
+  "devDependencies": {
+    "typescript": "^5.9.2",
+    "vite": "^7.1.3",
+    "vite-plugin-monkey": "^7.1.1"
+  }
+}
--- a/monkey/pnpm-lock.yaml
+++ b/monkey/pnpm-lock.yaml
@@ -0,0 +1,943 @@
+lockfileVersion: '9.0'
+
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
+importers:
+
+  .:
+    devDependencies:
+      typescript:
+        specifier: ^5.9.2
+        version: 5.9.3
+      vite:
+        specifier: ^7.1.3
+        version: 7.3.0
+      vite-plugin-monkey:
+        specifier: ^7.1.1
+        version: 7.1.8(postcss@8.5.6)(vite@7.3.0)
+
+packages:
+
+  '@esbuild/aix-ppc64@0.27.2':
+    resolution: {integrity: sha512-GZMB+a0mOMZs4MpDbj8RJp4cw+w1WV5NYD6xzgvzUJ5Ek2jerwfO2eADyI6ExDSUED+1X8aMbegahsJi+8mgpw==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/android-arm64@0.27.2':
+    resolution: {integrity: sha512-pvz8ZZ7ot/RBphf8fv60ljmaoydPU12VuXHImtAs0XhLLw+EXBi2BLe3OYSBslR4rryHvweW5gmkKFwTiFy6KA==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm@0.27.2':
+    resolution: {integrity: sha512-DVNI8jlPa7Ujbr1yjU2PfUSRtAUZPG9I1RwW4F4xFB1Imiu2on0ADiI/c3td+KmDtVKNbi+nffGDQMfcIMkwIA==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-x64@0.27.2':
+    resolution: {integrity: sha512-z8Ank4Byh4TJJOh4wpz8g2vDy75zFL0TlZlkUkEwYXuPSgX8yzep596n6mT7905kA9uHZsf/o2OJZubl2l3M7A==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/darwin-arm64@0.27.2':
+    resolution: {integrity: sha512-davCD2Zc80nzDVRwXTcQP/28fiJbcOwvdolL0sOiOsbwBa72kegmVU0Wrh1MYrbuCL98Omp5dVhQFWRKR2ZAlg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.27.2':
+    resolution: {integrity: sha512-ZxtijOmlQCBWGwbVmwOF/UCzuGIbUkqB1faQRf5akQmxRJ1ujusWsb3CVfk/9iZKr2L5SMU5wPBi1UWbvL+VQA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/freebsd-arm64@0.27.2':
+    resolution: {integrity: sha512-lS/9CN+rgqQ9czogxlMcBMGd+l8Q3Nj1MFQwBZJyoEKI50XGxwuzznYdwcav6lpOGv5BqaZXqvBSiB/kJ5op+g==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.27.2':
+    resolution: {integrity: sha512-tAfqtNYb4YgPnJlEFu4c212HYjQWSO/w/h/lQaBK7RbwGIkBOuNKQI9tqWzx7Wtp7bTPaGC6MJvWI608P3wXYA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/linux-arm64@0.27.2':
+    resolution: {integrity: sha512-hYxN8pr66NsCCiRFkHUAsxylNOcAQaxSSkHMMjcpx0si13t1LHFphxJZUiGwojB1a/Hd5OiPIqDdXONia6bhTw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.27.2':
+    resolution: {integrity: sha512-vWfq4GaIMP9AIe4yj1ZUW18RDhx6EPQKjwe7n8BbIecFtCQG4CfHGaHuh7fdfq+y3LIA2vGS/o9ZBGVxIDi9hw==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.27.2':
+    resolution: {integrity: sha512-MJt5BRRSScPDwG2hLelYhAAKh9imjHK5+NE/tvnRLbIqUWa+0E9N4WNMjmp/kXXPHZGqPLxggwVhz7QP8CTR8w==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.27.2':
+    resolution: {integrity: sha512-lugyF1atnAT463aO6KPshVCJK5NgRnU4yb3FUumyVz+cGvZbontBgzeGFO1nF+dPueHD367a2ZXe1NtUkAjOtg==}
+    engines: {node: '>=18'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.27.2':
+    resolution: {integrity: sha512-nlP2I6ArEBewvJ2gjrrkESEZkB5mIoaTswuqNFRv/WYd+ATtUpe9Y09RnJvgvdag7he0OWgEZWhviS1OTOKixw==}
+    engines: {node: '>=18'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.27.2':
+    resolution: {integrity: sha512-C92gnpey7tUQONqg1n6dKVbx3vphKtTHJaNG2Ok9lGwbZil6DrfyecMsp9CrmXGQJmZ7iiVXvvZH6Ml5hL6XdQ==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.27.2':
+    resolution: {integrity: sha512-B5BOmojNtUyN8AXlK0QJyvjEZkWwy/FKvakkTDCziX95AowLZKR6aCDhG7LeF7uMCXEJqwa8Bejz5LTPYm8AvA==}
+    engines: {node: '>=18'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.27.2':
+    resolution: {integrity: sha512-p4bm9+wsPwup5Z8f4EpfN63qNagQ47Ua2znaqGH6bqLlmJ4bx97Y9JdqxgGZ6Y8xVTixUnEkoKSHcpRlDnNr5w==}
+    engines: {node: '>=18'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.27.2':
+    resolution: {integrity: sha512-uwp2Tip5aPmH+NRUwTcfLb+W32WXjpFejTIOWZFw/v7/KnpCDKG66u4DLcurQpiYTiYwQ9B7KOeMJvLCu/OvbA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/netbsd-arm64@0.27.2':
+    resolution: {integrity: sha512-Kj6DiBlwXrPsCRDeRvGAUb/LNrBASrfqAIok+xB0LxK8CHqxZ037viF13ugfsIpePH93mX7xfJp97cyDuTZ3cw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-x64@0.27.2':
+    resolution: {integrity: sha512-HwGDZ0VLVBY3Y+Nw0JexZy9o/nUAWq9MlV7cahpaXKW6TOzfVno3y3/M8Ga8u8Yr7GldLOov27xiCnqRZf0tCA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/openbsd-arm64@0.27.2':
+    resolution: {integrity: sha512-DNIHH2BPQ5551A7oSHD0CKbwIA/Ox7+78/AWkbS5QoRzaqlev2uFayfSxq68EkonB+IKjiuxBFoV8ESJy8bOHA==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-x64@0.27.2':
+    resolution: {integrity: sha512-/it7w9Nb7+0KFIzjalNJVR5bOzA9Vay+yIPLVHfIQYG/j+j9VTH84aNB8ExGKPU4AzfaEvN9/V4HV+F+vo8OEg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/openharmony-arm64@0.27.2':
+    resolution: {integrity: sha512-LRBbCmiU51IXfeXk59csuX/aSaToeG7w48nMwA6049Y4J4+VbWALAuXcs+qcD04rHDuSCSRKdmY63sruDS5qag==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@esbuild/sunos-x64@0.27.2':
+    resolution: {integrity: sha512-kMtx1yqJHTmqaqHPAzKCAkDaKsffmXkPHThSfRwZGyuqyIeBvf08KSsYXl+abf5HDAPMJIPnbBfXvP2ZC2TfHg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/win32-arm64@0.27.2':
+    resolution: {integrity: sha512-Yaf78O/B3Kkh+nKABUF++bvJv5Ijoy9AN1ww904rOXZFLWVc5OLOfL56W+C8F9xn5JQZa3UX6m+IktJnIb1Jjg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.27.2':
+    resolution: {integrity: sha512-Iuws0kxo4yusk7sw70Xa2E2imZU5HoixzxfGCdxwBdhiDgt9vX9VUCBhqcwY7/uh//78A1hMkkROMJq9l27oLQ==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.27.2':
+    resolution: {integrity: sha512-sRdU18mcKf7F+YgheI/zGf5alZatMUTKj/jNS6l744f9u3WFu4v7twcUI9vu4mknF4Y9aDlblIie0IM+5xxaqQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [win32]
+
+  '@jridgewell/sourcemap-codec@1.5.5':
+    resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
+
+  '@rollup/rollup-android-arm-eabi@4.54.0':
+    resolution: {integrity: sha512-OywsdRHrFvCdvsewAInDKCNyR3laPA2mc9bRYJ6LBp5IyvF3fvXbbNR0bSzHlZVFtn6E0xw2oZlyjg4rKCVcng==}
+    cpu: [arm]
+    os: [android]
+
+  '@rollup/rollup-android-arm64@4.54.0':
+    resolution: {integrity: sha512-Skx39Uv+u7H224Af+bDgNinitlmHyQX1K/atIA32JP3JQw6hVODX5tkbi2zof/E69M1qH2UoN3Xdxgs90mmNYw==}
+    cpu: [arm64]
+    os: [android]
+
+  '@rollup/rollup-darwin-arm64@4.54.0':
+    resolution: {integrity: sha512-k43D4qta/+6Fq+nCDhhv9yP2HdeKeP56QrUUTW7E6PhZP1US6NDqpJj4MY0jBHlJivVJD5P8NxrjuobZBJTCRw==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@rollup/rollup-darwin-x64@4.54.0':
+    resolution: {integrity: sha512-cOo7biqwkpawslEfox5Vs8/qj83M/aZCSSNIWpVzfU2CYHa2G3P1UN5WF01RdTHSgCkri7XOlTdtk17BezlV3A==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@rollup/rollup-freebsd-arm64@4.54.0':
+    resolution: {integrity: sha512-miSvuFkmvFbgJ1BevMa4CPCFt5MPGw094knM64W9I0giUIMMmRYcGW/JWZDriaw/k1kOBtsWh1z6nIFV1vPNtA==}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@rollup/rollup-freebsd-x64@4.54.0':
+    resolution: {integrity: sha512-KGXIs55+b/ZfZsq9aR026tmr/+7tq6VG6MsnrvF4H8VhwflTIuYh+LFUlIsRdQSgrgmtM3fVATzEAj4hBQlaqQ==}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.54.0':
+    resolution: {integrity: sha512-EHMUcDwhtdRGlXZsGSIuXSYwD5kOT9NVnx9sqzYiwAc91wfYOE1g1djOEDseZJKKqtHAHGwnGPQu3kytmfaXLQ==}
+    cpu: [arm]
+    os: [linux]
+
+  '@rollup/rollup-linux-arm-musleabihf@4.54.0':
+    resolution: {integrity: sha512-+pBrqEjaakN2ySv5RVrj/qLytYhPKEUwk+e3SFU5jTLHIcAtqh2rLrd/OkbNuHJpsBgxsD8ccJt5ga/SeG0JmA==}
+    cpu: [arm]
+    os: [linux]
+
+  '@rollup/rollup-linux-arm64-gnu@4.54.0':
+    resolution: {integrity: sha512-NSqc7rE9wuUaRBsBp5ckQ5CVz5aIRKCwsoa6WMF7G01sX3/qHUw/z4pv+D+ahL1EIKy6Enpcnz1RY8pf7bjwng==}
+    cpu: [arm64]
+    os: [linux]
+
+  '@rollup/rollup-linux-arm64-musl@4.54.0':
+    resolution: {integrity: sha512-gr5vDbg3Bakga5kbdpqx81m2n9IX8M6gIMlQQIXiLTNeQW6CucvuInJ91EuCJ/JYvc+rcLLsDFcfAD1K7fMofg==}
+    cpu: [arm64]
+    os: [linux]
+
+  '@rollup/rollup-linux-loong64-gnu@4.54.0':
+    resolution: {integrity: sha512-gsrtB1NA3ZYj2vq0Rzkylo9ylCtW/PhpLEivlgWe0bpgtX5+9j9EZa0wtZiCjgu6zmSeZWyI/e2YRX1URozpIw==}
+    cpu: [loong64]
+    os: [linux]
+
+  '@rollup/rollup-linux-ppc64-gnu@4.54.0':
+    resolution: {integrity: sha512-y3qNOfTBStmFNq+t4s7Tmc9hW2ENtPg8FeUD/VShI7rKxNW7O4fFeaYbMsd3tpFlIg1Q8IapFgy7Q9i2BqeBvA==}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@rollup/rollup-linux-riscv64-gnu@4.54.0':
+    resolution: {integrity: sha512-89sepv7h2lIVPsFma8iwmccN7Yjjtgz0Rj/Ou6fEqg3HDhpCa+Et+YSufy27i6b0Wav69Qv4WBNl3Rs6pwhebQ==}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@rollup/rollup-linux-riscv64-musl@4.54.0':
+    resolution: {integrity: sha512-ZcU77ieh0M2Q8Ur7D5X7KvK+UxbXeDHwiOt/CPSBTI1fBmeDMivW0dPkdqkT4rOgDjrDDBUed9x4EgraIKoR2A==}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@rollup/rollup-linux-s390x-gnu@4.54.0':
+    resolution: {integrity: sha512-2AdWy5RdDF5+4YfG/YesGDDtbyJlC9LHmL6rZw6FurBJ5n4vFGupsOBGfwMRjBYH7qRQowT8D/U4LoSvVwOhSQ==}
+    cpu: [s390x]
+    os: [linux]
+
+  '@rollup/rollup-linux-x64-gnu@4.54.0':
+    resolution: {integrity: sha512-WGt5J8Ij/rvyqpFexxk3ffKqqbLf9AqrTBbWDk7ApGUzaIs6V+s2s84kAxklFwmMF/vBNGrVdYgbblCOFFezMQ==}
+    cpu: [x64]
+    os: [linux]
+
+  '@rollup/rollup-linux-x64-musl@4.54.0':
+    resolution: {integrity: sha512-JzQmb38ATzHjxlPHuTH6tE7ojnMKM2kYNzt44LO/jJi8BpceEC8QuXYA908n8r3CNuG/B3BV8VR3Hi1rYtmPiw==}
+    cpu: [x64]
+    os: [linux]
+
+  '@rollup/rollup-openharmony-arm64@4.54.0':
+    resolution: {integrity: sha512-huT3fd0iC7jigGh7n3q/+lfPcXxBi+om/Rs3yiFxjvSxbSB6aohDFXbWvlspaqjeOh+hx7DDHS+5Es5qRkWkZg==}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@rollup/rollup-win32-arm64-msvc@4.54.0':
+    resolution: {integrity: sha512-c2V0W1bsKIKfbLMBu/WGBz6Yci8nJ/ZJdheE0EwB73N3MvHYKiKGs3mVilX4Gs70eGeDaMqEob25Tw2Gb9Nqyw==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@rollup/rollup-win32-ia32-msvc@4.54.0':
+    resolution: {integrity: sha512-woEHgqQqDCkAzrDhvDipnSirm5vxUXtSKDYTVpZG3nUdW/VVB5VdCYA2iReSj/u3yCZzXID4kuKG7OynPnB3WQ==}
+    cpu: [ia32]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-gnu@4.54.0':
+    resolution: {integrity: sha512-dzAc53LOuFvHwbCEOS0rPbXp6SIhAf2txMP5p6mGyOXXw5mWY8NGGbPMPrs4P1WItkfApDathBj/NzMLUZ9rtQ==}
+    cpu: [x64]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-msvc@4.54.0':
+    resolution: {integrity: sha512-hYT5d3YNdSh3mbCU1gwQyPgQd3T2ne0A3KG8KSBdav5TiBg6eInVmV+TeR5uHufiIgSFg0XsOWGW5/RhNcSvPg==}
+    cpu: [x64]
+    os: [win32]
+
+  '@types/estree@1.0.8':
+    resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
+
+  acorn-walk@8.3.4:
+    resolution: {integrity: sha512-ueEepnujpqee2o5aIYnvHU6C0A42MNdsIDeqy5BydrkuC5R1ZuUFnm27EeFJGoEHJQgn3uleRvmTXaJgfXbt4g==}
+    engines: {node: '>=0.4.0'}
+
+  acorn@8.15.0:
+    resolution: {integrity: sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==}
+    engines: {node: '>=0.4.0'}
+    hasBin: true
+
+  balanced-match@1.0.2:
+    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
+
+  brace-expansion@1.1.12:
+    resolution: {integrity: sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==}
+
+  bundle-name@4.1.0:
+    resolution: {integrity: sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q==}
+    engines: {node: '>=18'}
+
+  concat-map@0.0.1:
+    resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
+
+  cross-spawn@7.0.6:
+    resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
+    engines: {node: '>= 8'}
+
+  cuint@0.2.2:
+    resolution: {integrity: sha512-d4ZVpCW31eWwCMe1YT3ur7mUDnTXbgwyzaL320DrcRT45rfjYxkt5QWLrmOJ+/UEAI2+fQgKe/fCjR8l4TpRgw==}
+
+  default-browser-id@5.0.1:
+    resolution: {integrity: sha512-x1VCxdX4t+8wVfd1so/9w+vQ4vx7lKd2Qp5tDRutErwmR85OgmfX7RlLRMWafRMY7hbEiXIbudNrjOAPa/hL8Q==}
+    engines: {node: '>=18'}
+
+  default-browser@5.4.0:
+    resolution: {integrity: sha512-XDuvSq38Hr1MdN47EDvYtx3U0MTqpCEn+F6ft8z2vYDzMrvQhVp0ui9oQdqW3MvK3vqUETglt1tVGgjLuJ5izg==}
+    engines: {node: '>=18'}
+
+  define-lazy-prop@3.0.0:
+    resolution: {integrity: sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==}
+    engines: {node: '>=12'}
+
+  dom-serializer@2.0.0:
+    resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
+
+  domelementtype@2.3.0:
+    resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
+
+  domhandler@5.0.3:
+    resolution: {integrity: sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==}
+    engines: {node: '>= 4'}
+
+  domutils@3.2.2:
+    resolution: {integrity: sha512-6kZKyUajlDuqlHKVX1w7gyslj9MPIXzIFiz/rGu35uC1wMi+kMhQwGhl4lt9unC9Vb9INnY9Z3/ZA3+FhASLaw==}
+
+  entities@4.5.0:
+    resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
+    engines: {node: '>=0.12'}
+
+  entities@6.0.1:
+    resolution: {integrity: sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==}
+    engines: {node: '>=0.12'}
+
+  esbuild@0.27.2:
+    resolution: {integrity: sha512-HyNQImnsOC7X9PMNaCIeAm4ISCQXs5a5YasTXVliKv4uuBo1dKrG0A+uQS8M5eXjVMnLg3WgXaKvprHlFJQffw==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  fdir@6.5.0:
+    resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==}
+    engines: {node: '>=12.0.0'}
+    peerDependencies:
+      picomatch: ^3 || ^4
+    peerDependenciesMeta:
+      picomatch:
+        optional: true
+
+  fsevents@2.3.3:
+    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+
+  htmlparser2@10.0.0:
+    resolution: {integrity: sha512-TwAZM+zE5Tq3lrEHvOlvwgj1XLWQCtaaibSN11Q+gGBAS7Y1uZSWwXXRe4iF6OXnaq1riyQAPFOBtYc77Mxq0g==}
+
+  import-meta-resolve@4.2.0:
+    resolution: {integrity: sha512-Iqv2fzaTQN28s/FwZAoFq0ZSs/7hMAHJVX+w8PZl3cY19Pxk6jFFalxQoIfW2826i/fDLXv8IiEZRIT0lDuWcg==}
+
+  is-docker@3.0.0:
+    resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    hasBin: true
+
+  is-inside-container@1.0.0:
+    resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==}
+    engines: {node: '>=14.16'}
+    hasBin: true
+
+  is-wsl@3.1.0:
+    resolution: {integrity: sha512-UcVfVfaK4Sc4m7X3dUSoHoozQGBEFeDC+zVo06t98xe8CzHSZZBekNXH+tu0NalHolcJ/QAGqS46Hef7QXBIMw==}
+    engines: {node: '>=16'}
+
+  isexe@2.0.0:
+    resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
+
+  magic-string@0.30.21:
+    resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
+
+  make-dir@3.1.0:
+    resolution: {integrity: sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==}
+    engines: {node: '>=8'}
+
+  mime@2.5.2:
+    resolution: {integrity: sha512-tqkh47FzKeCPD2PUiPB6pkbMzsCasjxAfC62/Wap5qrUWcb+sFasXUC5I3gYM5iBM8v/Qpn4UK0x+j0iHyFPDg==}
+    engines: {node: '>=4.0.0'}
+    hasBin: true
+
+  minimatch@3.0.8:
+    resolution: {integrity: sha512-6FsRAQsxQ61mw+qP1ZzbL9Bc78x2p5OqNgNpnoAFLTrX8n5Kxph0CsnhmKKNXTWjXqU5L0pGPR7hYk+XWZr60Q==}
+
+  mrmime@2.0.1:
+    resolution: {integrity: sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==}
+    engines: {node: '>=10'}
+
+  nanoid@3.3.11:
+    resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
+    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+    hasBin: true
+
+  open@10.2.0:
+    resolution: {integrity: sha512-YgBpdJHPyQ2UE5x+hlSXcnejzAvD0b22U2OuAP+8OnlJT+PjWPxtgmGqKKc+RgTM63U9gN0YzrYc71R2WT/hTA==}
+    engines: {node: '>=18'}
+
+  path-key@3.1.1:
+    resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
+    engines: {node: '>=8'}
+
+  picocolors@1.1.1:
+    resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
+
+  picomatch@4.0.3:
+    resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
+    engines: {node: '>=12'}
+
+  postcss-url@10.1.3:
+    resolution: {integrity: sha512-FUzyxfI5l2tKmXdYc6VTu3TWZsInayEKPbiyW+P6vmmIrrb4I6CGX0BFoewgYHLK+oIL5FECEK02REYRpBvUCw==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      postcss: ^8.0.0
+
+  postcss@8.5.6:
+    resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==}
+    engines: {node: ^10 || ^12 || >=14}
+
+  rollup@4.54.0:
+    resolution: {integrity: sha512-3nk8Y3a9Ea8szgKhinMlGMhGMw89mqule3KWczxhIzqudyHdCIOHw8WJlj/r329fACjKLEh13ZSk7oE22kyeIw==}
+    engines: {node: '>=18.0.0', npm: '>=8.0.0'}
+    hasBin: true
+
+  run-applescript@7.1.0:
+    resolution: {integrity: sha512-DPe5pVFaAsinSaV6QjQ6gdiedWDcRCbUuiQfQa2wmWV7+xC9bGulGI8+TdRmoFkAPaBXk8CrAbnlY2ISniJ47Q==}
+    engines: {node: '>=18'}
+
+  semver@6.3.1:
+    resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
+    hasBin: true
+
+  shebang-command@2.0.0:
+    resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
+    engines: {node: '>=8'}
+
+  shebang-regex@3.0.0:
+    resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
+    engines: {node: '>=8'}
+
+  source-map-js@1.2.1:
+    resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
+    engines: {node: '>=0.10.0'}
+
+  systemjs@6.15.1:
+    resolution: {integrity: sha512-Nk8c4lXvMB98MtbmjX7JwJRgJOL8fluecYCfCeYBznwmpOs8Bf15hLM6z4z71EDAhQVrQrI+wt1aLWSXZq+hXA==}
+
+  tinyglobby@0.2.15:
+    resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==}
+    engines: {node: '>=12.0.0'}
+
+  typescript@5.9.3:
+    resolution: {integrity: sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==}
+    engines: {node: '>=14.17'}
+    hasBin: true
+
+  vite-plugin-monkey@7.1.8:
+    resolution: {integrity: sha512-FGz1jlHcodt+L120UcHLiN0jXqQZdZHxLuHcGQg8Zjas6BulxLM1oiGUg3M95HbjYVFH6ygrOJoZ5YCYu1purw==}
+    peerDependencies:
+      vite: ^6.0.0 || ^7.0.0
+    peerDependenciesMeta:
+      vite:
+        optional: true
+
+  vite@7.3.0:
+    resolution: {integrity: sha512-dZwN5L1VlUBewiP6H9s2+B3e3Jg96D0vzN+Ry73sOefebhYr9f94wwkMNN/9ouoU8pV1BqA1d1zGk8928cx0rg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^20.19.0 || >=22.12.0
+      jiti: '>=1.21.0'
+      less: ^4.0.0
+      lightningcss: ^1.21.0
+      sass: ^1.70.0
+      sass-embedded: ^1.70.0
+      stylus: '>=0.54.8'
+      sugarss: ^5.0.0
+      terser: ^5.16.0
+      tsx: ^4.8.1
+      yaml: ^2.4.2
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      jiti:
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      sass-embedded:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+      tsx:
+        optional: true
+      yaml:
+        optional: true
+
+  which@2.0.2:
+    resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
+    engines: {node: '>= 8'}
+    hasBin: true
+
+  wsl-utils@0.1.0:
+    resolution: {integrity: sha512-h3Fbisa2nKGPxCpm89Hk33lBLsnaGBvctQopaBSOW/uIs6FTe1ATyAnKFJrzVs9vpGdsTe73WF3V4lIsk4Gacw==}
+    engines: {node: '>=18'}
+
+  xxhashjs@0.2.2:
+    resolution: {integrity: sha512-AkTuIuVTET12tpsVIQo+ZU6f/qDmKuRUcjaqR+OIvm+aCBsZ95i7UVY5WJ9TMsSaZ0DA2WxoZ4acu0sPH+OKAw==}
+
+snapshots:
+
+  '@esbuild/aix-ppc64@0.27.2':
+    optional: true
+
+  '@esbuild/android-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/android-arm@0.27.2':
+    optional: true
+
+  '@esbuild/android-x64@0.27.2':
+    optional: true
+
+  '@esbuild/darwin-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/darwin-x64@0.27.2':
+    optional: true
+
+  '@esbuild/freebsd-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-arm@0.27.2':
+    optional: true
+
+  '@esbuild/linux-ia32@0.27.2':
+    optional: true
+
+  '@esbuild/linux-loong64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.27.2':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.27.2':
+    optional: true
+
+  '@esbuild/linux-s390x@0.27.2':
+    optional: true
+
+  '@esbuild/linux-x64@0.27.2':
+    optional: true
+
+  '@esbuild/netbsd-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.27.2':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.27.2':
+    optional: true
+
+  '@esbuild/openharmony-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/sunos-x64@0.27.2':
+    optional: true
+
+  '@esbuild/win32-arm64@0.27.2':
+    optional: true
+
+  '@esbuild/win32-ia32@0.27.2':
+    optional: true
+
+  '@esbuild/win32-x64@0.27.2':
+    optional: true
+
+  '@jridgewell/sourcemap-codec@1.5.5': {}
+
+  '@rollup/rollup-android-arm-eabi@4.54.0':
+    optional: true
+
+  '@rollup/rollup-android-arm64@4.54.0':
+    optional: true
+
+  '@rollup/rollup-darwin-arm64@4.54.0':
+    optional: true
+
+  '@rollup/rollup-darwin-x64@4.54.0':
+    optional: true
+
+  '@rollup/rollup-freebsd-arm64@4.54.0':
+    optional: true
+
+  '@rollup/rollup-freebsd-x64@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm-musleabihf@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-gnu@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-musl@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-loong64-gnu@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-ppc64-gnu@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-gnu@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-musl@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-s390x-gnu@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-x64-gnu@4.54.0':
+    optional: true
+
+  '@rollup/rollup-linux-x64-musl@4.54.0':
+    optional: true
+
+  '@rollup/rollup-openharmony-arm64@4.54.0':
+    optional: true
+
+  '@rollup/rollup-win32-arm64-msvc@4.54.0':
+    optional: true
+
+  '@rollup/rollup-win32-ia32-msvc@4.54.0':
+    optional: true
+
+  '@rollup/rollup-win32-x64-gnu@4.54.0':
+    optional: true
+
+  '@rollup/rollup-win32-x64-msvc@4.54.0':
+    optional: true
+
+  '@types/estree@1.0.8': {}
+
+  acorn-walk@8.3.4:
+    dependencies:
+      acorn: 8.15.0
+
+  acorn@8.15.0: {}
+
+  balanced-match@1.0.2: {}
+
+  brace-expansion@1.1.12:
+    dependencies:
+      balanced-match: 1.0.2
+      concat-map: 0.0.1
+
+  bundle-name@4.1.0:
+    dependencies:
+      run-applescript: 7.1.0
+
+  concat-map@0.0.1: {}
+
+  cross-spawn@7.0.6:
+    dependencies:
+      path-key: 3.1.1
+      shebang-command: 2.0.0
+      which: 2.0.2
+
+  cuint@0.2.2: {}
+
+  default-browser-id@5.0.1: {}
+
+  default-browser@5.4.0:
+    dependencies:
+      bundle-name: 4.1.0
+      default-browser-id: 5.0.1
+
+  define-lazy-prop@3.0.0: {}
+
+  dom-serializer@2.0.0:
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      entities: 4.5.0
+
+  domelementtype@2.3.0: {}
+
+  domhandler@5.0.3:
+    dependencies:
+      domelementtype: 2.3.0
+
+  domutils@3.2.2:
+    dependencies:
+      dom-serializer: 2.0.0
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+
+  entities@4.5.0: {}
+
+  entities@6.0.1: {}
+
+  esbuild@0.27.2:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.27.2
+      '@esbuild/android-arm': 0.27.2
+      '@esbuild/android-arm64': 0.27.2
+      '@esbuild/android-x64': 0.27.2
+      '@esbuild/darwin-arm64': 0.27.2
+      '@esbuild/darwin-x64': 0.27.2
+      '@esbuild/freebsd-arm64': 0.27.2
+      '@esbuild/freebsd-x64': 0.27.2
+      '@esbuild/linux-arm': 0.27.2
+      '@esbuild/linux-arm64': 0.27.2
+      '@esbuild/linux-ia32': 0.27.2
+      '@esbuild/linux-loong64': 0.27.2
+      '@esbuild/linux-mips64el': 0.27.2
+      '@esbuild/linux-ppc64': 0.27.2
+      '@esbuild/linux-riscv64': 0.27.2
+      '@esbuild/linux-s390x': 0.27.2
+      '@esbuild/linux-x64': 0.27.2
+      '@esbuild/netbsd-arm64': 0.27.2
+      '@esbuild/netbsd-x64': 0.27.2
+      '@esbuild/openbsd-arm64': 0.27.2
+      '@esbuild/openbsd-x64': 0.27.2
+      '@esbuild/openharmony-arm64': 0.27.2
+      '@esbuild/sunos-x64': 0.27.2
+      '@esbuild/win32-arm64': 0.27.2
+      '@esbuild/win32-ia32': 0.27.2
+      '@esbuild/win32-x64': 0.27.2
+
+  fdir@6.5.0(picomatch@4.0.3):
+    optionalDependencies:
+      picomatch: 4.0.3
+
+  fsevents@2.3.3:
+    optional: true
+
+  htmlparser2@10.0.0:
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 5.0.3
+      domutils: 3.2.2
+      entities: 6.0.1
+
+  import-meta-resolve@4.2.0: {}
+
+  is-docker@3.0.0: {}
+
+  is-inside-container@1.0.0:
+    dependencies:
+      is-docker: 3.0.0
+
+  is-wsl@3.1.0:
+    dependencies:
+      is-inside-container: 1.0.0
+
+  isexe@2.0.0: {}
+
+  magic-string@0.30.21:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+
+  make-dir@3.1.0:
+    dependencies:
+      semver: 6.3.1
+
+  mime@2.5.2: {}
+
+  minimatch@3.0.8:
+    dependencies:
+      brace-expansion: 1.1.12
+
+  mrmime@2.0.1: {}
+
+  nanoid@3.3.11: {}
+
+  open@10.2.0:
+    dependencies:
+      default-browser: 5.4.0
+      define-lazy-prop: 3.0.0
+      is-inside-container: 1.0.0
+      wsl-utils: 0.1.0
+
+  path-key@3.1.1: {}
+
+  picocolors@1.1.1: {}
+
+  picomatch@4.0.3: {}
+
+  postcss-url@10.1.3(postcss@8.5.6):
+    dependencies:
+      make-dir: 3.1.0
+      mime: 2.5.2
+      minimatch: 3.0.8
+      postcss: 8.5.6
+      xxhashjs: 0.2.2
+
+  postcss@8.5.6:
+    dependencies:
+      nanoid: 3.3.11
+      picocolors: 1.1.1
+      source-map-js: 1.2.1
+
+  rollup@4.54.0:
+    dependencies:
+      '@types/estree': 1.0.8
+    optionalDependencies:
+      '@rollup/rollup-android-arm-eabi': 4.54.0
+      '@rollup/rollup-android-arm64': 4.54.0
+      '@rollup/rollup-darwin-arm64': 4.54.0
+      '@rollup/rollup-darwin-x64': 4.54.0
+      '@rollup/rollup-freebsd-arm64': 4.54.0
+      '@rollup/rollup-freebsd-x64': 4.54.0
+      '@rollup/rollup-linux-arm-gnueabihf': 4.54.0
+      '@rollup/rollup-linux-arm-musleabihf': 4.54.0
+      '@rollup/rollup-linux-arm64-gnu': 4.54.0
+      '@rollup/rollup-linux-arm64-musl': 4.54.0
+      '@rollup/rollup-linux-loong64-gnu': 4.54.0
+      '@rollup/rollup-linux-ppc64-gnu': 4.54.0
+      '@rollup/rollup-linux-riscv64-gnu': 4.54.0
+      '@rollup/rollup-linux-riscv64-musl': 4.54.0
+      '@rollup/rollup-linux-s390x-gnu': 4.54.0
+      '@rollup/rollup-linux-x64-gnu': 4.54.0
+      '@rollup/rollup-linux-x64-musl': 4.54.0
+      '@rollup/rollup-openharmony-arm64': 4.54.0
+      '@rollup/rollup-win32-arm64-msvc': 4.54.0
+      '@rollup/rollup-win32-ia32-msvc': 4.54.0
+      '@rollup/rollup-win32-x64-gnu': 4.54.0
+      '@rollup/rollup-win32-x64-msvc': 4.54.0
+      fsevents: 2.3.3
+
+  run-applescript@7.1.0: {}
+
+  semver@6.3.1: {}
+
+  shebang-command@2.0.0:
+    dependencies:
+      shebang-regex: 3.0.0
+
+  shebang-regex@3.0.0: {}
+
+  source-map-js@1.2.1: {}
+
+  systemjs@6.15.1: {}
+
+  tinyglobby@0.2.15:
+    dependencies:
+      fdir: 6.5.0(picomatch@4.0.3)
+      picomatch: 4.0.3
+
+  typescript@5.9.3: {}
+
+  vite-plugin-monkey@7.1.8(postcss@8.5.6)(vite@7.3.0):
+    dependencies:
+      acorn: 8.15.0
+      acorn-walk: 8.3.4
+      cross-spawn: 7.0.6
+      htmlparser2: 10.0.0
+      import-meta-resolve: 4.2.0
+      magic-string: 0.30.21
+      mrmime: 2.0.1
+      open: 10.2.0
+      picocolors: 1.1.1
+      postcss-url: 10.1.3(postcss@8.5.6)
+      systemjs: 6.15.1
+    optionalDependencies:
+      vite: 7.3.0
+    transitivePeerDependencies:
+      - postcss
+
+  vite@7.3.0:
+    dependencies:
+      esbuild: 0.27.2
+      fdir: 6.5.0(picomatch@4.0.3)
+      picomatch: 4.0.3
+      postcss: 8.5.6
+      rollup: 4.54.0
+      tinyglobby: 0.2.15
+    optionalDependencies:
+      fsevents: 2.3.3
+
+  which@2.0.2:
+    dependencies:
+      isexe: 2.0.0
+
+  wsl-utils@0.1.0:
+    dependencies:
+      is-wsl: 3.1.0
+
+  xxhashjs@0.2.2:
+    dependencies:
+      cuint: 0.2.2
--- a/monkey/src/main.ts
+++ b/monkey/src/main.ts
@@ -0,0 +1,146 @@
+import './style.css'
+
+// Get current video URL
+// yt-dlp can handle all URLs directly, so we just return the current URL
+function getVideoUrl(): string | null {
+  return window.location.href
+}
+
+// Temporarily hide button
+function hideButtonTemporarily(): void {
+  const container = document.getElementById('vidbee-download-btn')
+  if (container) {
+    container.classList.add('vidbee-hidden')
+    // Auto restore after 5 seconds
+    setTimeout(() => {
+      if (container) {
+        container.classList.remove('vidbee-hidden')
+      }
+    }, 5000)
+  }
+}
+
+// Create VidBee download button
+function createVidBeeButton(): void {
+  // Check if button already exists
+  if (document.getElementById('vidbee-download-btn')) {
+    return
+  }
+
+  const videoUrl = getVideoUrl()
+  if (!videoUrl) {
+    return
+  }
+
+  // Create button container
+  const container = document.createElement('div')
+  container.id = 'vidbee-download-btn'
+  container.className = 'vidbee-download-container'
+
+  // Create main download button
+  const button = document.createElement('button')
+  button.className = 'vidbee-download-button'
+  button.setAttribute('aria-label', 'Download with VidBee')
+  button.innerHTML = `
+    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+      <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+      <polyline points="7 10 12 15 17 10"></polyline>
+      <line x1="12" y1="15" x2="12" y2="3"></line>
+    </svg>
+    <span class="vidbee-tooltip">Download with VidBee</span>
+  `
+
+  // Create close button
+  const closeButton = document.createElement('button')
+  closeButton.className = 'vidbee-close-button'
+  closeButton.setAttribute('aria-label', 'Hide button')
+  closeButton.innerHTML = `
+    <svg width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3">
+      <line x1="18" y1="6" x2="6" y2="18"></line>
+      <line x1="6" y1="6" x2="18" y2="18"></line>
+    </svg>
+    <span class="vidbee-tooltip">Hide</span>
+  `
+
+  // Handle close button click - temporarily hide
+  closeButton.addEventListener('click', (e) => {
+    e.stopPropagation()
+    hideButtonTemporarily()
+  })
+
+  let clickTimer: number | null = null
+  let clickCount = 0
+
+  // Handle main button click event - single click for download
+  button.addEventListener('click', () => {
+    clickCount++
+
+    if (clickCount === 1) {
+      clickTimer = window.setTimeout(() => {
+        // Single click - trigger download
+        const vidbeeUrl = `vidbee://download?url=${encodeURIComponent(videoUrl)}`
+        window.location.href = vidbeeUrl
+        clickCount = 0
+      }, 300)
+    } else if (clickCount === 2) {
+      // Double click - temporarily hide
+      if (clickTimer !== null) {
+        clearTimeout(clickTimer)
+      }
+      clickCount = 0
+      hideButtonTemporarily()
+    }
+  })
+
+  // Assemble container
+  container.appendChild(button)
+  container.appendChild(closeButton)
+
+  // Insert container directly to body (fixed position)
+  document.body.appendChild(container)
+}
+
+// Initialize when page loads
+function init(): void {
+  // Wait for page to fully load
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', createVidBeeButton)
+  } else {
+    createVidBeeButton()
+  }
+
+  // Handle SPA navigation (when navigating between videos on sites like YouTube, Bilibili, etc.)
+  let lastUrl = location.href
+  let urlCheckTimer: number | null = null
+
+  const checkUrlChange = () => {
+    const currentUrl = location.href
+    if (currentUrl !== lastUrl) {
+      lastUrl = currentUrl
+      // Remove old button and create new one
+      const oldButton = document.getElementById('vidbee-download-btn')
+      if (oldButton) {
+        oldButton.remove()
+      }
+      // Wait a bit for the page to update (different sites have different update speeds)
+      const hostname = window.location.hostname
+      const delay = hostname.includes('bilibili.com') ? 800 : 500
+      setTimeout(createVidBeeButton, delay)
+    }
+  }
+
+  // Use MutationObserver for DOM changes (works for most SPA sites)
+  new MutationObserver(() => {
+    if (urlCheckTimer !== null) {
+      clearTimeout(urlCheckTimer)
+    }
+    urlCheckTimer = window.setTimeout(checkUrlChange, 100)
+  }).observe(document.body, { childList: true, subtree: true })
+
+  // Also listen to popstate for browser navigation
+  window.addEventListener('popstate', () => {
+    setTimeout(checkUrlChange, 300)
+  })
+}
+
+init()
--- a/monkey/src/style.css
+++ b/monkey/src/style.css
@@ -0,0 +1,169 @@
+/* VidBee Download Button Container */
+.vidbee-download-container {
+  position: fixed;
+  bottom: 16px;
+  right: 16px;
+  z-index: 9999;
+  transition: all 0.2s ease;
+  overflow: visible;
+}
+
+/* Hidden state */
+.vidbee-download-container.vidbee-hidden {
+  opacity: 0;
+  pointer-events: none;
+  transform: scale(0);
+}
+
+/* Main Download Button */
+.vidbee-download-button {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 36px;
+  height: 36px;
+  padding: 0;
+  background: rgba(0, 0, 0, 0.5);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  color: rgba(255, 255, 255, 0.8);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 50%;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+  cursor: pointer;
+  font-size: 0;
+  transition: all 0.2s ease;
+  opacity: 0.6;
+  overflow: visible;
+}
+
+.vidbee-download-button:hover {
+  opacity: 1;
+  background: rgba(0, 0, 0, 0.7);
+  border-color: rgba(255, 255, 255, 0.2);
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
+  transform: scale(1.1);
+}
+
+.vidbee-download-button:active {
+  transform: scale(0.95);
+}
+
+.vidbee-download-button svg {
+  flex-shrink: 0;
+  stroke: currentColor;
+  width: 16px;
+  height: 16px;
+}
+
+/* Tooltip */
+.vidbee-tooltip {
+  position: absolute;
+  right: calc(100% + 8px);
+  top: 50%;
+  padding: 6px 10px;
+  background: rgba(0, 0, 0, 0.9);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  color: white;
+  font-size: 12px;
+  font-weight: 500;
+  white-space: nowrap;
+  border-radius: 4px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.2s ease, transform 0.2s ease;
+  transform: translateY(-50%) translateX(4px);
+  z-index: 10000;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  line-height: 1;
+}
+
+.vidbee-tooltip::after {
+  content: '';
+  position: absolute;
+  left: 100%;
+  top: 50%;
+  transform: translateY(-50%);
+  border: 4px solid transparent;
+  border-left-color: rgba(0, 0, 0, 0.9);
+}
+
+.vidbee-download-button:hover .vidbee-tooltip {
+  opacity: 1;
+  transform: translateY(-50%) translateX(0);
+}
+
+/* Close Button - Hidden by default */
+.vidbee-close-button {
+  position: absolute;
+  top: -6px;
+  right: -6px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 18px;
+  height: 18px;
+  padding: 0;
+  background: rgba(255, 77, 77, 0.9);
+  backdrop-filter: blur(4px);
+  -webkit-backdrop-filter: blur(4px);
+  color: white;
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  border-radius: 50%;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+  cursor: pointer;
+  font-size: 0;
+  transition: all 0.2s ease;
+  z-index: 1;
+  opacity: 0;
+  pointer-events: none;
+  overflow: visible;
+}
+
+/* Show close button on container hover */
+.vidbee-download-container:hover .vidbee-close-button {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.vidbee-close-button:hover {
+  background: rgba(255, 77, 77, 1);
+  transform: scale(1.15);
+  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.4);
+}
+
+.vidbee-close-button:active {
+  transform: scale(0.9);
+}
+
+.vidbee-close-button svg {
+  flex-shrink: 0;
+  stroke: currentColor;
+  width: 10px;
+  height: 10px;
+}
+
+/* Close button tooltip positioning */
+.vidbee-close-button .vidbee-tooltip {
+  right: calc(100% + 6px);
+  top: 50%;
+  left: auto;
+  transform: translateY(-50%) translateX(4px);
+}
+
+.vidbee-close-button .vidbee-tooltip::after {
+  left: 100%;
+  top: 50%;
+  right: auto;
+  transform: translateY(-50%);
+  border-left-color: rgba(0, 0, 0, 0.9);
+  border-top-color: transparent;
+}
+
+.vidbee-download-container:hover .vidbee-close-button:hover .vidbee-tooltip {
+  opacity: 1;
+  transform: translateY(-50%) translateX(0);
+}
--- a/monkey/src/vite-env.d.ts
+++ b/monkey/src/vite-env.d.ts
@@ -0,0 +1,4 @@
+/// <reference types="vite/client" />
+/// <reference types="vite-plugin-monkey/client" />
+//// <reference types="vite-plugin-monkey/global" />
+/// <reference types="vite-plugin-monkey/style" />
--- a/monkey/tsconfig.json
+++ b/monkey/tsconfig.json
@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}
--- a/monkey/tsconfig.node.json
+++ b/monkey/tsconfig.node.json
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "noEmit": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["vite.config.ts"]
+}
--- a/monkey/vite.config.ts
+++ b/monkey/vite.config.ts
@@ -0,0 +1,67 @@
+import { defineConfig } from 'vite'
+import monkey from 'vite-plugin-monkey'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [
+    monkey({
+      entry: 'src/main.ts',
+      userscript: {
+        icon: 'https://vidbee.org/favicon.svg',
+        namespace: 'vidbee',
+        match: [
+          // YouTube
+          'https://www.youtube.com/*',
+          'https://youtube.com/*',
+          'https://music.youtube.com/*',
+          // Bilibili (哔哩哔哩)
+          'https://www.bilibili.com/*',
+          'https://bilibili.com/*',
+          // TikTok
+          'https://www.tiktok.com/*',
+          'https://tiktok.com/*',
+          // Vimeo
+          'https://vimeo.com/*',
+          'https://www.vimeo.com/*',
+          // Dailymotion
+          'https://www.dailymotion.com/*',
+          'https://dailymotion.com/*',
+          // Twitch
+          'https://www.twitch.tv/*',
+          'https://twitch.tv/*',
+          // Twitter/X
+          'https://twitter.com/*',
+          'https://www.twitter.com/*',
+          'https://x.com/*',
+          'https://www.x.com/*',
+          // Instagram
+          'https://www.instagram.com/*',
+          'https://instagram.com/*',
+          // Facebook
+          'https://www.facebook.com/*',
+          'https://facebook.com/*',
+          'https://fb.com/*',
+          'https://www.fb.com/*',
+          // Reddit
+          'https://www.reddit.com/*',
+          'https://reddit.com/*',
+          // SoundCloud
+          'https://soundcloud.com/*',
+          'https://www.soundcloud.com/*',
+          // NicoNico
+          'https://www.nicovideo.jp/*',
+          'https://nicovideo.jp/*',
+          // Kick
+          'https://kick.com/*',
+          'https://www.kick.com/*',
+          // Bandcamp
+          'https://bandcamp.com/*',
+          'https://*.bandcamp.com/*',
+          // Mixcloud
+          'https://www.mixcloud.com/*',
+          'https://mixcloud.com/*'
+        ]
+      }
+    })
+  ]
+})
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "vidbee",
-  "version": "0.3.4",
+  "version": "1.1.8",
  "description": "A modern Electron application for downloading videos and audios",
  "main": "./out/main/index.js",
  "author": "VidBee",
@@ -15,11 +15,12 @@
    "build": "electron-vite build",
    "setup": "node scripts/setup-dev-binaries.js",
    "postinstall": "node scripts/setup-dev-binaries.js && electron-builder install-app-deps",
-    "build:unpack": "pnpm run build && electron-builder --dir",
-    "build:win": "node scripts/check-ytdlp.js win && pnpm run build && electron-builder --win",
-    "build:mac": "node scripts/check-ytdlp.js mac && pnpm run build && electron-builder --mac --x64 --arm64",
-    "build:linux": "node scripts/check-ytdlp.js linux && pnpm run build && electron-builder --linux",
-    "release": "git checkout main && git pull && pnpm run check && bumpp"
+    "build:unpack": "pnpm run setup && pnpm run build && electron-builder --dir",
+    "build:win": "pnpm run setup && node scripts/check-ytdlp.js win && pnpm run build && electron-builder --win",
+    "build:mac": "pnpm run setup && node scripts/check-ytdlp.js mac && pnpm run build && electron-builder --mac --x64 --arm64",
+    "build:linux": "pnpm run setup && node scripts/check-ytdlp.js linux && pnpm run build && electron-builder --linux",
+    "release": "git checkout main && git pull && pnpm run check && bumpp",
+    "db:generate": "drizzle-kit generate"
  },
  "dependencies": {
    "@electron-toolkit/preload": "^3.0.2",
@@ -27,9 +28,12 @@
    "@hookform/resolvers": "^5.2.2",
    "@radix-ui/react-accordion": "^1.2.12",
    "@radix-ui/react-checkbox": "^1.3.3",
+    "@radix-ui/react-context-menu": "^2.2.16",
    "@radix-ui/react-dialog": "^1.1.15",
    "@radix-ui/react-dropdown-menu": "^2.1.16",
+    "@radix-ui/react-hover-card": "^1.1.15",
    "@radix-ui/react-label": "^2.1.7",
+    "@radix-ui/react-popover": "^1.1.15",
    "@radix-ui/react-progress": "^1.1.7",
    "@radix-ui/react-scroll-area": "^1.2.10",
    "@radix-ui/react-select": "^2.2.6",
@@ -41,9 +45,12 @@
    "@svgr/core": "^8.1.0",
    "@svgr/plugin-jsx": "^8.1.0",
    "@tailwindcss/vite": "^4.1.13",
+    "better-sqlite3": "^12.4.1",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
+    "cmdk": "^1.1.1",
    "dayjs": "^1.11.18",
+    "drizzle-orm": "^0.44.7",
    "electron-ipc-decorator": "^0.2.0",
    "electron-log": "^5.4.3",
    "electron-store": "^11.0.2",
@@ -56,9 +63,11 @@
    "react-hook-form": "^7.63.0",
    "react-i18next": "^16.0.0",
    "react-router": "^7.9.4",
+    "rss-parser": "^3.13.0",
    "sonner": "^2.0.7",
    "tailwind-merge": "^3.3.1",
    "tailwindcss": "^4.1.13",
+    "tw-animate-css": "^1.4.0",
    "yt-dlp-wrap-plus": "^2.3.20",
    "zod": "^4.1.11"
  },
@@ -71,6 +80,7 @@
    "@types/react-dom": "^19.1.9",
    "@vitejs/plugin-react": "^5.0.3",
    "bumpp": "^10.3.1",
+    "drizzle-kit": "^0.31.7",
    "electron": "^38.1.2",
    "electron-builder": "^25.1.8",
    "electron-vite": "^4.0.1",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/resources/.gitignore
+++ b/resources/.gitignore
@@ -6,6 +6,8 @@ ffmpeg.exe
 ffmpeg_macos
 ffmpeg_linux
 ffmpeg
+deno.exe
+deno

 # But keep the README
 !README.md
--- a/resources/README.md
+++ b/resources/README.md
@@ -69,3 +69,23 @@ ffmpeg is required for merging audio/video streams and audio extraction. Bundle
 - Bundled binaries are required for Windows builds. On macOS/Linux the app can also use ffmpeg/yt-dlp from the system PATH.
 - You can override the lookup paths via the `YTDLP_PATH` or `FFMPEG_PATH` environment variables if you prefer custom locations.
 - File sizes: ~10-15 MB per yt-dlp binary, ~40-80 MB per ffmpeg binary
+
+## JS Runtime (Deno)
+
+yt-dlp uses an external JS runtime (Deno by default) for some extractors. Bundle a Deno binary so the app can run without system dependencies.
+
+### Required Files
+
+1. **Windows**: `deno.exe`
+2. **macOS**: `deno`
+3. **Linux**: `deno`
+
+### How to Download
+
+- Visit: <https://github.com/denoland/deno/releases/latest>
+- Download the matching platform archive and extract the `deno` (or `deno.exe`) binary into `resources/`.
+- On macOS/Linux ensure the file is executable: `chmod +x resources/deno`
+
+### Note
+
+- You can override the runtime path via `YTDLP_JS_RUNTIME_PATH` if needed.
--- a/resources/drizzle/0000_swift_aaron_stack.sql
+++ b/resources/drizzle/0000_swift_aaron_stack.sql
@@ -0,0 +1,66 @@
+CREATE TABLE `download_history` (
+	`id` text PRIMARY KEY NOT NULL,
+	`url` text NOT NULL,
+	`title` text NOT NULL,
+	`thumbnail` text,
+	`type` text NOT NULL,
+	`status` text NOT NULL,
+	`download_path` text,
+	`saved_file_name` text,
+	`file_size` integer,
+	`duration` integer,
+	`downloaded_at` integer NOT NULL,
+	`completed_at` integer,
+	`sort_key` integer NOT NULL,
+	`error` text,
+	`description` text,
+	`channel` text,
+	`uploader` text,
+	`view_count` integer,
+	`tags` text,
+	`origin` text,
+	`subscription_id` text,
+	`selected_format` text,
+	`playlist_id` text,
+	`playlist_title` text,
+	`playlist_index` integer,
+	`playlist_size` integer
+);
+--> statement-breakpoint
+CREATE TABLE `subscription_items` (
+	`subscription_id` text NOT NULL,
+	`item_id` text NOT NULL,
+	`title` text NOT NULL,
+	`url` text NOT NULL,
+	`published_at` integer NOT NULL,
+	`thumbnail` text,
+	`added` integer NOT NULL,
+	`download_id` text,
+	`created_at` integer NOT NULL,
+	`updated_at` integer NOT NULL,
+	PRIMARY KEY(`subscription_id`, `item_id`)
+);
+--> statement-breakpoint
+CREATE INDEX `subscription_items_subscription_idx` ON `subscription_items` (`subscription_id`);--> statement-breakpoint
+CREATE TABLE `subscriptions` (
+	`id` text PRIMARY KEY NOT NULL,
+	`title` text NOT NULL,
+	`source_url` text NOT NULL,
+	`feed_url` text NOT NULL,
+	`platform` text NOT NULL,
+	`keywords` text NOT NULL,
+	`tags` text NOT NULL,
+	`only_latest` integer NOT NULL,
+	`enabled` integer NOT NULL,
+	`cover_url` text,
+	`latest_video_title` text,
+	`latest_video_published_at` integer,
+	`last_checked_at` integer,
+	`last_success_at` integer,
+	`status` text NOT NULL,
+	`last_error` text,
+	`created_at` integer NOT NULL,
+	`updated_at` integer NOT NULL,
+	`download_directory` text,
+	`naming_template` text
+);
--- a/resources/drizzle/meta/0000_snapshot.json
+++ b/resources/drizzle/meta/0000_snapshot.json
@@ -0,0 +1,451 @@
+{
+  "version": "6",
+  "dialect": "sqlite",
+  "id": "91501763-7554-435d-91d8-382c52ee65e4",
+  "prevId": "00000000-0000-0000-0000-000000000000",
+  "tables": {
+    "download_history": {
+      "name": "download_history",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "url": {
+          "name": "url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "title": {
+          "name": "title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "thumbnail": {
+          "name": "thumbnail",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "type": {
+          "name": "type",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "status": {
+          "name": "status",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "download_path": {
+          "name": "download_path",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "saved_file_name": {
+          "name": "saved_file_name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "file_size": {
+          "name": "file_size",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "duration": {
+          "name": "duration",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "downloaded_at": {
+          "name": "downloaded_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "completed_at": {
+          "name": "completed_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "sort_key": {
+          "name": "sort_key",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "error": {
+          "name": "error",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "channel": {
+          "name": "channel",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "uploader": {
+          "name": "uploader",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "view_count": {
+          "name": "view_count",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "tags": {
+          "name": "tags",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "origin": {
+          "name": "origin",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "subscription_id": {
+          "name": "subscription_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "selected_format": {
+          "name": "selected_format",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "playlist_id": {
+          "name": "playlist_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "playlist_title": {
+          "name": "playlist_title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "playlist_index": {
+          "name": "playlist_index",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "playlist_size": {
+          "name": "playlist_size",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "subscription_items": {
+      "name": "subscription_items",
+      "columns": {
+        "subscription_id": {
+          "name": "subscription_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "item_id": {
+          "name": "item_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "title": {
+          "name": "title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "url": {
+          "name": "url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "published_at": {
+          "name": "published_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "thumbnail": {
+          "name": "thumbnail",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "added": {
+          "name": "added",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "download_id": {
+          "name": "download_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        }
+      },
+      "indexes": {
+        "subscription_items_subscription_idx": {
+          "name": "subscription_items_subscription_idx",
+          "columns": ["subscription_id"],
+          "isUnique": false
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {
+        "subscription_items_pk": {
+          "columns": ["subscription_id", "item_id"],
+          "name": "subscription_items_pk"
+        }
+      },
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    },
+    "subscriptions": {
+      "name": "subscriptions",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "title": {
+          "name": "title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "source_url": {
+          "name": "source_url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "feed_url": {
+          "name": "feed_url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "platform": {
+          "name": "platform",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "keywords": {
+          "name": "keywords",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "tags": {
+          "name": "tags",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "only_latest": {
+          "name": "only_latest",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "enabled": {
+          "name": "enabled",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "cover_url": {
+          "name": "cover_url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "latest_video_title": {
+          "name": "latest_video_title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "latest_video_published_at": {
+          "name": "latest_video_published_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_checked_at": {
+          "name": "last_checked_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "last_success_at": {
+          "name": "last_success_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "status": {
+          "name": "status",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "last_error": {
+          "name": "last_error",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "autoincrement": false
+        },
+        "download_directory": {
+          "name": "download_directory",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        },
+        "naming_template": {
+          "name": "naming_template",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false,
+          "autoincrement": false
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "checkConstraints": {}
+    }
+  },
+  "views": {},
+  "enums": {},
+  "_meta": {
+    "schemas": {},
+    "tables": {},
+    "columns": {}
+  },
+  "internal": {
+    "indexes": {}
+  }
+}
--- a/resources/drizzle/meta/_journal.json
+++ b/resources/drizzle/meta/_journal.json
@@ -0,0 +1,13 @@
+{
+  "version": "7",
+  "dialect": "sqlite",
+  "entries": [
+    {
+      "idx": 0,
+      "version": "6",
+      "when": 1763176841336,
+      "tag": "0000_swift_aaron_stack",
+      "breakpoints": true
+    }
+  ]
+}
--- a/screenshots/browser-script.png
+++ b/screenshots/browser-script.png
--- a/scripts/check-ytdlp.js
+++ b/scripts/check-ytdlp.js
@@ -44,6 +44,17 @@ const binaries = [
      linux: 'https://ffmpeg.org/download.html',
      mac: 'https://github.com/eko5624/mpv-mac/releases/latest'
    }
+  },
+  {
+    label: 'deno',
+    filenameMap: {
+      win: 'deno.exe',
+      mac: 'deno',
+      linux: 'deno'
+    },
+    help: {
+      default: 'https://github.com/denoland/deno/releases/latest'
+    }
  }
 ]

--- a/scripts/setup-dev-binaries.js
+++ b/scripts/setup-dev-binaries.js
@@ -8,13 +8,16 @@
 const fs = require('node:fs')
 const path = require('node:path')
 const os = require('node:os')
-const { execSync } = require('node:child_process')
+const { execSync, spawnSync } = require('node:child_process')
 const https = require('node:https')
 const http = require('node:http')

 // Configuration
 const RESOURCES_DIR = path.join(__dirname, '..', 'resources')
 const YTDLP_BASE_URL = 'https://github.com/yt-dlp/yt-dlp/releases/latest/download'
+const DENO_BASE_URL = 'https://github.com/denoland/deno/releases/latest/download'
+const GITHUB_TOKEN =
+  process.env.GITHUB_TOKEN || process.env.GH_TOKEN || process.env.GITHUB_API_TOKEN

 // Platform configuration
 const PLATFORM_CONFIG = {
@@ -27,7 +30,12 @@ const PLATFORM_CONFIG = {
      url: 'https://github.com/yt-dlp/FFmpeg-Builds/releases/latest/download/ffmpeg-master-latest-win64-gpl.zip',
      innerPath: 'ffmpeg-master-latest-win64-gpl/bin/ffmpeg.exe',
      output: 'ffmpeg.exe',
-      extract: 'unzip'
+      extract: 'unzip',
+      release: {
+        repos: ['yt-dlp/FFmpeg-Builds', 'BtbN/FFmpeg-Builds'],
+        assetPattern: /ffmpeg-master-latest-win64-gpl\.zip$/i,
+        binaryName: 'ffmpeg.exe'
+      }
    }
  },
  darwin: {
@@ -41,13 +49,21 @@ const PLATFORM_CONFIG = {
        url: 'https://github.com/eko5624/mpv-mac/releases/download/2025-10-25/ffmpeg-arm64-defd5f3f64.zip',
        innerPath: 'ffmpeg/ffmpeg',
        output: 'ffmpeg_macos',
-        extract: 'unzip'
+        extract: 'unzip',
+        release: {
+          repo: 'eko5624/mpv-mac',
+          assetPattern: /ffmpeg-arm64.*\.zip$/i
+        }
      },
      x64: {
        url: 'https://github.com/eko5624/mpv-mac/releases/download/2025-10-25/ffmpeg-x86_64-defd5f3f64.zip',
        innerPath: 'ffmpeg/ffmpeg',
        output: 'ffmpeg_macos',
-        extract: 'unzip'
+        extract: 'unzip',
+        release: {
+          repo: 'eko5624/mpv-mac',
+          assetPattern: /ffmpeg-x86_64.*\.zip$/i
+        }
      }
    }
  },
@@ -60,7 +76,12 @@ const PLATFORM_CONFIG = {
      url: 'https://github.com/yt-dlp/FFmpeg-Builds/releases/latest/download/ffmpeg-master-latest-linux64-gpl.tar.xz',
      innerPath: 'ffmpeg-master-latest-linux64-gpl/bin/ffmpeg',
      output: 'ffmpeg_linux',
-      extract: 'tar'
+      extract: 'tar',
+      release: {
+        repos: ['yt-dlp/FFmpeg-Builds', 'BtbN/FFmpeg-Builds'],
+        assetPattern: /ffmpeg-master-latest-linux64-gpl\.tar\.xz$/i,
+        binaryName: 'ffmpeg'
+      }
    }
  }
 }
@@ -83,40 +104,180 @@ function ensureDir(dir) {
  }
 }

+function safeUnlink(filePath) {
+  if (fs.existsSync(filePath)) {
+    fs.unlinkSync(filePath)
+  }
+}
+
+function getDownloadHeaders(url) {
+  const headers = {
+    'User-Agent': 'vidbee-setup',
+    Accept: '*/*'
+  }
+  if (GITHUB_TOKEN && /github\.com|githubusercontent\.com/.test(url)) {
+    headers.Authorization = `Bearer ${GITHUB_TOKEN}`
+  }
+  return headers
+}
+
 function downloadFile(url, dest) {
  return new Promise((resolve, reject) => {
    const protocol = url.startsWith('https') ? https : http
    const file = fs.createWriteStream(dest)
+    let downloadedBytes = 0
+
+    const request = protocol.get(url, { headers: getDownloadHeaders(url) }, (response) => {
+      if (response.statusCode === 302 || response.statusCode === 301) {
+        // Handle redirect
+        file.close()
+        safeUnlink(dest)
+        const redirectUrl = response.headers.location
+        if (!redirectUrl) {
+          return reject(new Error(`Redirect without location for ${url}`))
+        }
+        log(`Redirected to ${redirectUrl}`, 'info')
+        return downloadFile(redirectUrl, dest).then(resolve).catch(reject)
+      }
+
+      const contentLength = response.headers['content-length']
+      if (response.statusCode !== 200) {
+        file.close()
+        safeUnlink(dest)
+        return reject(
+          new Error(
+            `Failed to download ${url}: ${response.statusCode} (length: ${contentLength || 'unknown'})`
+          )
+        )
+      }
+
+      response.on('data', (chunk) => {
+        downloadedBytes += chunk.length
+      })
+
+      response.pipe(file)
+      file.on('finish', () => {
+        file.close()
+        log(
+          `Downloaded ${formatBytes(downloadedBytes)} from ${url}`,
+          downloadedBytes ? 'success' : 'warn'
+        )
+        resolve()
+      })
+    })
+
+    request.setTimeout(30000, () => {
+      request.destroy(new Error('Download timeout'))
+    })
+
+    request.on('error', (err) => {
+      file.close()
+      safeUnlink(dest)
+      log(`Download error for ${url}: ${err.message}`, 'error')
+      reject(err)
+    })
+  })
+}
+
+async function downloadFileWithRetry(url, dest, retries = 3, delayMs = 2000) {
+  let lastError
+  for (let attempt = 1; attempt <= retries; attempt += 1) {
+    try {
+      log(`Downloading ${url} (attempt ${attempt}/${retries})...`, 'download')
+      await downloadFile(url, dest)
+      return
+    } catch (error) {
+      lastError = error
+      safeUnlink(dest)
+      if (attempt < retries) {
+        const backoff = delayMs * attempt
+        log(`Download failed for ${url} (attempt ${attempt}/${retries}): ${error.message}`, 'warn')
+        await new Promise((resolve) => setTimeout(resolve, backoff))
+      }
+    }
+  }
+  throw lastError
+}
+
+function fetchJson(url) {
+  return new Promise((resolve, reject) => {
+    const protocol = url.startsWith('https') ? https : http
+    const headers = {
+      'User-Agent': 'vidbee-setup',
+      Accept: 'application/vnd.github+json'
+    }
+    if (GITHUB_TOKEN) {
+      headers.Authorization = `Bearer ${GITHUB_TOKEN}`
+    }

    protocol
-      .get(url, (response) => {
+      .get(url, { headers }, (response) => {
        if (response.statusCode === 302 || response.statusCode === 301) {
-          // Handle redirect
-          file.close()
-          fs.unlinkSync(dest)
-          return downloadFile(response.headers.location, dest).then(resolve).catch(reject)
+          return fetchJson(response.headers.location).then(resolve).catch(reject)
        }
-
        if (response.statusCode !== 200) {
-          file.close()
-          fs.unlinkSync(dest)
-          return reject(new Error(`Failed to download: ${response.statusCode}`))
+          return reject(new Error(`Failed to fetch ${url}: ${response.statusCode}`))
        }

-        response.pipe(file)
-        file.on('finish', () => {
-          file.close()
-          resolve()
+        let body = ''
+        response.on('data', (chunk) => {
+          body += chunk
+        })
+        response.on('end', () => {
+          try {
+            resolve(JSON.parse(body))
+          } catch (error) {
+            reject(new Error(`Failed to parse JSON from ${url}: ${error.message}`))
+          }
        })
      })
      .on('error', (err) => {
-        file.close()
-        fs.unlinkSync(dest)
        reject(err)
      })
  })
 }

+function inferFfmpegInnerPath(assetName, binaryName) {
+  if (!assetName) {
+    return null
+  }
+  const match = assetName.match(/^(.*)\.(tar\.xz|zip)$/i)
+  if (!match) {
+    return null
+  }
+  return `${match[1]}/bin/${binaryName}`
+}
+
+async function resolveReleaseAsset(release) {
+  if (!release) {
+    return null
+  }
+  const repoCandidates = release.repos ?? (release.repo ? [release.repo] : [])
+  if (repoCandidates.length === 0) {
+    return null
+  }
+
+  let lastError
+  for (const repo of repoCandidates) {
+    try {
+      const data = await fetchJson(`https://api.github.com/repos/${repo}/releases/latest`)
+      const assets = Array.isArray(data.assets) ? data.assets : []
+      const match = assets.find((asset) => asset?.name && release.assetPattern.test(asset.name))
+      if (match?.browser_download_url) {
+        return { name: match.name, url: match.browser_download_url }
+      }
+      lastError = new Error(`No matching assets found in ${repo}`)
+    } catch (error) {
+      lastError = error
+    }
+  }
+
+  if (lastError) {
+    throw lastError
+  }
+  return null
+}
+
 function extractZip(zipPath, extractDir) {
  const platform = os.platform()
  ensureDir(extractDir)
@@ -158,12 +319,73 @@ function fileExists(filePath) {
  return fs.existsSync(filePath)
 }

+function formatBytes(bytes) {
+  if (!bytes || bytes <= 0) {
+    return 'unknown size'
+  }
+  if (bytes >= 1024 * 1024) {
+    return `${Math.round(bytes / (1024 * 1024))} MB`
+  }
+  return `${Math.round(bytes / 1024)} KB`
+}
+
+function checkBinary(filePath, args, label) {
+  const result = spawnSync(filePath, args, {
+    encoding: 'utf8',
+    timeout: 8000,
+    windowsHide: true
+  })
+
+  if (result.error) {
+    return { ok: false, message: result.error.message }
+  }
+
+  if (result.status !== 0) {
+    const output = `${result.stdout || ''}\n${result.stderr || ''}`.trim()
+    return { ok: false, message: output || `exit code ${result.status}` }
+  }
+
+  const output = `${result.stdout || ''}\n${result.stderr || ''}`.trim()
+  const firstLine = output.split(/\r?\n/).find((line) => line.trim())
+  return { ok: true, message: firstLine ? firstLine.trim() : `${label} version check ok` }
+}
+
+function getDenoAssetName(platform, arch) {
+  if (platform === 'win32') {
+    if (arch === 'arm64') {
+      return 'deno-aarch64-pc-windows-msvc.zip'
+    }
+    return 'deno-x86_64-pc-windows-msvc.zip'
+  }
+  if (platform === 'darwin') {
+    if (arch === 'arm64') {
+      return 'deno-aarch64-apple-darwin.zip'
+    }
+    return 'deno-x86_64-apple-darwin.zip'
+  }
+  if (platform === 'linux') {
+    if (arch === 'arm64') {
+      return 'deno-aarch64-unknown-linux-gnu.zip'
+    }
+    return 'deno-x86_64-unknown-linux-gnu.zip'
+  }
+  return null
+}
+
+function getDenoOutputName(platform) {
+  return platform === 'win32' ? 'deno.exe' : 'deno'
+}
+
 // Main download functions
 async function downloadYtDlp(config) {
  const { asset, output } = config.ytdlp
  const outputPath = path.join(RESOURCES_DIR, output)

  if (fileExists(outputPath)) {
+    const validation = checkBinary(outputPath, ['--version'], 'yt-dlp')
+    if (!validation.ok) {
+      log(`Existing ${output} failed version check: ${validation.message}`, 'warn')
+    }
    log(`${output} already exists, skipping download`, 'info')
    return
  }
@@ -173,9 +395,14 @@ async function downloadYtDlp(config) {
  const tempPath = path.join(RESOURCES_DIR, `.${asset}.tmp`)

  try {
-    await downloadFile(url, tempPath)
+    await downloadFileWithRetry(url, tempPath)
    fs.renameSync(tempPath, outputPath)
    setExecutable(outputPath)
+    const validation = checkBinary(outputPath, ['--version'], 'yt-dlp')
+    if (!validation.ok) {
+      safeUnlink(outputPath)
+      throw new Error(`Downloaded ${output} failed version check: ${validation.message}`)
+    }
    log(`Downloaded ${output} successfully`, 'success')
  } catch (error) {
    if (fs.existsSync(tempPath)) {
@@ -186,10 +413,14 @@ async function downloadYtDlp(config) {
 }

 async function downloadFfmpegWindows(config) {
-  const { url, innerPath, output } = config.ffmpeg
+  const { url: fallbackUrl, innerPath: fallbackInnerPath, output, release } = config.ffmpeg
  const outputPath = path.join(RESOURCES_DIR, output)

  if (fileExists(outputPath)) {
+    const validation = checkBinary(outputPath, ['-version'], 'ffmpeg')
+    if (!validation.ok) {
+      log(`Existing ${output} failed version check: ${validation.message}`, 'warn')
+    }
    log(`${output} already exists, skipping download`, 'info')
    return
  }
@@ -197,9 +428,26 @@ async function downloadFfmpegWindows(config) {
  log(`Downloading ffmpeg for Windows...`, 'download')
  const tempZip = path.join(RESOURCES_DIR, 'ffmpeg-temp.zip')
  const extractDir = path.join(RESOURCES_DIR, 'ffmpeg-temp')
+  let downloadUrl = fallbackUrl
+  let innerPath = fallbackInnerPath
+
+  if (release) {
+    try {
+      const resolved = await resolveReleaseAsset(release)
+      if (resolved) {
+        downloadUrl = resolved.url
+        const inferred = inferFfmpegInnerPath(resolved.name, release.binaryName ?? 'ffmpeg.exe')
+        if (inferred) {
+          innerPath = inferred
+        }
+      }
+    } catch (error) {
+      log(`Failed to resolve latest ffmpeg asset: ${error.message}`, 'warn')
+    }
+  }

  try {
-    await downloadFile(url, tempZip)
+    await downloadFileWithRetry(downloadUrl, tempZip)
    log('Extracting ffmpeg...', 'info')
    extractZip(tempZip, extractDir)

@@ -209,6 +457,11 @@ async function downloadFfmpegWindows(config) {
    }

    fs.copyFileSync(sourcePath, outputPath)
+    const validation = checkBinary(outputPath, ['-version'], 'ffmpeg')
+    if (!validation.ok) {
+      safeUnlink(outputPath)
+      throw new Error(`Downloaded ${output} failed version check: ${validation.message}`)
+    }
    log(`Downloaded ${output} successfully`, 'success')

    // Cleanup
@@ -229,10 +482,14 @@ async function downloadFfmpegMac(config) {
    throw new Error(`Unsupported architecture: ${arch}`)
  }

-  const { url, innerPath, output } = ffmpegConfig
+  const { url: fallbackUrl, innerPath, output, release } = ffmpegConfig
  const outputPath = path.join(RESOURCES_DIR, output)

  if (fileExists(outputPath)) {
+    const validation = checkBinary(outputPath, ['-version'], 'ffmpeg')
+    if (!validation.ok) {
+      log(`Existing ${output} failed version check: ${validation.message}`, 'warn')
+    }
    log(`${output} already exists, skipping download`, 'info')
    return
  }
@@ -240,9 +497,21 @@ async function downloadFfmpegMac(config) {
  log(`Downloading ffmpeg for macOS (${arch})...`, 'download')
  const tempZip = path.join(RESOURCES_DIR, 'ffmpeg-temp.zip')
  const extractDir = path.join(RESOURCES_DIR, 'ffmpeg-temp')
+  let downloadUrl = fallbackUrl
+
+  if (release) {
+    try {
+      const resolved = await resolveReleaseAsset(release)
+      if (resolved) {
+        downloadUrl = resolved.url
+      }
+    } catch (error) {
+      log(`Failed to resolve latest ffmpeg asset: ${error.message}`, 'warn')
+    }
+  }

  try {
-    await downloadFile(url, tempZip)
+    await downloadFileWithRetry(downloadUrl, tempZip)
    log('Extracting ffmpeg...', 'info')
    extractZip(tempZip, extractDir)

@@ -253,6 +522,11 @@ async function downloadFfmpegMac(config) {

    fs.copyFileSync(sourcePath, outputPath)
    setExecutable(outputPath)
+    const validation = checkBinary(outputPath, ['-version'], 'ffmpeg')
+    if (!validation.ok) {
+      safeUnlink(outputPath)
+      throw new Error(`Downloaded ${output} failed version check: ${validation.message}`)
+    }
    log(`Downloaded ${output} successfully`, 'success')

    // Cleanup
@@ -266,10 +540,14 @@ async function downloadFfmpegMac(config) {
 }

 async function downloadFfmpegLinux(config) {
-  const { url, innerPath, output } = config.ffmpeg
+  const { url: fallbackUrl, innerPath: fallbackInnerPath, output, release } = config.ffmpeg
  const outputPath = path.join(RESOURCES_DIR, output)

  if (fileExists(outputPath)) {
+    const validation = checkBinary(outputPath, ['-version'], 'ffmpeg')
+    if (!validation.ok) {
+      log(`Existing ${output} failed version check: ${validation.message}`, 'warn')
+    }
    log(`${output} already exists, skipping download`, 'info')
    return
  }
@@ -277,9 +555,26 @@ async function downloadFfmpegLinux(config) {
  log(`Downloading ffmpeg for Linux...`, 'download')
  const tempTar = path.join(RESOURCES_DIR, 'ffmpeg-temp.tar.xz')
  const extractDir = path.join(RESOURCES_DIR, 'ffmpeg-temp')
+  let downloadUrl = fallbackUrl
+  let innerPath = fallbackInnerPath
+
+  if (release) {
+    try {
+      const resolved = await resolveReleaseAsset(release)
+      if (resolved) {
+        downloadUrl = resolved.url
+        const inferred = inferFfmpegInnerPath(resolved.name, release.binaryName ?? 'ffmpeg')
+        if (inferred) {
+          innerPath = inferred
+        }
+      }
+    } catch (error) {
+      log(`Failed to resolve latest ffmpeg asset: ${error.message}`, 'warn')
+    }
+  }

  try {
-    await downloadFile(url, tempTar)
+    await downloadFileWithRetry(downloadUrl, tempTar)
    log('Extracting ffmpeg...', 'info')
    extractTarXz(tempTar, extractDir)

@@ -290,6 +585,11 @@ async function downloadFfmpegLinux(config) {

    fs.copyFileSync(sourcePath, outputPath)
    setExecutable(outputPath)
+    const validation = checkBinary(outputPath, ['-version'], 'ffmpeg')
+    if (!validation.ok) {
+      safeUnlink(outputPath)
+      throw new Error(`Downloaded ${output} failed version check: ${validation.message}`)
+    }
    log(`Downloaded ${output} successfully`, 'success')

    // Cleanup
@@ -302,6 +602,61 @@ async function downloadFfmpegLinux(config) {
  }
 }

+async function downloadDenoRuntime() {
+  const platform = os.platform()
+  const arch = os.arch()
+  const assetName = getDenoAssetName(platform, arch)
+
+  if (!assetName) {
+    log(`Skipping Deno runtime: unsupported platform/arch ${platform}/${arch}`, 'warn')
+    return
+  }
+
+  const outputName = getDenoOutputName(platform)
+  const outputPath = path.join(RESOURCES_DIR, outputName)
+
+  if (fileExists(outputPath)) {
+    const validation = checkBinary(outputPath, ['--version'], 'deno')
+    if (!validation.ok) {
+      log(`Existing ${outputName} failed version check: ${validation.message}`, 'warn')
+    }
+    log(`${outputName} already exists, skipping download`, 'info')
+    return
+  }
+
+  log(`Downloading Deno runtime (${platform}/${arch})...`, 'download')
+  const tempZip = path.join(RESOURCES_DIR, 'deno-temp.zip')
+  const extractDir = path.join(RESOURCES_DIR, 'deno-temp')
+  const downloadUrl = `${DENO_BASE_URL}/${assetName}`
+
+  try {
+    await downloadFileWithRetry(downloadUrl, tempZip)
+    log('Extracting Deno runtime...', 'info')
+    extractZip(tempZip, extractDir)
+
+    const sourcePath = path.join(extractDir, outputName)
+    if (!fileExists(sourcePath)) {
+      throw new Error(`Deno binary not found at ${sourcePath}`)
+    }
+
+    fs.copyFileSync(sourcePath, outputPath)
+    setExecutable(outputPath)
+    const validation = checkBinary(outputPath, ['--version'], 'deno')
+    if (!validation.ok) {
+      safeUnlink(outputPath)
+      throw new Error(`Downloaded ${outputName} failed version check: ${validation.message}`)
+    }
+    log(`Downloaded ${outputName} successfully`, 'success')
+
+    fs.unlinkSync(tempZip)
+    fs.rmSync(extractDir, { recursive: true, force: true })
+  } catch (error) {
+    if (fs.existsSync(tempZip)) fs.unlinkSync(tempZip)
+    if (fs.existsSync(extractDir)) fs.rmSync(extractDir, { recursive: true, force: true })
+    throw error
+  }
+}
+
 // Main setup function
 async function setup() {
  const platform = os.platform()
@@ -319,6 +674,9 @@ async function setup() {
    // Download yt-dlp
    await downloadYtDlp(config)

+    // Download JS runtime (Deno)
+    await downloadDenoRuntime()
+
    // Download ffmpeg
    if (platform === 'win32') {
      await downloadFfmpegWindows(config)
--- a/src/main/config/logger-config.ts
+++ b/src/main/config/logger-config.ts
@@ -5,15 +5,6 @@ import log from 'electron-log/main'
 * Set log format, file path, transport methods, etc.
 */
 export function configureLogger() {
-  // Configure console output format - support colors and scope, time in gray
-  log.transports.console.format = '%c{h}:{i}:{s}%c [{level}]{scope} {text}'
-
-  // Enable console colors
-  log.transports.console.useStyles = true
-
-  // Configure file output format - include scope information
-  log.transports.file.format = '[{y}-{m}-{d} {h}:{i}:{s}] [{level}] {scope} {text}'
-
  // Set log levels
  // Development: show all logs
  // Production: show info level and above only
--- a/src/main/download-engine/args-builder.ts
+++ b/src/main/download-engine/args-builder.ts
@@ -1,10 +1,30 @@
 import path from 'node:path'
 import type { AppSettings, DownloadOptions } from '../../shared/types'
+import { resolvePathWithHome } from '../utils/path-helpers'
+
+export const sanitizeFilenameTemplate = (template: string): string => {
+  const trimmed = template.trim()
+  if (!trimmed) {
+    return '%(title)s via VidBee.%(ext)s'
+  }
+  const normalized = trimmed.replace(/\\/g, '/')
+  const safeParts = normalized
+    .split('/')
+    .map((part) => part.trim())
+    .filter((part) => part !== '' && part !== '.' && part !== '..')
+    .map((part) => part.replace(/[<>:"|?*]/g, '-').replace(/[. ]+$/g, ''))
+    .filter((part) => part !== '')
+  return safeParts.length === 0 ? '%(title)s via VidBee.%(ext)s' : safeParts.join('/')
+}

 export const resolveVideoFormatSelector = (options: DownloadOptions): string => {
  const format = options.format
  const audioFormat = options.audioFormat

+  if (format && audioFormat === '') {
+    return format
+  }
+
  if (format && (format.includes('/') || (audioFormat === undefined && format.includes('+')))) {
    return format
  }
@@ -14,8 +34,8 @@ export const resolveVideoFormatSelector = (options: DownloadOptions): string =>
      return 'bestvideo+none'
    }
    if (!audioFormat || audioFormat === 'best') {
-      // Use bestvideo+bestaudio to ensure video and audio are merged into a single file
-      return 'bestvideo+bestaudio'
+      // Prefer merged formats, but allow single-file "best" for sites without separate streams.
+      return 'bestvideo+bestaudio/best'
    }
    return `bestvideo+${audioFormat}`
  }
@@ -45,9 +65,10 @@ export const resolveAudioFormatSelector = (options: DownloadOptions): string =>
 export const buildDownloadArgs = (
  options: DownloadOptions,
  downloadPath: string,
-  settings: AppSettings
+  settings: AppSettings,
+  jsRuntimeArgs: string[] = []
 ): string[] => {
-  const args: string[] = ['--no-playlist', '--embed-chapters', '--no-mtime']
+  const args: string[] = ['--no-playlist', '--no-mtime']

  // Add encoding support for proper handling of non-ASCII characters
  args.push('--encoding', 'utf-8')
@@ -74,13 +95,33 @@ export const buildDownloadArgs = (
    args.push('--download-sections', `*${start}-${end || ''}`)
  }

+  const embedSubs = settings.embedSubs
+  const embedMetadata = settings.embedMetadata
+  const embedChapters = settings.embedChapters
+
  // Subtitles
-  if (options.downloadSubs) {
-    args.push('--write-subs', '--sub-langs', 'all')
+  if (options.downloadSubs || embedSubs) {
+    args.push('--sub-langs', 'all')
  }

+  if (options.downloadSubs) {
+    args.push('--write-subs')
+  }
+
+  args.push(embedSubs ? '--embed-subs' : '--no-embed-subs')
+  if (process.platform !== 'darwin') {
+    args.push(settings.embedThumbnail ? '--embed-thumbnail' : '--no-embed-thumbnail')
+  }
+  args.push(embedMetadata ? '--embed-metadata' : '--no-embed-metadata')
+  args.push(embedChapters ? '--embed-chapters' : '--no-embed-chapters')
+
  // Output path with proper encoding handling
-  const outputTemplate = path.join(downloadPath, '%(title)s.%(ext)s')
+  const baseDownloadPath = options.customDownloadPath?.trim() || downloadPath
+  const filenameTemplate = sanitizeFilenameTemplate(
+    options.customFilenameTemplate ?? '%(title)s via VidBee.%(ext)s'
+  )
+  const safeTemplate = filenameTemplate.replace(/^[\\/]+/, '')
+  const outputTemplate = path.join(baseDownloadPath, safeTemplate)
  args.push('-o', outputTemplate)

  // Add options for better filename handling
@@ -104,8 +145,13 @@ export const buildDownloadArgs = (
    args.push('--proxy', settings.proxy)
  }

-  if (settings.configPath) {
-    args.push('--config-location', settings.configPath)
+  const configPath = resolvePathWithHome(settings.configPath)
+  if (configPath) {
+    args.push('--config-location', configPath)
+  }
+
+  if (jsRuntimeArgs.length > 0) {
+    args.push(...jsRuntimeArgs)
  }

  args.push(options.url)
--- a/src/main/download-engine/format-utils.ts
+++ b/src/main/download-engine/format-utils.ts
@@ -6,7 +6,6 @@ import type {
 } from '../../shared/types'

 const qualityPresetToVideoHeight: Record<OneClickQualityPreset, number | null> = {
-  auto: null,
  best: null,
  good: 1080,
  normal: 720,
@@ -15,7 +14,6 @@ const qualityPresetToVideoHeight: Record<OneClickQualityPreset, number | null> =
 }

 const qualityPresetToAudioAbr: Record<OneClickQualityPreset, number | null> = {
-  auto: null,
  best: 320,
  good: 256,
  normal: 192,
@@ -187,7 +185,7 @@ export const resolveSelectedFormat = (
    return directMatch
  }

-  const preset = settings.oneClickQuality ?? 'auto'
+  const preset = settings.oneClickQuality ?? 'best'

  if (options.type === 'video') {
    const videoFormats = formats.filter(
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -1,6 +1,15 @@
-import { join } from 'node:path'
+import { existsSync } from 'node:fs'
+import { isAbsolute, join, relative, resolve } from 'node:path'
 import { electronApp, optimizer } from '@electron-toolkit/utils'
-import { app, BrowserWindow, type BrowserWindowConstructorOptions, shell } from 'electron'
+import { APP_PROTOCOL, APP_PROTOCOL_SCHEME } from '@shared/constants'
+import {
+  app,
+  BrowserWindow,
+  type BrowserWindowConstructorOptions,
+  ipcMain,
+  protocol,
+  shell
+} from 'electron'
 import log from 'electron-log/main'
 import { autoUpdater } from 'electron-updater'
 import appIcon from '../../build/icon.png?asset'
@@ -8,9 +17,13 @@ import { configureLogger } from './config/logger-config'
 import { services } from './ipc'
 import { downloadEngine } from './lib/download-engine'
 import { ffmpegManager } from './lib/ffmpeg-manager'
+import { subscriptionManager } from './lib/subscription-manager'
+import { subscriptionScheduler } from './lib/subscription-scheduler'
 import { ytdlpManager } from './lib/ytdlp-manager'
+import { startExtensionApiServer, stopExtensionApiServer } from './local-api'
 import { settingsManager } from './settings'
 import { createTray, destroyTray } from './tray'
+import { applyAutoLaunchSetting } from './utils/auto-launch'
 import { applyDockVisibility } from './utils/dock'

 // Initialize electron-log for main process
@@ -19,12 +32,112 @@ log.initialize()
 // Configure logger settings
 configureLogger()

+const RENDERER_DIST_PATH = join(__dirname, '../renderer')
+
+protocol.registerSchemesAsPrivileged([
+  {
+    scheme: APP_PROTOCOL,
+    privileges: {
+      secure: true,
+      standard: true,
+      supportFetchAPI: true
+    }
+  }
+])
+
 let mainWindow: BrowserWindow | null = null
 let isQuitting = false
+interface DeepLinkData {
+  url: string
+  type: 'single' | 'playlist'
+}
+const pendingDeepLinkUrls: DeepLinkData[] = []
+let isRendererReady = false
+
+const parseDownloadDeepLink = (rawUrl: string): DeepLinkData | null => {
+  try {
+    const parsed = new URL(rawUrl)
+    if (parsed.protocol !== `${APP_PROTOCOL}:`) {
+      return null
+    }
+
+    const host = parsed.hostname
+    const path = parsed.pathname.replace(/^\/+/, '')
+    const isDownloadLink = host === 'download' || path.startsWith('download')
+    if (!isDownloadLink) {
+      return null
+    }
+
+    const targetUrl = parsed.searchParams.get('url')
+    if (!targetUrl || !targetUrl.trim()) {
+      return null
+    }
+
+    const typeParam = parsed.searchParams.get('type')
+    const type = typeParam === 'playlist' ? 'playlist' : 'single'
+
+    return {
+      url: targetUrl.trim(),
+      type
+    }
+  } catch (error) {
+    log.warn('Failed to parse deep link:', error)
+    return null
+  }
+}
+
+const deliverDeepLink = (data: DeepLinkData): void => {
+  if (!mainWindow || !isRendererReady) {
+    pendingDeepLinkUrls.push(data)
+    return
+  }
+
+  if (mainWindow.isMinimized()) {
+    mainWindow.restore()
+  }
+  if (!mainWindow.isVisible()) {
+    mainWindow.show()
+  }
+  mainWindow.focus()
+  mainWindow.webContents.send('download:deeplink', data)
+}
+
+const flushPendingDeepLinks = (): void => {
+  if (!mainWindow || !isRendererReady || pendingDeepLinkUrls.length === 0) {
+    return
+  }
+
+  const pending = pendingDeepLinkUrls.splice(0, pendingDeepLinkUrls.length)
+  for (const data of pending) {
+    mainWindow.webContents.send('download:deeplink', data)
+  }
+}
+
+const handleDeepLinkUrl = (rawUrl: string): void => {
+  const data = parseDownloadDeepLink(rawUrl)
+  if (!data) {
+    log.warn('Ignored unsupported deep link:', rawUrl)
+    return
+  }
+  deliverDeepLink(data)
+}
+
+const handleDeepLinkArgv = (argv: string[]): void => {
+  for (const arg of argv) {
+    if (arg.startsWith(`${APP_PROTOCOL}://`)) {
+      handleDeepLinkUrl(arg)
+    }
+  }
+}
+
+subscriptionManager.on('subscriptions:updated', (subscriptions) => {
+  mainWindow?.webContents.send('subscriptions:updated', subscriptions)
+})

 export function createWindow(): void {
  const isMac = process.platform === 'darwin'
  const isWindows = process.platform === 'win32'
+  const shouldStartHidden = isWindows && app.getLoginItemSettings().wasOpenedAtLogin

  const windowOptions: BrowserWindowConstructorOptions = {
    width: 1200,
@@ -64,6 +177,9 @@ export function createWindow(): void {
  })

  mainWindow.on('ready-to-show', () => {
+    if (shouldStartHidden) {
+      return
+    }
    mainWindow?.show()
  })

@@ -77,13 +193,57 @@ export function createWindow(): void {
  if (process.env.ELECTRON_RENDERER_URL) {
    mainWindow.loadURL(process.env.ELECTRON_RENDERER_URL)
  } else {
-    mainWindow.loadFile(join(__dirname, '../renderer/index.html'))
+    mainWindow.loadURL(`${APP_PROTOCOL_SCHEME}renderer/index.html`)
  }

+  mainWindow.webContents.on('did-finish-load', () => {
+    mainWindow?.webContents.send('subscriptions:updated', subscriptionManager.getAll())
+    isRendererReady = true
+    flushPendingDeepLinks()
+  })
+
+  // Setup error handling for renderer process
+  setupRendererErrorHandling()
+
  // Setup download engine event forwarding to renderer
  setupDownloadEvents()
 }

+function setupRendererErrorHandling(): void {
+  if (!mainWindow) return
+
+  // Handle uncaught exceptions in renderer process
+  mainWindow.webContents.on('unresponsive', () => {
+    log.error('Renderer process became unresponsive')
+  })
+
+  mainWindow.webContents.on('responsive', () => {
+    log.info('Renderer process became responsive again')
+  })
+
+  // Listen for renderer errors via IPC
+  ipcMain.on('error:renderer', (_event, errorData) => {
+    log.error('Renderer error received:', errorData)
+
+    // Log detailed error information
+    if (errorData.error) {
+      log.error('Error name:', errorData.error.name)
+      log.error('Error message:', errorData.error.message)
+      if (errorData.error.stack) {
+        log.error('Error stack:', errorData.error.stack)
+      }
+    }
+
+    if (errorData.errorInfo?.componentStack) {
+      log.error('Component stack:', errorData.errorInfo.componentStack)
+    }
+
+    if (errorData.context) {
+      log.error('Error context:', errorData.context)
+    }
+  })
+}
+
 function setupDownloadEvents(): void {
  downloadEngine.on('download-started', (id: string) => {
    mainWindow?.webContents.send('download:started', id)
@@ -106,6 +266,66 @@ function setupDownloadEvents(): void {
  })
 }

+function sanitizeRequestPath(requestUrl: URL): string {
+  const rawPath = `${requestUrl.hostname}${decodeURIComponent(requestUrl.pathname)}`
+  const trimmedLeading = rawPath.replace(/^\/+/, '')
+  const cleaned = trimmedLeading.replace(/\/+$/, '')
+  return cleaned || 'index.html'
+}
+
+function isWithinBase(targetPath: string, basePath: string): boolean {
+  const relativePath = relative(basePath, targetPath)
+  return !relativePath.startsWith('..') && !isAbsolute(relativePath)
+}
+
+function resolveVidbeeFilePath(requestUrl: URL, userDataPath: string): string | null {
+  const sanitizedPath = sanitizeRequestPath(requestUrl)
+  const [rootSegment, ...restSegments] = sanitizedPath.split('/')
+  const rendererPath = restSegments.join('/') || 'index.html'
+
+  if (rootSegment === 'renderer') {
+    const rendererTarget = resolve(RENDERER_DIST_PATH, rendererPath)
+
+    if (isWithinBase(rendererTarget, RENDERER_DIST_PATH) && existsSync(rendererTarget)) {
+      return rendererTarget
+    }
+  }
+
+  const userDataTarget = resolve(userDataPath, sanitizedPath)
+
+  if (isWithinBase(userDataTarget, userDataPath) && existsSync(userDataTarget)) {
+    return userDataTarget
+  }
+
+  const rendererFallback = resolve(RENDERER_DIST_PATH, sanitizedPath)
+
+  if (isWithinBase(rendererFallback, RENDERER_DIST_PATH) && existsSync(rendererFallback)) {
+    return rendererFallback
+  }
+
+  return null
+}
+
+function registerVidbeeProtocol(): void {
+  try {
+    const userDataPath = app.getPath('userData')
+    protocol.registerFileProtocol(APP_PROTOCOL, (request, callback) => {
+      const requestUrl = new URL(request.url)
+      const filePath = resolveVidbeeFilePath(requestUrl, userDataPath)
+
+      if (!filePath) {
+        log.error(`File not found for ${request.url}`)
+        callback({ error: -6 })
+        return
+      }
+
+      callback(filePath)
+    })
+  } catch (error) {
+    log.error(`Failed to register ${APP_PROTOCOL} protocol:`, error)
+  }
+}
+
 function initAutoUpdater(): void {
  try {
    log.info('Initializing auto-updater...')
@@ -144,14 +364,6 @@ function initAutoUpdater(): void {
    autoUpdater.on('update-downloaded', (info) => {
      log.info('Update downloaded:', info.version)
      mainWindow?.webContents.send('update:downloaded', info)
-
-      if (mainWindow) {
-        mainWindow.webContents.send('update:show-notification', {
-          title: 'Update Ready',
-          body: `Version ${info.version} has been downloaded and will be installed on restart.`,
-          icon: 'app-icon'
-        })
-      }
    })

    log.info('Auto-updater initialized successfully')
@@ -171,6 +383,28 @@ function initAutoUpdater(): void {
  }
 }

+const gotSingleInstanceLock = app.requestSingleInstanceLock()
+
+if (!gotSingleInstanceLock) {
+  app.quit()
+} else {
+  app.on('second-instance', (_event, argv) => {
+    handleDeepLinkArgv(argv)
+    if (mainWindow) {
+      if (mainWindow.isMinimized()) {
+        mainWindow.restore()
+      }
+      mainWindow.show()
+      mainWindow.focus()
+    }
+  })
+}
+
+app.on('open-url', (event, url) => {
+  event.preventDefault()
+  handleDeepLinkUrl(url)
+})
+
 // This method will be called when Electron has finished
 // initialization and is ready to create browser windows.
 // Some APIs can only be used after this event occurs.
@@ -178,10 +412,28 @@ app.whenReady().then(async () => {
  // Set app user model id for windows
  electronApp.setAppUserModelId('com.vidbee')

+  registerVidbeeProtocol()
+
+  const registered = app.setAsDefaultProtocolClient(APP_PROTOCOL)
+  if (!registered) {
+    log.warn(`Failed to register ${APP_PROTOCOL} protocol handler`)
+  }
+
  // Default open or close DevTools by F12 in development
  // and ignore CommandOrControl + R in production.
  app.on('browser-window-created', (_, window) => {
    optimizer.watchWindowShortcuts(window)
+
+    // Enable F12 to toggle DevTools in both development and production
+    window.webContents.on('before-input-event', (_, input) => {
+      if (input.key === 'F12') {
+        if (window.webContents.isDevToolsOpened()) {
+          window.webContents.closeDevTools()
+        } else {
+          window.webContents.openDevTools()
+        }
+      }
+    })
  })

  // IPC services are automatically registered by electron-ipc-decorator when imported
@@ -205,7 +457,10 @@ app.whenReady().then(async () => {
    log.error('Failed to initialize yt-dlp:', error)
  }

+  await startExtensionApiServer()
+
  applyDockVisibility(settingsManager.get('hideDockIcon'))
+  applyAutoLaunchSetting(settingsManager.get('launchAtLogin'))

  createWindow()

@@ -214,6 +469,10 @@ app.whenReady().then(async () => {
  // Create system tray
  createTray()

+  subscriptionScheduler.start()
+
+  handleDeepLinkArgv(process.argv)
+
  app.on('activate', () => {
    // On macOS it's common to re-create a window in the app when the
    // dock icon is clicked and there are no other windows open.
@@ -247,6 +506,7 @@ app.on('window-all-closed', () => {
 // Cleanup tray on quit
 app.on('will-quit', () => {
  destroyTray()
+  void stopExtensionApiServer()
 })

 // In this file you can include the rest of your app's specific main process
--- a/src/main/ipc/index.ts
+++ b/src/main/ipc/index.ts
@@ -1,9 +1,11 @@
 import { createServices, type MergeIpcService } from 'electron-ipc-decorator'
 import { AppService } from './services/app-service'
+import { BrowserCookiesService } from './services/browser-cookies-service'
 import { DownloadService } from './services/download-service'
 import { FileSystemService } from './services/file-system-service'
 import { HistoryService } from './services/history-service'
 import { SettingsService } from './services/settings-service'
+import { SubscriptionService } from './services/subscription-service'
 import { ThumbnailService } from './services/thumbnail-service'
 import { UpdateService } from './services/update-service'
 import { WindowService } from './services/window-service'
@@ -11,10 +13,12 @@ import { WindowService } from './services/window-service'
 // Create services with automatic type inference
 export const services = createServices([
  AppService,
+  BrowserCookiesService,
  DownloadService,
  FileSystemService,
  HistoryService,
  SettingsService,
+  SubscriptionService,
  ThumbnailService,
  UpdateService,
  WindowService
--- a/src/main/ipc/services/app-service.ts
+++ b/src/main/ipc/services/app-service.ts
@@ -1,6 +1,7 @@
 import os from 'node:os'
 import { app, BrowserWindow, dialog } from 'electron'
 import { type IpcContext, IpcMethod, IpcService } from 'electron-ipc-decorator'
+import { scopedLoggers } from '../../utils/logger'

 class AppService extends IpcService {
  static readonly groupName = 'app'
@@ -32,6 +33,26 @@ class AppService extends IpcService {

    return dialog.showMessageBox(options)
  }
+
+  @IpcMethod()
+  async getSiteIcon(_context: IpcContext, domain: string): Promise<string | null> {
+    try {
+      const iconUrl = `https://unavatar.io/${domain}`
+      const response = await fetch(iconUrl)
+      if (!response.ok) {
+        return null
+      }
+
+      const arrayBuffer = await response.arrayBuffer()
+      const buffer = Buffer.from(arrayBuffer)
+      const contentType = response.headers.get('content-type') || 'image/png'
+      const base64 = buffer.toString('base64')
+      return `data:${contentType};base64,${base64}`
+    } catch (error) {
+      scopedLoggers.system.error('Failed to fetch site icon:', error)
+      return null
+    }
+  }
 }

 export { AppService }
--- a/src/main/ipc/services/browser-cookies-service.ts
+++ b/src/main/ipc/services/browser-cookies-service.ts
@@ -0,0 +1,270 @@
+import fs from 'node:fs'
+import os from 'node:os'
+import path from 'node:path'
+import { type IpcContext, IpcMethod, IpcService } from 'electron-ipc-decorator'
+import { resolvePathWithHome } from '../../utils/path-helpers'
+
+class BrowserCookiesService extends IpcService {
+  static readonly groupName = 'browserCookies'
+
+  private buildValidationResult(valid: boolean, reason?: string) {
+    if (valid) {
+      return { valid }
+    }
+    return { valid, reason }
+  }
+
+  private isDirectory(target: string): boolean {
+    try {
+      return fs.statSync(target).isDirectory()
+    } catch {
+      return false
+    }
+  }
+
+  private pickFirstDirectory(paths: string[]): string {
+    for (const candidate of paths) {
+      if (this.isDirectory(candidate)) {
+        return candidate
+      }
+    }
+    return ''
+  }
+
+  private normalizeProfileInput(value: string): string {
+    return value.trim().replace(/^['"]|['"]$/g, '')
+  }
+
+  private getBrowserProfileBaseDirs(platform: string, homeDir: string, browser: string): string[] {
+    if (platform === 'win32') {
+      if (browser === 'edge') {
+        return [path.join(homeDir, 'AppData', 'Local', 'Microsoft', 'Edge', 'User Data')]
+      }
+      if (browser === 'chrome') {
+        return [path.join(homeDir, 'AppData', 'Local', 'Google', 'Chrome', 'User Data')]
+      }
+      if (browser === 'chromium') {
+        return [path.join(homeDir, 'AppData', 'Local', 'Chromium', 'User Data')]
+      }
+      if (browser === 'brave') {
+        return [
+          path.join(homeDir, 'AppData', 'Local', 'BraveSoftware', 'Brave-Browser', 'User Data')
+        ]
+      }
+      if (browser === 'vivaldi') {
+        return [path.join(homeDir, 'AppData', 'Local', 'Vivaldi', 'User Data')]
+      }
+      if (browser === 'whale') {
+        return [path.join(homeDir, 'AppData', 'Local', 'Naver', 'Whale', 'User Data')]
+      }
+      if (browser === 'opera') {
+        return [path.join(homeDir, 'AppData', 'Roaming', 'Opera Software', 'Opera Stable')]
+      }
+      if (browser === 'firefox') {
+        return [path.join(homeDir, 'AppData', 'Roaming', 'Mozilla', 'Firefox', 'Profiles')]
+      }
+    }
+
+    if (platform === 'darwin') {
+      if (browser === 'edge') {
+        return [path.join(homeDir, 'Library', 'Application Support', 'Microsoft Edge')]
+      }
+      if (browser === 'chrome') {
+        return [path.join(homeDir, 'Library', 'Application Support', 'Google', 'Chrome')]
+      }
+      if (browser === 'chromium') {
+        return [path.join(homeDir, 'Library', 'Application Support', 'Chromium')]
+      }
+      if (browser === 'brave') {
+        return [
+          path.join(homeDir, 'Library', 'Application Support', 'BraveSoftware', 'Brave-Browser')
+        ]
+      }
+      if (browser === 'vivaldi') {
+        return [path.join(homeDir, 'Library', 'Application Support', 'Vivaldi')]
+      }
+      if (browser === 'whale') {
+        return [
+          path.join(homeDir, 'Library', 'Application Support', 'Whale'),
+          path.join(homeDir, 'Library', 'Application Support', 'Naver Whale')
+        ]
+      }
+      if (browser === 'opera') {
+        return [
+          path.join(homeDir, 'Library', 'Application Support', 'com.operasoftware.Opera'),
+          path.join(homeDir, 'Library', 'Application Support', 'Opera Software', 'Opera Stable')
+        ]
+      }
+      if (browser === 'firefox') {
+        return [path.join(homeDir, 'Library', 'Application Support', 'Firefox', 'Profiles')]
+      }
+      if (browser === 'safari') {
+        return [path.join(homeDir, 'Library', 'Safari')]
+      }
+    }
+
+    if (platform === 'linux') {
+      if (browser === 'edge') {
+        return [path.join(homeDir, '.config', 'microsoft-edge')]
+      }
+      if (browser === 'chrome') {
+        return [path.join(homeDir, '.config', 'google-chrome')]
+      }
+      if (browser === 'chromium') {
+        return [path.join(homeDir, '.config', 'chromium')]
+      }
+      if (browser === 'brave') {
+        return [path.join(homeDir, '.config', 'BraveSoftware', 'Brave-Browser')]
+      }
+      if (browser === 'vivaldi') {
+        return [path.join(homeDir, '.config', 'vivaldi')]
+      }
+      if (browser === 'whale') {
+        return [path.join(homeDir, '.config', 'naver-whale')]
+      }
+      if (browser === 'opera') {
+        return [path.join(homeDir, '.config', 'opera')]
+      }
+      if (browser === 'firefox') {
+        return [path.join(homeDir, '.mozilla', 'firefox')]
+      }
+    }
+
+    if (platform === 'freebsd') {
+      if (browser === 'firefox') {
+        return [path.join(homeDir, '.mozilla', 'firefox')]
+      }
+    }
+
+    return []
+  }
+
+  private getDefaultProfilePath(baseDirs: string[], browser: string): string {
+    const base = baseDirs[0]
+    if (!base) {
+      return ''
+    }
+
+    if (browser === 'firefox' || browser === 'safari' || browser === 'opera') {
+      return base
+    }
+
+    return path.join(base, 'Default')
+  }
+
+  private findFirefoxProfilePath(profilesDir: string): string {
+    if (!this.isDirectory(profilesDir)) {
+      return ''
+    }
+
+    const entries = fs
+      .readdirSync(profilesDir, { withFileTypes: true })
+      .filter((entry) => entry.isDirectory())
+      .map((entry) => entry.name)
+      .sort((a, b) => a.localeCompare(b))
+
+    const preferred =
+      entries.find((name) => name.endsWith('.default-release')) ??
+      entries.find((name) => name.endsWith('.default')) ??
+      entries[0]
+
+    return preferred ? path.join(profilesDir, preferred) : ''
+  }
+
+  @IpcMethod()
+  getBrowserProfilePath(_context: IpcContext, browser: string): string {
+    if (!browser || browser === 'none') {
+      return ''
+    }
+
+    const homeDir = os.homedir()
+    const platform = os.platform()
+    const baseDirs = this.getBrowserProfileBaseDirs(platform, homeDir, browser)
+    const fallbackPath = this.getDefaultProfilePath(baseDirs, browser)
+
+    if (browser === 'firefox') {
+      const profilesDir = baseDirs[0]
+      const profilePath = profilesDir ? this.findFirefoxProfilePath(profilesDir) : ''
+      return profilePath || fallbackPath
+    }
+
+    if (browser === 'safari') {
+      const safariPath = baseDirs[0]
+      if (safariPath && this.isDirectory(safariPath)) {
+        return safariPath
+      }
+      return fallbackPath
+    }
+
+    if (baseDirs.length === 0) {
+      return fallbackPath
+    }
+
+    let detectedPath = ''
+    for (const baseDir of baseDirs) {
+      if (!baseDir) {
+        continue
+      }
+      const candidates =
+        browser === 'opera'
+          ? [baseDir, path.join(baseDir, 'Default'), path.join(baseDir, 'Profile 1')]
+          : [path.join(baseDir, 'Default'), path.join(baseDir, 'Profile 1')]
+      detectedPath = this.pickFirstDirectory(candidates)
+      if (detectedPath) {
+        break
+      }
+    }
+
+    return detectedPath || fallbackPath
+  }
+
+  @IpcMethod()
+  validateBrowserProfilePath(
+    _context: IpcContext,
+    browser: string,
+    profilePath: string
+  ): { valid: boolean; reason?: string } {
+    if (!browser || browser === 'none') {
+      return this.buildValidationResult(false, 'browserUnsupported')
+    }
+
+    const normalizedInput = this.normalizeProfileInput(profilePath)
+    if (!normalizedInput) {
+      return this.buildValidationResult(false, 'empty')
+    }
+
+    const resolvedInput = resolvePathWithHome(normalizedInput)
+    if (resolvedInput && this.isDirectory(resolvedInput)) {
+      return this.buildValidationResult(true)
+    }
+
+    const looksLikePath =
+      resolvedInput &&
+      (path.isAbsolute(resolvedInput) ||
+        resolvedInput.includes('/') ||
+        resolvedInput.includes('\\'))
+    if (looksLikePath) {
+      return this.buildValidationResult(false, 'pathNotFound')
+    }
+
+    const platform = os.platform()
+    const homeDir = os.homedir()
+    const baseDirs = this.getBrowserProfileBaseDirs(platform, homeDir, browser)
+    if (baseDirs.length === 0) {
+      return this.buildValidationResult(false, 'browserUnsupported')
+    }
+    for (const baseDir of baseDirs) {
+      if (!baseDir) {
+        continue
+      }
+      const candidate = path.join(baseDir, normalizedInput)
+      if (this.isDirectory(candidate)) {
+        return this.buildValidationResult(true)
+      }
+    }
+
+    return this.buildValidationResult(false, 'profileNotFound')
+  }
+}
+
+export { BrowserCookiesService }
--- a/src/main/ipc/services/file-system-service.ts
+++ b/src/main/ipc/services/file-system-service.ts
@@ -6,6 +6,7 @@ import { pathToFileURL } from 'node:url'
 import { promisify } from 'node:util'
 import { clipboard, dialog, shell } from 'electron'
 import { type IpcContext, IpcMethod, IpcService } from 'electron-ipc-decorator'
+import { scopedLoggers } from '../../utils/logger'

 const execFileAsync = promisify(execFile)

@@ -49,7 +50,10 @@ class FileSystemService extends IpcService {
          return xdgPath
        }
      } catch (error) {
-        console.warn('Unable to resolve XDG download directory, falling back to default:', error)
+        scopedLoggers.system.warn(
+          'Unable to resolve XDG download directory, falling back to default:',
+          error
+        )
      }
    }

@@ -75,7 +79,7 @@ class FileSystemService extends IpcService {
      if (stats?.isDirectory()) {
        const result = await shell.openPath(normalizedPath)
        if (result) {
-          console.error('Failed to open directory:', result)
+          scopedLoggers.system.error('Failed to open directory:', result)
          return false
        }
        return true
@@ -88,16 +92,16 @@ class FileSystemService extends IpcService {
      if (parentStats?.isDirectory()) {
        const result = await shell.openPath(parentDirectory)
        if (result) {
-          console.error('Failed to open parent directory:', result)
+          scopedLoggers.system.error('Failed to open parent directory:', result)
          return false
        }
        return true
      }

-      console.error('File or directory does not exist:', normalizedPath)
+      scopedLoggers.system.error('File or directory does not exist:', normalizedPath)
      return false
    } catch (error) {
-      console.error('Failed to open file location:', error)
+      scopedLoggers.system.error('Failed to open file location:', error)
      return false
    }
  }
@@ -122,7 +126,7 @@ class FileSystemService extends IpcService {

      return true
    } catch (error) {
-      console.error('Failed to copy file to clipboard:', error)
+      scopedLoggers.system.error('Failed to copy file to clipboard:', error)
      return false
    }
  }
@@ -150,7 +154,7 @@ class FileSystemService extends IpcService {
      await shell.openExternal(url)
      return true
    } catch (error) {
-      console.error('Failed to open external URL:', error)
+      scopedLoggers.system.error('Failed to open external URL:', error)
      return false
    }
  }
@@ -166,7 +170,10 @@ class FileSystemService extends IpcService {
      ])
      return
    } catch (error) {
-      console.error('PowerShell clipboard copy failed, falling back to manual buffer:', error)
+      scopedLoggers.system.error(
+        'PowerShell clipboard copy failed, falling back to manual buffer:',
+        error
+      )
    }

    const winPath = resolvedPath.replace(/\//g, '\\')
@@ -194,7 +201,10 @@ class FileSystemService extends IpcService {
      await execFileAsync('osascript', ['-e', `set the clipboard to (POSIX file "${escaped}")`])
      return
    } catch (error) {
-      console.error('osascript clipboard copy failed, falling back to manual buffer:', error)
+      scopedLoggers.system.error(
+        'osascript clipboard copy failed, falling back to manual buffer:',
+        error
+      )
    }

    const entries = [
@@ -229,6 +239,25 @@ class FileSystemService extends IpcService {
      .replace(/'/g, '&apos;')
  }

+  @IpcMethod()
+  async fileExists(_context: IpcContext, filePath: string): Promise<boolean> {
+    try {
+      if (!filePath) {
+        return false
+      }
+
+      const sanitizedPath = this.sanitizePath(filePath)
+      const normalizedPath = path.normalize(sanitizedPath)
+
+      const stats = await fs.stat(normalizedPath).catch(() => null)
+
+      return stats?.isFile() ?? false
+    } catch (error) {
+      scopedLoggers.system.error('Failed to check file existence:', error)
+      return false
+    }
+  }
+
  @IpcMethod()
  async deleteFile(_context: IpcContext, filePath: string): Promise<boolean> {
    try {
@@ -276,7 +305,7 @@ class FileSystemService extends IpcService {

      return false
    } catch (error) {
-      console.error('Failed to delete file:', error)
+      scopedLoggers.system.error('Failed to delete file:', error)
      return false
    }
  }
--- a/src/main/ipc/services/history-service.ts
+++ b/src/main/ipc/services/history-service.ts
@@ -25,6 +25,21 @@ class HistoryService extends IpcService {
    return historyManager.removeHistoryItem(id)
  }

+  @IpcMethod()
+  removeHistoryItems(_context: IpcContext, ids: string[]): number {
+    return historyManager.removeHistoryItems(ids)
+  }
+
+  @IpcMethod()
+  removeHistoryByPlaylistId(_context: IpcContext, playlistId: string): number {
+    return historyManager.removeHistoryByPlaylistId(playlistId)
+  }
+
+  @IpcMethod()
+  clearHistory(_context: IpcContext): void {
+    historyManager.clearHistory()
+  }
+
  @IpcMethod()
  getHistoryCount(_context: IpcContext): {
    active: number
--- a/src/main/ipc/services/settings-service.ts
+++ b/src/main/ipc/services/settings-service.ts
@@ -2,6 +2,7 @@ import { type IpcContext, IpcMethod, IpcService } from 'electron-ipc-decorator'
 import type { AppSettings } from '../../../shared/types'
 import { settingsManager } from '../../settings'
 import { updateTrayMenu } from '../../tray'
+import { applyAutoLaunchSetting } from '../../utils/auto-launch'
 import { applyDockVisibility } from '../../utils/dock'

 class SettingsService extends IpcService {
@@ -23,6 +24,10 @@ class SettingsService extends IpcService {
    if (key === 'hideDockIcon') {
      applyDockVisibility(value as AppSettings['hideDockIcon'])
    }
+
+    if (key === 'launchAtLogin') {
+      applyAutoLaunchSetting(value as AppSettings['launchAtLogin'])
+    }
  }

  @IpcMethod()
@@ -41,12 +46,17 @@ class SettingsService extends IpcService {
    if (typeof settings.hideDockIcon === 'boolean') {
      applyDockVisibility(settings.hideDockIcon)
    }
+
+    if (typeof settings.launchAtLogin === 'boolean') {
+      applyAutoLaunchSetting(settings.launchAtLogin)
+    }
  }

  @IpcMethod()
  reset(_context: IpcContext): void {
    settingsManager.reset()
    applyDockVisibility(settingsManager.get('hideDockIcon'))
+    applyAutoLaunchSetting(settingsManager.get('launchAtLogin'))
  }
 }

--- a/src/main/ipc/services/subscription-service.ts
+++ b/src/main/ipc/services/subscription-service.ts
@@ -0,0 +1,167 @@
+import path from 'node:path'
+import { type IpcContext, IpcMethod, IpcService } from 'electron-ipc-decorator'
+import type {
+  SubscriptionCreatePayload,
+  SubscriptionResolvedFeed,
+  SubscriptionRule,
+  SubscriptionUpdatePayload
+} from '../../../shared/types'
+import { DEFAULT_SUBSCRIPTION_FILENAME_TEMPLATE } from '../../../shared/types'
+import { sanitizeFilenameTemplate } from '../../download-engine/args-builder'
+import { subscriptionManager } from '../../lib/subscription-manager'
+import { subscriptionScheduler } from '../../lib/subscription-scheduler'
+import { settingsManager } from '../../settings'
+
+interface CreateSubscriptionOptions {
+  url: string
+  keywords?: string[]
+  tags?: string[]
+  onlyDownloadLatest?: boolean
+  downloadDirectory?: string
+  namingTemplate?: string
+  enabled?: boolean
+}
+
+const ensureUrlHasProtocol = (value: string): string => {
+  if (!value) {
+    return value
+  }
+  if (!/^https?:\/\//i.test(value)) {
+    return `https://${value}`
+  }
+  return value
+}
+
+const resolveFeedFromInput = (rawUrl: string): SubscriptionResolvedFeed => {
+  const normalized = ensureUrlHasProtocol(rawUrl.trim())
+  const youTubeChannelMatch = normalized.match(/youtube\.com\/channel\/([A-Za-z0-9_-]+)/i)
+  if (youTubeChannelMatch) {
+    return {
+      sourceUrl: normalized,
+      feedUrl: `https://www.youtube.com/feeds/videos.xml?channel_id=${youTubeChannelMatch[1]}`,
+      platform: 'youtube'
+    }
+  }
+
+  if (/youtube\.com\/feeds\/videos\.xml/i.test(normalized)) {
+    return {
+      sourceUrl: normalized,
+      feedUrl: normalized,
+      platform: 'youtube'
+    }
+  }
+
+  const youTubeUserMatch = normalized.match(/youtube\.com\/(?:user|c)\/([^/?]+)/i)
+  if (youTubeUserMatch) {
+    return {
+      sourceUrl: normalized,
+      feedUrl: `https://www.youtube.com/feeds/videos.xml?user=${youTubeUserMatch[1]}`,
+      platform: 'youtube'
+    }
+  }
+
+  const youTubeHandleMatch = normalized.match(/youtube\.com\/(@[^/?]+)/i)
+  if (youTubeHandleMatch) {
+    const handle = youTubeHandleMatch[1].replace('@', '')
+    return {
+      sourceUrl: normalized,
+      feedUrl: `https://www.youtube.com/feeds/videos.xml?user=${handle}`,
+      platform: 'youtube'
+    }
+  }
+
+  const biliSpaceMatch = normalized.match(/bilibili\.com\/(?:space|user)\/(\d+)/i)
+  if (biliSpaceMatch) {
+    return {
+      sourceUrl: normalized,
+      feedUrl: `https://rsshub.app/bilibili/user/video/${biliSpaceMatch[1]}`,
+      platform: 'bilibili'
+    }
+  }
+
+  if (/rsshub\.app\/bilibili/i.test(normalized)) {
+    return {
+      sourceUrl: normalized,
+      feedUrl: normalized,
+      platform: 'bilibili'
+    }
+  }
+
+  return {
+    sourceUrl: normalized,
+    feedUrl: normalized,
+    platform: 'custom'
+  }
+}
+
+class SubscriptionService extends IpcService {
+  static readonly groupName = 'subscriptions'
+
+  @IpcMethod()
+  list(_context: IpcContext): SubscriptionRule[] {
+    return subscriptionManager.getAll()
+  }
+
+  @IpcMethod()
+  resolve(_context: IpcContext, url: string): SubscriptionResolvedFeed {
+    return resolveFeedFromInput(url)
+  }
+
+  @IpcMethod()
+  async create(
+    _context: IpcContext,
+    options: CreateSubscriptionOptions
+  ): Promise<SubscriptionRule> {
+    const resolved = resolveFeedFromInput(options.url)
+    const settings = settingsManager.getAll()
+    const defaultDownloadDirectory = path.join(settings.downloadPath, 'Subscriptions')
+    const payload: SubscriptionCreatePayload = {
+      sourceUrl: resolved.sourceUrl,
+      feedUrl: resolved.feedUrl,
+      platform: resolved.platform,
+      keywords: options.keywords,
+      tags: options.tags,
+      onlyDownloadLatest:
+        options.onlyDownloadLatest ?? settings.subscriptionOnlyLatestDefault ?? true,
+      downloadDirectory: options.downloadDirectory || defaultDownloadDirectory,
+      namingTemplate: sanitizeFilenameTemplate(
+        options.namingTemplate || DEFAULT_SUBSCRIPTION_FILENAME_TEMPLATE
+      ),
+      enabled: options.enabled ?? true
+    }
+
+    const created = subscriptionManager.add(payload)
+    void subscriptionScheduler.runNow(created.id)
+    return created
+  }
+
+  @IpcMethod()
+  update(
+    _context: IpcContext,
+    id: string,
+    updates: SubscriptionUpdatePayload
+  ): SubscriptionRule | undefined {
+    const normalized: SubscriptionUpdatePayload = { ...updates }
+    if (typeof normalized.namingTemplate === 'string') {
+      normalized.namingTemplate = sanitizeFilenameTemplate(normalized.namingTemplate)
+    }
+    return subscriptionManager.update(id, normalized)
+  }
+
+  @IpcMethod()
+  remove(_context: IpcContext, id: string): boolean {
+    return subscriptionManager.remove(id)
+  }
+
+  @IpcMethod()
+  async refresh(_context: IpcContext, id?: string): Promise<void> {
+    await subscriptionScheduler.runNow(id)
+  }
+
+  @IpcMethod()
+  async queueItem(_context: IpcContext, id: string, itemId: string): Promise<boolean> {
+    return subscriptionScheduler.queueItem(id, itemId)
+  }
+}
+
+export { SubscriptionService }
--- a/src/main/lib/database-path.ts
+++ b/src/main/lib/database-path.ts
@@ -0,0 +1,6 @@
+import { join } from 'node:path'
+import { app } from 'electron'
+
+export const getDatabaseFilePath = (): string => {
+  return join(app.getPath('userData'), 'vidbee.db')
+}
--- a/src/main/lib/database/migrate.ts
+++ b/src/main/lib/database/migrate.ts
@@ -0,0 +1,97 @@
+import { existsSync } from 'node:fs'
+import { join, resolve } from 'node:path'
+import { sql } from 'drizzle-orm'
+import type { BetterSQLite3Database } from 'drizzle-orm/better-sqlite3'
+import { migrate } from 'drizzle-orm/better-sqlite3/migrator'
+import { type MigrationMeta, readMigrationFiles } from 'drizzle-orm/migrator'
+import { app } from 'electron'
+import log from 'electron-log/main'
+
+const MIGRATIONS_RELATIVE_PATH = 'resources/drizzle'
+const MIGRATIONS_TABLE = '__drizzle_migrations'
+const KNOWN_TABLES = ['download_history', 'subscriptions', 'subscription_items']
+
+const migrationsTableDefinition = sql`
+  CREATE TABLE IF NOT EXISTS ${sql.identifier(MIGRATIONS_TABLE)} (
+    id SERIAL PRIMARY KEY,
+    hash text NOT NULL,
+    created_at numeric
+  )
+`
+
+export const runMigrations = (database: BetterSQLite3Database): void => {
+  const migrationsFolder = resolveMigrationsFolder()
+  if (!migrationsFolder) {
+    log.warn('database: drizzle migrations folder not found, skipping migrations')
+    return
+  }
+
+  try {
+    ensureBaseline(database, migrationsFolder)
+    migrate(database, { migrationsFolder, migrationsTable: MIGRATIONS_TABLE })
+  } catch (error) {
+    log.error('database: failed to run drizzle migrations', error)
+  }
+}
+
+const resolveMigrationsFolder = (): string | null => {
+  const candidates = new Set<string>()
+  candidates.add(resolve(process.cwd(), MIGRATIONS_RELATIVE_PATH))
+  candidates.add(resolve(__dirname, '../../../../', MIGRATIONS_RELATIVE_PATH))
+
+  if (process.resourcesPath) {
+    candidates.add(join(process.resourcesPath, MIGRATIONS_RELATIVE_PATH))
+    candidates.add(join(process.resourcesPath, 'app.asar.unpacked', MIGRATIONS_RELATIVE_PATH))
+  }
+
+  try {
+    candidates.add(join(app.getAppPath(), MIGRATIONS_RELATIVE_PATH))
+  } catch {
+    // app might not be ready yet, ignore
+  }
+
+  for (const candidate of candidates) {
+    if (existsSync(candidate)) {
+      return candidate
+    }
+  }
+
+  return null
+}
+
+const ensureBaseline = (database: BetterSQLite3Database, migrationsFolder: string): void => {
+  if (hasTable(database, MIGRATIONS_TABLE)) {
+    return
+  }
+
+  const hasExistingSchema = KNOWN_TABLES.some((table) => hasTable(database, table))
+  if (!hasExistingSchema) {
+    return
+  }
+
+  log.info('database: detected existing schema, seeding drizzle migrations baseline')
+  database.run(migrationsTableDefinition)
+
+  let migrations: MigrationMeta[]
+  try {
+    migrations = readMigrationFiles({ migrationsFolder, migrationsTable: MIGRATIONS_TABLE })
+  } catch (error) {
+    log.error('database: failed to read drizzle migrations while seeding baseline', error)
+    return
+  }
+
+  database.transaction((tx) => {
+    for (const migration of migrations) {
+      tx.run(
+        sql`INSERT INTO ${sql.identifier(MIGRATIONS_TABLE)} ("hash", "created_at") VALUES(${migration.hash}, ${migration.folderMillis})`
+      )
+    }
+  })
+}
+
+const hasTable = (database: BetterSQLite3Database, tableName: string): boolean => {
+  const rows = database.all<{ name: string }>(
+    sql`SELECT name FROM sqlite_master WHERE type = 'table' AND name = ${tableName}`
+  )
+  return rows.length > 0
+}
--- a/src/main/lib/database/schema.ts
+++ b/src/main/lib/database/schema.ts
@@ -0,0 +1,83 @@
+import { index, integer, primaryKey, sqliteTable, text } from 'drizzle-orm/sqlite-core'
+
+export const downloadHistoryTable = sqliteTable('download_history', {
+  id: text('id').primaryKey(),
+  url: text('url').notNull(),
+  title: text('title').notNull(),
+  thumbnail: text('thumbnail'),
+  type: text('type').notNull(),
+  status: text('status').notNull(),
+  downloadPath: text('download_path'),
+  savedFileName: text('saved_file_name'),
+  fileSize: integer('file_size', { mode: 'number' }),
+  duration: integer('duration', { mode: 'number' }),
+  downloadedAt: integer('downloaded_at', { mode: 'number' }).notNull(),
+  completedAt: integer('completed_at', { mode: 'number' }),
+  sortKey: integer('sort_key', { mode: 'number' }).notNull(),
+  error: text('error'),
+  description: text('description'),
+  channel: text('channel'),
+  uploader: text('uploader'),
+  viewCount: integer('view_count', { mode: 'number' }),
+  tags: text('tags'),
+  origin: text('origin'),
+  subscriptionId: text('subscription_id'),
+  selectedFormat: text('selected_format'),
+  playlistId: text('playlist_id'),
+  playlistTitle: text('playlist_title'),
+  playlistIndex: integer('playlist_index', { mode: 'number' }),
+  playlistSize: integer('playlist_size', { mode: 'number' })
+})
+
+export const subscriptionsTable = sqliteTable('subscriptions', {
+  id: text('id').primaryKey(),
+  title: text('title').notNull(),
+  sourceUrl: text('source_url').notNull(),
+  feedUrl: text('feed_url').notNull(),
+  platform: text('platform').notNull(),
+  keywords: text('keywords').notNull(),
+  tags: text('tags').notNull(),
+  onlyDownloadLatest: integer('only_latest', { mode: 'number' }).notNull(),
+  enabled: integer('enabled', { mode: 'number' }).notNull(),
+  coverUrl: text('cover_url'),
+  latestVideoTitle: text('latest_video_title'),
+  latestVideoPublishedAt: integer('latest_video_published_at', { mode: 'number' }),
+  lastCheckedAt: integer('last_checked_at', { mode: 'number' }),
+  lastSuccessAt: integer('last_success_at', { mode: 'number' }),
+  status: text('status').notNull(),
+  lastError: text('last_error'),
+  createdAt: integer('created_at', { mode: 'number' }).notNull(),
+  updatedAt: integer('updated_at', { mode: 'number' }).notNull(),
+  downloadDirectory: text('download_directory'),
+  namingTemplate: text('naming_template')
+})
+
+export const subscriptionItemsTable = sqliteTable(
+  'subscription_items',
+  {
+    subscriptionId: text('subscription_id').notNull(),
+    itemId: text('item_id').notNull(),
+    title: text('title').notNull(),
+    url: text('url').notNull(),
+    publishedAt: integer('published_at', { mode: 'number' }).notNull(),
+    thumbnail: text('thumbnail'),
+    added: integer('added', { mode: 'number' }).notNull(),
+    downloadId: text('download_id'),
+    createdAt: integer('created_at', { mode: 'number' }).notNull(),
+    updatedAt: integer('updated_at', { mode: 'number' }).notNull()
+  },
+  (table) => ({
+    pk: primaryKey({
+      columns: [table.subscriptionId, table.itemId],
+      name: 'subscription_items_pk'
+    }),
+    subscriptionIdx: index('subscription_items_subscription_idx').on(table.subscriptionId)
+  })
+)
+
+export type DownloadHistoryRow = typeof downloadHistoryTable.$inferSelect
+export type DownloadHistoryInsert = typeof downloadHistoryTable.$inferInsert
+export type SubscriptionRow = typeof subscriptionsTable.$inferSelect
+export type SubscriptionInsert = typeof subscriptionsTable.$inferInsert
+export type SubscriptionItemRow = typeof subscriptionItemsTable.$inferSelect
+export type SubscriptionItemInsert = typeof subscriptionItemsTable.$inferInsert
--- a/src/main/lib/download-engine.ts
+++ b/src/main/lib/download-engine.ts
@@ -1,4 +1,5 @@
 import { EventEmitter } from 'node:events'
+import fs from 'node:fs'
 import path from 'node:path'
 import type { YTDlpEventEmitter } from 'yt-dlp-wrap-plus'
 import type {
@@ -12,7 +13,11 @@ import type {
  VideoFormat,
  VideoInfo
 } from '../../shared/types'
-import { buildDownloadArgs, resolveVideoFormatSelector } from '../download-engine/args-builder'
+import {
+  buildDownloadArgs,
+  resolveVideoFormatSelector,
+  sanitizeFilenameTemplate
+} from '../download-engine/args-builder'
 import {
  findFormatByIdCandidates,
  parseSizeToBytes,
@@ -20,6 +25,7 @@ import {
 } from '../download-engine/format-utils'
 import { settingsManager } from '../settings'
 import { scopedLoggers } from '../utils/logger'
+import { resolvePathWithHome } from '../utils/path-helpers'
 import { DownloadQueue } from './download-queue'
 import { ffmpegManager } from './ffmpeg-manager'
 import { historyManager } from './history-manager'
@@ -30,6 +36,135 @@ interface DownloadProcess {
  process: YTDlpEventEmitter
 }

+const formatYtDlpCommand = (args: string[]): string => {
+  const quoted = args.map((arg) => {
+    if (arg === '') {
+      return '""'
+    }
+    if (/[\s"'\\]/.test(arg)) {
+      return `"${arg.replace(/(["\\])/g, '\\$1')}"`
+    }
+    return arg
+  })
+  return `yt-dlp ${quoted.join(' ')}`
+}
+
+const ensureDirectoryExists = (dir?: string): void => {
+  if (!dir) {
+    return
+  }
+  try {
+    fs.mkdirSync(dir, { recursive: true })
+  } catch (error) {
+    scopedLoggers.download.error('Failed to ensure download directory:', error)
+  }
+}
+
+const sanitizeFolderName = (value: string, fallback: string): string => {
+  const trimmed = value.trim()
+  if (!trimmed) {
+    return fallback
+  }
+  const sanitized = trimmed
+    .replace(/[\\/:*?"<>|]+/g, '-')
+    .replace(/\s+/g, ' ')
+    .replace(/[. ]+$/g, '')
+  return sanitized || fallback
+}
+
+const isLikelyChannelUrl = (url: string): boolean => {
+  const normalized = url.toLowerCase()
+  if (normalized.includes('list=')) {
+    return false
+  }
+  return /youtube\.com\/(channel\/|c\/|user\/|@)/.test(normalized)
+}
+
+const resolveAutoPlaylistDownloadPath = (
+  basePath: string,
+  info: PlaylistInfo,
+  url: string
+): string => {
+  const kindFolder = isLikelyChannelUrl(url) ? 'Channels' : 'Playlists'
+  const title = sanitizeFolderName(
+    info.title || (kindFolder === 'Channels' ? 'Channel' : 'Playlist'),
+    kindFolder === 'Channels' ? 'Channel' : 'Playlist'
+  )
+  return path.join(basePath, kindFolder, title)
+}
+
+const resolveAutoVideoDownloadPath = (basePath: string, info?: VideoInfo): string => {
+  const root = path.join(basePath, 'Videos')
+  if (!info) {
+    return root
+  }
+  const label = info.uploader?.trim() || info.title?.trim()
+  if (!label) {
+    return root
+  }
+  return path.join(root, sanitizeFolderName(label, 'Video'))
+}
+
+const sanitizeTemplateValue = (value: string): string =>
+  value
+    .replace(/[\\/:*?"<>|]+/g, '-')
+    .replace(/\s+/g, ' ')
+    .trim()
+    .replace(/[. ]+$/g, '')
+
+const resolveTemplateToken = (token: string, info?: VideoInfo): string | undefined => {
+  if (!info) {
+    return undefined
+  }
+  switch (token) {
+    case 'uploader':
+      return info.uploader
+    case 'title':
+      return info.title
+    case 'id':
+      return info.id
+    case 'channel':
+      return info.uploader
+    case 'extractor':
+      return info.extractor_key
+    default:
+      return undefined
+  }
+}
+
+const resolveHistoryDownloadPath = (
+  basePath: string,
+  filenameTemplate?: string,
+  info?: VideoInfo
+): string => {
+  if (!filenameTemplate?.trim()) {
+    return basePath
+  }
+  const safeTemplate = sanitizeFilenameTemplate(filenameTemplate)
+  const resolvedTemplate = safeTemplate.replace(/%\(([^)]+)\)s/g, (match, token) => {
+    const value = resolveTemplateToken(token, info)
+    if (!value) {
+      return match
+    }
+    return sanitizeTemplateValue(value)
+  })
+  const templateDir = path.posix.dirname(resolvedTemplate)
+  if (templateDir === '.' || templateDir === '/') {
+    return basePath
+  }
+  if (/%\([^)]+\)s/.test(templateDir)) {
+    return basePath
+  }
+  return path.join(basePath, templateDir)
+}
+
+const appendJsRuntimeArgs = (args: string[]): void => {
+  const runtimeArgs = ytdlpManager.getJsRuntimeArgs()
+  if (runtimeArgs.length > 0) {
+    args.push(...runtimeArgs)
+  }
+}
+
 class DownloadEngine extends EventEmitter {
  private activeDownloads: Map<string, DownloadProcess> = new Map()
  private queue: DownloadQueue
@@ -74,10 +209,12 @@ class DownloadEngine extends EventEmitter {
    }

    // Add config file if configured
-    if (settings.configPath) {
-      args.push('--config-location', `"${settings.configPath}"`)
+    const configPath = resolvePathWithHome(settings.configPath)
+    if (configPath) {
+      args.push('--config-location', configPath)
    }

+    appendJsRuntimeArgs(args)
    args.push(url)

    return new Promise((resolve, reject) => {
@@ -169,10 +306,12 @@ class DownloadEngine extends EventEmitter {
    }

    // Add config file if configured
-    if (settings.configPath) {
-      args.push('--config-location', `"${settings.configPath}"`)
+    const configPath = resolvePathWithHome(settings.configPath)
+    if (configPath) {
+      args.push('--config-location', configPath)
    }

+    appendJsRuntimeArgs(args)
    args.push(url)

    type RawPlaylistEntry = {
@@ -313,6 +452,10 @@ class DownloadEngine extends EventEmitter {
    const rangeEnd = Math.max(requestedStart, requestedEnd)
    const rawEntries = playlistInfo.entries.slice(rangeStart, rangeEnd + 1)
    const settings = settingsManager.getAll()
+    const resolvedDownloadPath =
+      options.customDownloadPath?.trim() ||
+      resolveAutoPlaylistDownloadPath(settings.downloadPath, playlistInfo, options.url)
+    ensureDirectoryExists(resolvedDownloadPath)

    const selectedEntries = rawEntries.filter((entry) => {
      if (!entry.url) {
@@ -336,7 +479,8 @@ class DownloadEngine extends EventEmitter {
        url: entry.url,
        type: options.type,
        format: options.format,
-        audioFormat: options.type === 'audio' ? options.format : undefined
+        audioFormat: options.type === 'audio' ? options.format : undefined,
+        customDownloadPath: resolvedDownloadPath
      }

      const createdAt = Date.now()
@@ -367,7 +511,7 @@ class DownloadEngine extends EventEmitter {
        title: entry.title,
        status: 'pending',
        downloadedAt: createdAt,
-        downloadPath: settings.downloadPath,
+        downloadPath: resolvedDownloadPath,
        playlistId: groupId,
        playlistTitle: playlistInfo.title,
        playlistIndex: entry.index,
@@ -389,12 +533,20 @@ class DownloadEngine extends EventEmitter {

  startDownload(id: string, options: DownloadOptions): void {
    if (this.activeDownloads.has(id)) {
-      console.warn(`Download ${id} is already active`)
+      scopedLoggers.engine.warn(`Download ${id} is already active`)
      return
    }

    const createdAt = Date.now()
    const settings = settingsManager.getAll()
+    const targetDownloadPath = options.customDownloadPath?.trim() || settings.downloadPath
+    const origin = options.origin ?? 'manual'
+    const historyDownloadPath = resolveHistoryDownloadPath(
+      targetDownloadPath,
+      options.customFilenameTemplate
+    )
+    ensureDirectoryExists(targetDownloadPath)
+    ensureDirectoryExists(historyDownloadPath)

    const item: DownloadItem = {
      id,
@@ -402,7 +554,10 @@ class DownloadEngine extends EventEmitter {
      title: 'Downloading...',
      type: options.type,
      status: 'pending' as const,
-      createdAt
+      createdAt,
+      tags: options.tags,
+      origin,
+      subscriptionId: options.subscriptionId
    }

    this.queue.add(id, options, item)
@@ -411,7 +566,10 @@ class DownloadEngine extends EventEmitter {
      title: item.title,
      status: 'pending',
      downloadedAt: createdAt,
-      downloadPath: settings.downloadPath
+      downloadPath: historyDownloadPath,
+      tags: options.tags,
+      origin,
+      subscriptionId: options.subscriptionId
    })
  }

@@ -419,7 +577,8 @@ class DownloadEngine extends EventEmitter {
    scopedLoggers.download.info('Starting download execution for ID:', id, 'URL:', options.url)
    const ytdlp = ytdlpManager.getInstance()
    const settings = settingsManager.getAll()
-    const downloadPath = settings.downloadPath
+    const defaultDownloadPath = settings.downloadPath
+    let resolvedDownloadPath = options.customDownloadPath?.trim() || defaultDownloadPath

    // Set environment variables for proper encoding on Windows
    if (process.platform === 'win32') {
@@ -430,9 +589,8 @@ class DownloadEngine extends EventEmitter {
    let availableFormats: VideoFormat[] = []
    let selectedFormat: VideoFormat | undefined
    let actualFormat: string | null = null
-    let actualQuality: string | null = null
-    let actualCodec: string | null = null
    let videoInfo: VideoInfo | undefined
+    let lastKnownOutputPath: string | undefined

    // First, get detailed video info to capture basic metadata and formats
    try {
@@ -444,20 +602,6 @@ class DownloadEngine extends EventEmitter {

      if (selectedFormat) {
        actualFormat = selectedFormat.ext || actualFormat
-
-        if (selectedFormat.height) {
-          actualQuality = `${selectedFormat.height}p${
-            selectedFormat.fps && selectedFormat.fps === 60 ? '60' : ''
-          }`
-        } else if (selectedFormat.format_note) {
-          actualQuality = selectedFormat.format_note
-        }
-
-        if (options.type === 'audio' || options.type === 'extract') {
-          actualCodec = selectedFormat.acodec || actualCodec
-        } else {
-          actualCodec = selectedFormat.vcodec || selectedFormat.acodec || actualCodec
-        }
      }

      this.updateDownloadInfo(id, {
@@ -485,6 +629,19 @@ class DownloadEngine extends EventEmitter {
      scopedLoggers.download.warn('Failed to get detailed video info for ID:', id, error)
    }

+    if (!options.customDownloadPath?.trim()) {
+      resolvedDownloadPath = resolveAutoVideoDownloadPath(defaultDownloadPath, videoInfo)
+      options.customDownloadPath = resolvedDownloadPath
+    }
+
+    const historyDownloadPath = resolveHistoryDownloadPath(
+      resolvedDownloadPath,
+      options.customFilenameTemplate,
+      videoInfo
+    )
+    ensureDirectoryExists(historyDownloadPath)
+    this.upsertHistoryEntry(id, options, { downloadPath: historyDownloadPath })
+
    const applySelectedFormat = (formatId: string | undefined): boolean => {
      if (!formatId) {
        return false
@@ -502,18 +659,6 @@ class DownloadEngine extends EventEmitter {
      selectedFormat = candidate
      actualFormat = candidate.ext || actualFormat

-      if (candidate.height) {
-        actualQuality = `${candidate.height}p${candidate.fps === 60 ? '60' : ''}`
-      } else if (candidate.format_note) {
-        actualQuality = candidate.format_note
-      }
-
-      if (options.type === 'audio' || options.type === 'extract') {
-        actualCodec = candidate.acodec || actualCodec
-      } else {
-        actualCodec = candidate.vcodec || candidate.acodec || actualCodec
-      }
-
      this.updateDownloadInfo(id, {
        selectedFormat: candidate
      })
@@ -521,7 +666,44 @@ class DownloadEngine extends EventEmitter {
      return true
    }

-    const args = buildDownloadArgs(options, downloadPath, settings)
+    const args = buildDownloadArgs(
+      options,
+      resolvedDownloadPath,
+      settings,
+      ytdlpManager.getJsRuntimeArgs()
+    )
+
+    const captureOutputPath = (rawPath: string | undefined): void => {
+      if (!rawPath) {
+        return
+      }
+      const trimmed = rawPath.trim().replace(/^"|"$/g, '')
+      if (!trimmed) {
+        return
+      }
+      lastKnownOutputPath = path.isAbsolute(trimmed)
+        ? trimmed
+        : path.join(resolvedDownloadPath, trimmed)
+    }
+
+    const extractOutputPathFromLog = (message: string): void => {
+      const destinationMatch = message.match(/Destination:\s*(.+)$/)
+      if (destinationMatch) {
+        captureOutputPath(destinationMatch[1])
+        return
+      }
+
+      const mergingMatch = message.match(/Merging formats into\s+"(.+?)"/)
+      if (mergingMatch) {
+        captureOutputPath(mergingMatch[1])
+        return
+      }
+
+      const movingMatch = message.match(/Moving file to\s+"(.+?)"/)
+      if (movingMatch) {
+        captureOutputPath(movingMatch[1])
+      }
+    }

    // Check if format selector contains '+' which means video and audio will be merged
    const formatSelector =
@@ -563,6 +745,8 @@ class DownloadEngine extends EventEmitter {
    args.push('--ffmpeg-location', ffmpegPath)
    args.push(urlArg)

+    scopedLoggers.download.info('yt-dlp command:', formatYtDlpCommand(args))
+
    const controller = new AbortController()
    const ytdlpProcess = ytdlp.exec(args, {
      signal: controller.signal
@@ -629,16 +813,6 @@ class DownloadEngine extends EventEmitter {
          if (extMatch && !actualFormat) {
            actualFormat = extMatch[1]
          }
-
-          const heightMatch = formatInfo.match(/(\d+)p/)
-          if (heightMatch && !actualQuality) {
-            actualQuality = `${heightMatch[1]}p`
-          }
-
-          const codecMatch = formatInfo.match(/(?:vcodec|acodec)[:\s]*([^\s,]+)/)
-          if (codecMatch && !actualCodec) {
-            actualCodec = codecMatch[1]
-          }
        }
      }

@@ -649,6 +823,10 @@ class DownloadEngine extends EventEmitter {
          applySelectedFormat(formatMatch[1])
        }
      }
+
+      if (eventType === 'download' || eventType === 'info') {
+        extractOutputPathFromLog(eventData)
+      }
    })

    // Handle completion
@@ -675,32 +853,44 @@ class DownloadEngine extends EventEmitter {
          extension = actualFormat || 'mp4'
        }

-        const fileName = `${sanitizedTitle}.${extension}`
-        const finalOutputPath = path.join(downloadPath, fileName)
+        const fallbackFileName = `${sanitizedTitle}.${extension}`
+        const fallbackOutputPath = path.join(resolvedDownloadPath, fallbackFileName)

        scopedLoggers.download.info(
-          'Generated file path for ID:',
+          'Resolved output paths for ID:',
          id,
-          'Path:',
-          finalOutputPath,
+          'Primary:',
+          lastKnownOutputPath ?? fallbackOutputPath,
+          'Fallback:',
+          fallbackOutputPath,
          'Will merge:',
          willMerge
        )

        let fileSize: number | undefined
-        let actualFilePath = finalOutputPath
+        let actualFilePath = lastKnownOutputPath ?? fallbackOutputPath
+        const candidatePaths = lastKnownOutputPath
+          ? [lastKnownOutputPath, fallbackOutputPath]
+          : [fallbackOutputPath]
+
        try {
          const fs = await import('node:fs/promises')
-          // Try to find the actual file - yt-dlp may generate files with slightly different names
-          const stats = await fs.stat(finalOutputPath)
-          fileSize = stats.size
-          actualFilePath = finalOutputPath
-        } catch (error) {
-          // If the expected file doesn't exist, try to find it by scanning the directory
-          try {
-            const fs = await import('node:fs/promises')
-            const files = await fs.readdir(downloadPath)
-            // Look for files matching the title pattern with the correct extension
+          let located = false
+          for (const candidate of candidatePaths) {
+            if (!candidate) {
+              continue
+            }
+            try {
+              const stats = await fs.stat(candidate)
+              fileSize = stats.size
+              actualFilePath = candidate
+              located = true
+              break
+            } catch {}
+          }
+
+          if (!located) {
+            const files = await fs.readdir(resolvedDownloadPath)
            const matchingFiles = files.filter((file) => {
              const baseName = file.replace(/\.[^.]+$/, '')
              const fileExt = file.split('.').pop()?.toLowerCase()
@@ -711,30 +901,33 @@ class DownloadEngine extends EventEmitter {
            })

            if (matchingFiles.length > 0) {
-              // Use the most recently modified file if multiple matches
              const fileStats = await Promise.all(
                matchingFiles.map(async (file) => {
-                  const filePath = path.join(downloadPath, file)
+                  const filePath = path.join(resolvedDownloadPath, file)
                  const stats = await fs.stat(filePath)
-                  return { file, path: filePath, mtime: stats.mtime, size: stats.size }
+                  return { path: filePath, mtime: stats.mtime, size: stats.size }
                })
              )
              const mostRecent = fileStats.sort((a, b) => b.mtime.getTime() - a.mtime.getTime())[0]
              actualFilePath = mostRecent.path
              fileSize = mostRecent.size
+              located = true
              scopedLoggers.download.info('Found actual file:', actualFilePath, 'Size:', fileSize)
-            } else if (latestKnownSizeBytes !== undefined) {
-              fileSize = latestKnownSizeBytes
+            }
+          }
+
+          if (!fileSize && latestKnownSizeBytes !== undefined) {
+            fileSize = latestKnownSizeBytes
+            if (!located) {
              scopedLoggers.download.warn('File not found, using estimated size:', fileSize)
-            } else {
-              scopedLoggers.download.warn('Failed to find file for ID:', id, error)
-            }
-          } catch (scanError) {
-            if (latestKnownSizeBytes !== undefined) {
-              fileSize = latestKnownSizeBytes
-            } else {
-              scopedLoggers.download.warn('Failed to get file size for ID:', id, scanError)
            }
+          } else if (!fileSize) {
+            scopedLoggers.download.warn('Failed to find file for ID:', id)
+          }
+        } catch (error) {
+          scopedLoggers.download.warn('Failed to resolve file details for ID:', id, error)
+          if (latestKnownSizeBytes !== undefined) {
+            fileSize = latestKnownSizeBytes
          }
        }

@@ -742,13 +935,13 @@ class DownloadEngine extends EventEmitter {
          fileSize = latestKnownSizeBytes
        }

+        const savedFileName = path.basename(actualFilePath)
+
        this.updateDownloadInfo(id, {
          status: 'completed',
          completedAt: Date.now(),
          fileSize,
-          format: willMerge ? 'mp4' : actualFormat || undefined,
-          quality: actualQuality || undefined,
-          codec: actualCodec || undefined
+          savedFileName
        })
        scopedLoggers.download.info('Download completed successfully for ID:', id)
        this.emit('download-completed', id)
@@ -834,15 +1027,6 @@ class DownloadEngine extends EventEmitter {
    if (updates.fileSize !== undefined) {
      historyUpdates.fileSize = updates.fileSize
    }
-    if (updates.format !== undefined) {
-      historyUpdates.format = updates.format
-    }
-    if (updates.quality !== undefined) {
-      historyUpdates.quality = updates.quality
-    }
-    if (updates.codec !== undefined) {
-      historyUpdates.codec = updates.codec
-    }
    if (updates.description !== undefined) {
      historyUpdates.description = updates.description
    }
@@ -870,6 +1054,9 @@ class DownloadEngine extends EventEmitter {
    if (updates.playlistSize !== undefined) {
      historyUpdates.playlistSize = updates.playlistSize
    }
+    if (updates.selectedFormat !== undefined) {
+      historyUpdates.selectedFormat = updates.selectedFormat
+    }
    if (updates.status !== undefined) {
      historyUpdates.status = updates.status
    }
@@ -879,8 +1066,8 @@ class DownloadEngine extends EventEmitter {
    if (updates.error !== undefined) {
      historyUpdates.error = updates.error
    }
-    if (updates.selectedFormat !== undefined) {
-      historyUpdates.selectedFormat = updates.selectedFormat
+    if (updates.savedFileName !== undefined) {
+      historyUpdates.savedFileName = updates.savedFileName
    }

    if (Object.keys(historyUpdates).length > 0) {
@@ -907,14 +1094,13 @@ class DownloadEngine extends EventEmitter {
      error,
      duration: completedDownload?.item.duration,
      fileSize: completedDownload?.item.fileSize,
-      format: completedDownload?.item.format,
-      quality: completedDownload?.item.quality,
-      codec: completedDownload?.item.codec,
      description: completedDownload?.item.description,
      channel: completedDownload?.item.channel,
      uploader: completedDownload?.item.uploader,
      viewCount: completedDownload?.item.viewCount,
      tags: completedDownload?.item.tags,
+      origin: completedDownload?.item.origin,
+      subscriptionId: completedDownload?.item.subscriptionId,
      playlistId: completedDownload?.item.playlistId,
      playlistTitle: completedDownload?.item.playlistTitle,
      playlistIndex: completedDownload?.item.playlistIndex,
@@ -928,6 +1114,8 @@ class DownloadEngine extends EventEmitter {
    updates: Partial<DownloadHistoryItem>
  ): void {
    const existing = historyManager.getHistoryById(id)
+    const resolvedDownloadPath =
+      updates.downloadPath ?? existing?.downloadPath ?? options.customDownloadPath
    const base: DownloadHistoryItem = existing ?? {
      id,
      url: options.url,
@@ -935,20 +1123,20 @@ class DownloadEngine extends EventEmitter {
      thumbnail: updates.thumbnail,
      type: options.type,
      status: updates.status || 'pending',
-      downloadPath: updates.downloadPath,
+      downloadPath: resolvedDownloadPath,
+      savedFileName: updates.savedFileName,
      fileSize: updates.fileSize,
      duration: updates.duration,
      downloadedAt: updates.downloadedAt ?? Date.now(),
      completedAt: updates.completedAt,
      error: updates.error,
-      format: updates.format,
-      quality: updates.quality,
-      codec: updates.codec,
      description: updates.description,
      channel: updates.channel,
      uploader: updates.uploader,
      viewCount: updates.viewCount,
-      tags: updates.tags,
+      tags: updates.tags ?? options.tags,
+      origin: updates.origin ?? options.origin,
+      subscriptionId: updates.subscriptionId ?? options.subscriptionId,
      // Download-specific format info
      selectedFormat: updates.selectedFormat,
      playlistId: updates.playlistId,
@@ -965,7 +1153,11 @@ class DownloadEngine extends EventEmitter {
      type: updates.type ?? base.type,
      title: updates.title ?? base.title,
      status: updates.status ?? base.status,
-      downloadedAt: updates.downloadedAt ?? base.downloadedAt
+      downloadedAt: updates.downloadedAt ?? base.downloadedAt,
+      downloadPath: resolvedDownloadPath ?? base.downloadPath,
+      tags: updates.tags ?? base.tags,
+      origin: updates.origin ?? base.origin,
+      subscriptionId: updates.subscriptionId ?? base.subscriptionId
    }

    historyManager.addHistoryItem(merged)
--- a/src/main/lib/ffmpeg-manager.ts
+++ b/src/main/lib/ffmpeg-manager.ts
@@ -2,13 +2,14 @@ import { execSync } from 'node:child_process'
 import fs from 'node:fs'
 import os from 'node:os'
 import path from 'node:path'
+import { scopedLoggers } from '../utils/logger'

 class FfmpegManager {
  private ffmpegPath: string | null = null

  async initialize(): Promise<void> {
    this.ffmpegPath = await this.findFfmpegBinary()
-    console.log('ffmpeg initialized at:', this.ffmpegPath)
+    scopedLoggers.engine.info('ffmpeg initialized at:', this.ffmpegPath)
  }

  getPath(): string {
@@ -30,7 +31,7 @@ class FfmpegManager {
    const resourceCandidates: string[] = []

    if (process.env.FFMPEG_PATH && fs.existsSync(process.env.FFMPEG_PATH)) {
-      console.log('Using ffmpeg from FFMPEG_PATH:', process.env.FFMPEG_PATH)
+      scopedLoggers.engine.info('Using ffmpeg from FFMPEG_PATH:', process.env.FFMPEG_PATH)
      return process.env.FFMPEG_PATH
    }

@@ -50,10 +51,13 @@ class FfmpegManager {
          try {
            fs.chmodSync(fullPath, 0o755)
          } catch (error) {
-            console.warn('Failed to set executable permission on ffmpeg binary:', error)
+            scopedLoggers.engine.warn(
+              'Failed to set executable permission on ffmpeg binary:',
+              error
+            )
          }
        }
-        console.log('Using bundled ffmpeg:', fullPath)
+        scopedLoggers.engine.info('Using bundled ffmpeg:', fullPath)
        return fullPath
      }
    }
@@ -62,7 +66,7 @@ class FfmpegManager {
      const commonPaths = ['/opt/homebrew/bin/ffmpeg', '/usr/local/bin/ffmpeg']
      for (const candidate of commonPaths) {
        if (fs.existsSync(candidate)) {
-          console.log('Using system ffmpeg:', candidate)
+          scopedLoggers.engine.info('Using system ffmpeg:', candidate)
          return candidate
        }
      }
@@ -72,7 +76,7 @@ class FfmpegManager {
      try {
        const systemPath = execSync('which ffmpeg').toString().trim()
        if (systemPath && fs.existsSync(systemPath)) {
-          console.log('Using system ffmpeg:', systemPath)
+          scopedLoggers.engine.info('Using system ffmpeg:', systemPath)
          return systemPath
        }
      } catch (_error) {
@@ -84,7 +88,7 @@ class FfmpegManager {
      try {
        const output = execSync('where ffmpeg').toString().split(/\r?\n/)[0]
        if (output && fs.existsSync(output)) {
-          console.log('Using system ffmpeg:', output)
+          scopedLoggers.engine.info('Using system ffmpeg:', output)
          return output
        }
      } catch (_error) {
--- a/src/main/lib/history-manager.ts
+++ b/src/main/lib/history-manager.ts
@@ -1,52 +1,476 @@
-// Use require for electron-store to avoid CommonJS/ESM issues
-const ElectronStore = require('electron-store')
-// Access the default export
-const Store = ElectronStore.default || ElectronStore
-
+import { existsSync, readFileSync, renameSync } from 'node:fs'
+import { join } from 'node:path'
+import DatabaseConstructor from 'better-sqlite3'
+import { eq, inArray, sql } from 'drizzle-orm'
+import type { BetterSQLite3Database } from 'drizzle-orm/better-sqlite3'
+import { drizzle } from 'drizzle-orm/better-sqlite3'
+import { integer, sqliteTable, text } from 'drizzle-orm/sqlite-core'
+import { app } from 'electron'
+import log from 'electron-log/main'
 import type { DownloadHistoryItem } from '../../shared/types'
+import { runMigrations } from './database/migrate'
+import {
+  type DownloadHistoryInsert,
+  type DownloadHistoryRow,
+  downloadHistoryTable
+} from './database/schema'
+import { getDatabaseFilePath } from './database-path'
+
+const logger = log.scope('history-manager')
+
+const TAG_SEPARATOR = '\n'
+
+const createDownloadHistoryTableSql = sql`
+  CREATE TABLE IF NOT EXISTS download_history (
+    id TEXT PRIMARY KEY,
+    url TEXT NOT NULL,
+    title TEXT NOT NULL,
+    thumbnail TEXT,
+    type TEXT NOT NULL,
+    status TEXT NOT NULL,
+    download_path TEXT,
+    saved_file_name TEXT,
+    file_size INTEGER,
+    duration INTEGER,
+    downloaded_at INTEGER NOT NULL,
+    completed_at INTEGER,
+    sort_key INTEGER NOT NULL,
+    error TEXT,
+    description TEXT,
+    channel TEXT,
+    uploader TEXT,
+    view_count INTEGER,
+    tags TEXT,
+    origin TEXT,
+    subscription_id TEXT,
+    selected_format TEXT,
+    playlist_id TEXT,
+    playlist_title TEXT,
+    playlist_index INTEGER,
+    playlist_size INTEGER
+  )
+`
+
+const renameDownloadHistoryTableSql = sql`
+  ALTER TABLE download_history RENAME TO download_history_legacy
+`
+
+const dropLegacyDownloadHistoryTableSql = sql`
+  DROP TABLE download_history_legacy
+`
+
+const copyDownloadHistoryFromLegacySql = sql`
+  INSERT INTO download_history (
+    id,
+    url,
+    title,
+    thumbnail,
+    type,
+    status,
+    download_path,
+    saved_file_name,
+    file_size,
+    duration,
+    downloaded_at,
+    completed_at,
+    sort_key,
+    error,
+    description,
+    channel,
+    uploader,
+    view_count,
+    tags,
+    origin,
+    subscription_id,
+    selected_format,
+    playlist_id,
+    playlist_title,
+    playlist_index,
+    playlist_size
+  )
+  SELECT
+    id,
+    url,
+    title,
+    thumbnail,
+    type,
+    status,
+    download_path,
+    saved_file_name,
+    file_size,
+    duration,
+    downloaded_at,
+    completed_at,
+    sort_key,
+    error,
+    description,
+    channel,
+    uploader,
+    view_count,
+    tags,
+    origin,
+    subscription_id,
+    selected_format,
+    playlist_id,
+    playlist_title,
+    playlist_index,
+    playlist_size
+  FROM download_history_legacy
+`
+
+const sanitizeList = (values?: string[]): string[] => {
+  if (!values || values.length === 0) {
+    return []
+  }
+  return values
+    .map((value) => value.trim())
+    .filter((value, index, array) => value.length > 0 && array.indexOf(value) === index)
+}
+
+const serializeTags = (values?: string[]): string | null => {
+  const sanitized = sanitizeList(values)
+  return sanitized.length > 0 ? sanitized.join(TAG_SEPARATOR) : null
+}
+
+const parseTags = (value: string | null): string[] | undefined => {
+  if (!value) {
+    return undefined
+  }
+  const parsed = value
+    .split(TAG_SEPARATOR)
+    .map((tag) => tag.trim())
+    .filter((tag, index, array) => tag.length > 0 && array.indexOf(tag) === index)
+  return parsed.length > 0 ? parsed : undefined
+}
+
+const legacyDownloadHistoryTable = sqliteTable('download_history_legacy', {
+  id: text('id').primaryKey(),
+  status: text('status').notNull(),
+  downloadedAt: integer('downloaded_at', { mode: 'number' }).notNull(),
+  completedAt: integer('completed_at', { mode: 'number' }),
+  sortKey: integer('sort_key', { mode: 'number' }).notNull(),
+  payload: text('payload').notNull()
+})
+type LegacyDownloadHistoryRow = typeof legacyDownloadHistoryTable.$inferSelect

 class HistoryManager {
-  // biome-ignore lint/suspicious/noExplicitAny: electron-store requires dynamic import
-  private store: any
+  private db: BetterSQLite3Database | null = null
  private history: Map<string, DownloadHistoryItem> = new Map()
+  private schemaChecked = false
+  private migrationChecked = false

  constructor() {
-    this.store = new Store({
-      name: 'download-history',
-      defaults: {
-        items: []
-      }
-    })
-    this.loadHistory()
+    this.initialize()
  }

-  private loadHistory(): void {
+  private initialize(): void {
    try {
-      const historyArray = this.store.get('items', [])
-      this.history = new Map(historyArray.map((item) => [item.id, item]))
+      this.getDatabase()
+      this.ensureStructuredSchema()
+      this.ensureLegacyMigration()
+      this.loadHistoryFromDatabase()
    } catch (error) {
-      console.error('Failed to load download history:', error)
+      logger.error('history-db failed to initialize', error)
    }
  }

-  private saveHistory(): void {
+  private getDatabase(): BetterSQLite3Database {
+    if (this.db) {
+      return this.db
+    }
+
+    const databasePath = this.getDatabasePath()
+
+    const sqlite = new DatabaseConstructor(databasePath, { timeout: 5000 })
+    sqlite.pragma('journal_mode = WAL')
+    sqlite.pragma('foreign_keys = ON')
+
+    const database = drizzle(sqlite)
+    runMigrations(database)
+
+    this.db = database
+    logger.info(`history-db initialized at ${databasePath}`)
+    return this.db
+  }
+
+  private getDatabasePath(): string {
+    return getDatabaseFilePath()
+  }
+
+  private getLegacyStorePath(): string {
+    return join(app.getPath('userData'), 'download-history.json')
+  }
+
+  private ensureStructuredSchema(): void {
+    if (this.schemaChecked) {
+      return
+    }
+    this.schemaChecked = true
+
    try {
-      const historyArray = Array.from(this.history.values())
-      this.store.set('items', historyArray)
+      const database = this.getDatabase()
+      const columns = database.all<{ name: string }>(sql`PRAGMA table_info(download_history)`)
+      const hasPayloadColumn = columns.some((column) => column.name === 'payload')
+      const hasUrlColumn = columns.some((column) => column.name === 'url')
+      if (hasPayloadColumn || !hasUrlColumn) {
+        this.migrateLegacyPayloadTable()
+        return
+      }
+
+      const deprecatedColumns = ['subscription_title', 'format', 'quality', 'codec']
+      const needsRebuild = columns.some((column) => deprecatedColumns.includes(column.name))
+      if (needsRebuild) {
+        this.rebuildDownloadHistoryTable()
+      }
    } catch (error) {
-      console.error('Failed to save download history:', error)
+      logger.error('history-db failed to inspect schema', error)
+    }
+  }
+
+  private migrateLegacyPayloadTable(): void {
+    const database = this.getDatabase()
+    logger.info('history-db migrating legacy payload schema to structured columns')
+
+    try {
+      let migratedCount = 0
+      database.transaction(
+        (tx) => {
+          tx.run(renameDownloadHistoryTableSql)
+          tx.run(createDownloadHistoryTableSql)
+
+          const legacyRows = tx.select().from(legacyDownloadHistoryTable).all()
+          migratedCount = legacyRows.length
+          for (const legacyRow of legacyRows) {
+            const normalized = this.normalizeItem(this.mapLegacyRowToItem(legacyRow))
+            tx.insert(downloadHistoryTable).values(this.mapItemToInsert(normalized)).run()
+          }
+
+          tx.run(dropLegacyDownloadHistoryTableSql)
+        },
+        { behavior: 'immediate' }
+      )
+      logger.info(`history-db migrated ${migratedCount} rows to new schema`)
+    } catch (error) {
+      logger.error('history-db failed to migrate legacy payload rows', error)
+      throw error
+    }
+  }
+
+  private rebuildDownloadHistoryTable(): void {
+    const database = this.getDatabase()
+    logger.info('history-db rebuilding download_history table to latest schema')
+
+    try {
+      database.transaction(
+        (tx) => {
+          tx.run(renameDownloadHistoryTableSql)
+          tx.run(createDownloadHistoryTableSql)
+          tx.run(copyDownloadHistoryFromLegacySql)
+          tx.run(dropLegacyDownloadHistoryTableSql)
+        },
+        { behavior: 'immediate' }
+      )
+      logger.info('history-db rebuilt download_history table')
+    } catch (error) {
+      logger.error('history-db failed to rebuild download_history schema', error)
+      throw error
+    }
+  }
+
+  private mapLegacyRowToItem(row: LegacyDownloadHistoryRow): DownloadHistoryItem {
+    try {
+      const parsed = JSON.parse(row.payload) as DownloadHistoryItem
+      return {
+        ...parsed,
+        status: (parsed.status ?? row.status) as DownloadHistoryItem['status'],
+        downloadedAt: parsed.downloadedAt ?? row.downloadedAt,
+        completedAt: parsed.completedAt ?? row.completedAt ?? undefined
+      }
+    } catch (error) {
+      logger.warn('history-db falling back while migrating payload row', { id: row.id, error })
+      return {
+        id: row.id,
+        url: row.id,
+        title: `Download ${row.id}`,
+        type: 'video',
+        status: row.status as DownloadHistoryItem['status'],
+        downloadedAt: row.downloadedAt,
+        completedAt: row.completedAt ?? undefined
+      }
+    }
+  }
+
+  private ensureLegacyMigration(): void {
+    if (this.migrationChecked) {
+      return
+    }
+    this.migrationChecked = true
+
+    const legacyPath = this.getLegacyStorePath()
+    if (!existsSync(legacyPath)) {
+      return
+    }
+
+    try {
+      const raw = readFileSync(legacyPath, 'utf-8')
+      const parsed = JSON.parse(raw) as { items?: DownloadHistoryItem[] }
+      const items = parsed.items ?? []
+      if (items.length === 0) {
+        return
+      }
+
+      const database = this.getDatabase()
+      for (const legacyItem of items) {
+        const normalized = this.normalizeItem(legacyItem)
+        const insertPayload = this.mapItemToInsert(normalized)
+        database
+          .insert(downloadHistoryTable)
+          .values(insertPayload)
+          .onConflictDoUpdate({
+            target: downloadHistoryTable.id,
+            set: this.mapItemToUpdate(insertPayload)
+          })
+          .run()
+      }
+
+      try {
+        renameSync(legacyPath, `${legacyPath}.bak`)
+      } catch (renameError) {
+        logger.warn(
+          'history-db migrated legacy store but could not rename original file',
+          renameError
+        )
+      }
+
+      logger.info(`history-db migrated ${items.length} entries from legacy electron-store data`)
+    } catch (error) {
+      logger.error('history-db failed to migrate legacy store', error)
+    }
+  }
+
+  private loadHistoryFromDatabase(): void {
+    try {
+      const database = this.getDatabase()
+      const rows = database.select().from(downloadHistoryTable).all()
+      this.history = new Map(rows.map((row) => [row.id, this.mapRowToItem(row)]))
+    } catch (error) {
+      logger.error('history-db failed to load rows', error)
+      this.history = new Map()
+    }
+  }
+
+  private normalizeItem(item: DownloadHistoryItem): DownloadHistoryItem {
+    const fallbackTimestamp = Date.now()
+    const downloadedAt = item.downloadedAt ?? item.completedAt ?? fallbackTimestamp
+    const status = item.status ?? 'pending'
+
+    return {
+      ...item,
+      status,
+      downloadedAt
+    }
+  }
+
+  private mapItemToInsert(item: DownloadHistoryItem): DownloadHistoryInsert {
+    return {
+      id: item.id,
+      url: item.url,
+      title: item.title,
+      thumbnail: item.thumbnail ?? null,
+      type: item.type,
+      status: item.status,
+      downloadPath: item.downloadPath ?? null,
+      savedFileName: item.savedFileName ?? null,
+      fileSize: item.fileSize ?? null,
+      duration: item.duration ?? null,
+      downloadedAt: item.downloadedAt,
+      completedAt: item.completedAt ?? null,
+      sortKey: item.completedAt ?? item.downloadedAt,
+      error: item.error ?? null,
+      description: item.description ?? null,
+      channel: item.channel ?? null,
+      uploader: item.uploader ?? null,
+      viewCount: item.viewCount ?? null,
+      tags: serializeTags(item.tags) ?? null,
+      origin: item.origin ?? null,
+      subscriptionId: item.subscriptionId ?? null,
+      selectedFormat: item.selectedFormat ? JSON.stringify(item.selectedFormat) : null,
+      playlistId: item.playlistId ?? null,
+      playlistTitle: item.playlistTitle ?? null,
+      playlistIndex: item.playlistIndex ?? null,
+      playlistSize: item.playlistSize ?? null
+    }
+  }
+
+  private mapItemToUpdate(payload: DownloadHistoryInsert): Omit<DownloadHistoryInsert, 'id'> {
+    const { id: _id, ...rest } = payload
+    return rest
+  }
+
+  private mapRowToItem(row: DownloadHistoryRow): DownloadHistoryItem {
+    let selectedFormat: DownloadHistoryItem['selectedFormat']
+    if (row.selectedFormat) {
+      try {
+        selectedFormat = JSON.parse(row.selectedFormat) as DownloadHistoryItem['selectedFormat']
+      } catch (error) {
+        logger.warn('history-db failed to parse stored selectedFormat', { id: row.id, error })
+      }
+    }
+
+    const tags = parseTags(row.tags ?? null)
+
+    return {
+      id: row.id,
+      url: row.url,
+      title: row.title,
+      thumbnail: row.thumbnail ?? undefined,
+      type: row.type as DownloadHistoryItem['type'],
+      status: row.status as DownloadHistoryItem['status'],
+      downloadPath: row.downloadPath ?? undefined,
+      savedFileName: row.savedFileName ?? undefined,
+      fileSize: row.fileSize ?? undefined,
+      duration: row.duration ?? undefined,
+      downloadedAt: row.downloadedAt,
+      completedAt: row.completedAt ?? undefined,
+      error: row.error ?? undefined,
+      description: row.description ?? undefined,
+      channel: row.channel ?? undefined,
+      uploader: row.uploader ?? undefined,
+      viewCount: row.viewCount ?? undefined,
+      tags,
+      origin: row.origin ? (row.origin as DownloadHistoryItem['origin']) : undefined,
+      subscriptionId: row.subscriptionId ?? undefined,
+      selectedFormat,
+      playlistId: row.playlistId ?? undefined,
+      playlistTitle: row.playlistTitle ?? undefined,
+      playlistIndex: row.playlistIndex ?? undefined,
+      playlistSize: row.playlistSize ?? undefined
    }
  }

  addHistoryItem(item: DownloadHistoryItem): void {
-    this.history.set(item.id, item)
-    this.saveHistory()
+    const normalized = this.normalizeItem(item)
+    const insertPayload = this.mapItemToInsert(normalized)
+    try {
+      const database = this.getDatabase()
+      database
+        .insert(downloadHistoryTable)
+        .values(insertPayload)
+        .onConflictDoUpdate({
+          target: downloadHistoryTable.id,
+          set: this.mapItemToUpdate(insertPayload)
+        })
+        .run()
+      this.history.set(normalized.id, normalized)
+    } catch (error) {
+      logger.error('history-db failed to upsert item', { id: normalized.id, error })
+    }
  }

  getHistory(): DownloadHistoryItem[] {
    return Array.from(this.history.values()).sort((a, b) => {
-      const aTime = a.completedAt || a.downloadedAt
-      const bTime = b.completedAt || b.downloadedAt
+      const aTime = a.completedAt ?? a.downloadedAt
+      const bTime = b.completedAt ?? b.downloadedAt
      return bTime - aTime
    })
  }
@@ -56,30 +480,107 @@ class HistoryManager {
  }

  removeHistoryItem(id: string): boolean {
-    const deleted = this.history.delete(id)
-    if (deleted) {
-      this.saveHistory()
+    try {
+      const database = this.getDatabase()
+      const result = database
+        .delete(downloadHistoryTable)
+        .where(eq(downloadHistoryTable.id, id))
+        .run()
+      const removedFromMap = this.history.delete(id)
+      return result.changes > 0 || removedFromMap
+    } catch (error) {
+      logger.error('history-db failed to delete item', { id, error })
+      return false
+    }
+  }
+
+  removeHistoryItems(ids: string[]): number {
+    const uniqueIds = Array.from(new Set(ids)).filter((id) => id.trim().length > 0)
+    if (uniqueIds.length === 0) {
+      return 0
+    }
+    let removedCount = 0
+    try {
+      const database = this.getDatabase()
+      const result = database
+        .delete(downloadHistoryTable)
+        .where(inArray(downloadHistoryTable.id, uniqueIds))
+        .run()
+      for (const id of uniqueIds) {
+        if (this.history.delete(id)) {
+          removedCount++
+        }
+      }
+      if ((result.changes ?? 0) > removedCount) {
+        removedCount = result.changes ?? removedCount
+      }
+      return removedCount
+    } catch (error) {
+      logger.error('history-db failed to delete items', { count: uniqueIds.length, error })
+      return removedCount
+    }
+  }
+
+  removeHistoryByPlaylistId(playlistId: string): number {
+    const normalized = playlistId.trim()
+    if (!normalized) {
+      return 0
+    }
+    let removedCount = 0
+    try {
+      const database = this.getDatabase()
+      const result = database
+        .delete(downloadHistoryTable)
+        .where(eq(downloadHistoryTable.playlistId, normalized))
+        .run()
+      for (const [id, item] of this.history.entries()) {
+        if (item.playlistId === normalized) {
+          this.history.delete(id)
+          removedCount++
+        }
+      }
+      if ((result.changes ?? 0) > removedCount) {
+        removedCount = result.changes ?? removedCount
+      }
+      return removedCount
+    } catch (error) {
+      logger.error('history-db failed to delete playlist items', { playlistId: normalized, error })
+      return removedCount
    }
-    return deleted
  }

  clearHistory(): void {
-    this.history.clear()
-    this.saveHistory()
+    try {
+      const database = this.getDatabase()
+      database.delete(downloadHistoryTable).run()
+      this.history.clear()
+    } catch (error) {
+      logger.error('history-db failed to clear items', error)
+    }
  }

  clearHistoryByStatus(status: DownloadHistoryItem['status']): number {
    let removedCount = 0
-    for (const [id, item] of this.history.entries()) {
-      if (item.status === status) {
-        this.history.delete(id)
-        removedCount++
+    try {
+      const database = this.getDatabase()
+      const result = database
+        .delete(downloadHistoryTable)
+        .where(eq(downloadHistoryTable.status, status))
+        .run()
+      for (const [id, item] of this.history.entries()) {
+        if (item.status === status) {
+          this.history.delete(id)
+          removedCount++
+        }
      }
+      if ((result.changes ?? 0) > removedCount) {
+        removedCount = result.changes ?? removedCount
+      }
+      return removedCount
+    } catch (error) {
+      logger.error('history-db failed to clear items by status', { status, error })
+      return removedCount
    }
-    if (removedCount > 0) {
-      this.saveHistory()
-    }
-    return removedCount
  }

  getHistoryCount(): {
@@ -111,6 +612,15 @@ class HistoryManager {

    return counts
  }
+
+  hasHistoryForUrl(url: string): boolean {
+    for (const item of this.history.values()) {
+      if (item.url === url) {
+        return true
+      }
+    }
+    return false
+  }
 }

 export const historyManager = new HistoryManager()
--- a/src/main/lib/subscription-manager.ts
+++ b/src/main/lib/subscription-manager.ts
@@ -0,0 +1,643 @@
+import { randomUUID } from 'node:crypto'
+import { EventEmitter } from 'node:events'
+import fs from 'node:fs'
+import type { Database as BetterSqlite3Instance } from 'better-sqlite3'
+import DatabaseConstructor from 'better-sqlite3'
+import { and, desc, eq, inArray } from 'drizzle-orm'
+import type { BetterSQLite3Database } from 'drizzle-orm/better-sqlite3'
+import { drizzle } from 'drizzle-orm/better-sqlite3'
+import log from 'electron-log/main'
+import type {
+  SubscriptionCreatePayload,
+  SubscriptionFeedItem,
+  SubscriptionRule,
+  SubscriptionStatus,
+  SubscriptionUpdatePayload
+} from '../../shared/types'
+import { sanitizeFilenameTemplate } from '../download-engine/args-builder'
+import { runMigrations } from './database/migrate'
+import {
+  type SubscriptionInsert,
+  type SubscriptionItemRow,
+  type SubscriptionRow,
+  subscriptionItemsTable,
+  subscriptionsTable
+} from './database/schema'
+import { getDatabaseFilePath } from './database-path'
+
+const sanitizeList = (values?: string[]): string[] => {
+  if (!values || values.length === 0) {
+    return []
+  }
+  return values
+    .map((value) => value.trim())
+    .filter((value, index, array) => value.length > 0 && array.indexOf(value) === index)
+}
+
+const ensureDirectoryExists = (dir?: string): void => {
+  if (!dir) {
+    return
+  }
+  try {
+    fs.mkdirSync(dir, { recursive: true })
+  } catch (error) {
+    log.error('Failed to ensure subscription directory:', error)
+  }
+}
+
+const booleanToNumber = (value: boolean): number => (value ? 1 : 0)
+const numberToBoolean = (value: number | null | undefined): boolean => value === 1
+
+const parseStringArray = (value: string | null | undefined): string[] => {
+  if (!value) {
+    return []
+  }
+  try {
+    const parsed = JSON.parse(value) as unknown
+    return Array.isArray(parsed) ? sanitizeList(parsed as string[]) : []
+  } catch {
+    return []
+  }
+}
+
+const stringifyArray = (values: string[]): string => JSON.stringify(sanitizeList(values))
+
+export class SubscriptionManager extends EventEmitter {
+  private sqlite: BetterSqlite3Instance | null = null
+  private db: BetterSQLite3Database | null = null
+
+  constructor() {
+    super()
+    try {
+      this.getDatabase()
+      this.migrateLegacyStore()
+    } catch (error) {
+      log.error('subscriptions: failed to initialize database', error)
+    }
+  }
+
+  getAll(): SubscriptionRule[] {
+    const database = this.getDatabase()
+    const rows = database
+      .select()
+      .from(subscriptionsTable)
+      .orderBy(desc(subscriptionsTable.updatedAt))
+      .all()
+    return this.attachFeedItems(rows.map((row) => this.mapRowToRecord(row)))
+  }
+
+  getById(id: string): SubscriptionRule | undefined {
+    const database = this.getDatabase()
+    const row = database
+      .select()
+      .from(subscriptionsTable)
+      .where(eq(subscriptionsTable.id, id))
+      .get()
+    if (!row) {
+      return undefined
+    }
+    return this.attachFeedItems([this.mapRowToRecord(row)])[0]
+  }
+
+  add(payload: SubscriptionCreatePayload): SubscriptionRule {
+    const timestamp = Date.now()
+    const keywords = sanitizeList(payload.keywords)
+    const tags = sanitizeList(payload.tags)
+    const record: SubscriptionRule = {
+      id: randomUUID(),
+      title: payload.sourceUrl,
+      sourceUrl: payload.sourceUrl,
+      feedUrl: payload.feedUrl,
+      platform: payload.platform,
+      keywords,
+      tags,
+      onlyDownloadLatest: payload.onlyDownloadLatest ?? true,
+      enabled: payload.enabled ?? true,
+      coverUrl: undefined,
+      latestVideoTitle: undefined,
+      latestVideoPublishedAt: undefined,
+      lastCheckedAt: undefined,
+      lastSuccessAt: undefined,
+      status: 'idle',
+      lastError: undefined,
+      createdAt: timestamp,
+      updatedAt: timestamp,
+      downloadDirectory: payload.downloadDirectory,
+      namingTemplate: payload.namingTemplate
+        ? sanitizeFilenameTemplate(payload.namingTemplate)
+        : undefined,
+      items: []
+    }
+
+    ensureDirectoryExists(payload.downloadDirectory)
+    this.insertRecord(record)
+    this.emitUpdates()
+    return record
+  }
+
+  update(
+    id: string,
+    updates: SubscriptionUpdatePayload & Partial<SubscriptionRule>
+  ): SubscriptionRule | undefined {
+    const existing = this.getById(id)
+    if (!existing) {
+      return undefined
+    }
+
+    const keywords = updates.keywords ? sanitizeList(updates.keywords) : undefined
+    const tags = updates.tags ? sanitizeList(updates.tags) : undefined
+    const next: SubscriptionRule = {
+      ...existing,
+      ...updates,
+      keywords: keywords ?? existing.keywords,
+      tags: tags ?? existing.tags,
+      updatedAt: Date.now()
+    }
+
+    // If sourceUrl is updated but title is not explicitly set, update title to match sourceUrl
+    if (updates.sourceUrl && !updates.title && updates.sourceUrl !== existing.sourceUrl) {
+      next.title = updates.sourceUrl
+    }
+
+    if (updates.namingTemplate) {
+      next.namingTemplate = sanitizeFilenameTemplate(updates.namingTemplate)
+    }
+
+    ensureDirectoryExists(next.downloadDirectory)
+    this.updateRecord(next)
+    this.emitUpdates()
+    return next
+  }
+
+  remove(id: string): boolean {
+    const database = this.getDatabase()
+    const result = database.delete(subscriptionsTable).where(eq(subscriptionsTable.id, id)).run()
+    if ((result.changes ?? 0) > 0) {
+      database
+        .delete(subscriptionItemsTable)
+        .where(eq(subscriptionItemsTable.subscriptionId, id))
+        .run()
+      this.emitUpdates()
+      return true
+    }
+    return false
+  }
+
+  replaceFeedItems(
+    subscriptionId: string,
+    items: SubscriptionFeedItem[],
+    silent: boolean = false
+  ): void {
+    const database = this.getDatabase()
+    const orderedItems = [...items].sort((a, b) => b.publishedAt - a.publishedAt)
+    const now = Date.now()
+    database.transaction((tx) => {
+      tx.delete(subscriptionItemsTable)
+        .where(eq(subscriptionItemsTable.subscriptionId, subscriptionId))
+        .run()
+      for (const item of orderedItems) {
+        tx.insert(subscriptionItemsTable)
+          .values({
+            subscriptionId,
+            itemId: item.id,
+            title: item.title,
+            url: item.url,
+            publishedAt: item.publishedAt,
+            thumbnail: item.thumbnail ?? null,
+            added: booleanToNumber(item.addedToQueue),
+            downloadId: item.downloadId ?? null,
+            createdAt: item.publishedAt,
+            updatedAt: now
+          })
+          .run()
+      }
+    })
+    if (!silent) {
+      this.emitUpdates()
+    }
+  }
+
+  updateFeedItemQueueState(
+    subscriptionId: string,
+    itemId: string,
+    updates: { added?: boolean; downloadId?: string | null }
+  ): void {
+    if (updates.added === undefined && !Object.hasOwn(updates, 'downloadId')) {
+      return
+    }
+
+    const setPayload: Partial<typeof subscriptionItemsTable.$inferInsert> = {
+      updatedAt: Date.now()
+    }
+
+    if (updates.added !== undefined) {
+      setPayload.added = booleanToNumber(updates.added)
+    }
+    if (Object.hasOwn(updates, 'downloadId')) {
+      setPayload.downloadId = updates.downloadId ?? null
+    }
+
+    const database = this.getDatabase()
+    const result = database
+      .update(subscriptionItemsTable)
+      .set(setPayload)
+      .where(
+        and(
+          eq(subscriptionItemsTable.subscriptionId, subscriptionId),
+          eq(subscriptionItemsTable.itemId, itemId)
+        )
+      )
+      .run()
+
+    if ((result.changes ?? 0) > 0) {
+      this.emitUpdates()
+    }
+  }
+
+  private attachFeedItems(records: SubscriptionRule[]): SubscriptionRule[] {
+    if (records.length === 0) {
+      return records
+    }
+    const ids = records.map((record) => record.id)
+    const database = this.getDatabase()
+    const rows = database
+      .select()
+      .from(subscriptionItemsTable)
+      .where(inArray(subscriptionItemsTable.subscriptionId, ids))
+      .orderBy(desc(subscriptionItemsTable.publishedAt))
+      .all()
+
+    const grouped = new Map<string, SubscriptionFeedItem[]>()
+    for (const row of rows) {
+      const item = this.mapItemRowToFeedItem(row)
+      const list = grouped.get(row.subscriptionId)
+      if (list) {
+        list.push(item)
+      } else {
+        grouped.set(row.subscriptionId, [item])
+      }
+    }
+
+    return records.map((record) => ({
+      ...record,
+      items: grouped.get(record.id) ?? []
+    }))
+  }
+
+  private getDatabase(): BetterSQLite3Database {
+    if (this.db) {
+      return this.db
+    }
+
+    const databasePath = this.getDatabasePath()
+    this.sqlite = new DatabaseConstructor(databasePath, { timeout: 5000 })
+    this.sqlite.pragma('journal_mode = WAL')
+    this.sqlite.pragma('foreign_keys = ON')
+    this.db = drizzle(this.sqlite)
+    runMigrations(this.db)
+    this.ensureSubscriptionsSchema()
+    this.ensureItemsSchema()
+    log.info('subscriptions: database initialized at', databasePath)
+    return this.db
+  }
+
+  private ensureItemsSchema(): void {
+    if (!this.sqlite) {
+      return
+    }
+    try {
+      const columns = this.sqlite.prepare(`PRAGMA table_info(subscription_items)`).all() as Array<{
+        name: string
+      }>
+      const hasAdded = columns.some((column) => column.name === 'added')
+      if (!hasAdded) {
+        this.sqlite
+          .prepare(`ALTER TABLE subscription_items ADD COLUMN added INTEGER NOT NULL DEFAULT 0`)
+          .run()
+      }
+      const hasDownloaded = columns.some((column) => column.name === 'downloaded')
+      const hasLegacyStatus = columns.some((column) => column.name === 'status')
+      const needsMigration = hasDownloaded || hasLegacyStatus
+      if (needsMigration) {
+        if (hasDownloaded) {
+          this.sqlite.prepare(`UPDATE subscription_items SET added = 1 WHERE downloaded = 1`).run()
+        }
+        const sqlite = this.sqlite
+        const migrate = sqlite.transaction(() => {
+          sqlite.prepare(`DROP TABLE IF EXISTS subscription_items_new`).run()
+          sqlite
+            .prepare(
+              `CREATE TABLE subscription_items_new (
+                subscription_id TEXT NOT NULL,
+                item_id TEXT NOT NULL,
+                title TEXT NOT NULL,
+                url TEXT NOT NULL,
+                published_at INTEGER NOT NULL,
+                thumbnail TEXT,
+                added INTEGER NOT NULL,
+                download_id TEXT,
+                created_at INTEGER NOT NULL,
+                updated_at INTEGER NOT NULL,
+                PRIMARY KEY (subscription_id, item_id)
+              )`
+            )
+            .run()
+          sqlite
+            .prepare(
+              `INSERT INTO subscription_items_new (
+                subscription_id,
+                item_id,
+                title,
+                url,
+                published_at,
+                thumbnail,
+                added,
+                download_id,
+                created_at,
+                updated_at
+              )
+              SELECT
+                subscription_id,
+                item_id,
+                title,
+                url,
+                published_at,
+                thumbnail,
+                added,
+                download_id,
+                created_at,
+                updated_at
+              FROM subscription_items`
+            )
+            .run()
+          sqlite.prepare(`DROP TABLE subscription_items`).run()
+          sqlite.prepare(`ALTER TABLE subscription_items_new RENAME TO subscription_items`).run()
+          sqlite
+            .prepare(
+              'CREATE INDEX IF NOT EXISTS subscription_items_subscription_idx ON subscription_items (subscription_id)'
+            )
+            .run()
+        })
+        migrate()
+        log.info('subscriptions: removed legacy columns from subscription_items')
+      }
+    } catch (error) {
+      log.warn('subscriptions: failed to ensure subscription_items schema', error)
+    }
+  }
+
+  private ensureSubscriptionsSchema(): void {
+    if (!this.sqlite) {
+      return
+    }
+    try {
+      const columns = this.sqlite.prepare(`PRAGMA table_info(subscriptions)`).all() as Array<{
+        name: string
+      }>
+      const hasLegacyColumns = columns.some((column) =>
+        ['seen_item_ids', 'last_item_id'].includes(column.name)
+      )
+      if (!hasLegacyColumns) {
+        return
+      }
+      const sqlite = this.sqlite
+      const migrate = sqlite.transaction(() => {
+        sqlite.prepare(`DROP TABLE IF EXISTS subscriptions_new`).run()
+        sqlite
+          .prepare(
+            `CREATE TABLE subscriptions_new (
+              id TEXT PRIMARY KEY,
+              title TEXT NOT NULL,
+              source_url TEXT NOT NULL,
+              feed_url TEXT NOT NULL,
+              platform TEXT NOT NULL,
+              keywords TEXT NOT NULL,
+              tags TEXT NOT NULL,
+              only_latest INTEGER NOT NULL,
+              enabled INTEGER NOT NULL,
+              cover_url TEXT,
+              latest_video_title TEXT,
+              latest_video_published_at INTEGER,
+              last_checked_at INTEGER,
+              last_success_at INTEGER,
+              status TEXT NOT NULL,
+              last_error TEXT,
+              created_at INTEGER NOT NULL,
+              updated_at INTEGER NOT NULL,
+              download_directory TEXT,
+              naming_template TEXT
+            )`
+          )
+          .run()
+        sqlite
+          .prepare(
+            `INSERT INTO subscriptions_new (
+              id,
+              title,
+              source_url,
+              feed_url,
+              platform,
+              keywords,
+              tags,
+              only_latest,
+              enabled,
+              cover_url,
+              latest_video_title,
+              latest_video_published_at,
+              last_checked_at,
+              last_success_at,
+              status,
+              last_error,
+              created_at,
+              updated_at,
+              download_directory,
+              naming_template
+            )
+            SELECT
+              id,
+              title,
+              source_url,
+              feed_url,
+              platform,
+              keywords,
+              tags,
+              only_latest,
+              enabled,
+              cover_url,
+              latest_video_title,
+              latest_video_published_at,
+              last_checked_at,
+              last_success_at,
+              status,
+              last_error,
+              created_at,
+              updated_at,
+              download_directory,
+              naming_template
+            FROM subscriptions`
+          )
+          .run()
+        sqlite.prepare(`DROP TABLE subscriptions`).run()
+        sqlite.prepare(`ALTER TABLE subscriptions_new RENAME TO subscriptions`).run()
+      })
+      migrate()
+      log.info('subscriptions: removed legacy seen_item_ids and last_item_id columns')
+    } catch (error) {
+      log.warn('subscriptions: failed to ensure subscriptions schema', error)
+    }
+  }
+
+  private getDatabasePath(): string {
+    return getDatabaseFilePath()
+  }
+
+  private migrateLegacyStore(): void {
+    try {
+      const ElectronStore = require('electron-store')
+      // Access the default export
+      const LegacyStore = ElectronStore.default || ElectronStore
+      const store = new LegacyStore({
+        name: 'subscriptions',
+        defaults: {
+          subscriptions: []
+        }
+      })
+      const legacyData = store.get('subscriptions') as SubscriptionRule[] | undefined
+      if (!legacyData || legacyData.length === 0) {
+        return
+      }
+
+      if (this.getAll().length > 0) {
+        return
+      }
+
+      for (const legacyItem of legacyData) {
+        try {
+          const normalized: SubscriptionRule = {
+            ...legacyItem,
+            keywords: sanitizeList(legacyItem.keywords),
+            tags: sanitizeList(legacyItem.tags),
+            items: []
+          }
+          this.insertRecord(normalized)
+          const legacyFeedItemsRaw = Array.isArray(
+            (legacyItem as { items?: SubscriptionFeedItem[] }).items
+          )
+            ? ((legacyItem as { items?: SubscriptionFeedItem[] }).items ?? [])
+            : []
+          if (legacyFeedItemsRaw.length > 0) {
+            const converted = legacyFeedItemsRaw.map((item) => ({
+              id: item.id,
+              url: item.url,
+              title: item.title,
+              publishedAt: item.publishedAt,
+              thumbnail: item.thumbnail,
+              addedToQueue: Boolean((item as { downloaded?: boolean }).downloaded),
+              downloadId: item.downloadId
+            }))
+            this.replaceFeedItems(normalized.id, converted, true)
+          }
+        } catch (error) {
+          log.error('subscriptions: failed to migrate legacy record', error)
+        }
+      }
+
+      store.clear()
+      this.emitUpdates()
+      log.info(`subscriptions: migrated ${legacyData.length} legacy entries`)
+    } catch (error) {
+      log.warn('subscriptions: legacy migration skipped', error)
+    }
+  }
+
+  private insertRecord(record: SubscriptionRule): void {
+    const database = this.getDatabase()
+    const payload = this.mapRecordToInsert(record)
+    database
+      .insert(subscriptionsTable)
+      .values(payload)
+      .onConflictDoUpdate({ target: subscriptionsTable.id, set: payload })
+      .run()
+  }
+
+  private updateRecord(record: SubscriptionRule): void {
+    const database = this.getDatabase()
+    const payload = this.mapRecordToInsert(record)
+    database
+      .insert(subscriptionsTable)
+      .values(payload)
+      .onConflictDoUpdate({ target: subscriptionsTable.id, set: payload })
+      .run()
+  }
+
+  private mapRecordToInsert(record: SubscriptionRule): SubscriptionInsert {
+    return {
+      id: record.id,
+      title: record.title,
+      sourceUrl: record.sourceUrl,
+      feedUrl: record.feedUrl,
+      platform: record.platform,
+      keywords: stringifyArray(record.keywords),
+      tags: stringifyArray(record.tags),
+      onlyDownloadLatest: booleanToNumber(record.onlyDownloadLatest),
+      enabled: booleanToNumber(record.enabled),
+      coverUrl: record.coverUrl,
+      latestVideoTitle: record.latestVideoTitle,
+      latestVideoPublishedAt: record.latestVideoPublishedAt ?? null,
+      lastCheckedAt: record.lastCheckedAt ?? null,
+      lastSuccessAt: record.lastSuccessAt ?? null,
+      status: record.status,
+      lastError: record.lastError,
+      createdAt: record.createdAt,
+      updatedAt: record.updatedAt,
+      downloadDirectory: record.downloadDirectory,
+      namingTemplate: record.namingTemplate
+        ? sanitizeFilenameTemplate(record.namingTemplate)
+        : undefined
+    }
+  }
+
+  private mapRowToRecord(row: SubscriptionRow): SubscriptionRule {
+    return {
+      id: row.id,
+      title: row.title,
+      sourceUrl: row.sourceUrl,
+      feedUrl: row.feedUrl,
+      platform: row.platform as SubscriptionRule['platform'],
+      keywords: parseStringArray(row.keywords),
+      tags: parseStringArray(row.tags),
+      onlyDownloadLatest: numberToBoolean(row.onlyDownloadLatest),
+      enabled: numberToBoolean(row.enabled),
+      coverUrl: row.coverUrl ?? undefined,
+      latestVideoTitle: row.latestVideoTitle ?? undefined,
+      latestVideoPublishedAt: row.latestVideoPublishedAt ?? undefined,
+      lastCheckedAt: row.lastCheckedAt ?? undefined,
+      lastSuccessAt: row.lastSuccessAt ?? undefined,
+      status: row.status as SubscriptionStatus,
+      lastError: row.lastError ?? undefined,
+      createdAt: row.createdAt,
+      updatedAt: row.updatedAt,
+      downloadDirectory: row.downloadDirectory ?? undefined,
+      namingTemplate: row.namingTemplate ? sanitizeFilenameTemplate(row.namingTemplate) : undefined,
+      items: []
+    }
+  }
+
+  private mapItemRowToFeedItem(row: SubscriptionItemRow): SubscriptionFeedItem {
+    return {
+      id: row.itemId,
+      url: row.url,
+      title: row.title,
+      publishedAt: row.publishedAt,
+      thumbnail: row.thumbnail ?? undefined,
+      addedToQueue: numberToBoolean(row.added),
+      downloadId: row.downloadId ?? undefined
+    }
+  }
+
+  private emitUpdates(): void {
+    this.emit('subscriptions:updated', this.getAll())
+  }
+}
+
+export const subscriptionManager = new SubscriptionManager()
--- a/src/main/lib/subscription-scheduler.ts
+++ b/src/main/lib/subscription-scheduler.ts
@@ -0,0 +1,532 @@
+import { EventEmitter } from 'node:events'
+import fs from 'node:fs'
+import log from 'electron-log/main'
+import Parser from 'rss-parser'
+import type { SubscriptionFeedItem, SubscriptionRule } from '../../shared/types'
+import { DEFAULT_SUBSCRIPTION_FILENAME_TEMPLATE } from '../../shared/types'
+import { settingsManager } from '../settings'
+import { downloadEngine } from './download-engine'
+import { historyManager } from './history-manager'
+import { subscriptionManager } from './subscription-manager'
+
+const logger = log.scope('subscriptions')
+
+type ParserItem = {
+  title?: string
+  link?: string
+  guid?: string
+  id?: string
+  isoDate?: string
+  pubDate?: string
+  youtubeId?: string
+  content?: string
+  contentSnippet?: string
+  contentEncoded?: string
+  summary?: string
+  description?: string
+  mediaThumbnail?: Array<{ url?: string }> | { url?: string }
+  mediaContent?: Array<{ url?: string }> | { url?: string }
+  enclosure?: Array<{ url?: string; type?: string }> | { url?: string; type?: string }
+  [key: string]: unknown
+}
+
+type TrackedDownload = {
+  subscriptionId: string
+  itemId: string
+  url: string
+  retries: number
+  downloadId: string
+}
+
+type FeedItem = {
+  id: string
+  url: string
+  title: string
+  publishedAt: number
+  thumbnail?: string
+}
+
+const parser = new Parser<Record<string, never>, ParserItem>({
+  customFields: {
+    item: [
+      ['yt:videoId', 'youtubeId'],
+      ['media:thumbnail', 'mediaThumbnail'],
+      ['media:content', 'mediaContent'],
+      ['enclosure', 'enclosure'],
+      ['content:encoded', 'contentEncoded'],
+      ['description', 'description']
+    ]
+  }
+})
+
+const sanitizeDownloadId = (subscriptionId: string, itemId: string): string => {
+  const base = Buffer.from(`${subscriptionId}:${itemId}`).toString('base64url')
+  return `sub_${base}`
+}
+
+const ensureDirectoryExists = (dir?: string): void => {
+  if (!dir) {
+    return
+  }
+  try {
+    fs.mkdirSync(dir, { recursive: true })
+  } catch (error) {
+    logger.warn('Failed to ensure subscription download directory:', error)
+  }
+}
+
+export class SubscriptionScheduler extends EventEmitter {
+  private timer?: NodeJS.Timeout
+  private checking = false
+  private pendingRun = false
+  private downloads: Map<string, TrackedDownload> = new Map()
+
+  constructor() {
+    super()
+    downloadEngine.on('download-completed', (id: string) => {
+      const tracked = this.downloads.get(id)
+      if (!tracked) {
+        return
+      }
+      this.downloads.delete(id)
+      subscriptionManager.update(tracked.subscriptionId, {
+        status: 'up-to-date',
+        lastSuccessAt: Date.now()
+      })
+      subscriptionManager.updateFeedItemQueueState(tracked.subscriptionId, tracked.itemId, {
+        downloadId: id
+      })
+    })
+
+    downloadEngine.on('download-error', (id: string, error: Error) => {
+      const tracked = this.downloads.get(id)
+      if (!tracked) {
+        return
+      }
+      const currentRetries = tracked.retries ?? 0
+      if (currentRetries < 1) {
+        logger.warn('Retrying failed subscription download', { id, error })
+        this.queueDownload(
+          tracked.subscriptionId,
+          tracked.itemId,
+          tracked.url,
+          currentRetries + 1
+        ).catch((queueError) => {
+          logger.error('Retry queue failed:', queueError)
+        })
+        return
+      }
+
+      this.downloads.delete(id)
+      subscriptionManager.update(tracked.subscriptionId, {
+        status: 'failed',
+        lastCheckedAt: Date.now()
+      })
+      subscriptionManager.updateFeedItemQueueState(tracked.subscriptionId, tracked.itemId, {
+        downloadId: null
+      })
+    })
+  }
+
+  start(): void {
+    this.scheduleNextRun(0)
+  }
+
+  refreshInterval(): void {
+    if (this.timer) {
+      clearTimeout(this.timer)
+    }
+    this.scheduleNextRun()
+  }
+
+  async runNow(subscriptionId?: string): Promise<void> {
+    if (subscriptionId) {
+      const target = subscriptionManager.getById(subscriptionId)
+      if (target?.enabled) {
+        await this.checkSubscription(target)
+      }
+      return
+    }
+    await this.checkAll()
+  }
+
+  async queueItem(subscriptionId: string, itemId: string): Promise<boolean> {
+    const subscription = subscriptionManager.getById(subscriptionId)
+    if (!subscription) {
+      return false
+    }
+    const item = subscription.items.find((entry) => entry.id === itemId)
+    if (!item || item.addedToQueue) {
+      return false
+    }
+    await this.queueDownload(subscriptionId, itemId, item.url)
+    return true
+  }
+
+  private scheduleNextRun(initialDelay?: number): void {
+    if (this.timer) {
+      clearTimeout(this.timer)
+    }
+    const intervalHours = 3 // Default check interval: 3 hours
+    const delayMs = initialDelay ?? intervalHours * 60 * 60 * 1000
+    this.timer = setTimeout(() => {
+      void this.checkAll().finally(() => this.scheduleNextRun())
+    }, delayMs)
+  }
+
+  private async checkAll(): Promise<void> {
+    if (this.checking) {
+      this.pendingRun = true
+      return
+    }
+    this.checking = true
+    try {
+      const subscriptions = subscriptionManager
+        .getAll()
+        .filter((subscription) => subscription.enabled)
+      for (const subscription of subscriptions) {
+        await this.checkSubscription(subscription)
+      }
+    } catch (error) {
+      logger.error('Failed to run subscription sync', error)
+    } finally {
+      this.checking = false
+      if (this.pendingRun) {
+        this.pendingRun = false
+        void this.checkAll()
+      }
+    }
+  }
+
+  private async checkSubscription(subscription: SubscriptionRule): Promise<void> {
+    const startedAt = Date.now()
+    subscriptionManager.update(subscription.id, {
+      status: 'checking',
+      lastCheckedAt: startedAt,
+      lastError: undefined
+    })
+
+    try {
+      const feed = await parser.parseURL(subscription.feedUrl)
+      const feedItems = Array.isArray(feed.items) ? feed.items : []
+      const normalizedItems = this.normalizeFeedItems(feedItems as ParserItem[])
+      const recentItems = this.filterRecentItems(subscription, normalizedItems)
+      const unseenItems = this.filterNewItems(subscription, recentItems)
+      const keywords = subscription.keywords.map((keyword) => keyword.toLowerCase())
+      const keywordFiltered =
+        keywords.length > 0
+          ? unseenItems.filter((item) => {
+              const lowered = item.title.toLowerCase()
+              return keywords.some((keyword) => lowered.includes(keyword))
+            })
+          : unseenItems
+
+      const deduped = keywordFiltered
+        .filter((item) => !historyManager.hasHistoryForUrl(item.url))
+        .sort((a, b) => b.publishedAt - a.publishedAt)
+
+      const itemsToDownload =
+        subscription.onlyDownloadLatest && deduped.length > 0 ? [deduped[0]] : deduped
+
+      subscriptionManager.replaceFeedItems(
+        subscription.id,
+        this.buildFeedItems(normalizedItems, subscription)
+      )
+
+      if (itemsToDownload.length > 0) {
+        for (const item of itemsToDownload) {
+          await this.queueDownload(subscription.id, item.id, item.url)
+        }
+      }
+
+      const latestItem = normalizedItems[0]
+      const coverUrl = this.resolveSubscriptionCover(
+        feed,
+        normalizedItems,
+        feedItems as ParserItem[]
+      )
+      subscriptionManager.update(subscription.id, {
+        status: 'up-to-date',
+        lastSuccessAt: Date.now(),
+        lastError: undefined,
+        latestVideoTitle: latestItem?.title ?? subscription.latestVideoTitle,
+        latestVideoPublishedAt: latestItem?.publishedAt ?? subscription.latestVideoPublishedAt,
+        coverUrl: coverUrl ?? subscription.coverUrl,
+        title:
+          typeof feed.title === 'string' && feed.title.trim().length > 0
+            ? feed.title.trim()
+            : subscription.title,
+        sourceUrl:
+          typeof feed.link === 'string' && feed.link.trim().length > 0
+            ? feed.link.trim()
+            : subscription.sourceUrl
+      })
+    } catch (error) {
+      const message = error instanceof Error ? error.message : 'Unknown RSS error'
+      subscriptionManager.update(subscription.id, {
+        status: 'failed',
+        lastError: message,
+        lastCheckedAt: Date.now()
+      })
+      logger.error('Subscription check failed:', { id: subscription.id, error })
+    }
+  }
+
+  private normalizeFeedItems(items: ParserItem[]): FeedItem[] {
+    const normalized: FeedItem[] = []
+    for (const item of items) {
+      const id = this.resolveItemId(item)
+      if (!id || !item.link || !item.title) {
+        continue
+      }
+      normalized.push({
+        id,
+        url: item.link,
+        title: item.title,
+        publishedAt: this.resolvePublishedAt(item),
+        thumbnail: this.resolveThumbnail(item)
+      })
+    }
+
+    return normalized.sort((a, b) => b.publishedAt - a.publishedAt)
+  }
+
+  private buildFeedItems(
+    items: FeedItem[],
+    subscription: SubscriptionRule
+  ): SubscriptionFeedItem[] {
+    const existingItems = new Map(subscription.items.map((item) => [item.id, item]))
+    return items.map((item) => {
+      const tracked = this.getTrackedDownloadByUrl(item.url)
+      const existing = existingItems.get(item.id)
+      return {
+        id: item.id,
+        url: item.url,
+        title: item.title,
+        publishedAt: item.publishedAt,
+        thumbnail: item.thumbnail,
+        addedToQueue:
+          Boolean(tracked) || existing?.addedToQueue || historyManager.hasHistoryForUrl(item.url),
+        downloadId: tracked?.downloadId ?? existing?.downloadId
+      }
+    })
+  }
+
+  private resolveItemId(item: ParserItem): string | null {
+    const idCandidate =
+      item.youtubeId || item.guid || item.id || (typeof item.link === 'string' ? item.link : null)
+    if (!idCandidate) {
+      return null
+    }
+    return idCandidate.trim()
+  }
+
+  private resolvePublishedAt(item: ParserItem): number {
+    const candidates = [item.isoDate, item.pubDate]
+    for (const candidate of candidates) {
+      if (!candidate) {
+        continue
+      }
+      const timestamp = Date.parse(candidate)
+      if (!Number.isNaN(timestamp)) {
+        return timestamp
+      }
+    }
+    return Date.now()
+  }
+
+  private resolveThumbnail(item: ParserItem): string | undefined {
+    // Try media:thumbnail first
+    const thumbnail = item.mediaThumbnail
+    if (Array.isArray(thumbnail)) {
+      const found = thumbnail.find((entry) => entry?.url)
+      if (found?.url) return found.url
+    }
+    if (thumbnail && typeof thumbnail === 'object' && 'url' in thumbnail) {
+      return thumbnail.url as string | undefined
+    }
+
+    // Try enclosure (for RSS feeds with image/jpeg type)
+    const enclosure = item.enclosure
+    if (Array.isArray(enclosure)) {
+      const imageEnclosure = enclosure.find(
+        (entry) => entry?.url && entry?.type?.startsWith('image/')
+      )
+      if (imageEnclosure?.url) return imageEnclosure.url
+    }
+    if (enclosure && typeof enclosure === 'object' && 'url' in enclosure) {
+      const enc = enclosure as { url?: string; type?: string }
+      if (enc.url && enc.type?.startsWith('image/')) {
+        return enc.url
+      }
+    }
+
+    // Try media:content as fallback
+    const mediaContent = item.mediaContent
+    if (Array.isArray(mediaContent)) {
+      const found = mediaContent.find((entry) => entry?.url)
+      if (found?.url) return found.url
+    }
+    if (mediaContent && typeof mediaContent === 'object' && 'url' in mediaContent) {
+      return mediaContent.url as string | undefined
+    }
+
+    // Try to parse an image from HTML fields
+    const htmlCandidates = [
+      item.content,
+      item.contentEncoded,
+      item.description,
+      item.summary,
+      item.contentSnippet
+    ]
+    for (const html of htmlCandidates) {
+      const imageUrl = this.extractImageFromHtml(html)
+      if (imageUrl) {
+        return imageUrl
+      }
+    }
+
+    return undefined
+  }
+
+  private resolveSubscriptionCover(
+    feed: Parser.Output<ParserItem>,
+    items: FeedItem[],
+    rawItems: ParserItem[]
+  ): string | undefined {
+    const feedImageUrl = typeof feed.image?.url === 'string' ? feed.image.url : undefined
+    if (feedImageUrl) {
+      return feedImageUrl
+    }
+
+    const itunesImageUrl = typeof feed.itunes?.image === 'string' ? feed.itunes.image : undefined
+    if (itunesImageUrl) {
+      return itunesImageUrl
+    }
+
+    const itemThumbnail = items.find((item) => item.thumbnail)?.thumbnail
+    if (itemThumbnail) {
+      return itemThumbnail
+    }
+
+    for (const item of rawItems) {
+      const thumbnail = this.resolveThumbnail(item)
+      if (thumbnail) {
+        return thumbnail
+      }
+    }
+
+    return undefined
+  }
+
+  private extractImageFromHtml(html?: string): string | undefined {
+    if (!html) {
+      return undefined
+    }
+
+    const srcMatch = html.match(
+      /<img\b[^>]*\b(?:src|data-src|data-original)\b\s*=\s*(['"]?)([^'">\s]+)\1/i
+    )
+    if (srcMatch?.[2]) {
+      return srcMatch[2]
+    }
+
+    const srcsetMatch = html.match(/<img[^>]+srcset\s*=\s*(['"])([^'"]+)\1/i)
+    if (srcsetMatch?.[2]) {
+      const firstCandidate = srcsetMatch[2].split(',')[0]?.trim().split(/\s+/)[0]
+      if (firstCandidate) {
+        return firstCandidate
+      }
+    }
+
+    return undefined
+  }
+
+  private filterRecentItems(subscription: SubscriptionRule, items: FeedItem[]): FeedItem[] {
+    const lastKnownPublishedAt = this.getLastKnownPublishedAt(subscription)
+    if (lastKnownPublishedAt === 0) {
+      return subscription.onlyDownloadLatest ? items.slice(0, 1) : items
+    }
+    return items.filter((item) => item.publishedAt > lastKnownPublishedAt)
+  }
+
+  private getLastKnownPublishedAt(subscription: SubscriptionRule): number {
+    const fromItems = subscription.items.reduce((max, item) => Math.max(max, item.publishedAt), 0)
+    return Math.max(subscription.latestVideoPublishedAt ?? 0, fromItems)
+  }
+
+  private filterNewItems(subscription: SubscriptionRule, items: FeedItem[]): FeedItem[] {
+    const seenIds = new Set(subscription.items.map((item) => item.id))
+    return items.filter((item) => !seenIds.has(item.id))
+  }
+
+  private async queueDownload(
+    subscriptionId: string,
+    itemId: string,
+    url: string,
+    retryCount = 0
+  ): Promise<void> {
+    const downloadId = sanitizeDownloadId(subscriptionId, itemId)
+    const isRetry = retryCount > 0
+    if (this.downloads.has(downloadId) && !isRetry) {
+      return
+    }
+
+    const subscription = subscriptionManager.getById(subscriptionId)
+    if (!subscription) {
+      return
+    }
+
+    const settings = settingsManager.getAll()
+    const downloadDirectory = subscription.downloadDirectory?.trim() || settings.downloadPath
+    const namingTemplate =
+      subscription.namingTemplate?.trim() || DEFAULT_SUBSCRIPTION_FILENAME_TEMPLATE
+    ensureDirectoryExists(downloadDirectory)
+
+    const tags = Array.from(new Set([subscription.platform, ...subscription.tags]))
+
+    try {
+      downloadEngine.startDownload(downloadId, {
+        url,
+        type: 'video',
+        customDownloadPath: downloadDirectory,
+        customFilenameTemplate: namingTemplate,
+        tags,
+        origin: 'subscription',
+        subscriptionId
+      })
+
+      this.downloads.set(downloadId, {
+        subscriptionId,
+        itemId,
+        url,
+        retries: retryCount,
+        downloadId
+      })
+      subscriptionManager.updateFeedItemQueueState(subscriptionId, itemId, {
+        added: true,
+        downloadId
+      })
+    } catch (error) {
+      logger.error('Failed to start subscription download', { subscriptionId, itemId, error })
+      subscriptionManager.update(subscriptionId, {
+        status: 'failed'
+      })
+      subscriptionManager.updateFeedItemQueueState(subscriptionId, itemId, {
+        added: false,
+        downloadId: null
+      })
+    }
+  }
+
+  private getTrackedDownloadByUrl(url: string): TrackedDownload | undefined {
+    for (const tracked of this.downloads.values()) {
+      if (tracked.url === url) {
+        return tracked
+      }
+    }
+    return undefined
+  }
+}
+
+export const subscriptionScheduler = new SubscriptionScheduler()
--- a/src/main/lib/thumbnail-cache.ts
+++ b/src/main/lib/thumbnail-cache.ts
@@ -2,8 +2,9 @@ import crypto from 'node:crypto'
 import fs from 'node:fs'
 import fsPromises from 'node:fs/promises'
 import path from 'node:path'
-import { pathToFileURL } from 'node:url'
+import { APP_PROTOCOL_SCHEME } from '@shared/constants'
 import { app } from 'electron'
+import { scopedLoggers } from '../utils/logger'

 const SUPPORTED_EXTENSIONS = new Set(['.jpg', '.jpeg', '.png', '.webp', '.gif'])

@@ -37,7 +38,11 @@ export class ThumbnailCache {
      return null
    }

-    if (originalUrl.startsWith('file://') || originalUrl.startsWith('data:')) {
+    if (
+      originalUrl.startsWith(APP_PROTOCOL_SCHEME) ||
+      originalUrl.startsWith('file://') ||
+      originalUrl.startsWith('data:')
+    ) {
      return originalUrl
    }

@@ -59,7 +64,7 @@ export class ThumbnailCache {

      const existingPath = await this.findExistingPath(basePath, defaultExtension)
      if (existingPath) {
-        return pathToFileURL(existingPath).toString()
+        return this.toAppProtocolUrl(existingPath)
      }

      const response = await fetch(originalUrl)
@@ -75,9 +80,9 @@ export class ThumbnailCache {
      const finalPath = `${basePath}${extension}`

      await fsPromises.writeFile(finalPath, buffer)
-      return pathToFileURL(finalPath).toString()
+      return this.toAppProtocolUrl(finalPath)
    } catch (error) {
-      console.error('Failed to cache thumbnail:', error)
+      scopedLoggers.thumbnail.error('Failed to cache thumbnail:', error)
      return null
    }
  }
@@ -132,6 +137,13 @@ export class ThumbnailCache {
    const basePath = path.join(cacheDir, `${hash}`)
    return { basePath, defaultExtension: extension }
  }
+
+  private toAppProtocolUrl(filePath: string): string {
+    const userDataPath = app.getPath('userData')
+    const relativePath = path.relative(userDataPath, filePath).replace(/\\/g, '/')
+
+    return `${APP_PROTOCOL_SCHEME}${relativePath}`
+  }
 }

 export const thumbnailCache = new ThumbnailCache()
--- a/src/main/lib/ytdlp-manager.ts
+++ b/src/main/lib/ytdlp-manager.ts
@@ -3,6 +3,7 @@ import fs from 'node:fs'
 import os from 'node:os'
 import path from 'node:path'
 import type YTDlpWrap from 'yt-dlp-wrap-plus'
+import { scopedLoggers } from '../utils/logger'

 // Use require for yt-dlp-wrap-plus to handle CommonJS/ESM compatibility
 const YTDlpWrapModule = require('yt-dlp-wrap-plus')
@@ -12,11 +13,13 @@ type YTDlpWrapInstance = InstanceType<typeof YTDlpWrapCtor>
 class YtDlpManager {
  private ytdlpPath: string | null = null
  private ytdlpInstance: YTDlpWrapInstance | null = null
+  private jsRuntimeArgs: string[] = []

  async initialize(): Promise<void> {
    this.ytdlpPath = await this.findOrDownloadYtDlp()
    this.ytdlpInstance = new YTDlpWrapCtor(this.ytdlpPath)
-    console.log('yt-dlp initialized at:', this.ytdlpPath)
+    this.jsRuntimeArgs = this.resolveJsRuntimeArgs()
+    scopedLoggers.engine.info('yt-dlp initialized at:', this.ytdlpPath)
  }

  getInstance(): YTDlpWrapInstance {
@@ -33,6 +36,10 @@ class YtDlpManager {
    return this.ytdlpPath
  }

+  getJsRuntimeArgs(): string[] {
+    return [...this.jsRuntimeArgs]
+  }
+
  private getResourcesPath(): string {
    // In development, read from project root's resources
    if (process.env.NODE_ENV === 'development') {
@@ -57,7 +64,7 @@ class YtDlpManager {

    // Check environment variable first
    if (process.env.YTDLP_PATH && fs.existsSync(process.env.YTDLP_PATH)) {
-      console.log('Using yt-dlp from YTDLP_PATH:', process.env.YTDLP_PATH)
+      scopedLoggers.engine.info('Using yt-dlp from YTDLP_PATH:', process.env.YTDLP_PATH)
      return process.env.YTDLP_PATH
    }

@@ -65,13 +72,13 @@ class YtDlpManager {
    const resourcesPath = this.getResourcesPath()
    const bundledPath = path.join(resourcesPath, bundledName)
    if (fs.existsSync(bundledPath)) {
-      console.log('Using bundled yt-dlp:', bundledPath)
+      scopedLoggers.engine.info('Using bundled yt-dlp:', bundledPath)
      // Make executable on Unix-like systems if needed
      if (platform !== 'win32') {
        try {
          fs.chmodSync(bundledPath, 0o755)
        } catch (error) {
-          console.warn('Failed to set executable permission:', error)
+          scopedLoggers.engine.warn('Failed to set executable permission:', error)
        }
      }
      return bundledPath
@@ -82,7 +89,7 @@ class YtDlpManager {
      const possiblePaths = ['/opt/homebrew/bin/yt-dlp', '/usr/local/bin/yt-dlp']
      for (const p of possiblePaths) {
        if (fs.existsSync(p)) {
-          console.log('Using system yt-dlp:', p)
+          scopedLoggers.engine.info('Using system yt-dlp:', p)
          return p
        }
      }
@@ -93,7 +100,7 @@ class YtDlpManager {
      try {
        const systemPath = execSync('which yt-dlp').toString().trim()
        if (systemPath && fs.existsSync(systemPath)) {
-          console.log('Using system yt-dlp:', systemPath)
+          scopedLoggers.engine.info('Using system yt-dlp:', systemPath)
          return systemPath
        }
      } catch (_error) {
@@ -115,6 +122,92 @@ class YtDlpManager {
    )
  }

+  private resolveJsRuntimeArgs(): string[] {
+    const runtime = (process.env.YTDLP_JS_RUNTIME || 'deno').trim()
+    if (!runtime || runtime === 'none') {
+      return []
+    }
+
+    const runtimePath = this.resolveJsRuntimePath(runtime)
+    if (runtimePath) {
+      return ['--js-runtimes', `${runtime}:${runtimePath}`]
+    }
+
+    if (process.env.YTDLP_JS_RUNTIME) {
+      scopedLoggers.engine.warn(
+        `Requested JS runtime "${runtime}" was not found. Falling back to yt-dlp default detection.`
+      )
+    } else {
+      scopedLoggers.engine.warn(
+        'JS runtime not found. YouTube support may be limited without an external JS runtime.'
+      )
+    }
+
+    return process.env.YTDLP_JS_RUNTIME ? ['--js-runtimes', runtime] : []
+  }
+
+  private resolveJsRuntimePath(runtime: string): string | null {
+    const envPath = process.env.YTDLP_JS_RUNTIME_PATH?.trim()
+    if (envPath && fs.existsSync(envPath)) {
+      scopedLoggers.engine.info('Using JS runtime from YTDLP_JS_RUNTIME_PATH:', envPath)
+      return envPath
+    }
+
+    const platform = os.platform()
+    const resourcesPath = this.getResourcesPath()
+    const resourceCandidates: string[] = []
+
+    if (runtime === 'deno') {
+      resourceCandidates.push(platform === 'win32' ? 'deno.exe' : 'deno')
+    } else if (runtime === 'node') {
+      resourceCandidates.push(platform === 'win32' ? 'node.exe' : 'node')
+    } else if (runtime === 'bun') {
+      resourceCandidates.push(platform === 'win32' ? 'bun.exe' : 'bun')
+    } else if (runtime === 'quickjs') {
+      resourceCandidates.push(platform === 'win32' ? 'qjs.exe' : 'qjs')
+    } else {
+      resourceCandidates.push(runtime)
+      if (platform === 'win32' && !runtime.endsWith('.exe')) {
+        resourceCandidates.push(`${runtime}.exe`)
+      }
+    }
+
+    for (const candidate of resourceCandidates) {
+      const fullPath = path.join(resourcesPath, candidate)
+      if (fs.existsSync(fullPath)) {
+        if (platform !== 'win32') {
+          try {
+            fs.chmodSync(fullPath, 0o755)
+          } catch (error) {
+            scopedLoggers.engine.warn('Failed to set executable permission on JS runtime:', error)
+          }
+        }
+        scopedLoggers.engine.info('Using bundled JS runtime:', fullPath)
+        return fullPath
+      }
+    }
+
+    try {
+      if (platform === 'win32') {
+        const output = execSync(`where ${runtime}`).toString().split(/\r?\n/)[0]
+        if (output && fs.existsSync(output)) {
+          scopedLoggers.engine.info('Using system JS runtime:', output)
+          return output
+        }
+      } else {
+        const systemPath = execSync(`which ${runtime}`).toString().trim()
+        if (systemPath && fs.existsSync(systemPath)) {
+          scopedLoggers.engine.info('Using system JS runtime:', systemPath)
+          return systemPath
+        }
+      }
+    } catch (_error) {
+      // Runtime not found in PATH
+    }
+
+    return null
+  }
+
  // Removed runtime download/update to avoid network dependency in production builds
 }

--- a/src/main/local-api.ts
+++ b/src/main/local-api.ts
@@ -0,0 +1,191 @@
+import crypto from 'node:crypto'
+import http from 'node:http'
+import type { AddressInfo } from 'node:net'
+
+import log from 'electron-log/main'
+
+import { downloadEngine } from './lib/download-engine'
+
+const PORT_RANGE_START = 27100
+const PORT_RANGE_END = 27120
+const TOKEN_TTL_MS = 60_000
+
+type TokenRecord = {
+  expiresAt: number
+}
+
+let server: http.Server | null = null
+let serverPort: number | null = null
+const tokens = new Map<string, TokenRecord>()
+
+const isLoopbackAddress = (address?: string | null): boolean => {
+  if (!address) return false
+  return address === '127.0.0.1' || address === '::1' || address === '::ffff:127.0.0.1'
+}
+
+const writeJson = (res: http.ServerResponse, status: number, body: unknown): void => {
+  res.writeHead(status, {
+    'Content-Type': 'application/json; charset=utf-8',
+    'Access-Control-Allow-Origin': '*',
+    'Access-Control-Allow-Methods': 'GET, OPTIONS',
+    'Access-Control-Allow-Headers': 'Content-Type'
+  })
+  res.end(JSON.stringify(body))
+}
+
+const writeEmpty = (res: http.ServerResponse, status: number): void => {
+  res.writeHead(status, {
+    'Access-Control-Allow-Origin': '*',
+    'Access-Control-Allow-Methods': 'GET, OPTIONS',
+    'Access-Control-Allow-Headers': 'Content-Type'
+  })
+  res.end()
+}
+
+const issueToken = (): string => {
+  const token = crypto.randomBytes(16).toString('hex')
+  tokens.set(token, { expiresAt: Date.now() + TOKEN_TTL_MS })
+  return token
+}
+
+const consumeToken = (token?: string | null): boolean => {
+  if (!token) return false
+  const record = tokens.get(token)
+  if (!record) return false
+  if (Date.now() > record.expiresAt) {
+    tokens.delete(token)
+    return false
+  }
+  tokens.delete(token)
+  return true
+}
+
+const handleRequest = async (
+  req: http.IncomingMessage,
+  res: http.ServerResponse
+): Promise<void> => {
+  try {
+    if (!isLoopbackAddress(req.socket.remoteAddress)) {
+      writeJson(res, 403, { error: 'Forbidden' })
+      return
+    }
+
+    if (req.method === 'OPTIONS') {
+      writeEmpty(res, 204)
+      return
+    }
+
+    if (!req.url) {
+      writeJson(res, 400, { error: 'Missing URL' })
+      return
+    }
+
+    const requestUrl = new URL(req.url, 'http://127.0.0.1')
+    const pathname = requestUrl.pathname
+
+    if (req.method !== 'GET') {
+      writeJson(res, 405, { error: 'Method not allowed' })
+      return
+    }
+
+    if (pathname === '/token') {
+      const token = issueToken()
+      writeJson(res, 200, { token, expiresInMs: TOKEN_TTL_MS })
+      return
+    }
+
+    if (pathname === '/video-info') {
+      const token = requestUrl.searchParams.get('token')
+      if (!consumeToken(token)) {
+        writeJson(res, 401, { error: 'Invalid token' })
+        return
+      }
+
+      const targetUrl = requestUrl.searchParams.get('url')
+      if (!targetUrl || !targetUrl.trim()) {
+        writeJson(res, 400, { error: 'Missing url' })
+        return
+      }
+
+      try {
+        const info = await downloadEngine.getVideoInfo(targetUrl.trim())
+        writeJson(res, 200, {
+          title: info.title,
+          thumbnail: info.thumbnail,
+          duration: info.duration,
+          formats: info.formats ?? []
+        })
+      } catch (error) {
+        const message = error instanceof Error ? error.message : 'Failed to fetch video info'
+        const details =
+          error instanceof Error
+            ? error.stack
+            : typeof error === 'object' && error && 'stderr' in error
+              ? String((error as { stderr?: unknown }).stderr ?? '')
+              : undefined
+        writeJson(res, 500, { error: message, details })
+      }
+      return
+    }
+
+    if (pathname === '/status') {
+      writeJson(res, 200, { ok: true })
+      return
+    }
+
+    writeJson(res, 404, { error: 'Not found' })
+  } catch (error) {
+    const message = error instanceof Error ? error.message : 'Unhandled request error'
+    writeJson(res, 500, { error: message })
+  }
+}
+
+const startServerOnPort = (port: number): Promise<http.Server> =>
+  new Promise((resolve, reject) => {
+    const httpServer = http.createServer((req, res) => {
+      void handleRequest(req, res)
+    })
+
+    httpServer.once('error', (error) => {
+      httpServer.close()
+      reject(error)
+    })
+
+    httpServer.listen(port, '127.0.0.1', () => resolve(httpServer))
+  })
+
+export async function startExtensionApiServer(): Promise<number | null> {
+  if (server && serverPort) {
+    return serverPort
+  }
+
+  for (let port = PORT_RANGE_START; port <= PORT_RANGE_END; port += 1) {
+    try {
+      server = await startServerOnPort(port)
+      const address = server.address() as AddressInfo | null
+      serverPort = address?.port ?? port
+      log.info(`Extension API listening on 127.0.0.1:${serverPort}`)
+      return serverPort
+    } catch (error) {
+      const err = error as NodeJS.ErrnoException
+      if (err.code !== 'EADDRINUSE') {
+        log.warn('Extension API failed to start on port:', port, err)
+      }
+    }
+  }
+
+  log.error(`Extension API failed to bind any port in range ${PORT_RANGE_START}-${PORT_RANGE_END}`)
+  return null
+}
+
+export async function stopExtensionApiServer(): Promise<void> {
+  if (!server) return
+
+  await new Promise<void>((resolve) => {
+    server?.close(() => resolve())
+  })
+
+  server = null
+  serverPort = null
+  tokens.clear()
+}
--- a/src/main/settings.ts
+++ b/src/main/settings.ts
@@ -1,13 +1,32 @@
+import fs from 'node:fs'
 import os from 'node:os'
 import path from 'node:path'
 import type { AppSettings } from '../shared/types'
 import { defaultSettings } from '../shared/types'
+import { scopedLoggers } from './utils/logger'

 // Use require for electron-store to avoid CommonJS/ESM issues
 const ElectronStore = require('electron-store')
 // Access the default export
 const Store = ElectronStore.default || ElectronStore

+const OLD_DEFAULT_DOWNLOAD_PATH = path.join(os.homedir(), 'Downloads')
+const ensureDirectoryExists = (dir: string) => {
+  try {
+    fs.mkdirSync(dir, { recursive: true })
+  } catch (error) {
+    scopedLoggers.system.error('Failed to ensure download directory:', error)
+  }
+}
+
+const resolveDefaultDownloadPath = () => {
+  const downloadDir = path.join(os.homedir(), 'Downloads', 'VidBee')
+  ensureDirectoryExists(downloadDir)
+  return downloadDir
+}
+
+const DEFAULT_DOWNLOAD_PATH = resolveDefaultDownloadPath()
+
 class SettingsManager {
  // biome-ignore lint/suspicious/noExplicitAny: electron-store requires dynamic import
  private store: any
@@ -16,9 +35,10 @@ class SettingsManager {
    this.store = new Store({
      defaults: {
        ...defaultSettings,
-        downloadPath: path.join(os.homedir(), 'Downloads')
+        downloadPath: DEFAULT_DOWNLOAD_PATH
      }
    })
+    this.ensureDownloadDirectory()
  }

  get<K extends keyof AppSettings>(key: K): AppSettings[K] {
@@ -26,15 +46,25 @@ class SettingsManager {
  }

  set<K extends keyof AppSettings>(key: K, value: AppSettings[K]): void {
+    if (key === 'downloadPath' && typeof value === 'string') {
+      ensureDirectoryExists(value)
+    }
    this.store.set(key, value)
  }

  getAll(): AppSettings {
-    return this.store.store
+    return {
+      ...defaultSettings,
+      downloadPath: DEFAULT_DOWNLOAD_PATH,
+      ...this.store.store
+    }
  }

  setAll(settings: Partial<AppSettings>): void {
    for (const [key, value] of Object.entries(settings)) {
+      if (key === 'downloadPath' && typeof value === 'string') {
+        ensureDirectoryExists(value)
+      }
      this.store.set(key as keyof AppSettings, value as AppSettings[keyof AppSettings])
    }
  }
@@ -43,8 +73,25 @@ class SettingsManager {
    this.store.clear()
    this.store.set({
      ...defaultSettings,
-      downloadPath: path.join(os.homedir(), 'Downloads')
+      downloadPath: DEFAULT_DOWNLOAD_PATH
    })
+    ensureDirectoryExists(DEFAULT_DOWNLOAD_PATH)
+  }
+
+  private ensureDownloadDirectory(): void {
+    try {
+      const currentPath: string | undefined = this.store.get('downloadPath')
+      const normalizedDownloadPath =
+        !currentPath || currentPath === OLD_DEFAULT_DOWNLOAD_PATH
+          ? DEFAULT_DOWNLOAD_PATH
+          : currentPath
+      if (normalizedDownloadPath !== currentPath) {
+        this.store.set('downloadPath', normalizedDownloadPath)
+      }
+      ensureDirectoryExists(normalizedDownloadPath)
+    } catch (error) {
+      scopedLoggers.system.error('Failed to verify download directory:', error)
+    }
  }
 }

--- a/src/main/utils/auto-launch.ts
+++ b/src/main/utils/auto-launch.ts
@@ -0,0 +1,38 @@
+import { app } from 'electron'
+import log from 'electron-log/main'
+
+const SUPPORTED_PLATFORMS = new Set(['darwin', 'win32'])
+
+export function isAutoLaunchSupported(): boolean {
+  return SUPPORTED_PLATFORMS.has(process.platform)
+}
+
+export function applyAutoLaunchSetting(enabled: boolean): void {
+  if (!isAutoLaunchSupported()) {
+    log.info('Auto launch is not supported on this platform, skipping setting update')
+    return
+  }
+
+  const updateSetting = () => {
+    try {
+      const options: Parameters<typeof app.setLoginItemSettings>[0] = {
+        openAtLogin: enabled
+      }
+
+      if (process.platform === 'darwin') {
+        options.openAsHidden = true
+      }
+
+      app.setLoginItemSettings(options)
+      log.info(`Auto launch ${enabled ? 'enabled' : 'disabled'}`)
+    } catch (error) {
+      log.error('Failed to update login item settings:', error)
+    }
+  }
+
+  if (app.isReady()) {
+    updateSetting()
+  } else {
+    app.once('ready', updateSetting)
+  }
+}
--- a/src/main/utils/path-helpers.ts
+++ b/src/main/utils/path-helpers.ts
@@ -0,0 +1,19 @@
+import os from 'node:os'
+import path from 'node:path'
+
+export const resolvePathWithHome = (rawPath?: string | null): string | undefined => {
+  const trimmed = rawPath?.trim()
+  if (!trimmed) {
+    return undefined
+  }
+
+  if (trimmed === '~') {
+    return os.homedir()
+  }
+
+  if (trimmed.startsWith('~/') || trimmed.startsWith('~\\')) {
+    return path.join(os.homedir(), trimmed.slice(2))
+  }
+
+  return trimmed
+}
--- a/src/renderer/index.html
+++ b/src/renderer/index.html
@@ -5,7 +5,7 @@
  <meta charset="UTF-8" />
  <title>VidBee</title>
  <meta http-equiv="Content-Security-Policy"
-    content="default-src 'self'; script-src 'self' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data: file: https://i.ytimg.com https://img.youtube.com; connect-src 'self'" />
+    content="default-src 'self'; script-src 'self' 'unsafe-eval' https://rybbit.102417.xyz; style-src 'self' 'unsafe-inline'; img-src 'self' data: file: vidbee: https://i.ytimg.com https://img.youtube.com; connect-src 'self' https://rybbit.102417.xyz" />
 </head>

 <body>
--- a/src/renderer/src/App.tsx
+++ b/src/renderer/src/App.tsx
@@ -2,27 +2,155 @@ import { ScrollArea } from '@renderer/components/ui/scroll-area'
 import { Sidebar } from '@renderer/components/ui/sidebar'
 import { Toaster } from '@renderer/components/ui/sonner'
 import { TitleBar } from '@renderer/components/ui/title-bar'
-import { useAtom } from 'jotai'
+import type { SubscriptionRule } from '@shared/types'
+import { useAtom, useSetAtom } from 'jotai'
 import { ThemeProvider } from 'next-themes'
-import { useEffect, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
+import { HashRouter, Navigate, Route, Routes, useLocation, useNavigate } from 'react-router'
 import { toast } from 'sonner'
+import { ErrorBoundary } from './components/error/ErrorBoundary'
 import { ipcEvents, ipcServices } from './lib/ipc'
 import { About } from './pages/About'
 import { Home } from './pages/Home'
 import { Settings } from './pages/Settings'
-import { SupportedSites } from './pages/SupportedSites'
-import { settingsAtom } from './store/settings'
+import { Subscriptions } from './pages/Subscriptions'
+import { loadSettingsAtom, settingsAtom } from './store/settings'
+import { loadSubscriptionsAtom, setSubscriptionsAtom } from './store/subscriptions'
+import { updateAvailableAtom, updateReadyAtom } from './store/update'

-type Page = 'home' | 'settings' | 'about' | 'sites'
+type Page = 'home' | 'subscriptions' | 'settings' | 'about'
+
+const pageToPath: Record<Page, string> = {
+  home: '/',
+  subscriptions: '/subscriptions',
+  settings: '/settings',
+  about: '/about'
+}
+
+const normalizePathname = (pathname: string): string => {
+  const trimmed = pathname.replace(/\/+$/, '')
+  return trimmed === '' ? '/' : trimmed
+}
+
+const pathToPage = (pathname: string): Page => {
+  const normalized = normalizePathname(pathname)
+  switch (normalized) {
+    case '/subscriptions':
+      return 'subscriptions'
+    case '/settings':
+      return 'settings'
+    case '/about':
+      return 'about'
+    default:
+      return 'home'
+  }
+}

 function AppContent() {
-  const [currentPage, setCurrentPage] = useState<Page>('home')
  const [platform, setPlatform] = useState<string>('')
+  const loadSubscriptions = useSetAtom(loadSubscriptionsAtom)
+  const setSubscriptions = useSetAtom(setSubscriptionsAtom)
  const [settings] = useAtom(settingsAtom)
-  const { t } = useTranslation()
-  const autoUpdateEnabled = settings.autoUpdate
+  const loadSettings = useSetAtom(loadSettingsAtom)
+  const setUpdateReady = useSetAtom(updateReadyAtom)
+  const setUpdateAvailable = useSetAtom(updateAvailableAtom)
+  const { i18n } = useTranslation()
  const updateDownloadInProgressRef = useRef(false)
+  const analyticsScriptRef = useRef<HTMLScriptElement | null>(null)
+  const navigate = useNavigate()
+  const location = useLocation()
+  const currentPage = pathToPage(location.pathname)
+  const supportedSitesUrl = 'https://vidbee.org/supported-sites/'
+
+  const handlePageChange = useCallback(
+    (page: Page) => {
+      const targetPath = pageToPath[page] ?? '/'
+      if (normalizePathname(location.pathname) !== targetPath) {
+        navigate(targetPath)
+      }
+    },
+    [location.pathname, navigate]
+  )
+
+  const handleOpenSupportedSites = () => {
+    window.open(supportedSitesUrl, '_blank')
+  }
+
+  useEffect(() => {
+    loadSettings()
+  }, [loadSettings])
+
+  useEffect(() => {
+    const handleDeepLink = (rawUrl: unknown) => {
+      const url = typeof rawUrl === 'string' ? rawUrl.trim() : ''
+      if (!url) {
+        return
+      }
+      // Switch to home page to show download dialog
+      handlePageChange('home')
+      // The DownloadDialog component will handle opening the dialog and parsing the video
+    }
+
+    ipcEvents.on('download:deeplink', handleDeepLink)
+    return () => {
+      ipcEvents.removeListener('download:deeplink', handleDeepLink)
+    }
+  }, [handlePageChange])
+
+  useEffect(() => {
+    loadSubscriptions()
+
+    const handleSubscriptions = (...args: unknown[]) => {
+      const list = args[0]
+      if (Array.isArray(list)) {
+        setSubscriptions(list as SubscriptionRule[])
+      }
+    }
+
+    ipcEvents.on('subscriptions:updated', handleSubscriptions)
+
+    return () => {
+      ipcEvents.removeListener('subscriptions:updated', handleSubscriptions)
+    }
+  }, [loadSubscriptions, setSubscriptions])
+
+  // Load or remove analytics script based on settings
+  useEffect(() => {
+    const scriptId = 'analytics-script'
+    const existingScript = document.getElementById(scriptId) as HTMLScriptElement | null
+
+    if (settings.enableAnalytics) {
+      // Remove existing script if it exists
+      if (existingScript) {
+        existingScript.remove()
+      }
+
+      // Create and append new script
+      const script = document.createElement('script')
+      script.id = scriptId
+      script.src = 'https://rybbit.102417.xyz/api/script.js'
+      script.setAttribute('data-site-id', '7bc6f6d625a4')
+      script.defer = true
+      script.async = true
+      document.head.appendChild(script)
+      analyticsScriptRef.current = script
+    } else {
+      // Remove script if analytics is disabled
+      if (existingScript) {
+        existingScript.remove()
+        analyticsScriptRef.current = null
+      }
+    }
+
+    return () => {
+      // Cleanup on unmount
+      const script = document.getElementById(scriptId)
+      if (script) {
+        script.remove()
+      }
+    }
+  }, [settings.enableAnalytics])

  useEffect(() => {
    // Get platform info to determine if we should show title bar
@@ -44,10 +172,39 @@ function AppContent() {
      return
    }

-    const showRestartPrompt = () => {
-      toast.info(t('about.notifications.restartToUpdate'), {
+    const resetDownloadState = () => {
+      if (updateDownloadInProgressRef.current) {
+        updateDownloadInProgressRef.current = false
+      }
+    }
+
+    const handleUpdateAvailable = (rawInfo: unknown) => {
+      const info = (rawInfo ?? {}) as { version?: string }
+      setUpdateAvailable({
+        available: true,
+        version: info.version
+      })
+    }
+
+    const handleUpdateDownloaded = (rawInfo: unknown) => {
+      const info = (rawInfo ?? {}) as { version?: string }
+      resetDownloadState()
+      setUpdateReady({
+        ready: true,
+        version: info.version
+      })
+      setUpdateAvailable({
+        available: true,
+        version: info.version
+      })
+
+      const versionLabel = info?.version ?? ''
+      const downloadedMessage = versionLabel
+        ? i18n.t('about.notifications.updateDownloadedVersion', { version: versionLabel })
+        : i18n.t('about.notifications.updateDownloaded')
+      toast.info(downloadedMessage, {
        action: {
-          label: t('about.notifications.restartNowAction'),
+          label: i18n.t('about.notifications.restartNowAction'),
          onClick: () => {
            void ipcServices.update.quitAndInstall()
          }
@@ -55,60 +212,12 @@ function AppContent() {
      })
    }

-    const resetDownloadState = () => {
-      if (updateDownloadInProgressRef.current) {
-        updateDownloadInProgressRef.current = false
-      }
-    }
-
-    const handleGoToDownloadPage = () => {
-      if (typeof window !== 'undefined') {
-        window.open('https://vidbee.org/download/', '_blank', 'noopener,noreferrer')
-      }
-    }
-
-    const handleUpdateAvailable = (rawInfo: unknown) => {
-      const info = (rawInfo ?? {}) as { version?: string }
-      const versionLabel = info.version ?? ''
-
-      if (autoUpdateEnabled) {
-        // Update will be downloaded automatically because autoDownload is enabled in main process
-        toast.success(t('about.notifications.updateAvailable', { version: versionLabel }), {
-          action: {
-            label: t('about.actions.goToDownload'),
-            onClick: handleGoToDownloadPage
-          }
-        })
-        // No need to manually call downloadUpdate() because autoDownload is true
-      } else {
-        toast.success(t('about.notifications.updateAvailable', { version: versionLabel }), {
-          action: {
-            label: t('about.actions.goToDownload'),
-            onClick: handleGoToDownloadPage
-          }
-        })
-      }
-    }
-
-    const handleUpdateDownloaded = (rawInfo: unknown) => {
-      const info = (rawInfo ?? {}) as { version?: string }
-      resetDownloadState()
-
-      const versionLabel = info?.version ?? ''
-      const downloadedMessage = versionLabel
-        ? t('about.notifications.updateDownloadedVersion', { version: versionLabel })
-        : t('about.notifications.updateDownloaded')
-      toast.success(downloadedMessage)
-
-      showRestartPrompt()
-    }
-
    const handleUpdateError = (rawMessage: unknown) => {
      const message = typeof rawMessage === 'string' ? rawMessage : ''
      resetDownloadState()

-      const errorMessage = message || t('about.notifications.unknownErrorFallback')
-      toast.error(t('about.notifications.updateError', { error: errorMessage }))
+      const errorMessage = message || i18n.t('about.notifications.unknownErrorFallback')
+      toast.error(i18n.t('about.notifications.updateError', { error: errorMessage }))
    }

    const handleDownloadProgress = (rawProgress: unknown) => {
@@ -118,57 +227,29 @@ function AppContent() {
      }
    }

-    const handleUpdateNotification = (rawPayload: unknown) => {
-      const payload = (rawPayload ?? {}) as { body?: string; version?: string }
-      const versionLabel = payload.version ?? ''
-      const downloadedMessage = versionLabel
-        ? t('about.notifications.updateDownloadedVersion', { version: versionLabel })
-        : t('about.notifications.updateDownloaded')
-
-      toast.info(payload?.body ?? downloadedMessage, {
-        action: {
-          label: t('about.notifications.restartNowAction'),
-          onClick: () => {
-            void ipcServices.update.quitAndInstall()
-          }
-        }
-      })
-    }
-
+    // Only listen to update events that should be shown globally
+    // update:available shows a visual indicator in the sidebar
    ipcEvents.on('update:available', handleUpdateAvailable)
    ipcEvents.on('update:downloaded', handleUpdateDownloaded)
    ipcEvents.on('update:error', handleUpdateError)
    ipcEvents.on('update:download-progress', handleDownloadProgress)
-    ipcEvents.on('update:show-notification', handleUpdateNotification)

    return () => {
      ipcEvents.removeListener('update:available', handleUpdateAvailable)
      ipcEvents.removeListener('update:downloaded', handleUpdateDownloaded)
      ipcEvents.removeListener('update:error', handleUpdateError)
      ipcEvents.removeListener('update:download-progress', handleDownloadProgress)
-      ipcEvents.removeListener('update:show-notification', handleUpdateNotification)
    }
-  }, [autoUpdateEnabled, t])
-
-  const renderPage = () => {
-    switch (currentPage) {
-      case 'home':
-        return <Home onOpenSupportedSites={() => setCurrentPage('sites')} />
-      case 'settings':
-        return <Settings />
-      case 'about':
-        return <About />
-      case 'sites':
-        return <SupportedSites />
-      default:
-        return <Home onOpenSupportedSites={() => setCurrentPage('sites')} />
-    }
-  }
+  }, [i18n, setUpdateAvailable, setUpdateReady])

  return (
    <div className="flex flex-row h-screen">
      {/* Sidebar Navigation */}
-      <Sidebar currentPage={currentPage} onPageChange={setCurrentPage} />
+      <Sidebar
+        currentPage={currentPage}
+        onPageChange={handlePageChange}
+        onOpenSupportedSites={handleOpenSupportedSites}
+      />

      {/* Main Content */}
      <main className="flex flex-col flex-1 min-h-0 overflow-hidden bg-background">
@@ -179,8 +260,22 @@ function AppContent() {
          className="flex-1 w-full overflow-y-auto overflow-x-hidden"
          style={{ maxWidth: '100%' }}
        >
-          <div className="w-full overflow-hidden" style={{ maxWidth: '100%' }}>
-            {renderPage()}
+          <div className="w-full h-full flex flex-col min-h-0" style={{ maxWidth: '100%' }}>
+            <Routes>
+              <Route
+                path="/"
+                element={
+                  <Home
+                    onOpenSupportedSites={handleOpenSupportedSites}
+                    onOpenSettings={() => handlePageChange('settings')}
+                  />
+                }
+              />
+              <Route path="/subscriptions" element={<Subscriptions />} />
+              <Route path="/settings" element={<Settings />} />
+              <Route path="/about" element={<About />} />
+              <Route path="*" element={<Navigate to="/" replace />} />
+            </Routes>
          </div>
        </ScrollArea>
      </main>
@@ -192,9 +287,13 @@ function AppContent() {

 function App() {
  return (
-    <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
-      <AppContent />
-    </ThemeProvider>
+    <ErrorBoundary>
+      <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+        <HashRouter>
+          <AppContent />
+        </HashRouter>
+      </ThemeProvider>
+    </ErrorBoundary>
  )
 }

--- a/src/renderer/src/assets/global.css
+++ b/src/renderer/src/assets/global.css
@@ -1,5 +1,7 @@
@import 'tailwindcss';
@import './theme.css';
+@import "tw-animate-css";
+

@layer base {
  * {
@@ -8,5 +10,9 @@
  body {
    @apply text-foreground;
  }
+  input::placeholder,
+  textarea::placeholder {
+    opacity: 0.4;
+  }
 }

--- a/src/renderer/src/assets/theme.css
+++ b/src/renderer/src/assets/theme.css
@@ -34,7 +34,7 @@
  --font-sans: Open Sans, sans-serif;
  --font-serif: Georgia, serif;
  --font-mono: Menlo, monospace;
-  --radius: 1.3rem;
+  --radius: 0.625rem;
  --shadow-x: 0px;
  --shadow-y: 2px;
  --shadow-blur: 0px;
@@ -60,50 +60,35 @@
  --card-foreground: oklch(0.8853 0 0);
  --popover: oklch(0 0 0);
  --popover-foreground: oklch(0.9328 0.0025 228.7857);
-  --primary: oklch(0.6692 0.1607 245.0110);
+  --primary: oklch(0.8223 0.1704 79.8747);
  --primary-foreground: oklch(1.0000 0 0);
  --secondary: oklch(0.9622 0.0035 219.5331);
  --secondary-foreground: oklch(0.1884 0.0128 248.5103);
-  --muted: oklch(0.2090 0 0);
+  --muted: oklch(0.3485 0 0);
  --muted-foreground: oklch(0.5637 0.0078 247.9662);
  --accent: oklch(0.1928 0.0331 242.5459);
-  --accent-foreground: oklch(0.6692 0.1607 245.0110);
+  --accent-foreground: oklch(0.8223 0.1704 79.8747);
  --destructive: oklch(0.6188 0.2376 25.7658);
  --destructive-foreground: oklch(1.0000 0 0);
  --border: oklch(0.2674 0.0047 248.0045);
  --input: oklch(0.3020 0.0288 244.8244);
-  --ring: oklch(0.6818 0.1584 243.3540);
-  --chart-1: oklch(0.6723 0.1606 244.9955);
+  --ring: oklch(0.8223 0.1704 79.8747);
+  --chart-1: oklch(0.8223 0.1704 79.8747);
  --chart-2: oklch(0.6907 0.1554 160.3454);
  --chart-3: oklch(0.8214 0.1600 82.5337);
  --chart-4: oklch(0.7064 0.1822 151.7125);
  --chart-5: oklch(0.5919 0.2186 10.5826);
  --sidebar: oklch(0.2097 0.0080 274.5332);
  --sidebar-foreground: oklch(0.8853 0 0);
-  --sidebar-primary: oklch(0.6818 0.1584 243.3540);
+  --sidebar-primary: oklch(0.8223 0.1704 79.8747);
  --sidebar-primary-foreground: oklch(1.0000 0 0);
  --sidebar-accent: oklch(0.1928 0.0331 242.5459);
-  --sidebar-accent-foreground: oklch(0.6692 0.1607 245.0110);
+  --sidebar-accent-foreground: oklch(0.8223 0.1704 79.8747);
  --sidebar-border: oklch(0.3795 0.0220 240.5943);
-  --sidebar-ring: oklch(0.6818 0.1584 243.3540);
+  --sidebar-ring: oklch(0.8223 0.1704 79.8747);
  --font-sans: Open Sans, sans-serif;
  --font-serif: Georgia, serif;
  --font-mono: Menlo, monospace;
-  --radius: 1.3rem;
-  --shadow-x: 0px;
-  --shadow-y: 2px;
-  --shadow-blur: 0px;
-  --shadow-spread: 0px;
-  --shadow-opacity: 0;
-  --shadow-color: #1da1f2;
-  --shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-sm: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-md: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 2px 4px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-lg: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 4px 6px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 8px 10px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
 }

@theme inline {
@@ -145,16 +130,10 @@
  --font-serif: var(--font-serif);

  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-
-  --shadow-2xs: var(--shadow-2xs);
-  --shadow-xs: var(--shadow-xs);
-  --shadow-sm: var(--shadow-sm);
-  --shadow: var(--shadow);
-  --shadow-md: var(--shadow-md);
-  --shadow-lg: var(--shadow-lg);
-  --shadow-xl: var(--shadow-xl);
-  --shadow-2xl: var(--shadow-2xl);
+--radius-md: calc(var(--radius) - 2px);
+--radius-lg: var(--radius);
+--radius-xl: calc(var(--radius) + 4px);
+--radius-2xl: calc(var(--radius) + 8px);
+--radius-3xl: calc(var(--radius) + 12px);
+--radius-4xl: calc(var(--radius) + 16px);
 }
--- a/src/renderer/src/components/download/DownloadDialog.tsx
+++ b/src/renderer/src/components/download/DownloadDialog.tsx
--- a/src/renderer/src/components/download/DownloadItem.tsx
+++ b/src/renderer/src/components/download/DownloadItem.tsx
@@ -1,13 +1,31 @@
 import { Badge } from '@renderer/components/ui/badge'
 import { Button } from '@renderer/components/ui/button'
-import { ImageWithPlaceholder } from '@renderer/components/ui/image-with-placeholder'
+import { Checkbox } from '@renderer/components/ui/checkbox'
 import { Progress } from '@renderer/components/ui/progress'
+import { RemoteImage } from '@renderer/components/ui/remote-image'
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle
+} from '@renderer/components/ui/sheet'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@renderer/components/ui/tooltip'
 import { useAtomValue, useSetAtom } from 'jotai'
-import { AlertCircle, CheckCircle2, Copy, FolderOpen, Loader2, Play, Trash2, X } from 'lucide-react'
+import {
+  AlertCircle,
+  CheckCircle2,
+  Copy,
+  FolderOpen,
+  Info,
+  Loader2,
+  Play,
+  Trash2,
+  X
+} from 'lucide-react'
+import { type ReactNode, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { toast } from 'sonner'
-import { useCachedThumbnail } from '../../hooks/use-cached-thumbnail'
 import { ipcServices } from '../../lib/ipc'
 import {
  type DownloadRecord,
@@ -16,17 +34,136 @@ import {
 } from '../../store/downloads'
 import { settingsAtom } from '../../store/settings'

-// Helper function to generate file path with proper path separators
-const generateFilePath = (downloadPath: string, title: string, format: string): string => {
-  const fileName = `${title}.${format}`
-  // Use proper path joining for cross-platform compatibility
-  // Handle both forward and backward slashes for cross-platform compatibility
+const normalizeSavedFileName = (fileName?: string): string | undefined => {
+  if (!fileName) {
+    return undefined
+  }
+  const trimmed = fileName.trim()
+  if (!trimmed) {
+    return undefined
+  }
+  return trimmed.replace(/\.f\d+(?=\.[^.]+$)/i, '')
+}
+
+const generateFilePathCandidates = (
+  downloadPath: string,
+  title: string,
+  format: string,
+  savedFileName?: string
+): string[] => {
  const normalizedDownloadPath = downloadPath.replace(/\\/g, '/')
-  return `${normalizedDownloadPath}/${fileName}`
+  const safeTitle = title.trim() || 'Unknown'
+
+  const savedNameCandidates: string[] = []
+  const trimmedSavedFileName = savedFileName?.trim()
+  if (trimmedSavedFileName) {
+    const normalized = normalizeSavedFileName(trimmedSavedFileName)
+    if (normalized) {
+      savedNameCandidates.push(normalized)
+    }
+    if (!normalized || normalized !== trimmedSavedFileName) {
+      savedNameCandidates.push(trimmedSavedFileName)
+    }
+  }
+
+  const candidateFileNames =
+    savedNameCandidates.length > 0
+      ? savedNameCandidates
+      : [`${safeTitle} via VidBee.${format}`, `${safeTitle}.${format}`]
+  return Array.from(
+    new Set(candidateFileNames.map((fileName) => `${normalizedDownloadPath}/${fileName}`))
+  )
+}
+
+const tryFileOperation = async (
+  paths: string[],
+  operation: (filePath: string) => Promise<boolean>
+): Promise<boolean> => {
+  for (const filePath of paths) {
+    const success = await operation(filePath)
+    if (success) {
+      return true
+    }
+  }
+  return false
+}
+
+const getSavedFileExtension = (fileName?: string): string | undefined => {
+  const normalized = normalizeSavedFileName(fileName)
+  if (!normalized) {
+    return undefined
+  }
+  if (!normalized.includes('.')) {
+    return undefined
+  }
+  const ext = normalized.split('.').pop()
+  return ext?.toLowerCase()
+}
+
+const resolveDownloadExtension = (download: DownloadRecord): string => {
+  const savedExt = getSavedFileExtension(download.savedFileName)
+  if (savedExt) {
+    return savedExt
+  }
+  const selectedExt = download.selectedFormat?.ext?.toLowerCase()
+  if (selectedExt) {
+    return selectedExt
+  }
+  return download.type === 'audio' ? 'mp3' : 'mp4'
+}
+
+const getFormatLabel = (download: DownloadRecord): string | undefined => {
+  if (download.selectedFormat?.ext) {
+    return download.selectedFormat.ext.toUpperCase()
+  }
+  const savedExt = getSavedFileExtension(download.savedFileName)
+  return savedExt ? savedExt.toUpperCase() : undefined
+}
+
+const getQualityLabel = (download: DownloadRecord): string | undefined => {
+  const format = download.selectedFormat
+  if (!format) {
+    return undefined
+  }
+  if (format.height) {
+    return `${format.height}p${format.fps === 60 ? '60' : ''}`
+  }
+  if (format.format_note) {
+    return format.format_note
+  }
+  if (typeof format.quality === 'number') {
+    return format.quality.toString()
+  }
+  return undefined
+}
+
+const sanitizeCodec = (codec?: string | null): string | undefined => {
+  if (!codec || codec === 'none') {
+    return undefined
+  }
+  return codec
+}
+
+const getCodecLabel = (download: DownloadRecord): string | undefined => {
+  const format = download.selectedFormat
+  if (!format) {
+    return undefined
+  }
+  if (download.type === 'audio' || download.type === 'extract') {
+    return sanitizeCodec(format.acodec)
+  }
+  return sanitizeCodec(format.vcodec) ?? sanitizeCodec(format.acodec)
 }

 interface DownloadItemProps {
  download: DownloadRecord
+  isSelected?: boolean
+  onToggleSelect?: (id: string) => void
+}
+
+type MetadataDetail = {
+  label: string
+  value: ReactNode
 }

 const formatFileSize = (bytes?: number) => {
@@ -52,20 +189,68 @@ const formatDate = (timestamp?: number) => {
  return new Date(timestamp).toLocaleString()
 }

-export function DownloadItem({ download }: DownloadItemProps) {
+const formatDateShort = (timestamp?: number) => {
+  if (!timestamp) return ''
+  const date = new Date(timestamp)
+  return date.toLocaleString(undefined, {
+    month: 'numeric',
+    day: 'numeric',
+    hour: '2-digit',
+    minute: '2-digit'
+  })
+}
+
+export function DownloadItem({ download, isSelected = false, onToggleSelect }: DownloadItemProps) {
  const { t } = useTranslation()
  const settings = useAtomValue(settingsAtom)
  const removeDownload = useSetAtom(removeDownloadAtom)
  const removeHistory = useSetAtom(removeHistoryRecordAtom)
  const isHistory = download.entryType === 'history'
+  const isSubscriptionDownload = download.origin === 'subscription'
+  const subscriptionLabel = download.subscriptionId ?? t('subscriptions.labels.unknown')
  const timestamp = download.completedAt ?? download.downloadedAt ?? download.createdAt
-  const thumbnailSrc = useCachedThumbnail(download.thumbnail)
-  const showActionsWithoutHover = isHistory || download.status === 'completed'
-  const actionsContainerBaseClass =
-    'flex shrink-0 flex-wrap items-center justify-end gap-1 text-muted-foreground opacity-100 transition-opacity'
-  const actionsContainerClass = showActionsWithoutHover
-    ? actionsContainerBaseClass
-    : `${actionsContainerBaseClass} sm:opacity-0 sm:group-hover:opacity-100`
+  const actionsContainerClass =
+    'relative z-20 flex shrink-0 flex-wrap items-center justify-end gap-1 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity'
+  const resolvedExtension = resolveDownloadExtension(download)
+  const normalizedSavedFileName = normalizeSavedFileName(download.savedFileName)
+  const selectionEnabled = isHistory && Boolean(onToggleSelect)
+
+  // Track if the file exists
+  const [fileExists, setFileExists] = useState(false)
+  const [sheetOpen, setSheetOpen] = useState(false)
+
+  // Check if file exists when download data changes
+  useEffect(() => {
+    const checkFileExists = async () => {
+      if (!download.title || !download.downloadPath) {
+        setFileExists(false)
+        return
+      }
+
+      try {
+        const formatForPath = resolvedExtension
+        const filePaths = generateFilePathCandidates(
+          download.downloadPath,
+          download.title,
+          formatForPath,
+          download.savedFileName
+        )
+        for (const filePath of filePaths) {
+          const exists = await ipcServices.fs.fileExists(filePath)
+          if (exists) {
+            setFileExists(true)
+            return
+          }
+        }
+        setFileExists(false)
+      } catch (error) {
+        console.error('Failed to check file existence:', error)
+        setFileExists(false)
+      }
+    }
+
+    checkFileExists()
+  }, [download.title, download.downloadPath, download.savedFileName, resolvedExtension])

  const handleCancel = async () => {
    if (isHistory) return
@@ -79,12 +264,18 @@ export function DownloadItem({ download }: DownloadItemProps) {

  const handleOpenFolder = async () => {
    try {
-      // Generate file path using downloadPath + title + ext
      const downloadPath = download.downloadPath || settings.downloadPath
-      const format = download.format || (download.type === 'audio' ? 'mp3' : 'mp4')
-      const filePath = generateFilePath(downloadPath, download.title, format)
+      const format = resolvedExtension
+      const filePaths = generateFilePathCandidates(
+        downloadPath,
+        download.title,
+        format,
+        download.savedFileName
+      )

-      const success = await ipcServices.fs.openFileLocation(filePath)
+      const success = await tryFileOperation(filePaths, (filePath) =>
+        ipcServices.fs.openFileLocation(filePath)
+      )
      if (!success) {
        toast.error(t('notifications.openFolderFailed'))
      }
@@ -93,20 +284,40 @@ export function DownloadItem({ download }: DownloadItemProps) {
      toast.error(t('notifications.openFolderFailed'))
    }
  }
+  // Check if copy to clipboard is available
+  const canCopyToClipboard = () => {
+    return Boolean(download.title && download.downloadPath && fileExists)
+  }
+
  // need title, downloadPath, format
  const handleCopyToClipboard = async () => {
-    if (!download.title || !download.downloadPath || !download.format) {
+    if (!canCopyToClipboard()) {
+      toast.error(t('notifications.copyFailed'))
+      return
+    }
+
+    // Type guard: these values are guaranteed to exist after canCopyToClipboard() check
+    const downloadPath = download.downloadPath
+    const format = resolvedExtension
+    const title = download.title
+
+    if (!downloadPath || !title) {
      toast.error(t('notifications.copyFailed'))
      return
    }

    try {
      // Generate file path using downloadPath + title + ext
-      const downloadPath = download.downloadPath
-      const format = download.format
-      const filePath = generateFilePath(downloadPath, download.title, format)
+      const filePaths = generateFilePathCandidates(
+        downloadPath,
+        title,
+        format,
+        download.savedFileName
+      )

-      const success = await ipcServices.fs.copyFileToClipboard(filePath)
+      const success = await tryFileOperation(filePaths, (filePath) =>
+        ipcServices.fs.copyFileToClipboard(filePath)
+      )
      if (!success) {
        toast.error(t('notifications.copyFailed'))
        return
@@ -122,16 +333,25 @@ export function DownloadItem({ download }: DownloadItemProps) {
  const handleRemoveHistory = async () => {
    if (!isHistory) return
    try {
-      // Generate file path using downloadPath + title + ext
      const downloadPath = download.downloadPath || settings.downloadPath
-      const format = download.format || (download.type === 'audio' ? 'mp3' : 'mp4')
-      const filePath = generateFilePath(downloadPath, download.title, format)
+      const format = resolvedExtension
+      const filePaths = generateFilePathCandidates(
+        downloadPath,
+        download.title,
+        format,
+        download.savedFileName
+      )

      // Remove from history first
      await ipcServices.history.removeHistoryItem(download.id)

      // Then try to delete the file
-      await ipcServices.fs.deleteFile(filePath)
+      const deleted = await tryFileOperation(filePaths, (filePath) =>
+        ipcServices.fs.deleteFile(filePath)
+      )
+      if (!deleted) {
+        console.warn('Failed to delete download file for history item:', download.id)
+      }

      removeHistory(download.id)
      toast.success(t('notifications.itemRemoved'))
@@ -180,135 +400,399 @@ export function DownloadItem({ download }: DownloadItemProps) {

  const statusIcon = getStatusIcon()
  const statusText = getStatusText()
+  const progressInfo = download.progress
+  const showInlineProgress = Boolean(
+    progressInfo && download.status !== 'completed' && download.status !== 'error'
+  )
+  const sourceDisplay =
+    download.uploader && download.channel && download.uploader !== download.channel
+      ? `${download.uploader} • ${download.channel}`
+      : download.uploader || download.channel || ''
+
+  const metadataDetails: MetadataDetail[] = []
+
+  if (timestamp) {
+    metadataDetails.push({
+      label: t('history.date'),
+      value: formatDate(timestamp)
+    })
+  }
+
+  if (sourceDisplay) {
+    metadataDetails.push({
+      label: t('download.metadata.source'),
+      value: sourceDisplay
+    })
+  }
+
+  if (download.playlistId) {
+    metadataDetails.push({
+      label: t('download.metadata.playlist'),
+      value: (
+        <span>
+          {download.playlistTitle || t('playlist.untitled')}
+          {download.playlistIndex !== undefined && download.playlistSize !== undefined ? (
+            <span className="text-muted-foreground/80">
+              {` ${t('playlist.positionLabel', {
+                index: download.playlistIndex,
+                total: download.playlistSize
+              })}`}
+            </span>
+          ) : null}
+        </span>
+      )
+    })
+  }
+
+  if (download.duration) {
+    metadataDetails.push({
+      label: t('history.duration'),
+      value: formatDuration(download.duration)
+    })
+  }
+
+  const selectedFormatSize =
+    download.selectedFormat?.filesize || download.selectedFormat?.filesize_approx
+  const inlineFileSize = selectedFormatSize ? formatFileSize(selectedFormatSize) : undefined
+
+  const formatLabelValue = getFormatLabel(download)
+
+  if (formatLabelValue) {
+    metadataDetails.push({
+      label: t('download.metadata.format'),
+      value: formatLabelValue
+    })
+  }
+
+  const qualityLabel = getQualityLabel(download)
+
+  if (qualityLabel) {
+    metadataDetails.push({
+      label: t('download.metadata.quality'),
+      value: qualityLabel
+    })
+  }
+
+  if (inlineFileSize) {
+    metadataDetails.push({
+      label: t('history.fileSize'),
+      value: inlineFileSize
+    })
+  }
+
+  const codecValue = getCodecLabel(download)
+  if (codecValue) {
+    metadataDetails.push({
+      label: t('download.metadata.codec'),
+      value: codecValue
+    })
+  }
+
+  if (normalizedSavedFileName || download.savedFileName) {
+    metadataDetails.push({
+      label: t('download.metadata.savedFile'),
+      value: normalizedSavedFileName ?? download.savedFileName
+    })
+  }
+
+  if (download.url) {
+    metadataDetails.push({
+      label: t('download.metadata.url'),
+      value: (
+        <a
+          href={download.url}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="relative z-20 wrap-break-word text-primary hover:underline"
+        >
+          {download.url}
+        </a>
+      )
+    })
+  }
+
+  // Additional metadata fields
+  if (download.description) {
+    metadataDetails.push({
+      label: t('download.metadata.description'),
+      value: <span className="wrap-break-word">{download.description}</span>
+    })
+  }
+
+  if (download.viewCount !== undefined && download.viewCount !== null) {
+    metadataDetails.push({
+      label: t('download.metadata.views'),
+      value: download.viewCount.toLocaleString()
+    })
+  }
+
+  if (download.tags && download.tags.length > 0) {
+    metadataDetails.push({
+      label: t('download.metadata.tags'),
+      value: (
+        <div className="flex flex-wrap gap-1">
+          {download.tags.map((tag) => (
+            <Badge key={tag} variant="secondary" className="text-[10px] px-1.5 py-0.5">
+              {tag}
+            </Badge>
+          ))}
+        </div>
+      )
+    })
+  }
+
+  if (download.downloadPath) {
+    metadataDetails.push({
+      label: t('download.metadata.downloadPath'),
+      value: <span className="wrap-break-word font-mono text-xs">{download.downloadPath}</span>
+    })
+  }
+
+  // Timestamps
+  if (download.createdAt && download.createdAt !== timestamp) {
+    metadataDetails.push({
+      label: t('download.metadata.createdAt'),
+      value: formatDate(download.createdAt)
+    })
+  }
+
+  if (download.startedAt) {
+    metadataDetails.push({
+      label: t('download.metadata.startedAt'),
+      value: formatDate(download.startedAt)
+    })
+  }
+
+  if (download.completedAt && download.completedAt !== timestamp) {
+    metadataDetails.push({
+      label: t('download.metadata.completedAt'),
+      value: formatDate(download.completedAt)
+    })
+  }
+
+  // Speed
+  if (download.speed) {
+    metadataDetails.push({
+      label: t('download.metadata.speed'),
+      value: download.speed
+    })
+  }
+
+  // File size (if different from inlineFileSize)
+  if (download.fileSize && download.fileSize !== selectedFormatSize) {
+    metadataDetails.push({
+      label: t('download.metadata.fileSize'),
+      value: formatFileSize(download.fileSize)
+    })
+  }
+
+  // Selected format details
+  if (download.selectedFormat) {
+    if (download.selectedFormat.width) {
+      metadataDetails.push({
+        label: t('download.metadata.width'),
+        value: `${download.selectedFormat.width}px`
+      })
+    }
+
+    if (download.selectedFormat.height && !qualityLabel) {
+      metadataDetails.push({
+        label: t('download.metadata.height'),
+        value: `${download.selectedFormat.height}px`
+      })
+    }
+
+    if (download.selectedFormat.fps) {
+      metadataDetails.push({
+        label: t('download.metadata.fps'),
+        value: `${download.selectedFormat.fps}`
+      })
+    }
+
+    if (download.selectedFormat.vcodec) {
+      metadataDetails.push({
+        label: t('download.metadata.videoCodec'),
+        value: download.selectedFormat.vcodec
+      })
+    }
+
+    if (download.selectedFormat.acodec) {
+      metadataDetails.push({
+        label: t('download.metadata.audioCodec'),
+        value: download.selectedFormat.acodec
+      })
+    }
+
+    if (download.selectedFormat.format_note) {
+      metadataDetails.push({
+        label: t('download.metadata.formatNote'),
+        value: download.selectedFormat.format_note
+      })
+    }
+
+    if (download.selectedFormat.protocol) {
+      metadataDetails.push({
+        label: t('download.metadata.protocol'),
+        value: download.selectedFormat.protocol.toUpperCase()
+      })
+    }
+  }
+
+  if (isSubscriptionDownload) {
+    metadataDetails.push({
+      label: t('download.metadata.subscription'),
+      value: subscriptionLabel
+    })
+  }
+
+  const hasMetadataDetails = metadataDetails.length > 0
+
+  const isSelectedHistory = selectionEnabled && isSelected

  return (
-    <div className="group relative w-full max-w-full overflow-hidden">
-      <div className="flex w-full flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-start sm:gap-4">
+    <div
+      className={`group relative w-full max-w-full overflow-hidden rounded-lg border border-transparent transition-colors ${
+        isSelectedHistory ? 'bg-primary/10' : ''
+      }`}
+    >
+      {isSelectedHistory && (
+        <div className="absolute left-0 top-0 h-full w-1 bg-primary/70" aria-hidden="true" />
+      )}
+      <div
+        className={`flex w-full flex-col gap-2 sm:flex-row sm:items-center sm:gap-3 ${
+          selectionEnabled ? 'cursor-pointer' : ''
+        }`}
+        {...(selectionEnabled
+          ? {
+              onClick: () => onToggleSelect?.(download.id),
+              onKeyDown: (e: React.KeyboardEvent) => {
+                if (e.key === 'Enter' || e.key === ' ') {
+                  e.preventDefault()
+                  onToggleSelect?.(download.id)
+                }
+              },
+              role: 'button',
+              tabIndex: 0,
+              'aria-label': t('history.selectItem')
+            }
+          : {})}
+      >
        {/* Thumbnail */}
-        <div className="shrink-0 overflow-hidden rounded-md border border-border/60 bg-background/60 w-32 h-20">
-          <ImageWithPlaceholder
-            src={thumbnailSrc}
+        <div className="relative z-20 shrink-0 overflow-hidden rounded-lg border border-border/60 bg-background/60 w-20 h-14 pointer-events-none">
+          {selectionEnabled && (
+            <div
+              className={`absolute left-1 top-1 z-30 rounded-md transition pointer-events-auto ${
+                isSelected
+                  ? 'opacity-100'
+                  : 'opacity-0 group-hover:opacity-100 group-focus-within:opacity-100'
+              }`}
+            >
+              <Checkbox
+                checked={Boolean(isSelected)}
+                onCheckedChange={() => onToggleSelect?.(download.id)}
+                onClick={(event) => event.stopPropagation()}
+                aria-label={t('history.selectItem')}
+              />
+            </div>
+          )}
+          <RemoteImage
+            src={download.thumbnail}
            alt={download.title}
            className="w-full h-full object-cover"
-            fallbackIcon={<Play className="h-6 w-6" />}
+            fallbackIcon={<Play className="h-4 w-4" />}
          />
        </div>

        {/* Content */}
-        <div className="flex-1 min-w-0 max-w-full space-y-3 overflow-hidden">
-          <div className="flex w-full flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-start sm:justify-between sm:gap-4">
-            <div className="flex-1 min-w-0 max-w-full space-y-2 overflow-hidden">
-              <div className="w-full min-w-0 overflow-hidden">
-                <p className="w-full wrap-break-word text-sm font-medium sm:text-base line-clamp-2">
+        <div className="flex-1 min-w-0 max-w-full space-y-1.5 overflow-hidden pointer-events-none">
+          <div className="flex w-full flex-col gap-1.5 sm:flex-row sm:items-start sm:justify-between sm:gap-2">
+            <div className="flex-1 min-w-0 max-w-full space-y-1 overflow-hidden">
+              <div className="w-full min-w-0 overflow-hidden flex flex-wrap items-center gap-1.5">
+                <p className="flex-1 wrap-break-word text-sm font-medium line-clamp-1">
                  {download.title}
                </p>
-              </div>
-              <div className="flex w-full flex-wrap items-center gap-2 text-xs text-muted-foreground">
-                <Badge variant="outline" className="bg-muted/50 capitalize text-[11px] font-medium">
-                  {download.type}
-                </Badge>
-                {(statusIcon || statusText) && (
-                  <div className="flex items-center gap-1 text-xs text-muted-foreground">
-                    {statusIcon}
-                    <span>{statusText}</span>
-                  </div>
+                {isSubscriptionDownload && (
+                  <Badge variant="secondary" className="text-[10px] px-1.5 py-0.5 shrink-0">
+                    {t('subscriptions.labels.subscription')}
+                  </Badge>
                )}
              </div>
-              {download.playlistId && (
-                <div className="flex w-full flex-wrap items-center gap-2 text-xs text-muted-foreground">
-                  <Badge
-                    variant="secondary"
-                    className="bg-blue-500/10 text-blue-700 dark:text-blue-200"
-                  >
-                    {t('playlist.badgeLabel')}
-                  </Badge>
-                  <span className="truncate">
-                    {download.playlistTitle || t('playlist.untitled')}
-                    {download.playlistIndex !== undefined &&
-                      download.playlistSize !== undefined && (
-                        <span className="ml-1 text-muted-foreground/80">
-                          {t('playlist.positionLabel', {
-                            index: download.playlistIndex,
-                            total: download.playlistSize
-                          })}
-                        </span>
-                      )}
-                  </span>
-                </div>
-              )}
-              <div className="flex w-full min-w-0 flex-wrap items-center gap-2 text-xs text-muted-foreground">
-                {timestamp ? (
-                  <span className="truncate max-w-[120px]">{formatDate(timestamp)}</span>
-                ) : null}
-
-                <span className="truncate max-w-[120px] text-left">
+              <div className="flex w-full flex-wrap items-center gap-1.5 text-[11px] text-muted-foreground">
+                {/* Status */}
+                {statusIcon && (
                  <Tooltip>
                    <TooltipTrigger asChild>
-                      <a
-                        href={download.url}
-                        target="_blank"
-                        rel="noopener noreferrer"
-                        className="hover:text-primary transition-colors cursor-pointer"
-                      >
-                        {download.uploader &&
-                        download.channel &&
-                        download.uploader !== download.channel
-                          ? `${download.uploader} • ${download.channel}`
-                          : download.uploader
-                            ? `${download.uploader}`
-                            : download.channel
-                              ? `${download.channel}`
-                              : ''}
-                      </a>
+                      <div className="flex items-center shrink-0">{statusIcon}</div>
                    </TooltipTrigger>
-                    <TooltipContent className="max-w-xs wrap-break-word">
-                      <p>{download.url}</p>
+                    <TooltipContent>
+                      <p>{statusText}</p>
                    </TooltipContent>
                  </Tooltip>
-                </span>
-                {download.duration ? <span>{formatDuration(download.duration)}</span> : null}
-                {download.selectedFormat ? (
-                  <>
-                    {download.selectedFormat.height ? (
-                      <Badge variant="secondary" className="text-[10px] px-1.5 py-0.5">
-                        {download.selectedFormat.height}p
-                        {download.selectedFormat.fps === 60 ? '60' : ''}
-                      </Badge>
-                    ) : null}
-                    {download.selectedFormat.ext ? (
-                      <Badge variant="outline" className="text-[10px] px-1.5 py-0.5">
-                        {download.selectedFormat.ext.toUpperCase()}
-                      </Badge>
-                    ) : null}
-                    {download.selectedFormat.filesize || download.selectedFormat.filesize_approx ? (
-                      <span className="text-[10px] opacity-75">
-                        {formatFileSize(
-                          download.selectedFormat.filesize ||
-                            download.selectedFormat.filesize_approx
-                        )}
+                )}
+                {showInlineProgress && (
+                  <div className="flex items-center gap-2 min-w-0">
+                    <span className="font-medium shrink-0">
+                      {(progressInfo?.percent ?? 0).toFixed(1)}%
+                    </span>
+                    {progressInfo?.downloaded && progressInfo?.total && (
+                      <span className="truncate max-w-[120px]">
+                        {progressInfo.downloaded} / {progressInfo.total}
                      </span>
-                    ) : null}
-                  </>
-                ) : (
+                    )}
+                    {progressInfo?.currentSpeed && (
+                      <span className="truncate max-w-[80px]">{progressInfo.currentSpeed}</span>
+                    )}
+                    {progressInfo?.eta && (
+                      <span className="truncate max-w-[80px]">ETA: {progressInfo.eta}</span>
+                    )}
+                  </div>
+                )}
+                {/* Timestamp */}
+                {timestamp && (
+                  <span className="truncate shrink-0">{formatDateShort(timestamp)}</span>
+                )}
+                {/* Quality */}
+                {qualityLabel && (
                  <>
-                    {download.quality ? (
-                      <Badge variant="secondary" className="text-[10px] px-1.5 py-0.5">
-                        {download.quality}
-                      </Badge>
-                    ) : null}
-                    {download.format ? (
-                      <Badge variant="outline" className="text-[10px] px-1.5 py-0.5">
-                        {download.format.toUpperCase()}
-                      </Badge>
-                    ) : null}
-                    {download.codec ? (
-                      <span className="text-[10px] opacity-75">{download.codec}</span>
-                    ) : null}
+                    {(statusIcon || timestamp) && (
+                      <span className="text-muted-foreground/60 shrink-0">•</span>
+                    )}
+                    <span className="shrink-0">{qualityLabel}</span>
+                  </>
+                )}
+                {/* File size */}
+                {inlineFileSize && (
+                  <>
+                    {(statusIcon || timestamp || qualityLabel) && (
+                      <span className="text-muted-foreground/60 shrink-0">•</span>
+                    )}
+                    <span className="shrink-0">{inlineFileSize}</span>
                  </>
                )}
              </div>
            </div>
-            <div className={actionsContainerClass}>
+            <div className={`${actionsContainerClass} pointer-events-auto`}>
+              {/* Info button - show details in sheet */}
+              {hasMetadataDetails && (
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="h-8 w-8 shrink-0 rounded-full"
+                      onClick={(e) => {
+                        e.stopPropagation()
+                        setSheetOpen(true)
+                      }}
+                    >
+                      <Info className="h-4 w-4" />
+                    </Button>
+                  </TooltipTrigger>
+                  <TooltipContent>
+                    <p>{t('download.showDetails')}</p>
+                  </TooltipContent>
+                </Tooltip>
+              )}
              {isHistory ? (
                <>
                  {download.status === 'completed' && (
@@ -318,9 +802,12 @@ export function DownloadItem({ download }: DownloadItemProps) {
                          <Button
                            variant="ghost"
                            size="icon"
-                            className="h-8 w-8 shrink-0"
-                            onClick={handleCopyToClipboard}
-                            disabled={!download.title || !download.downloadPath || !download.format}
+                            className="h-8 w-8 shrink-0 rounded-full"
+                            onClick={(e) => {
+                              e.stopPropagation()
+                              handleCopyToClipboard()
+                            }}
+                            disabled={!canCopyToClipboard()}
                          >
                            <Copy className="h-4 w-4" />
                          </Button>
@@ -334,8 +821,11 @@ export function DownloadItem({ download }: DownloadItemProps) {
                          <Button
                            variant="ghost"
                            size="icon"
-                            className="h-8 w-8 shrink-0"
-                            onClick={handleOpenFolder}
+                            className="h-8 w-8 shrink-0 rounded-full"
+                            onClick={(e) => {
+                              e.stopPropagation()
+                              handleOpenFolder()
+                            }}
                          >
                            <FolderOpen className="h-4 w-4" />
                          </Button>
@@ -351,8 +841,11 @@ export function DownloadItem({ download }: DownloadItemProps) {
                      <Button
                        variant="ghost"
                        size="icon"
-                        className="h-8 w-8 shrink-0"
-                        onClick={handleRemoveHistory}
+                        className="h-8 w-8 shrink-0 rounded-full"
+                        onClick={(e) => {
+                          e.stopPropagation()
+                          handleRemoveHistory()
+                        }}
                      >
                        <Trash2 className="h-4 w-4" />
                      </Button>
@@ -371,8 +864,12 @@ export function DownloadItem({ download }: DownloadItemProps) {
                          <Button
                            variant="ghost"
                            size="icon"
-                            className="h-8 w-8 shrink-0"
-                            onClick={handleCopyToClipboard}
+                            className="h-8 w-8 shrink-0 rounded-full"
+                            onClick={(e) => {
+                              e.stopPropagation()
+                              handleCopyToClipboard()
+                            }}
+                            disabled={!canCopyToClipboard()}
                          >
                            <Copy className="h-4 w-4" />
                          </Button>
@@ -386,8 +883,11 @@ export function DownloadItem({ download }: DownloadItemProps) {
                          <Button
                            variant="ghost"
                            size="icon"
-                            className="h-8 w-8 shrink-0"
-                            onClick={handleOpenFolder}
+                            className="h-8 w-8 shrink-0 rounded-full"
+                            onClick={(e) => {
+                              e.stopPropagation()
+                              handleOpenFolder()
+                            }}
                          >
                            <FolderOpen className="h-4 w-4" />
                          </Button>
@@ -404,8 +904,11 @@ export function DownloadItem({ download }: DownloadItemProps) {
                    <Button
                      variant="ghost"
                      size="icon"
-                      className="h-8 w-8 shrink-0"
-                      onClick={handleCancel}
+                      className="h-8 w-8 shrink-0 rounded-full"
+                      onClick={(e) => {
+                        e.stopPropagation()
+                        handleCancel()
+                      }}
                    >
                      <X className="h-4 w-4" />
                    </Button>
@@ -417,26 +920,8 @@ export function DownloadItem({ download }: DownloadItemProps) {

          {/* Progress */}
          {download.progress && download.status !== 'completed' && download.status !== 'error' && (
-            <div className="space-y-2 bg-background/60 w-full overflow-hidden">
-              <Progress value={download.progress.percent} className="h-1.5 w-full" />
-              <div className="flex flex-wrap items-center justify-between gap-2 text-xs text-muted-foreground w-full">
-                <span className="font-medium shrink-0">
-                  {download.progress.percent.toFixed(1)}%
-                </span>
-                <div className="flex flex-wrap items-center gap-3 min-w-0 flex-1">
-                  {download.progress.downloaded && download.progress.total && (
-                    <span className="truncate max-w-[100px]">
-                      {download.progress.downloaded} / {download.progress.total}
-                    </span>
-                  )}
-                  {download.progress.currentSpeed && (
-                    <span className="truncate max-w-[80px]">{download.progress.currentSpeed}</span>
-                  )}
-                  {download.progress.eta && (
-                    <span className="truncate max-w-[80px]">ETA: {download.progress.eta}</span>
-                  )}
-                </div>
-              </div>
+            <div className="bg-background/60 w-full overflow-hidden">
+              <Progress value={download.progress.percent} className="h-1 w-full" />
            </div>
          )}

@@ -448,6 +933,32 @@ export function DownloadItem({ download }: DownloadItemProps) {
          )}
        </div>
      </div>
+
+      {/* Video Details Sheet */}
+      {hasMetadataDetails && (
+        <Sheet open={sheetOpen} onOpenChange={setSheetOpen}>
+          <SheetContent side="right" className="w-full sm:max-w-lg flex flex-col p-0">
+            <div className="flex flex-col h-full overflow-hidden">
+              <SheetHeader className="px-6 pt-6 pb-4 border-b shrink-0">
+                <SheetTitle className="line-clamp-2">{download.title}</SheetTitle>
+                <SheetDescription>{t('download.videoInfo')}</SheetDescription>
+              </SheetHeader>
+              <div className="flex-1 overflow-y-auto px-6 py-4">
+                <div className="space-y-4">
+                  {metadataDetails.map((item, index) => (
+                    <div key={`${item.label}-${index}`} className="flex flex-col gap-1">
+                      <span className="text-sm font-medium text-muted-foreground">
+                        {item.label}
+                      </span>
+                      <div className="text-sm text-foreground break-words">{item.value}</div>
+                    </div>
+                  ))}
+                </div>
+              </div>
+            </div>
+          </SheetContent>
+        </Sheet>
+      )}
    </div>
  )
 }
--- a/src/renderer/src/components/download/PlaylistDownloadGroup.tsx
+++ b/src/renderer/src/components/download/PlaylistDownloadGroup.tsx
@@ -1,5 +1,9 @@
+import { ChevronDown, ChevronRight, Trash2 } from 'lucide-react'
+import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import type { DownloadRecord } from '../../store/downloads'
+import { Button } from '../ui/button'
+import { Progress } from '../ui/progress'
 import { DownloadItem } from './DownloadItem'

 interface PlaylistDownloadGroupProps {
@@ -7,15 +11,50 @@ interface PlaylistDownloadGroupProps {
  title: string
  records: DownloadRecord[]
  totalCount: number
+  selectedIds?: Set<string>
+  onToggleSelect?: (id: string) => void
+  onDeletePlaylist?: (playlistId: string, title: string, ids: string[]) => void
+}
+
+const STORAGE_KEY_PREFIX = 'playlist_expanded_'
+
+const getStorageKey = (groupId: string): string => {
+  return `${STORAGE_KEY_PREFIX}${groupId}`
+}
+
+const loadExpandedState = (groupId: string): boolean => {
+  try {
+    const stored = localStorage.getItem(getStorageKey(groupId))
+    return stored === 'true'
+  } catch (error) {
+    console.error('Failed to load playlist expanded state:', error)
+    return false
+  }
+}
+
+const saveExpandedState = (groupId: string, isExpanded: boolean): void => {
+  try {
+    localStorage.setItem(getStorageKey(groupId), String(isExpanded))
+  } catch (error) {
+    console.error('Failed to save playlist expanded state:', error)
+  }
 }

 export function PlaylistDownloadGroup({
  groupId,
  title,
  records,
-  totalCount
+  totalCount,
+  selectedIds,
+  onToggleSelect,
+  onDeletePlaylist
 }: PlaylistDownloadGroupProps) {
  const { t } = useTranslation()
+  const [isExpanded, setIsExpanded] = useState(() => loadExpandedState(groupId))
+
+  useEffect(() => {
+    saveExpandedState(groupId, isExpanded)
+  }, [groupId, isExpanded])

  const completedCount = records.filter((record) => record.status === 'completed').length
  const errorCount = records.filter((record) => record.status === 'error').length
@@ -24,35 +63,108 @@ export function PlaylistDownloadGroup({
  ).length

  const displayTitle = title || t('playlist.untitled')
+  const historyRecords = records.filter((record) => record.entryType === 'history')
+  const canDeletePlaylist = historyRecords.length > 0 && Boolean(onDeletePlaylist)
+  const toggleLabel = isExpanded ? t('playlist.groupCollapse') : t('playlist.groupExpand')
+  const totalProgress = records.reduce((acc, record) => {
+    if (record.status === 'completed') {
+      return acc + 1
+    }
+    if (record.progress?.percent && record.progress.percent > 0) {
+      return acc + Math.min(record.progress.percent, 100) / 100
+    }
+    return acc
+  }, 0)
+  const aggregatePercent = totalCount > 0 ? Math.min((totalProgress / totalCount) * 100, 100) : 0

  return (
-    <div className="space-y-2 rounded-md border border-border/60 bg-muted/20 p-3">
-      <div className="flex flex-wrap items-center justify-between gap-3">
-        <div className="min-w-0">
-          <p className="truncate text-sm font-semibold text-foreground">{displayTitle}</p>
-          <p className="text-xs text-muted-foreground">
-            {t('playlist.groupSummary', { completed: completedCount, total: totalCount })}
-          </p>
-        </div>
-        <div className="flex shrink-0 items-center gap-2 text-xs text-muted-foreground">
-          {activeCount > 0 && <span>{t('playlist.groupActive', { count: activeCount })}</span>}
-          {errorCount > 0 && (
-            <span className="text-destructive">
-              {t('playlist.groupErrors', { count: errorCount })}
-            </span>
+    <div className="space-y-2 rounded-md bg-muted/30 px-2.5 py-2">
+      <div className="flex items-center justify-between gap-2">
+        <button
+          type="button"
+          className="flex min-w-0 flex-1 items-center gap-2 rounded-md p-1.5 transition-colors hover:bg-muted/40 active:bg-muted/60 -ml-1.5 -mr-1.5"
+          onClick={() => setIsExpanded((prev) => !prev)}
+          aria-expanded={isExpanded}
+          aria-label={toggleLabel}
+          title={toggleLabel}
+        >
+          <div className="flex shrink-0 items-center justify-center text-muted-foreground">
+            {isExpanded ? (
+              <ChevronDown className="h-5 w-5" />
+            ) : (
+              <ChevronRight className="h-5 w-5" />
+            )}
+          </div>
+          <div className="min-w-0 flex-1 text-left">
+            <p className="truncate text-sm font-medium text-foreground">{displayTitle}</p>
+            <div className="flex items-center gap-1.5 text-[11px] text-muted-foreground">
+              <span>
+                {t('playlist.collapsedProgress', { completed: completedCount, total: totalCount })}
+              </span>
+              {activeCount > 0 && (
+                <>
+                  <span className="text-muted-foreground/50">•</span>
+                  <span>{t('playlist.groupActive', { count: activeCount })}</span>
+                </>
+              )}
+              {errorCount > 0 && (
+                <>
+                  <span className="text-muted-foreground/50">•</span>
+                  <span className="text-destructive">
+                    {t('playlist.groupErrors', { count: errorCount })}
+                  </span>
+                </>
+              )}
+            </div>
+          </div>
+        </button>
+        <div className="flex shrink-0 items-center gap-1">
+          {canDeletePlaylist && (
+            <Button
+              type="button"
+              variant="ghost"
+              size="icon"
+              className="h-6 w-6 rounded-full"
+              onClick={(e) => {
+                e.stopPropagation()
+                onDeletePlaylist?.(
+                  groupId,
+                  displayTitle,
+                  historyRecords.map((record) => record.id)
+                )
+              }}
+              aria-label={t('history.deletePlaylist')}
+              title={t('history.deletePlaylist')}
+            >
+              <Trash2 className="h-3.5 w-3.5" />
+            </Button>
          )}
        </div>
      </div>

-      <div className="space-y-2">
-        {records.map((record) => (
-          <div
-            key={`${groupId}:${record.entryType}:${record.id}`}
-            className="border-l border-border/50 pl-3"
-          >
-            <DownloadItem download={record} />
+      {!isExpanded && totalCount > 0 && (
+        <Progress value={aggregatePercent} className="h-0.5 w-full" />
+      )}
+
+      <div
+        className="grid overflow-hidden transition-[grid-template-rows] duration-300 ease-in-out"
+        style={{
+          gridTemplateRows: isExpanded ? '1fr' : '0fr'
+        }}
+      >
+        <div className="min-h-0">
+          <div className="space-y-3 pt-1">
+            {records.map((record) => (
+              <div key={`${groupId}:${record.entryType}:${record.id}`}>
+                <DownloadItem
+                  download={record}
+                  isSelected={selectedIds?.has(record.id) ?? false}
+                  onToggleSelect={onToggleSelect}
+                />
+              </div>
+            ))}
          </div>
-        ))}
+        </div>
      </div>
    </div>
  )
--- a/src/renderer/src/components/download/UnifiedDownloadHistory.tsx
+++ b/src/renderer/src/components/download/UnifiedDownloadHistory.tsx
@@ -1,27 +1,147 @@
 import { Button } from '@renderer/components/ui/button'
-import { Card, CardContent, CardHeader, CardTitle } from '@renderer/components/ui/card'
+import { CardContent, CardHeader } from '@renderer/components/ui/card'
+import { Checkbox } from '@renderer/components/ui/checkbox'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from '@renderer/components/ui/dialog'
 import { cn } from '@renderer/lib/utils'
 import { useAtomValue, useSetAtom } from 'jotai'
 import { History as HistoryIcon } from 'lucide-react'
-import { useMemo, useState } from 'react'
+import { useEffect, useId, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
+import { toast } from 'sonner'
 import { useHistorySync } from '../../hooks/use-history-sync'
+import { ipcServices } from '../../lib/ipc'
 import type { DownloadRecord } from '../../store/downloads'
-import { clearCompletedAtom, downloadStatsAtom, downloadsArrayAtom } from '../../store/downloads'
+import {
+  downloadStatsAtom,
+  downloadsArrayAtom,
+  removeHistoryRecordsAtom,
+  removeHistoryRecordsByPlaylistAtom
+} from '../../store/downloads'
+import { settingsAtom } from '../../store/settings'
+import { DownloadDialog } from './DownloadDialog'
 import { DownloadItem } from './DownloadItem'
 import { PlaylistDownloadGroup } from './PlaylistDownloadGroup'

 type StatusFilter = 'all' | 'active' | 'completed' | 'error'
+type ConfirmAction =
+  | { type: 'delete-selected'; ids: string[] }
+  | { type: 'delete-playlist'; playlistId: string; title: string; ids: string[] }

-export function UnifiedDownloadHistory() {
+const normalizeSavedFileName = (fileName?: string): string | undefined => {
+  if (!fileName) {
+    return undefined
+  }
+  const trimmed = fileName.trim()
+  if (!trimmed) {
+    return undefined
+  }
+  return trimmed.replace(/\.f\d+(?=\.[^.]+$)/i, '')
+}
+
+const generateFilePathCandidates = (
+  downloadPath: string,
+  title: string,
+  format: string,
+  savedFileName?: string
+): string[] => {
+  const normalizedDownloadPath = downloadPath.replace(/\\/g, '/')
+  const safeTitle = title.trim() || 'Unknown'
+
+  const savedNameCandidates: string[] = []
+  const trimmedSavedFileName = savedFileName?.trim()
+  if (trimmedSavedFileName) {
+    const normalized = normalizeSavedFileName(trimmedSavedFileName)
+    if (normalized) {
+      savedNameCandidates.push(normalized)
+    }
+    if (!normalized || normalized !== trimmedSavedFileName) {
+      savedNameCandidates.push(trimmedSavedFileName)
+    }
+  }
+
+  const candidateFileNames =
+    savedNameCandidates.length > 0
+      ? savedNameCandidates
+      : [`${safeTitle} via VidBee.${format}`, `${safeTitle}.${format}`]
+  return Array.from(
+    new Set(candidateFileNames.map((fileName) => `${normalizedDownloadPath}/${fileName}`))
+  )
+}
+
+const tryFileOperation = async (
+  paths: string[],
+  operation: (filePath: string) => Promise<boolean>
+): Promise<boolean> => {
+  for (const filePath of paths) {
+    const success = await operation(filePath)
+    if (success) {
+      return true
+    }
+  }
+  return false
+}
+
+const getSavedFileExtension = (fileName?: string): string | undefined => {
+  const normalized = normalizeSavedFileName(fileName)
+  if (!normalized) {
+    return undefined
+  }
+  if (!normalized.includes('.')) {
+    return undefined
+  }
+  const ext = normalized.split('.').pop()
+  return ext?.toLowerCase()
+}
+
+const resolveDownloadExtension = (download: DownloadRecord): string => {
+  const savedExt = getSavedFileExtension(download.savedFileName)
+  if (savedExt) {
+    return savedExt
+  }
+  const selectedExt = download.selectedFormat?.ext?.toLowerCase()
+  if (selectedExt) {
+    return selectedExt
+  }
+  return download.type === 'audio' ? 'mp3' : 'mp4'
+}
+
+interface UnifiedDownloadHistoryProps {
+  onOpenSupportedSites?: () => void
+  onOpenSettings?: () => void
+}
+
+export function UnifiedDownloadHistory({
+  onOpenSupportedSites,
+  onOpenSettings
+}: UnifiedDownloadHistoryProps) {
  const { t } = useTranslation()
  const allRecords = useAtomValue(downloadsArrayAtom)
  const downloadStats = useAtomValue(downloadStatsAtom)
-  const clearCompleted = useSetAtom(clearCompletedAtom)
+  const removeHistoryRecords = useSetAtom(removeHistoryRecordsAtom)
+  const removeHistoryRecordsByPlaylist = useSetAtom(removeHistoryRecordsByPlaylistAtom)
+  const settings = useAtomValue(settingsAtom)
  const [statusFilter, setStatusFilter] = useState<StatusFilter>('all')
+  const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set())
+  const [confirmAction, setConfirmAction] = useState<ConfirmAction | null>(null)
+  const [confirmBusy, setConfirmBusy] = useState(false)
+  const [alsoDeleteFiles, setAlsoDeleteFiles] = useState(false)
+  const alsoDeleteFilesId = useId()

  useHistorySync()

+  const historyRecords = useMemo(
+    () => allRecords.filter((record) => record.entryType === 'history'),
+    [allRecords]
+  )
+  const selectedCount = selectedIds.size
+
  const filteredRecords = useMemo(() => {
    return allRecords.filter((record) => {
      switch (statusFilter) {
@@ -49,6 +169,184 @@ export function UnifiedDownloadHistory() {
    { key: 'error', label: t('download.error'), count: downloadStats.error }
  ]

+  const selectableIds = useMemo(
+    () =>
+      filteredRecords.filter((record) => record.entryType === 'history').map((record) => record.id),
+    [filteredRecords]
+  )
+  const selectableCount = selectableIds.length
+  const selectionSummary =
+    selectableCount === 0
+      ? t('history.selectedCount', { count: selectedCount })
+      : t('history.selectionSummary', { selected: selectedCount, total: selectableCount })
+
+  useEffect(() => {
+    if (selectedIds.size === 0) {
+      return
+    }
+    const historyIdSet = new Set(historyRecords.map((record) => record.id))
+    setSelectedIds((prev) => {
+      let changed = false
+      const next = new Set<string>()
+      for (const id of prev) {
+        if (historyIdSet.has(id)) {
+          next.add(id)
+        } else {
+          changed = true
+        }
+      }
+      return changed ? next : prev
+    })
+  }, [historyRecords, selectedIds.size])
+
+  const handleToggleSelect = (id: string) => {
+    setSelectedIds((prev) => {
+      const next = new Set(prev)
+      if (next.has(id)) {
+        next.delete(id)
+      } else {
+        next.add(id)
+      }
+      return next
+    })
+  }
+
+  const handleClearSelection = () => {
+    setSelectedIds(new Set())
+  }
+
+  const handleRequestDeleteSelected = () => {
+    if (selectedIds.size === 0) {
+      return
+    }
+    setConfirmAction({ type: 'delete-selected', ids: Array.from(selectedIds) })
+  }
+
+  const handleRequestDeletePlaylist = (playlistId: string, title: string, ids: string[]) => {
+    if (ids.length === 0) {
+      return
+    }
+    setConfirmAction({ type: 'delete-playlist', playlistId, title, ids })
+  }
+
+  const pruneSelectedIds = (ids: string[]) => {
+    if (ids.length === 0) {
+      return
+    }
+    setSelectedIds((prev) => {
+      const next = new Set(prev)
+      let changed = false
+      ids.forEach((id) => {
+        if (next.delete(id)) {
+          changed = true
+        }
+      })
+      return changed ? next : prev
+    })
+  }
+
+  const confirmContent = useMemo(() => {
+    if (!confirmAction) {
+      return null
+    }
+    switch (confirmAction.type) {
+      case 'delete-selected': {
+        return {
+          title: t('history.confirmDeleteSelectedTitle'),
+          description: t('history.confirmDeleteSelectedDescription', {
+            count: confirmAction.ids.length
+          }),
+          actionLabel: t('history.removeAction')
+        }
+      }
+      case 'delete-playlist': {
+        return {
+          title: t('history.confirmDeletePlaylistTitle'),
+          description: t('history.confirmDeletePlaylistDescription', {
+            count: confirmAction.ids.length,
+            title: confirmAction.title
+          }),
+          actionLabel: t('history.removeAction')
+        }
+      }
+      default:
+        return null
+    }
+  }, [confirmAction, t])
+
+  const deleteHistoryFiles = async (records: DownloadRecord[]) => {
+    const failedIds: string[] = []
+    for (const record of records) {
+      if (!record.title) {
+        continue
+      }
+      const downloadPath = record.downloadPath || settings.downloadPath
+      if (!downloadPath) {
+        continue
+      }
+      const formatForPath = resolveDownloadExtension(record)
+      const filePaths = generateFilePathCandidates(
+        downloadPath,
+        record.title,
+        formatForPath,
+        record.savedFileName
+      )
+      const deleted = await tryFileOperation(filePaths, (filePath) =>
+        ipcServices.fs.deleteFile(filePath)
+      )
+      if (!deleted) {
+        failedIds.push(record.id)
+      }
+    }
+    if (failedIds.length > 0) {
+      console.warn('Failed to delete some playlist files:', failedIds)
+    }
+  }
+
+  const handleConfirmAction = async () => {
+    if (!confirmAction) {
+      return
+    }
+    setConfirmBusy(true)
+    try {
+      if (confirmAction.type === 'delete-selected') {
+        await ipcServices.history.removeHistoryItems(confirmAction.ids)
+        removeHistoryRecords(confirmAction.ids)
+        if (alsoDeleteFiles) {
+          const idSet = new Set(confirmAction.ids)
+          const recordsToDelete = historyRecords.filter((record) => idSet.has(record.id))
+          await deleteHistoryFiles(recordsToDelete)
+        }
+        pruneSelectedIds(confirmAction.ids)
+        toast.success(t('notifications.itemsRemoved', { count: confirmAction.ids.length }))
+      }
+      if (confirmAction.type === 'delete-playlist') {
+        const idSet = new Set(confirmAction.ids)
+        const playlistRecords = historyRecords.filter((record) => idSet.has(record.id))
+        await ipcServices.history.removeHistoryByPlaylistId(confirmAction.playlistId)
+        removeHistoryRecordsByPlaylist(confirmAction.playlistId)
+        await deleteHistoryFiles(playlistRecords)
+        pruneSelectedIds(confirmAction.ids)
+        toast.success(
+          t('notifications.playlistHistoryRemoved', { count: confirmAction.ids.length })
+        )
+      }
+      setConfirmAction(null)
+      setAlsoDeleteFiles(false)
+    } catch (error) {
+      if (confirmAction.type === 'delete-selected') {
+        console.error('Failed to remove selected history items:', error)
+        toast.error(t('notifications.itemsRemoveFailed'))
+      }
+      if (confirmAction.type === 'delete-playlist') {
+        console.error('Failed to remove playlist history:', error)
+        toast.error(t('notifications.playlistHistoryRemoveFailed'))
+      }
+    } finally {
+      setConfirmBusy(false)
+    }
+  }
+
  const groupedView = useMemo(() => {
    const groups = new Map<
      string,
@@ -99,76 +397,62 @@ export function UnifiedDownloadHistory() {
    return { order, groups }
  }, [filteredRecords])

-  const hasCompletedActive = allRecords.some(
-    (item) => item.entryType === 'active' && item.status === 'completed'
-  )
-  const handleClearCompleted = () => {
-    clearCompleted()
-  }
-
  return (
-    <Card className="border border-border/60 bg-background max-w-full shadow-sm backdrop-blur-sm">
-      <CardHeader className="gap-4">
-        <div className="flex flex-wrap items-center justify-between gap-4">
-          <div className="space-y-1">
-            <CardTitle>{t('download.downloadQueue')}</CardTitle>
-          </div>
-          <div className="flex flex-wrap items-center gap-2 text-xs">
-            {hasCompletedActive && (
-              <Button
-                variant="ghost"
-                size="sm"
-                className="h-8 border border-border/60 px-3"
-                onClick={handleClearCompleted}
-              >
-                {t('download.clearCompleted')}
-              </Button>
-            )}
-          </div>
-        </div>
-        <div className="flex flex-wrap items-center gap-2 text-sm">
-          {filters.map((filter) => {
-            const isActive = statusFilter === filter.key
-            return (
-              <Button
-                key={filter.key}
-                variant={isActive ? 'secondary' : 'ghost'}
-                size="sm"
-                className={
-                  isActive
-                    ? 'h-8 rounded-full px-3 shadow-sm'
-                    : 'h-8 rounded-full border border-border/60 px-3'
-                }
-                onClick={() => setStatusFilter(filter.key)}
-              >
-                <span>{filter.label}</span>
-                <span
-                  className={cn(
-                    'ml-1 min-w-5 rounded-full px-1 text-xs font-medium text-neutral-900',
-                    isActive ? ' bg-neutral-100' : ' bg-neutral-200'
-                  )}
+    <div className={cn('space-y-4', selectedCount > 0 && 'pb-20')}>
+      <CardHeader className="gap-4 p-0 pb-4 sticky top-0 z-50 bg-background backdrop-blur supports-[backdrop-filter]:bg-background/95">
+        <div className="flex flex-wrap items-center justify-between gap-2 text-sm">
+          <div className="flex flex-wrap items-center gap-2">
+            {filters.map((filter) => {
+              const isActive = statusFilter === filter.key
+              return (
+                <Button
+                  key={filter.key}
+                  variant={isActive ? 'secondary' : 'ghost'}
+                  size="sm"
+                  className={
+                    isActive
+                      ? 'h-8 rounded-full px-3 shadow-sm'
+                      : 'h-8 rounded-full border border-border/60 px-3'
+                  }
+                  onClick={() => setStatusFilter(filter.key)}
                >
-                  {filter.count}
-                </span>
-              </Button>
-            )
-          })}
+                  <span>{filter.label}</span>
+                  <span
+                    className={cn(
+                      'ml-1 min-w-5 rounded-full px-1 text-xs font-medium text-neutral-900',
+                      isActive ? ' bg-neutral-100' : ' bg-neutral-200'
+                    )}
+                  >
+                    {filter.count}
+                  </span>
+                </Button>
+              )
+            })}
+          </div>
+          <div className="flex items-center gap-2">
+            <DownloadDialog
+              onOpenSupportedSites={onOpenSupportedSites}
+              onOpenSettings={onOpenSettings}
+            />
+          </div>
        </div>
      </CardHeader>
-      <CardContent className="space-y-3 overflow-hidden w-full">
+      <CardContent className="space-y-3 p-0 overflow-x-hidden w-full">
        {filteredRecords.length === 0 ? (
-          <div className="flex flex-col items-center justify-center gap-3 rounded-lg border border-dashed border-border/60 px-6 py-10 text-center text-muted-foreground">
+          <div className="flex flex-col items-center justify-center gap-3 rounded-xl border border-dashed border-border/60 px-6 py-10 text-center text-muted-foreground">
            <HistoryIcon className="h-10 w-10 opacity-50" />
            <p className="text-sm font-medium">{t('download.noItems')}</p>
          </div>
        ) : (
-          <div className="space-y-3 sm:space-y-4 overflow-hidden w-full">
+          <div className="space-y-4 w-full">
            {groupedView.order.map((item) => {
              if (item.type === 'single') {
                return (
                  <DownloadItem
                    key={`${item.record.entryType}:${item.record.id}`}
                    download={item.record}
+                    isSelected={selectedIds.has(item.record.id)}
+                    onToggleSelect={handleToggleSelect}
                  />
                )
              }
@@ -185,12 +469,90 @@ export function UnifiedDownloadHistory() {
                  title={group.title}
                  totalCount={group.totalCount}
                  records={group.records}
+                  selectedIds={selectedIds}
+                  onToggleSelect={handleToggleSelect}
+                  onDeletePlaylist={handleRequestDeletePlaylist}
                />
              )
            })}
          </div>
        )}
      </CardContent>
-    </Card>
+      {selectedCount > 0 && (
+        <div className="fixed bottom-4 left-1/2 z-40 w-[calc(100%-2rem)] -translate-x-1/2 sm:left-auto sm:right-6 sm:translate-x-0 sm:w-auto">
+          <div className="flex flex-wrap items-center justify-between gap-3 rounded-full border border-border/50 bg-background/80 pl-5 pr-2 py-2 shadow-lg backdrop-blur">
+            <div className="flex flex-wrap items-center gap-2">
+              <span className="text-xs text-muted-foreground">{selectionSummary}</span>
+            </div>
+            <div className="flex flex-wrap items-center gap-2">
+              <Button
+                variant="ghost"
+                size="sm"
+                className="h-8 rounded-full px-3"
+                onClick={handleClearSelection}
+              >
+                {t('history.clearSelection')}
+              </Button>
+              <Button
+                variant="destructive"
+                size="sm"
+                className="h-8 rounded-full px-3"
+                onClick={handleRequestDeleteSelected}
+              >
+                {t('history.deleteSelected')}
+              </Button>
+            </div>
+          </div>
+        </div>
+      )}
+      <Dialog
+        open={Boolean(confirmAction)}
+        onOpenChange={(open) => {
+          if (!open && !confirmBusy) {
+            setConfirmAction(null)
+            setAlsoDeleteFiles(false)
+          }
+        }}
+      >
+        {confirmContent && (
+          <DialogContent>
+            <DialogHeader>
+              <DialogTitle>{confirmContent.title}</DialogTitle>
+              <DialogDescription>{confirmContent.description}</DialogDescription>
+            </DialogHeader>
+            {confirmAction?.type === 'delete-selected' && (
+              <div className="flex items-center space-x-2">
+                <Checkbox
+                  id={alsoDeleteFilesId}
+                  checked={alsoDeleteFiles}
+                  onCheckedChange={(checked) => setAlsoDeleteFiles(checked === true)}
+                />
+                <label
+                  htmlFor={alsoDeleteFilesId}
+                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70 cursor-pointer"
+                >
+                  {t('history.alsoDeleteFiles')}
+                </label>
+              </div>
+            )}
+            <DialogFooter>
+              <Button
+                variant="outline"
+                onClick={() => {
+                  setConfirmAction(null)
+                  setAlsoDeleteFiles(false)
+                }}
+                disabled={confirmBusy}
+              >
+                {t('download.cancel')}
+              </Button>
+              <Button variant="destructive" onClick={handleConfirmAction} disabled={confirmBusy}>
+                {confirmContent.actionLabel}
+              </Button>
+            </DialogFooter>
+          </DialogContent>
+        )}
+      </Dialog>
+    </div>
  )
 }
--- a/src/renderer/src/components/error/ErrorBoundary.tsx
+++ b/src/renderer/src/components/error/ErrorBoundary.tsx
@@ -0,0 +1,152 @@
+import { ipcServices } from '@renderer/lib/ipc'
+import { logger } from '@renderer/lib/logger'
+import { Component, type ErrorInfo, type ReactNode } from 'react'
+import { type ErrorInfo as ErrorInfoType, ErrorPage } from './ErrorPage'
+
+interface Props {
+  children: ReactNode
+  onError?: (error: Error, errorInfo: ErrorInfo) => void
+  fallback?: (errorInfo: ErrorInfoType) => ReactNode
+}
+
+interface State {
+  hasError: boolean
+  errorInfo: ErrorInfoType | null
+}
+
+export class ErrorBoundary extends Component<Props, State> {
+  constructor(props: Props) {
+    super(props)
+    this.state = {
+      hasError: false,
+      errorInfo: null
+    }
+  }
+
+  static getDerivedStateFromError(error: Error): Partial<State> {
+    const errorInfo = {
+      error,
+      timestamp: Date.now(),
+      context: {
+        url: window.location.href,
+        userAgent: navigator.userAgent,
+        platform: navigator.platform
+      }
+    }
+
+    // Log error details immediately
+    logger.error('ErrorBoundary: getDerivedStateFromError called', {
+      errorName: error.name,
+      errorMessage: error.message,
+      errorStack: error.stack,
+      url: errorInfo.context.url,
+      timestamp: errorInfo.timestamp
+    })
+
+    return {
+      hasError: true,
+      errorInfo
+    }
+  }
+
+  async componentDidCatch(error: Error, errorInfo: ErrorInfo): Promise<void> {
+    logger.error('ErrorBoundary caught an error:', {
+      errorName: error.name,
+      errorMessage: error.message,
+      errorStack: error.stack,
+      componentStack: errorInfo.componentStack,
+      errorInfo: JSON.stringify(errorInfo, null, 2)
+    })
+
+    // Get app version if available
+    let appVersion: string | undefined
+    try {
+      if (window?.api && ipcServices?.app) {
+        appVersion = await ipcServices.app.getVersion()
+        logger.info('ErrorBoundary: App version retrieved', { appVersion })
+      }
+    } catch (err) {
+      logger.warn('Failed to get app version:', err)
+    }
+
+    // Update state with component stack and version
+    if (this.state.errorInfo) {
+      this.setState({
+        errorInfo: {
+          ...this.state.errorInfo,
+          context: {
+            ...this.state.errorInfo.context,
+            version: appVersion
+          },
+          errorInfo: {
+            componentStack: errorInfo.componentStack || undefined
+          }
+        }
+      })
+    }
+
+    // Call optional error handler
+    if (this.props.onError) {
+      this.props.onError(error, errorInfo)
+    }
+
+    // Send error to main process if available
+    if (window?.api) {
+      try {
+        window.api.send('error:renderer', {
+          error: {
+            name: error.name,
+            message: error.message,
+            stack: error.stack
+          },
+          errorInfo: {
+            componentStack: errorInfo.componentStack
+          },
+          timestamp: Date.now(),
+          context: {
+            url: window.location.href,
+            userAgent: navigator.userAgent,
+            platform: navigator.platform,
+            version: appVersion
+          }
+        })
+      } catch (err) {
+        logger.error('Failed to send error to main process:', err)
+      }
+    }
+  }
+
+  handleReload = (): void => {
+    this.setState({
+      hasError: false,
+      errorInfo: null
+    })
+    window.location.reload()
+  }
+
+  handleGoHome = (): void => {
+    this.setState({
+      hasError: false,
+      errorInfo: null
+    })
+    window.location.hash = '/'
+    window.location.reload()
+  }
+
+  render(): ReactNode {
+    if (this.state.hasError && this.state.errorInfo) {
+      if (this.props.fallback) {
+        return this.props.fallback(this.state.errorInfo)
+      }
+      return (
+        <ErrorPage
+          errorInfo={this.state.errorInfo}
+          onReload={this.handleReload}
+          onGoHome={this.handleGoHome}
+        />
+      )
+    }
+
+    return this.props.children
+  }
+}
--- a/src/renderer/src/components/error/ErrorPage.tsx
+++ b/src/renderer/src/components/error/ErrorPage.tsx
@@ -0,0 +1,200 @@
+import { Button } from '@renderer/components/ui/button'
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle
+} from '@renderer/components/ui/card'
+import { ScrollArea } from '@renderer/components/ui/scroll-area'
+import { Textarea } from '@renderer/components/ui/textarea'
+import { logger } from '@renderer/lib/logger'
+import { AlertTriangle, Copy, Home, RefreshCw } from 'lucide-react'
+import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { toast } from 'sonner'
+
+export interface ErrorInfo {
+  error: Error
+  errorInfo?: {
+    componentStack?: string
+  }
+  timestamp: number
+  context?: {
+    url?: string
+    userAgent?: string
+    platform?: string
+    version?: string
+  }
+}
+
+interface ErrorPageProps {
+  errorInfo: ErrorInfo
+  onReload?: () => void
+  onGoHome?: () => void
+}
+
+export function ErrorPage({ errorInfo, onReload, onGoHome }: ErrorPageProps) {
+  const { t } = useTranslation()
+  const [showDetails, setShowDetails] = useState(false)
+  const [copied, setCopied] = useState(false)
+
+  const errorReport = generateErrorReport(errorInfo)
+
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(errorReport)
+      setCopied(true)
+      toast.success(t('error.copySuccess'))
+      setTimeout(() => setCopied(false), 2000)
+    } catch (error) {
+      logger.error('Failed to copy error report:', error)
+      toast.error(t('error.copyFailed'))
+    }
+  }
+
+  const handleReload = () => {
+    if (onReload) {
+      onReload()
+    } else {
+      window.location.reload()
+    }
+  }
+
+  return (
+    <div className="flex items-center justify-center min-h-screen bg-background p-4">
+      <Card className="w-full max-w-3xl">
+        <CardHeader>
+          <div className="flex items-center gap-3">
+            <div className="flex-shrink-0">
+              <AlertTriangle className="h-8 w-8 text-destructive" />
+            </div>
+            <div className="flex-1">
+              <CardTitle className="text-2xl">{t('error.title')}</CardTitle>
+              <CardDescription className="mt-2">{t('error.description')}</CardDescription>
+            </div>
+          </div>
+        </CardHeader>
+        <CardContent className="space-y-4">
+          {/* Error Message */}
+          <div className="rounded-md bg-destructive/10 border border-destructive/20 p-4">
+            <p className="text-sm font-medium text-destructive mb-1">{t('error.message')}</p>
+            <p className="text-sm text-foreground break-words">
+              {errorInfo.error.message || t('error.unknownError')}
+            </p>
+          </div>
+
+          {/* Actions */}
+          <div className="flex flex-wrap gap-2">
+            {onGoHome && (
+              <Button variant="outline" onClick={onGoHome}>
+                <Home className="h-4 w-4 mr-2" />
+                {t('error.goHome')}
+              </Button>
+            )}
+            <Button variant="outline" onClick={handleReload}>
+              <RefreshCw className="h-4 w-4 mr-2" />
+              {t('error.reload')}
+            </Button>
+            <Button variant="outline" onClick={handleCopy}>
+              <Copy className="h-4 w-4 mr-2" />
+              {copied ? t('error.copied') : t('error.copyReport')}
+            </Button>
+            <Button variant="ghost" onClick={() => setShowDetails(!showDetails)}>
+              {showDetails ? t('error.hideDetails') : t('error.showDetails')}
+            </Button>
+          </div>
+
+          {/* Error Details */}
+          {showDetails && (
+            <div className="space-y-4">
+              <div>
+                <p className="text-sm font-medium mb-2">{t('error.stackTrace')}</p>
+                <ScrollArea className="h-48 rounded-md border bg-muted/50 p-4">
+                  <pre className="text-xs font-mono whitespace-pre-wrap break-words">
+                    {errorInfo.error.stack || t('error.noStackTrace')}
+                  </pre>
+                </ScrollArea>
+              </div>
+
+              {errorInfo.errorInfo?.componentStack && (
+                <div>
+                  <p className="text-sm font-medium mb-2">{t('error.componentStack')}</p>
+                  <ScrollArea className="h-32 rounded-md border bg-muted/50 p-4">
+                    <pre className="text-xs font-mono whitespace-pre-wrap break-words">
+                      {errorInfo.errorInfo.componentStack}
+                    </pre>
+                  </ScrollArea>
+                </div>
+              )}
+
+              <div>
+                <p className="text-sm font-medium mb-2">{t('error.fullReport')}</p>
+                <Textarea
+                  readOnly
+                  value={errorReport}
+                  className="font-mono text-xs min-h-48"
+                  onClick={(e) => {
+                    const target = e.target as HTMLTextAreaElement
+                    target.select()
+                  }}
+                />
+              </div>
+            </div>
+          )}
+
+          {/* Help Text */}
+          <div className="rounded-md bg-muted/50 border p-4">
+            <p className="text-sm text-muted-foreground">{t('error.helpText')}</p>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  )
+}
+
+function generateErrorReport(errorInfo: ErrorInfo): string {
+  const lines: string[] = []
+
+  lines.push('=== VidBee Error Report ===')
+  lines.push(`Timestamp: ${new Date(errorInfo.timestamp).toISOString()}`)
+  lines.push('')
+
+  if (errorInfo.context) {
+    lines.push('--- Context ---')
+    if (errorInfo.context.version) {
+      lines.push(`App Version: ${errorInfo.context.version}`)
+    }
+    if (errorInfo.context.platform) {
+      lines.push(`Platform: ${errorInfo.context.platform}`)
+    }
+    if (errorInfo.context.url) {
+      lines.push(`URL: ${errorInfo.context.url}`)
+    }
+    if (errorInfo.context.userAgent) {
+      lines.push(`User Agent: ${errorInfo.context.userAgent}`)
+    }
+    lines.push('')
+  }
+
+  lines.push('--- Error ---')
+  lines.push(`Name: ${errorInfo.error.name}`)
+  lines.push(`Message: ${errorInfo.error.message}`)
+  lines.push('')
+
+  if (errorInfo.error.stack) {
+    lines.push('--- Stack Trace ---')
+    lines.push(errorInfo.error.stack)
+    lines.push('')
+  }
+
+  if (errorInfo.errorInfo?.componentStack) {
+    lines.push('--- Component Stack ---')
+    lines.push(errorInfo.errorInfo.componentStack)
+    lines.push('')
+  }
+
+  lines.push('=== End of Report ===')
+
+  return lines.join('\n')
+}
--- a/src/renderer/src/components/subscription/SubscriptionFormDialog.tsx
+++ b/src/renderer/src/components/subscription/SubscriptionFormDialog.tsx
@@ -0,0 +1,337 @@
+import { Button } from '@renderer/components/ui/button'
+import { Checkbox } from '@renderer/components/ui/checkbox'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from '@renderer/components/ui/dialog'
+import { Input } from '@renderer/components/ui/input'
+import { Label } from '@renderer/components/ui/label'
+import { Switch } from '@renderer/components/ui/switch'
+import { ipcServices } from '@renderer/lib/ipc'
+import { cn } from '@renderer/lib/utils'
+import { settingsAtom } from '@renderer/store/settings'
+import { resolveFeedAtom } from '@renderer/store/subscriptions'
+import { DEFAULT_SUBSCRIPTION_FILENAME_TEMPLATE, type SubscriptionRule } from '@shared/types'
+import { useAtom, useSetAtom } from 'jotai'
+import { ChevronRight } from 'lucide-react'
+import { useEffect, useId, useRef, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { toast } from 'sonner'
+
+const sanitizeCommaList = (value: string) =>
+  value
+    .split(',')
+    .map((entry) => entry.trim())
+    .filter((entry, index, array) => entry.length > 0 && array.indexOf(entry) === index)
+
+const sanitizeTemplateInput = (value: string) => value.replace(/\\/g, '/').replace(/\/{2,}/g, '/')
+
+const buildDefaultSubscriptionDirectory = (downloadPath: string) => {
+  const trimmed = downloadPath.trim().replace(/[\\/]+$/, '')
+  if (!trimmed) {
+    return 'Subscriptions'
+  }
+  return `${trimmed}/Subscriptions`
+}
+
+export interface SubscriptionFormData {
+  url?: string
+  keywords?: string[]
+  tags?: string[]
+  onlyDownloadLatest?: boolean
+  downloadDirectory?: string
+  namingTemplate?: string
+  enabled?: boolean
+}
+
+interface SubscriptionFormDialogProps {
+  mode: 'add' | 'edit'
+  subscription?: SubscriptionRule
+  open: boolean
+  onSave: (data: SubscriptionFormData) => Promise<void>
+  onClose: () => void
+}
+
+export function SubscriptionFormDialog({
+  mode,
+  subscription,
+  open,
+  onSave,
+  onClose
+}: SubscriptionFormDialogProps) {
+  const { t } = useTranslation()
+  const [settings] = useAtom(settingsAtom)
+  const resolveFeed = useSetAtom(resolveFeedAtom)
+
+  // Form state
+  const [url, setUrl] = useState('')
+  const [keywords, setKeywords] = useState('')
+  const [tags, setTags] = useState('')
+  const [onlyLatest, setOnlyLatest] = useState(false)
+  const [downloadDirectory, setDownloadDirectory] = useState('')
+  const [namingTemplate, setNamingTemplate] = useState('')
+
+  // Feed detection state
+  const [detectingFeed, setDetectingFeed] = useState(false)
+
+  const detectTimeout = useRef<NodeJS.Timeout | null>(null)
+  const prevDefaultPathRef = useRef(buildDefaultSubscriptionDirectory(settings.downloadPath))
+  const urlInputId = useId()
+  const advancedOptionsId = useId()
+  const [advancedOptionsOpen, setAdvancedOptionsOpen] = useState(false)
+
+  // Initialize form values based on mode
+  useEffect(() => {
+    if (!open) {
+      return
+    }
+
+    setAdvancedOptionsOpen(false)
+
+    if (mode === 'edit' && subscription) {
+      setUrl(subscription.feedUrl)
+      setKeywords(subscription.keywords.join(', '))
+      setTags(subscription.tags.join(', '))
+      setOnlyLatest(subscription.onlyDownloadLatest)
+      setDownloadDirectory(subscription.downloadDirectory || '')
+      setNamingTemplate(subscription.namingTemplate || '')
+    } else {
+      // Add mode - use defaults from settings
+      setUrl('')
+      setKeywords('')
+      setTags('')
+      setOnlyLatest(settings.subscriptionOnlyLatestDefault)
+      setDownloadDirectory(buildDefaultSubscriptionDirectory(settings.downloadPath))
+      setNamingTemplate(DEFAULT_SUBSCRIPTION_FILENAME_TEMPLATE)
+    }
+  }, [open, mode, subscription, settings.subscriptionOnlyLatestDefault, settings.downloadPath])
+
+  // Sync download directory with settings changes (only in add mode)
+  useEffect(() => {
+    if (mode === 'add') {
+      const newPath = buildDefaultSubscriptionDirectory(settings.downloadPath)
+      setDownloadDirectory((prev) => {
+        if (!prev || prev === prevDefaultPathRef.current) {
+          return newPath
+        }
+        return prev
+      })
+      prevDefaultPathRef.current = newPath
+    }
+  }, [settings.downloadPath, mode])
+
+  // Sync onlyLatest with settings changes (only in add mode)
+  useEffect(() => {
+    if (mode === 'add') {
+      setOnlyLatest(settings.subscriptionOnlyLatestDefault)
+    }
+  }, [settings.subscriptionOnlyLatestDefault, mode])
+
+  // Feed detection logic
+  useEffect(() => {
+    if (!url.trim()) {
+      return
+    }
+
+    // In edit mode, don't detect if URL hasn't changed
+    if (mode === 'edit' && subscription && url.trim() === subscription.feedUrl) {
+      return
+    }
+
+    if (detectTimeout.current) {
+      clearTimeout(detectTimeout.current)
+    }
+
+    detectTimeout.current = setTimeout(async () => {
+      setDetectingFeed(true)
+      try {
+        await resolveFeed(url.trim())
+      } catch (error) {
+        console.error('Failed to resolve feed:', error)
+      } finally {
+        setDetectingFeed(false)
+      }
+    }, 500)
+
+    return () => {
+      if (detectTimeout.current) {
+        clearTimeout(detectTimeout.current)
+      }
+    }
+  }, [url, resolveFeed, mode, subscription])
+
+  const handleSelectDirectory = async () => {
+    try {
+      const path = await ipcServices.fs.selectDirectory()
+      if (path) {
+        setDownloadDirectory(path)
+      }
+    } catch (error) {
+      console.error('Failed to select directory:', error)
+      toast.error(t('subscriptions.notifications.directoryError'))
+    }
+  }
+
+  const handleOpenRSSHubDocs = async () => {
+    try {
+      await ipcServices.fs.openExternal('https://docs.rsshub.app/routes/social-media#youtube')
+    } catch (error) {
+      console.error('Failed to open RSSHub documentation:', error)
+      toast.error(t('subscriptions.notifications.openLinkError'))
+    }
+  }
+
+  const handleSave = async () => {
+    // Validate URL for add mode
+    if (mode === 'add' && !url.trim()) {
+      toast.error(t('subscriptions.notifications.missingUrl'))
+      return
+    }
+
+    const formData: SubscriptionFormData = {
+      keywords: sanitizeCommaList(keywords),
+      tags: sanitizeCommaList(tags),
+      onlyDownloadLatest: onlyLatest,
+      downloadDirectory: downloadDirectory || undefined,
+      namingTemplate: namingTemplate || undefined
+    }
+
+    // Include URL if it's provided and different from current (for edit mode)
+    if (url.trim()) {
+      if (
+        mode === 'add' ||
+        (mode === 'edit' && subscription && url.trim() !== subscription.feedUrl)
+      ) {
+        try {
+          await resolveFeed(url.trim())
+          formData.url = url.trim()
+        } catch (error) {
+          console.error('Failed to resolve feed:', error)
+          toast.error(t('subscriptions.notifications.resolveError'))
+          return
+        }
+      }
+    }
+
+    await onSave(formData)
+  }
+
+  const titleKey = mode === 'add' ? 'subscriptions.add.title' : 'subscriptions.edit.title'
+  const descriptionKey =
+    mode === 'add' ? 'subscriptions.add.description' : 'subscriptions.edit.description'
+  const saveButtonKey = mode === 'add' ? 'subscriptions.actions.add' : 'subscriptions.actions.save'
+
+  return (
+    <Dialog open={open} onOpenChange={(isOpen) => !isOpen && onClose()}>
+      <DialogContent className="max-w-2xl max-h-[90vh] overflow-y-auto">
+        <DialogHeader>
+          <DialogTitle>
+            {mode === 'edit' && subscription
+              ? t(titleKey, { name: subscription.title })
+              : t(titleKey)}
+          </DialogTitle>
+          <DialogDescription>{t(descriptionKey)}</DialogDescription>
+        </DialogHeader>
+        <div className="space-y-4 py-2">
+          <div className="space-y-2">
+            <Label htmlFor={urlInputId}>{t('subscriptions.fields.url')}</Label>
+            <Input
+              id={urlInputId}
+              value={url}
+              placeholder={t('subscriptions.placeholders.url')}
+              onChange={(event) => setUrl(event.target.value)}
+            />
+            {detectingFeed && (
+              <p className="text-xs text-muted-foreground">{t('subscriptions.detecting')}</p>
+            )}
+            {mode === 'add' && !url.trim() && (
+              <div className="flex items-center gap-2 rounded-md bg-primary/5 px-3 py-2">
+                <p className="text-xs text-muted-foreground flex-1">
+                  {t('subscriptions.rssHub.hint')}
+                </p>
+                <Button
+                  variant="ghost"
+                  size="sm"
+                  onClick={() => void handleOpenRSSHubDocs()}
+                  className="h-5 w-5 p-0 shrink-0"
+                  title={t('subscriptions.rssHub.openDocs')}
+                >
+                  <ChevronRight className="h-3 w-3" />
+                </Button>
+              </div>
+            )}
+          </div>
+          <div className="space-y-2">
+            <Label>{t('subscriptions.fields.customDirectory')}</Label>
+            <div className="flex gap-2">
+              <Input value={downloadDirectory} readOnly />
+              <Button variant="secondary" onClick={() => void handleSelectDirectory()}>
+                {t('subscriptions.actions.selectDirectory')}
+              </Button>
+            </div>
+          </div>
+          <div
+            data-state={advancedOptionsOpen ? 'open' : 'closed'}
+            className={cn(
+              'grid overflow-hidden transition-[grid-template-rows,opacity] duration-200 ease-out',
+              advancedOptionsOpen ? 'grid-rows-[1fr] opacity-100' : 'grid-rows-[0fr] opacity-0'
+            )}
+            aria-hidden={!advancedOptionsOpen}
+          >
+            <div className={cn('min-h-0', !advancedOptionsOpen && 'pointer-events-none')}>
+              <div className="space-y-3 border-t pt-4">
+                <div className="space-y-2">
+                  <Label>{t('subscriptions.fields.keywords')}</Label>
+                  <Input value={keywords} onChange={(event) => setKeywords(event.target.value)} />
+                </div>
+                <div className="space-y-2">
+                  <Label>{t('subscriptions.fields.tags')}</Label>
+                  <Input value={tags} onChange={(event) => setTags(event.target.value)} />
+                </div>
+                <div className="space-y-2">
+                  <Label>{t('subscriptions.fields.namingTemplate')}</Label>
+                  <Input
+                    value={namingTemplate}
+                    onChange={(event) =>
+                      setNamingTemplate(sanitizeTemplateInput(event.target.value))
+                    }
+                  />
+                </div>
+                <div className="flex items-center justify-between gap-4 rounded-md border px-3 py-2">
+                  <p className="text-sm">{t('subscriptions.fields.onlyLatest')}</p>
+                  <Switch checked={onlyLatest} onCheckedChange={setOnlyLatest} />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <DialogFooter>
+          <div className="flex items-center justify-between w-full gap-4">
+            <div className="flex items-center gap-2">
+              <Checkbox
+                id={advancedOptionsId}
+                checked={advancedOptionsOpen}
+                onCheckedChange={(checked) => setAdvancedOptionsOpen(checked === true)}
+              />
+              <Label htmlFor={advancedOptionsId} className="cursor-pointer">
+                {t('advancedOptions.title')}
+              </Label>
+            </div>
+            <div className="ml-auto flex gap-2">
+              {mode === 'add' && (
+                <Button variant="outline" onClick={onClose}>
+                  {t('download.cancel')}
+                </Button>
+              )}
+              <Button onClick={() => void handleSave()}>{t(saveButtonKey)}</Button>
+            </div>
+          </div>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}
--- a/src/renderer/src/components/ui/button.tsx
+++ b/src/renderer/src/components/ui/button.tsx
@@ -8,10 +8,10 @@ const buttonVariants = cva(
  {
    variants: {
      variant: {
-        default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90',
-        destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
-        outline: 'border bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
-        secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
+        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+        destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+        outline: 'border bg-background hover:bg-accent hover:text-accent-foreground',
+        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
        ghost: 'hover:bg-accent hover:text-accent-foreground',
        link: 'text-primary underline-offset-4 hover:underline'
      },
--- a/src/renderer/src/components/ui/card.tsx
+++ b/src/renderer/src/components/ui/card.tsx
@@ -5,7 +5,7 @@ const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElemen
  ({ className, ...props }, ref) => (
    <div
      ref={ref}
-      className={cn('rounded-lg bg-muted/30 text-card-foreground shadow', className)}
+      className={cn('rounded-lg bg-muted/30 text-card-foreground', className)}
      {...props}
    />
  )
--- a/src/renderer/src/components/ui/checkbox.tsx
+++ b/src/renderer/src/components/ui/checkbox.tsx
@@ -8,7 +8,7 @@ function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxP
    <CheckboxPrimitive.Root
      data-slot="checkbox"
      className={cn(
-        'peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50',
+        'peer  dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50',
        className
      )}
      {...props}
@@ -22,5 +22,4 @@ function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxP
    </CheckboxPrimitive.Root>
  )
 }
-
 export { Checkbox }
--- a/src/renderer/src/components/ui/context-menu.tsx
+++ b/src/renderer/src/components/ui/context-menu.tsx
@@ -0,0 +1,221 @@
+import * as ContextMenuPrimitive from '@radix-ui/react-context-menu'
+import { cn } from '@renderer/lib/utils'
+import { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react'
+import type * as React from 'react'
+
+function ContextMenu({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Root>) {
+  return <ContextMenuPrimitive.Root data-slot="context-menu" {...props} />
+}
+
+function ContextMenuTrigger({
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.Trigger>) {
+  return <ContextMenuPrimitive.Trigger data-slot="context-menu-trigger" {...props} />
+}
+
+function ContextMenuGroup({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Group>) {
+  return <ContextMenuPrimitive.Group data-slot="context-menu-group" {...props} />
+}
+
+function ContextMenuPortal({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Portal>) {
+  return <ContextMenuPrimitive.Portal data-slot="context-menu-portal" {...props} />
+}
+
+function ContextMenuSub({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Sub>) {
+  return <ContextMenuPrimitive.Sub data-slot="context-menu-sub" {...props} />
+}
+
+function ContextMenuRadioGroup({
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.RadioGroup>) {
+  return <ContextMenuPrimitive.RadioGroup data-slot="context-menu-radio-group" {...props} />
+}
+
+function ContextMenuSubTrigger({
+  className,
+  inset,
+  children,
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.SubTrigger> & {
+  inset?: boolean
+}) {
+  return (
+    <ContextMenuPrimitive.SubTrigger
+      data-slot="context-menu-sub-trigger"
+      data-inset={inset}
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      {children}
+      <ChevronRightIcon className="ml-auto" />
+    </ContextMenuPrimitive.SubTrigger>
+  )
+}
+
+function ContextMenuSubContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.SubContent>) {
+  return (
+    <ContextMenuPrimitive.SubContent
+      data-slot="context-menu-sub-content"
+      className={cn(
+        'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function ContextMenuContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.Content>) {
+  return (
+    <ContextMenuPrimitive.Portal>
+      <ContextMenuPrimitive.Content
+        data-slot="context-menu-content"
+        className={cn(
+          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md',
+          className
+        )}
+        {...props}
+      />
+    </ContextMenuPrimitive.Portal>
+  )
+}
+
+function ContextMenuItem({
+  className,
+  inset,
+  variant = 'default',
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.Item> & {
+  inset?: boolean
+  variant?: 'default' | 'destructive'
+}) {
+  return (
+    <ContextMenuPrimitive.Item
+      data-slot="context-menu-item"
+      data-inset={inset}
+      data-variant={variant}
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function ContextMenuCheckboxItem({
+  className,
+  children,
+  checked,
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem>) {
+  return (
+    <ContextMenuPrimitive.CheckboxItem
+      data-slot="context-menu-checkbox-item"
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      checked={checked}
+      {...props}
+    >
+      <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+        <ContextMenuPrimitive.ItemIndicator>
+          <CheckIcon className="size-4" />
+        </ContextMenuPrimitive.ItemIndicator>
+      </span>
+      {children}
+    </ContextMenuPrimitive.CheckboxItem>
+  )
+}
+
+function ContextMenuRadioItem({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.RadioItem>) {
+  return (
+    <ContextMenuPrimitive.RadioItem
+      data-slot="context-menu-radio-item"
+      className={cn(
+        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    >
+      <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+        <ContextMenuPrimitive.ItemIndicator>
+          <CircleIcon className="size-2 fill-current" />
+        </ContextMenuPrimitive.ItemIndicator>
+      </span>
+      {children}
+    </ContextMenuPrimitive.RadioItem>
+  )
+}
+
+function ContextMenuLabel({
+  className,
+  inset,
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.Label> & {
+  inset?: boolean
+}) {
+  return (
+    <ContextMenuPrimitive.Label
+      data-slot="context-menu-label"
+      data-inset={inset}
+      className={cn('text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8', className)}
+      {...props}
+    />
+  )
+}
+
+function ContextMenuSeparator({
+  className,
+  ...props
+}: React.ComponentProps<typeof ContextMenuPrimitive.Separator>) {
+  return (
+    <ContextMenuPrimitive.Separator
+      data-slot="context-menu-separator"
+      className={cn('bg-border -mx-1 my-1 h-px', className)}
+      {...props}
+    />
+  )
+}
+
+function ContextMenuShortcut({ className, ...props }: React.ComponentProps<'span'>) {
+  return (
+    <span
+      data-slot="context-menu-shortcut"
+      className={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)}
+      {...props}
+    />
+  )
+}
+
+export {
+  ContextMenu,
+  ContextMenuTrigger,
+  ContextMenuContent,
+  ContextMenuItem,
+  ContextMenuCheckboxItem,
+  ContextMenuRadioItem,
+  ContextMenuLabel,
+  ContextMenuSeparator,
+  ContextMenuShortcut,
+  ContextMenuGroup,
+  ContextMenuPortal,
+  ContextMenuSub,
+  ContextMenuSubContent,
+  ContextMenuSubTrigger,
+  ContextMenuRadioGroup
+}
--- a/src/renderer/src/components/ui/dialog.tsx
+++ b/src/renderer/src/components/ui/dialog.tsx
@@ -1,101 +1,126 @@
 import * as DialogPrimitive from '@radix-ui/react-dialog'
 import { cn } from '@renderer/lib/utils'
-import { X } from 'lucide-react'
-import * as React from 'react'
+import { XIcon } from 'lucide-react'
+import type * as React from 'react'

-const Dialog = DialogPrimitive.Root
+function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>) {
+  return <DialogPrimitive.Root data-slot="dialog" {...props} />
+}

-const DialogTrigger = DialogPrimitive.Trigger
+function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
+  return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
+}

-const DialogPortal = DialogPrimitive.Portal
+function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>) {
+  return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
+}

-const DialogClose = DialogPrimitive.Close
+function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {
+  return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
+}

-const DialogOverlay = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Overlay>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>
->(({ className, ...props }, ref) => (
-  <DialogPrimitive.Overlay
-    ref={ref}
-    className={cn(
-      'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
-      className
-    )}
-    {...props}
-  />
-))
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName
-
-const DialogContent = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
->(({ className, children, ...props }, ref) => (
-  <DialogPortal>
-    <DialogOverlay />
-    <DialogPrimitive.Content
-      ref={ref}
+function DialogOverlay({
+  className,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
+  return (
+    <DialogPrimitive.Overlay
+      data-slot="dialog-overlay"
      className={cn(
-        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',
+        'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',
        className
      )}
      {...props}
-    >
-      {children}
-      <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
-        <X className="h-4 w-4" />
-        <span className="sr-only">Close</span>
-      </DialogPrimitive.Close>
-    </DialogPrimitive.Content>
-  </DialogPortal>
-))
-DialogContent.displayName = DialogPrimitive.Content.displayName
+    />
+  )
+}

-const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
-  <div className={cn('flex flex-col space-y-1.5 text-center sm:text-left', className)} {...props} />
-)
-DialogHeader.displayName = 'DialogHeader'
+function DialogContent({
+  className,
+  children,
+  showCloseButton = true,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Content> & {
+  showCloseButton?: boolean
+}) {
+  return (
+    <DialogPortal data-slot="dialog-portal">
+      <DialogOverlay />
+      <DialogPrimitive.Content
+        data-slot="dialog-content"
+        className={cn(
+          'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
+          className
+        )}
+        {...props}
+      >
+        {children}
+        {showCloseButton && (
+          <DialogPrimitive.Close
+            data-slot="dialog-close"
+            className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
+          >
+            <XIcon />
+            <span className="sr-only">Close</span>
+          </DialogPrimitive.Close>
+        )}
+      </DialogPrimitive.Content>
+    </DialogPortal>
+  )
+}

-const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className)}
-    {...props}
-  />
-)
-DialogFooter.displayName = 'DialogFooter'
+function DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {
+  return (
+    <div
+      data-slot="dialog-header"
+      className={cn('flex flex-col gap-2 text-center sm:text-left', className)}
+      {...props}
+    />
+  )
+}

-const DialogTitle = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Title>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>
->(({ className, ...props }, ref) => (
-  <DialogPrimitive.Title
-    ref={ref}
-    className={cn('text-lg font-semibold leading-none tracking-tight', className)}
-    {...props}
-  />
-))
-DialogTitle.displayName = DialogPrimitive.Title.displayName
+function DialogFooter({ className, ...props }: React.ComponentProps<'div'>) {
+  return (
+    <div
+      data-slot="dialog-footer"
+      className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}
+      {...props}
+    />
+  )
+}

-const DialogDescription = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Description>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>
->(({ className, ...props }, ref) => (
-  <DialogPrimitive.Description
-    ref={ref}
-    className={cn('text-sm text-muted-foreground', className)}
-    {...props}
-  />
-))
-DialogDescription.displayName = DialogPrimitive.Description.displayName
+function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {
+  return (
+    <DialogPrimitive.Title
+      data-slot="dialog-title"
+      className={cn('text-lg leading-none font-semibold', className)}
+      {...props}
+    />
+  )
+}
+
+function DialogDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof DialogPrimitive.Description>) {
+  return (
+    <DialogPrimitive.Description
+      data-slot="dialog-description"
+      className={cn('text-muted-foreground text-sm', className)}
+      {...props}
+    />
+  )
+}

 export {
  Dialog,
-  DialogPortal,
-  DialogOverlay,
  DialogClose,
-  DialogTrigger,
  DialogContent,
-  DialogHeader,
+  DialogDescription,
  DialogFooter,
+  DialogHeader,
+  DialogOverlay,
+  DialogPortal,
  DialogTitle,
-  DialogDescription
+  DialogTrigger
 }
--- a/src/renderer/src/components/ui/hover-card.tsx
+++ b/src/renderer/src/components/ui/hover-card.tsx
@@ -0,0 +1,35 @@
+import * as HoverCardPrimitive from '@radix-ui/react-hover-card'
+import { cn } from '@renderer/lib/utils'
+import type * as React from 'react'
+
+function HoverCard({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Root>) {
+  return <HoverCardPrimitive.Root data-slot="hover-card" {...props} />
+}
+
+function HoverCardTrigger({ ...props }: React.ComponentProps<typeof HoverCardPrimitive.Trigger>) {
+  return <HoverCardPrimitive.Trigger data-slot="hover-card-trigger" {...props} />
+}
+
+function HoverCardContent({
+  className,
+  align = 'center',
+  sideOffset = 4,
+  ...props
+}: React.ComponentProps<typeof HoverCardPrimitive.Content>) {
+  return (
+    <HoverCardPrimitive.Portal data-slot="hover-card-portal">
+      <HoverCardPrimitive.Content
+        data-slot="hover-card-content"
+        align={align}
+        sideOffset={sideOffset}
+        className={cn(
+          'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',
+          className
+        )}
+        {...props}
+      />
+    </HoverCardPrimitive.Portal>
+  )
+}
+
+export { HoverCard, HoverCardTrigger, HoverCardContent }
--- a/src/renderer/src/components/ui/image-with-placeholder.tsx
+++ b/src/renderer/src/components/ui/image-with-placeholder.tsx
@@ -9,6 +9,7 @@ interface ImageWithPlaceholderProps {
  placeholderClassName?: string
  fallbackIcon?: React.ReactNode
  onError?: () => void
+  onLoad?: () => void
 }

 export function ImageWithPlaceholder({
@@ -17,7 +18,8 @@ export function ImageWithPlaceholder({
  className,
  placeholderClassName,
  fallbackIcon,
-  onError
+  onError,
+  onLoad
 }: ImageWithPlaceholderProps) {
  const [hasError, setHasError] = useState(false)
  const [isLoading, setIsLoading] = useState(true)
@@ -30,6 +32,7 @@ export function ImageWithPlaceholder({

  const handleLoad = () => {
    setIsLoading(false)
+    onLoad?.()
  }

  // Show placeholder if no src, error occurred, or still loading
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Nexmoe	877f088136	chore: release v1.1.8	2026-01-12 10:14:49 +08:00
Nexmoe	5ee08a3e62	chore(build): add macOS signing secrets and validation - Introduced new secrets for macOS signing in the build workflow. - Added validation to check for the presence of required secrets before proceeding with code signing setup.	2026-01-12 10:13:58 +08:00
Nexmoe	137a07cf4e	chore(build): enhance macOS signing and notarization process - Updated electron-builder configuration to enable hardened runtime and notarization for macOS builds. - Added a new GitHub Actions step to set up macOS signing with necessary certificates and keys.	2026-01-12 09:58:44 +08:00
Nexmoe	21a5adbdf2	fix(update): localize update toast (#82 )	2026-01-11 16:56:34 +08:00
Nexmoe	81f52f86e5	fix(about): hide check updates when available (#80 )	2026-01-11 16:34:48 +08:00
Nexmoe	c8147cafe3	fix(download): inline progress details (#81 )	2026-01-11 16:34:40 +08:00
Nexmoe	7074f698e5	chore: release v1.1.7	2026-01-11 15:46:37 +08:00
Nexmoe	b254bb6dba	chore(build): reduce packaged artifacts (#79 )	2026-01-11 15:44:20 +08:00
Nexmoe	1caca0ea9a	feat(settings): add embed features (#76 ) * feat(settings): add embed options * feat(settings): default embed on * refactor(setup-dev-binaries): enhance download error handling and version checks for binaries	2026-01-11 15:24:33 +08:00
Nexmoe	12ec142a77	ci(release): notify Cloudflare Pages (#78 )	2026-01-11 15:21:40 +08:00
Nexmoe	0136da410d	chore: release v1.1.6	2026-01-11 10:21:42 +08:00
Nexmoe	4971a5fe8a	feat(settings): improve cookie profile handling (#74 ) * feat(settings): improve cookie profile handling * fix(settings): normalize profile input	2026-01-11 10:16:28 +08:00
Nexmoe	d2806164a2	feat(extension): integrate local video info API (#67 ) * feat(extension): integrate local video info API * chore(repo): clean up popup styles * feat(extension): revamp popup UI * chore(repo): revert docs and drop content script	2026-01-11 00:05:46 +08:00
Nexmoe	e332ec4ddc	chore: release v1.1.5	2026-01-10 19:18:55 +08:00
Nexmoe	3b74712f57	fix(subscription): improve cover image selection (#73 ) * fix(subscriptions): improve rss cover fallback * fix(subscriptions): match img src first	2026-01-10 19:18:03 +08:00
Nexmoe	475e4127c2	fix(remote-image): add load timeout (#72 )	2026-01-10 18:39:00 +08:00
Nexmoe	3041307aa2	fix: Advanced settings tab broken (#71 )	2026-01-10 18:30:18 +08:00
Nexmoe	e2ab8dce60	chore: release v1.1.4	2026-01-09 21:39:01 +08:00
Nexmoe	c1806e5321	fix(main): hide window on autostart (#68 )	2026-01-09 21:03:25 +08:00
Nexmoe	92494966c6	fix(settings): merge defaults for getAll (#66 )	2026-01-09 20:53:08 +08:00
Nexmoe	f04680b8c2	chore: release v1.1.3	2026-01-02 16:17:42 +08:00
Nexmoe	a5b94411fe	fix(download): handle empty format selections (#64 )	2026-01-02 16:16:04 +08:00
Nexmoe	71ae4a4425	fix(download): add format fallback selectors (#63 )	2026-01-01 14:41:59 +08:00
Nexmoe	e8413aefae	feat(ui): show update indicator on About (#58 ) * feat(ui): add update indicator for about * fix(ci): remove unused import * fix(ci): retry binary downloads	2025-12-26 16:46:55 +08:00
Nexmoe	b229225b6e	chore: release v1.1.2	2025-12-26 13:04:52 +08:00
Nexmoe	5497ed6245	chore(templates): simplify bug report (#57 )	2025-12-26 13:04:30 +08:00
Nexmoe	155bf652f2	fix(ci): harden download steps (#56 )	2025-12-26 13:02:21 +08:00
Nexmoe	86bd77d995	fix(download): improve format fallbacks (#55 )	2025-12-26 13:02:07 +08:00
Nexmoe	b38b356c22	feat(issue): add issue templates (#54 )	2025-12-26 12:53:51 +08:00
Nexmoe	5020605590	chore: release v1.1.1	2025-12-25 22:20:18 +08:00
Nexmoe	b15c3d8ce5	feat(about): refresh description and links (#52 )	2025-12-25 22:18:04 +08:00
Nexmoe	a51655697d	fix(update): streamline update notification (#51 )	2025-12-23 09:43:14 +08:00
Nexmoe	f5c26f5f02	Animate advanced options panels (#47 )	2025-12-21 13:32:46 +08:00
Nexmoe	3bc9d76f6e	Add JS runtime support for yt-dlp #36 (#46 ) * Add yt-dlp JS runtime support * Update build scripts and logging * fix: update README to include DeepWiki badge and correct contributor badge logo	2025-12-21 10:38:04 +08:00
Nexmoe	5751d73d5b	Limit electron languages to English (#45 )	2025-12-20 22:34:06 +08:00
Nexmoe	50bd9f1659	fix: update README download links to point to new VidBee website * Replace individual OS download links with a single link to the VidBee download page for improved clarity and accessibility.	2025-12-20 21:49:46 +08:00
Nexmoe	e7627e1132	chore: release v1.1.0	2025-12-20 19:26:01 +08:00
Nexmoe	d7b131d795	feat: update configuration and improve download components * Modify biome.json to exclude specific directories from scanning and add experimental scanner ignores. * Refine .vscode/settings.json for better Tailwind CSS integration and maintain locales paths. * Simplify DownloadDialog component by removing unused imports and optimizing button rendering. * Enhance DownloadItem component's accessibility and interaction handling. * Introduce Input component in AdvancedOptions for improved user input handling.	2025-12-20 19:25:45 +08:00
Nexmoe	74dbb223ce	feat: enhance README with browser script and RSS auto-download features * Update VidBee description to include RSS auto-download automation. * Add section for VidBee browser script installation and usage, detailing supported sites for quick downloads. * Introduce new screenshot for the browser script feature.	2025-12-20 19:14:13 +08:00
Nexmoe	11a931f865	feat: add VidBee quick download user script and update .gitignore * Introduce a new user script for quick downloads from various video platforms. * Update .gitignore to exclude 'dist' and include 'dist-ssr' directory.	2025-12-20 19:04:42 +08:00
Nexmoe	79a78d4322	feat: initialize VidBee download extension with core functionality * Add .gitignore files for main and monkey directories. * Create initial project structure for VidBee download extension. * Implement main functionality in src/main/index.ts to handle deep links. * Develop UI components including DownloadDialog and VidBee download button. * Set up TypeScript configuration and Vite for build process. * Add styles for download button and tooltips. * Integrate localization for user interface elements. * Establish deep link handling in the renderer for improved user experience.	2025-12-20 19:03:13 +08:00
Nexmoe	a1c44baf65	feat: refactor download components and enhance UI/UX * Rename ElectronStore to LegacyStore for clarity in subscription manager. * Remove unused deep link state in AppContent and add a TODO for future handling. * Introduce a new DownloadDialog component for managing downloads. * Update DownloadItem to include a details sheet for video metadata. * Enhance PlaylistDownloadGroup to persist expanded state in local storage. * Improve UnifiedDownloadHistory layout and integrate DownloadDialog for better user interaction. * Update various UI components for consistency and improved styling. * Add new localization strings for download actions across multiple languages.	2025-12-20 17:03:12 +08:00
Nexmoe	86e6b93476	Add custom download folders and refine RSS dialog #37 (#44 ) * Add custom download folders * Refine RSS defaults and dialog layout * Record template folder in download path * Store template folder in history paths * Resolve template vars for history paths * Default RSS directory to Subscriptions	2025-12-20 13:05:12 +08:00
Nexmoe	dbcd77963f	Add bulk history actions and selection UX #37 (#42 ) * Add collapsed playlist progress * Improve history bulk actions and selection UX * Fix ffmpeg download resolution in setup script	2025-12-20 12:07:13 +08:00
Nexmoe	58a4d2da36	Handle download deep links (#41 ) * Add download deep link support * Queue deep links until renderer ready	2025-12-19 22:18:11 +08:00
Nexmoe	db16d5d051	Remove supported sites page (#40 ) * Remove supported sites page * Remove supported sites page component	2025-12-19 20:41:58 +08:00
Nexmoe	41f40b6e71	Use icon tabs with tooltips (#38 ) * feat: icon tabs with tooltips * chore: add conductor config	2025-12-19 18:03:03 +08:00
Nexmoe	1ee717888f	chore: release v1.0.2	2025-12-06 16:46:10 +08:00
Nexmoe	c7815eb81a	feat: register vidbee protocol and respect vidbee:// paths in images (#35 )	2025-12-06 16:45:48 +08:00
Nexmoe	3946b5ef2f	feat: resolve ~ in config paths before passing to engine (#34 )	2025-11-29 11:10:16 +08:00
Nexmoe	ef99eb1f59	feat: add Chromium option closes #32 (#33 )	2025-11-22 19:28:20 +08:00
Nexmoe	31607bd947	chore: release v1.0.1	2025-11-16 17:08:13 +08:00
Nexmoe	452132ce16	feat(i18n): add comprehensive i18n (#31 ) * feat(i18n): add comprehensive i18n * fix(i18n): unify zh locale variable names to English keys for templating	2025-11-16 12:30:53 +08:00
Nexmoe	f84f3ef02a	feat(settings): add auto-launch handling and UI toggle support (#29 )	2025-11-15 16:16:16 +08:00
Nexmoe	6c3f070797	chore: release v1.0.0	2025-11-15 12:30:16 +08:00
Nexmoe	62a339e5b9	feat: rss-subscriptions (#28 ) * feat(subscriptions): add subscription atoms and types for feeds and rules * refactor(types): remove obsolete format/quality/codec fields and related logic to simplify download and avoid redundant storage * feat: add download_history schema, migration, and tag utils * refactor(dialog): convert to functional wrappers, simplify overlay and * feat(rss): add enclosure support, refine thumbnail lookup and UI labels feat(settings): add toggleable anonymous analytics collection and loader script * feat(settings): add toggleable anonymous analytics collection and loader script * feat(i18n): add subscriptions UI strings and import downloads types * refactor(subscriptions): remove legacy status fields and migrate items ordering * feat: add Radix HoverCard dependency and wrap tabs with HoverCard for * feat(db): move download history schema into migrate + drizzle config * feat(subscriptions): add item queueing UI and IPC handler * feat(downloads): normalize saved filenames, improve candidates and UI display	2025-11-15 12:29:31 +08:00
Nexmoe	f1fd40176f	feat(ui): make sidebar a draggable title bar and opt out buttons from drag region (#26 )	2025-11-15 12:06:59 +08:00
Nexmoe	e5d8629ba3	feat(ui): make sidebar a draggable title bar and opt out buttons from drag region (#24 )	2025-11-11 22:27:25 +08:00
Nexmoe	3375f94848	feat(images): add RemoteImage with caching and loading hooks, and (#25 )	2025-11-11 22:23:58 +08:00
Nexmoe	9f7206abfe	feat(history): migrate from electron-store to SQLite with drizzle and (#21 )	2025-11-10 22:04:52 +08:00
Nexmoe	334c7426c2	feat(sites): show site icons and update supported sites layout (#23 ) Modified SupportedSites.tsx: - Added ImageWithPlaceholder import and IPC service import to fetch site icons. - Implemented SiteIcon component that loads site icon via ipcServices.app.getSiteIcon and handles errors/cancellation. - Updated layout: adjusted grid to include lg:grid-cols-3 and restructured list items into anchor cards with icon, label, external link icon, and description with truncation. These changes are focused on UI improvements for the SupportedSites page and fetching site icons from the main process.	2025-11-10 21:22:59 +08:00
Nexmoe	bd7f4a433c	chore: optimize ui and save structure (#19 ) * feat: persist and use saved file name for downloads * feat(settings): ensure and migrate download directory to VidBee/Downloads * feat: format download dates with locale date and time for clarity * feat(files): try multiple candidate file paths for file ops and DRY logic * fix(download): handle multi-path file deletion and warn on failure	2025-11-08 21:28:51 +08:00
Nexmoe	27287238aa	feat: rewrite README header and intro with badges and (#20 )	2025-11-08 18:56:57 +08:00
Nexmoe	486767fca9	chore: optimize update function (#18 ) * chore: add zip target with arm64 and x64 architectures to dmg/targets * feat(updates): move update UI handling to About page and add progress UI and i18n key	2025-11-08 18:29:26 +08:00
Nexmoe	e22fe7679a	chore: release v0.3.5	2025-11-08 13:45:05 +08:00
Nexmoe	7c2e526c49	feat(ui): add one-click texts, file existence checks, clipboard copy (#15 ) * feat(ui): add one-click texts, file existence checks, clipboard copy * refactor(ui): remove unused clearCompleted and adjust card bg	2025-11-08 13:44:28 +08:00
Nexmoe	2f5776d1e0	feat(theme): update primary/accent colors to new OKLCH values (#17 )	2025-11-08 13:41:05 +08:00
Nexmoe	7901fc7e82	feat(settings): remove 'auto' preset and default to 'best' to (#16 )	2025-11-08 13:40:17 +08:00