bump VERSION to 0.7.1

Terminals answer OSC 10/11/12 color queries but never push changes, so
detect theme flips with a 60 s poll (legacy-tmux fallback for servers
< 3.6). Re-queries palette + default fg/bg, updates the system palette
and re-detects dark/light mode.

.eslintrc.cjs

@@ -1,11 +0,0 @@
-module.exports = {
-  root: true,
-  parser: "@typescript-eslint/parser",
-  plugins: ["@typescript-eslint"],
-  extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
-  env: {
-    es2022: true,
-    node: true,
-  },
-  ignorePatterns: ["dist", "node_modules"],
-}

.github/workflows/release.yml

@@ -0,0 +1,102 @@
+name: release
+
+# Builds standalone PodTui binaries for each supported OS/arch and attaches
+# them to a GitHub Release. One runner per platform because Bun cannot
+# cross-compile — each runner runs `make dist`, which emits a
+# podtui-<platform>-<arch>.tar.gz (binary + native libs side by side).
+#
+# Trigger: push a tag like v0.1.0. Bump VERSION in src/index.tsx in the same
+# commit as the tag so the released binary reports the tagged version.
+
+on: # intentional: YAML `on` key
+  push:
+    tags:
+      - "v*"
+
+permissions:
+  contents: write
+
+jobs:
+  build:
+    name: build (${{ matrix.os }} / ${{ matrix.arch }})
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        include:
+          - os: ubuntu-latest
+            arch: x64
+            plat: linux
+          - os: ubuntu-24.04-arm
+            arch: arm64
+            plat: linux
+          - os: macos-15-intel
+            arch: x64
+            plat: darwin
+          - os: macos-14
+            arch: arm64
+            plat: darwin
+    steps:
+      - name: Check out repo
+        uses: actions/checkout@v5
+
+      - name: Set up Bun
+        uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: latest
+
+      - name: Install dependencies
+        run: bun install
+
+      - name: Install fftw (cavacore build dependency)
+        run: |
+          if uname -s | grep -qi darwin; then
+            brew install fftw
+          else
+            sudo apt-get update
+            sudo apt-get install -y libfftw3-dev
+          fi
+
+      - name: Build native cavacore library
+        run: scripts/build-cavacore.sh
+
+      - name: Build standalone binary + tarball
+        run: make dist
+
+      - name: Smoke-test binary boot
+        env:
+          DIST_TAR: podtui-${{ matrix.plat }}-${{ matrix.arch }}.tar.gz
+        run: |
+          # The binary is compiled with bunfig autoload disabled
+          # (autoloadBunfig: false in build.ts), so it must boot even from a
+          # directory holding a bunfig.toml with a top-level preload the
+          # standalone can't resolve. Plant one to make this a real regression
+          # test for "preload not found".
+          SMOKE_DIR=$(mktemp -d)
+          tar -xzf "dist/$DIST_TAR" -C "$SMOKE_DIR"
+          printf 'preload = ["./definitely-missing.ts"]\n' > "$SMOKE_DIR/bunfig.toml"
+          cd "$SMOKE_DIR"
+          ./podtui-*/podtui --version
+
+      - name: Upload artifact
+        uses: actions/upload-artifact@v6
+        with:
+          name: podtui-${{ matrix.plat }}-${{ matrix.arch }}
+          path: dist/podtui-*.tar.gz
+
+  upload:
+    name: Attach to GitHub Release
+    needs: build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Download all binaries
+        uses: actions/download-artifact@v7
+        with:
+          path: artifacts
+
+      - name: Publish release
+        uses: softprops/action-gh-release@v3
+        with:
+          generate_release_notes: true
+          files: |
+            artifacts/**/*.tar.gz
+            LICENSE

.gitignore

@@ -27,9 +27,13 @@ report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 .eslintcache
 .cache
 *.tsbuildinfo
+*.lock
 
-# IntelliJ based IDEs
-.idea
 
 # Finder (MacOS) folder config
 .DS_Store
+.harness/
+.ralpi
+notes.md
+# pygienium run-state and check artifacts
+.pygienium/

AGENTS.md

@@ -0,0 +1,97 @@
+# AGENTS.md
+
+## Build, Lint, and Test Commands
+
+### Development
+- `bun start` - Run the application
+- `bun run dev` - Run with hot reload (watch mode)
+
+### Build
+- `bun run build` - Build JavaScript bundle to `dist/`
+- `bun run build:native` - Build native libraries (requires `scripts/build-cavacore.sh`)
+
+### Testing
+- `bun test` - Run all tests
+- `bun tests/cavacore-smoke.ts` - Run specific native library smoke test
+
+### Linting
+- `bun run lint` - Run the TypeScript typecheck (`bun tsc --noEmit`)
+
+## Code Style Guidelines
+
+### TypeScript Configuration
+- Target: ESNext with bundler module resolution
+- Strict mode enabled
+- Path alias: `@/*` maps to `src/*`
+- JSX: Use `@opentui/solid` as import source
+
+### Import Organization
+1. Third-party framework imports (solid-js, @opentui/solid)
+2. Local utility imports
+3. Type imports (separate from value imports)
+
+### Naming Conventions
+- **Components**: PascalCase (e.g., `FeedPage`, `Player`)
+- **Hooks**: `use*` prefix (e.g., `useAudio`, `useAppKeyboard`)
+- **Stores**: `create*` factory + `use*` accessor (e.g., `createFeedStore`, `useFeedStore`)
+- **Utilities**: camelCase (e.g., `parseRSSFeed`, `detectPlayers`)
+- **Constants**: UPPER_SNAKE_CASE (e.g., `MAX_EPISODES_REFRESH`)
+- **Types/interfaces**: PascalCase (e.g., `Feed`, `AudioBackend`)
+- **Enums**: PascalCase (e.g., `FeedVisibility`)
+
+### Code Structure
+- **Section Dividers**: Use `// ── Section Name ────────────────────────────────────────────────────────────` format
+- **Helper Functions**: Define before main logic
+- **Factory Functions**: Use for store creation (return object with state, computed, actions)
+- **Singleton Pattern**: Stores use module-level singleton with `use*` accessor
+
+### Type Definitions
+- Use `interface` for object shapes
+- Use `type` for unions, intersections, and complex types
+- Use `enum` for constant sets
+- Export types from `src/types/` directory
+- Include JSDoc comments for complex types
+
+### Error Handling
+- Use `try/catch` for async operations
+- For expected failures, use `.catch(() => {})` to suppress errors
+- Return default values on failure (e.g., `return []` or `return null`)
+- Use `catch` blocks with descriptive comments for unexpected errors
+- For UI components, wrap in `ErrorBoundary` with clear fallback
+
+### Async Patterns
+- Fire-and-forget async operations: `.catch(() => {})` with comment
+- Async store initialization: IIFE `(async () => { ... })()`
+- Promise handling: Use `.catch()` to return defaults
+
+### Comments
+- **File headers**: Brief description of file purpose
+- **Complex functions**: JSDoc-style comments explaining behavior
+- **Section dividers**: Visual separators for code organization
+- **Inline comments**: Explain non-obvious logic, especially async patterns
+
+### Code Formatting
+- 2-space indentation
+- No semicolons (Bun style)
+- Arrow functions with implicit return where appropriate
+- Object shorthand where possible
+- Prefer `const` over `let`
+
+### Reactivity (Solid.js)
+- Use `createSignal` for primitive state
+- Use `createMemo` for computed values
+- Use `createEffect` for side effects
+- Component functions return JSX
+- Store functions return plain objects with state, computed, and actions
+
+### Persistence
+- Async persistence operations fire-and-forget
+- Use `.catch(() => {})` to suppress errors
+- Update state synchronously, persist asynchronously
+- Use `setFeeds()` pattern to update state and trigger save
+
+### Testing
+- Test files in `tests/` directory
+- Use Bun's test framework
+- Include JSDoc comments explaining test purpose
+- Native library tests use `bun:ffi` for FFI calls

CONTRIBUTING.md

@@ -0,0 +1,230 @@
+# Contributing to PodTui
+
+This file is written **for humans**. If you're an AI agent or LLM working in
+this repo, read [AGENTS.md](AGENTS.md) instead — it has the machine-oriented
+build/test/lint contract and code-style rules. Both describe the same project;
+CONTRIBUTING.md focuses on *understanding* and *navigating* the codebase.
+
+PodTui is a keyboard-first, yazi-style terminal podcast client. TypeScript +
+[OpenTUI](https://github.com/opentui/opentui) on top, [Bun](https://bun.sh)
+as the runtime and toolchain.
+
+---
+
+## Quick start
+
+```bash
+brew install bun          # or: curl -fsSL https://bun.sh/install | bash
+git clone git@github.com:mikefreno/podtui.git
+cd podtui
+
+bun install               # install JS dependencies
+make native               # build libcavacore.dylib from the vendored C source
+bun run dev               # launch with hot reload (alias: make dev)
+```
+
+The app is a TUI — it expects a real terminal (Ghostty, kitty, iTerm2,
+      WezTerm, tmux, …). It will not render in a plain captured `bash` session.
+
+## What each command does
+
+| Command            | Purpose                                                                  |
+|--------------------|--------------------------------------------------------------------------|
+| `bun install`      | Install JS dependencies                                                  |
+| `make native`      | Compile `cava/cavacore.c` → `src/native/libcavacore.<dylib\|so>`          |
+| `bun run dev`      | Run with hot reload                                                       |
+| `bun run start`    | Run once (no watch)                                                       |
+| `bun test`         | Run the test suite (see [Testing](#testing))                              |
+| `bun run lint`        | Type-check                                         |
+| `bun run build`    | Bundle JS into `dist/` + copy native libs (the `podtui` npm script path)  |
+| `make dist`        | Compile the standalone binary + make the current platform's tarball       |
+| `make dist-mac` / `make dist-linux` | Aliases for `dist` on their platform (CI runs these)          |
+| `make clean`       | Remove `dist/`                                                             |
+
+## Repository layout
+
+```
+src/
+  api/          Network + XML/RSS — client.ts, rss-parser.ts
+  components/   Reusable UI pieces: Shell, Navigation, YaziPaneRow, TabPanel…
+  config/       App config: keybinds.jsonc, shortcuts, auth
+  constants/    Static tables (sync formats, themes)
+  context/      Solid contexts: KeybindContext, NavigationContext, ThemeContext
+  hooks/        useAudio, useMultimediaKeys, useCachedData
+  native/       FFI glue + the built libcavacore.{dylib,so}
+  pages/        App screens: Feed, MyShows, Discover, Search, Player, Settings
+  stores/       Zustand stores — app, feed, audio-nav, search, auth, progress…
+  styles/       theme.css
+  themes/       catppuccin, gruvbox, nord, tokyo schemes + schema.json
+  types/        All shared interfaces (podcast, episode, feed, settings…)
+  ui/           Modal-adjacent UI: command.tsx, dialog.tsx, toast.tsx
+  utils/        Parser/persistence/audio helpers (audio-player, config-dir…)
+scripts/
+  build-cavacore.sh   C → shared lib; finds libfftw3.a on macOS & Debian
+  tui-harness.tsx     Headless harness for scripted interaction (see below)
+cava/                 Vendored cavacore C source (MIT, from karlstav/cava)
+tests/                bun test suite + cavacore smoke test
+dist/                 Build output (JS bundle + libs + tarballs)
+```
+
+## Native libraries: how the FFI layer works
+
+PodTui loads **two** native libraries at runtime:
+
+1. **libopentui** — the OpenTUI renderer (shipped inside the
+   `@opentui/core-<platform>-<arch>` npm packages, copied to `dist/` by
+   `build.ts`).
+2. **libcavacore** — the audio spectrum renderer, built from C. The source is
+   vendored under `cava/` (it must stay committed — every CI runner builds it).
+   `libfftw3` is needed to build it:
+   - macOS: `brew install fftw`
+   - Debian/Ubuntu: `apt-get install libfftw3-dev`
+   (CI installs it for you; locally run `make native`.)
+
+**Critical sibling rule**: both libraries are loaded *relative to the binary*,
+so `podtui`, `libopentui.*` and `libcavacore.*` must sit in the **same
+directory**. Never move a single binary out of the tarball. The Homebrew
+formula keeps all three in `libexec/` and exposes only a `podtui` symlink.
+
+Cavacore smoke test: `bun tests/cavacore-smoke.ts`
+(FFI-calls `cava_init` / `cava_execute` / `cava_destroy` and prints results).
+
+## Gotchas (read before touching anything)
+
+1. **The compiled binary must keep bunfig autoload disabled.**
+   `build.ts` compiles the standalone with `autoloadBunfig: false`, so its
+   embedded runtime *never* reads the launching CWD's `bunfig.toml`. Without
+   that flag, a top-level `preload` in the CWD bunfig (common in Bun project
+   dirs) resolves against the CWD rather than the binary and kills startup
+   with `preload not found`. Don't remove the flag. Preloads for dev/test
+   belong in the explicit `--preload` flags in `package.json` and the
+   `[test]` section of `bunfig.toml` — not as a top-level entry.
+
+2. **Smoke-test the binary from a dir with a poisoned bunfig.**
+   The CI smoke test unpacks the tarball into a `mktemp` dir, drops a
+   `bunfig.toml` containing an unresolvable top-level `preload` next to it,
+   and boots the binary — proving bunfig autoload stayed disabled. `./dist/
+   podtui --version` must work from any directory, including the repo root;
+   do the same check when testing a release build locally.
+
+3. **Homebrew's dylib-repair warning is benign.**
+   `brew install` may print “load commands do not fit in the header … needs
+   `-headerpad`” for a prebuilt dylib. The app dlopens the libs by path, so
+   the warning is cosmetic; installs complete and the app boots.
+
+## Testing
+
+```bash
+bun test                # full suite   (54 tests across 6 files today)
+```
+
+The suite covers the keyboard/nav model, keybind dispatch, and the yazi pane
+logic; plus `tests/cavacore-smoke.ts` asserting the native lib exports.
+
+For scripted end-to-end interaction there's a **headless harness**,
+`scripts/tui-harness.tsx`: each invocation snapshot-rebuilds the app state
+into a sandboxed `.harness/` config dir, replays the saved action log
+(`.harness/actions.json`), executes one more key/action passed on the CLI, and
+prints the resulting frame + a style summary — all without a real terminal.
+Audio is a no-op during those snapshots. The last frame lands in
+`.harness/last-frame.{json,txt}` for inspection.
+
+## Releasing
+
+Releases are built and published from **tags**
+
+### Steps
+
+1. Run `scripts/release-tag.sh` (interactive: pick major/minor/patch/custom,
+   confirms the plan, bumps `VERSION` in `src/index.tsx`, commits, tags
+   `vX.Y.Z`, and pushes branch + tag to every remote). If the version bump is
+   already committed but the tag is missing, it offers a tag-only path.
+   `--dry-run` prints the plan without doing anything.
+2. Equivalent manual commands:
+
+   ```bash
+   git tag -a v0.2.0 -m 'PodTUI v0.2.0' && git push gh v0.2.0
+   ```
+
+3. CI (`.github/workflows/release.yml`) runs four builds in parallel,
+   each producing `podtui-<platform>-<arch>.tar.gz`:
+
+   | Runner              | Platform/Arch |
+   |---------------------|---------------|
+   | `ubuntu-latest`     | linux-x64     |
+   | `ubuntu-24.04-arm`  | linux-arm64   |
+   | `macos-15-intel`    | darwin-x64    |
+   | `macos-14`          | darwin-arm64  |
+
+   Each runner: installs deps → installs fftw → `scripts/build-cavacore.sh`
+   → `make dist` → smoke-boots the binary from a temp dir → uploads the
+   tarball. (`macos-15-intel` matters: GitHub's `macos-latest` is arm64 now.)
+
+4. A release is auto-created with all 4 tarballs attached. `brew` never
+   sees the new version: the **tap self-updates**: the
+   `mikefreno/homebrew-tap` repo has a scheduled workflow (hourly) that
+   polls GitHub releases, and when a new tag appears, rewrites
+   `Formula/podtui.rb` (URLs + arm64/x64 `sha256`) and pushes it — no
+   secrets. See `scripts/sync-formula.sh` in that repo for the logic. Local
+   test: `brew install mikefreno/tap/podtui`.
+5. **AUR packaging** (`packaging/aur/PKGBUILD`): the `podtui-bin` package is
+   staged, not yet published (AUR account registrations are closed; see the
+   README's Installation section). On each release, keep the AUR sources in sync
+   with the new tag: bump `pkgver`, recompute the two tarball `sha256sums`
+   entries, keep the `LICENSE` asset source (the workflow above uploads
+   `LICENSE` to every release), and regenerate `packaging/aur/.SRCINFO` with
+   `bash packaging/aur/gen-srcinfo.sh`.
+
+### Manual fallback
+
+If you ever need to sync the tap by hand (or before the hourly job runs):
+
+```bash
+cd <clone of mikefreno/homebrew-tap>
+./scripts/sync-formula.sh 0.2.0
+git commit -am 'podtui 0.2.0' && git push
+```
+
+### Local release build
+
+```bash
+make dist          # builds the binary + tarball for THIS machine only
+```
+
+Bun cannot cross-compile — the other platforms come from CI.
+
+## Distribution & packaging
+
+A release tarball is three files sitting side by side: the `podtui` binary
+plus its two FFI libraries (`libopentui.<dylib|so>`,
+`libcavacore.<dylib|so>`). The sibling rule above is why they ship together.
+
+PodTui deliberately ships **no** `.deb`, `.rpm`, Flatpak, or Snap packages:
+for a terminal app that's overwhelmingly installed through repositories or
+archives, those formats add desktop-sandboxing overhead and a packaging tax
+with little benefit. Instead:
+
+- **GitHub Release tarballs** are the universal path — one upload per
+  OS/arch, works on any distro with `curl` + `tar`.
+- **AUR (`podtui-bin`)** covers Arch/Manjaro with the same binary through the
+  native package manager.
+- **Nix / cross-distro** users build from source (or a Nix flake can be added
+  later).
+
+This keeps maintenance to a single build per OS/arch while still reaching the
+vast majority of desktop Linux users. The AUR PKGBUILD lives in
+`packaging/aur/` and can be built locally to test before publication:
+
+```bash
+cd packaging/aur && makepkg -si
+```
+
+---
+
+## Open items / things to sort out
+
+- **Native libs in `dist/` still need committing?** No — they're built from
+  sources kept in the repo (`cava/`, `node_modules/@opentui/core-*`). Only
+  `src/native/libcavacore.dylib` is a committed binary artifact; macOS arm64
+  ships from it directly until a full rebuild replaces it. On other hosts the
+  `make native` build is required — see `scripts/build-cavacore.sh`.

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Michael Freno
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

Makefile

@@ -0,0 +1,65 @@
+# PodTui — Makefile
+#
+# Development targets:
+#   make install     install dependencies (bun install) + build native lib
+#   make dev         run with hot reload
+#   make test        run the test suite
+#   make build       produce the JS bundle + native libs in dist/
+#   make native      build the cavacore FFI library from C source
+#   make lint        run typecheck-style checks (lsp), not eslint
+#
+# Packaging / release targets:
+#   make dist        build a standalone compiled binary + tarball for the
+#                    CURRENT platform (see dist/ for podtui + libs + tarball)
+#   make dist-mac    alias for `dist` targeting macOS (run on macOS)
+#   make dist-linux  alias for `dist` targeting Linux (run on Linux)
+#   make clean       remove dist/ output
+#
+# Cross-platform binaries are produced by CI (GitHub Actions) with one runner
+# per OS/arch — Bun cannot cross-compile, so dist:mac / dist:linux only produce
+# the binary for the OS they run on. Each runner runs `make dist` and uploads
+# its podtui-<platform>-<arch>.tar.gz artifact.
+
+SHELL := /bin/bash
+
+.PHONY: install dev build native dist dist-mac dist-linux test clean
+
+## Install dependencies and build the native runtime library.
+install:
+	bun install
+	make native
+
+## Run the dev server with hot reload.
+dev:
+	bun run dev
+
+## Type-check the whole project. (See AGENTS.md: `bun run lint` points at a
+## nonexistent lint.ts; LSP diagnostics are the maintained clean bar.)
+lint:
+	bun tsc --noEmit
+
+## Build the JS bundle + native libs into dist/ (the `podtui` npm bin target).
+build:
+	bun run build
+
+## Build the cavacore FFI library from src/native/cavacore.c.
+native:
+	scripts/build-cavacore.sh
+
+## Standalone binary + native-libs tarball for the current platform.
+## Built with bunfig autoload disabled (build.ts sets autoloadBunfig: false),
+## so the embedded runtime ignores any bunfig.toml in the launching directory.
+dist:
+	bun run build.ts --compile
+
+## macOS build (run on a macOS runner / host).
+dist-mac:
+	bun run build.ts --compile
+
+## Linux build (run on a Linux runner / host).
+dist-linux:
+	bun run build.ts --compile
+
+## Remove build artifacts.
+clean:
+	rm -rf dist

README.md

@@ -1,15 +1,237 @@
-# solid
+# PodTui
 
-To install dependencies:
+A keyboard-first, terminal podcast client built on [OpenTUI](https://github.com/opentui/opentui). Subscribe to RSS feeds,
+browse episodes in a three-pane file-manager layout, and play audio through an
+external player with full transport control — all from your terminal.
 
-```bash
-bun install
+## Features
+
+- **Vim/yazi-style navigation** — `j/k` to move, `h/l` to swipe between panes,
+  `Enter` to open, `1–6` / `[` `]` to switch tabs. The tab list is the app root:
+  at launch it fills the current pane, and drilling into a tab's contents slides
+  it into the parent pane.
+- **Three-pane view** — parent / current / preview (Up | Current | Preview).
+- **Podcast feeds** — add feeds, browse episodes, and manage your library
+  (My Shows, Discover, Feed tabs).
+- **Search** across your subscribed shows.
+- **Audio playback** through an external player with full transport control:
+  play/pause, next/previous, seek, speed, and per-episode resume progress.
+  When an episode finishes, the next one plays automatically, continuing
+  down the list you started it from (search results, a show, or the Feed).
+- **Themeable** and **remappable keybindings**.
+- Ships as a **standalone compiled binary** — no runtime or install step beyond
+  a system audio player.
+
+## Quick start
+
+1. Install PodTui ([Installation](#installation)) and make sure **mpv** is in
+   your `PATH`.
+2. Run `podtui` in your terminal.
+3. Press `3` to open **Discover** (or `4` to open **Search**, then `s`), drill
+   in with `Enter`, and press `Enter` on a show to subscribe.
+4. Press `1` (**Feed**) or `2` (**My Shows**), open an episode with `Enter`,
+   and use `P` to play/pause, `N`/`B` for next/previous, and `shift-.` /
+   `shift-,` to seek.
+
+Press `~` any time for in-app help. All keys are remappable — see
+[Keybindings](#keybindings).
+
+## Requirements
+
+- A terminal with UTF-8 and modern color support (kitty, iTerm2, WezTerm,
+  Ghostty, tmux etc.).
+- **mpv** on `PATH` for audio playback. PodTui drives mpv over JSON IPC, so
+  seek, speed, and position tracking all work. Without `mpv` on `PATH`,
+  playback is a silent no-op (the `none` backend) — see
+  [Troubleshooting](#troubleshooting).
+
+## Installation
+
+PodTui distributes as a **self-contained binary** for macOS (arm64/x64) and
+Linux (arm64/x64). Pick whichever fits your platform.
+
+### 1. Homebrew (macOS)
+
+```sh
+brew install mikefreno/tap/podtui
 ```
 
-To run:
+### 2. Standalone tarball (all platforms)
+
+Grab `podtui-<platform>-<arch>.tar.gz` from the latest
+[GitHub Release](https://github.com/mikefreno/podtui/releases), unpack it, and
+put `podtui` on your `PATH`:
 
 ```bash
-bun dev
+curl -sS -o /tmp/podtui.tar.gz \
+  https://github.com/mikefreno/podtui/releases/latest/download/podtui-linux-x64.tar.gz
+sudo mkdir -p /opt/podtui
+sudo tar -xzf /tmp/podtui.tar.gz -C /opt/podtui --strip-components=1
+sudo ln -sf /opt/podtui/podtui /usr/local/bin/podtui
 ```
 
-This project was created using `bun create tui`. [create-tui](https://git.new/create-tui) is the easiest way to get started with OpenTUI.
+> The tarball contains `podtui` plus `libopentui.<ext>` and
+> `libcavacore.<ext>` **beside it** — keep them together (don't move just the
+> binary alone), or the native FFI libraries won't load.
+
+### 3. Arch Linux (AUR)
+
+```bash
+yay -S podtui-bin   # once published
+```
+
+Requires an AUR helper ([paru](https://github.com/morgan/paru)); the package
+pulls in `mpv` as a dependency.
+
+> **Not yet on the AUR.** The `podtui-bin` package is staged and awaiting
+> publication (AUR account registrations are currently suspended). Until it
+> lands, use the standalone tarball above.
+
+### 4. From source
+
+PodTui is written in TypeScript and runs on [Bun](https://bun.sh). To build
+from source (development, distro packaging, unreleased versions), see
+[CONTRIBUTING.md](CONTRIBUTING.md).
+
+## Usage
+
+Launch `podtui`. Press `~` for the in-app help.
+
+### Command-line flags
+
+| Flag | Description |
+|------|-------------|
+| `-v`, `--version` | Print the version and exit |
+| `-q`, `--query <term>` | Query feeds for a show title and print matching shows, without launching the TUI |
+| `-p`, `--play <term>` | Play the matching show, without launching the TUI |
+
+### Keybindings
+
+All keys are remappable — edit `keybinds.jsonc` in your config directory
+(see [Configuration](#configuration)).
+
+**Movement**
+
+| Keys | Action |
+|------|--------|
+| `j` / `k` (or `down` / `up`) | Move down / up |
+| `J` / `K` | Jump 5 lines down / up |
+| `ctrl-d` / `ctrl-u` | Page down / up |
+| `ctrl-f` / `ctrl-b` | Full page down / up |
+| `gg` / `G` | Go to top / bottom |
+
+**Panes**
+
+| Keys | Action |
+|------|--------|
+| `h` / `l` (or `left` / `right`) | Focus parent pane / preview pane |
+| `Enter` | Open the item under the cursor (a tab, episode, show…) |
+| `shift-enter` | Open with the interactive variant |
+
+**Selection**
+
+| Keys | Action |
+|------|--------|
+| `Space` | Toggle selection |
+| `v` | Visual mode (multi-select) |
+| `ctrl-a` | Select / deselect all |
+| `ctrl-r` | Invert selection |
+| `Esc` | Cancel / escape |
+
+**Tabs**
+
+| Keys | Action |
+|------|--------|
+| `1`–`6` | Jump to tab 1–6 (Feed, My Shows, Discover, Search, Player, Settings) |
+| `[` / `]` | Previous / next tab |
+
+**Commands, help, quit**
+
+| Keys | Action |
+|------|--------|
+| `:` or `q` | Open the command palette (type `q` + `Enter` there to quit) |
+| `Q` or `ctrl-c` | Quit |
+| `~` or `f1` | In-app help |
+
+**Lists**
+
+| Keys | Action |
+|------|--------|
+| `s` | Search |
+| `f` | Filter |
+| `,` | Sort |
+| `.` | Toggle hidden |
+| `r` | Refresh |
+| `x` | Unsubscribe the focused show (My Shows) |
+| `d` | Download the focused episode (Feed / My Shows detail pane) |
+| `D` | Delete the focused episode's download (if one exists) |
+| `w` | Toggle the focused show in/out of the auto-download whitelist (My Shows, whitelist scope) |
+
+**Audio**
+
+| Keys | Action |
+|------|--------|
+| `P` | Play / pause |
+| `N` / `B` | Next / previous episode |
+| `shift-.` / `shift-,` | Seek forward / backward |
+
+## Configuration
+
+Configuration lives under the XDG config directory — `~/.config/podtui` by
+default (`$XDG_CONFIG_HOME/podtui` if set).
+
+| File | Purpose |
+|------|---------|
+| `config.json` | Unified settings (theme, playback speed, download path), feeds, and custom feed sources |
+| `downloads.json` | Downloaded episode metadata |
+| `keybinds.jsonc` | Keybinding remaps (see above) |
+| `themes/` | Optional custom theme files |
+
+Legacy `feeds.json`, `sources.json`, and `app-state.json` are auto-migrated
+into `config.json` on first run.
+
+**Auto-download** — in Settings → Preferences: `Auto Download` (master
+toggle) downloads the `Auto Download Count` most recent episodes (default 2,
+any positive integer — type it in the editor) of every show in the `Auto
+Download Scope` (all / none / whitelist, default all). With the whitelist
+scope, a search field appears under the setting to pick shows (Space toggles
+a suggestion in/out), and `w` in My Shows adds/removes the focused show.
+
+Env overrides: `PODTUI_AUDIO_BACKEND`, `XDG_CONFIG_HOME`, `PODTUI_NERD_FONTS`.
+
+**Fonts** — PodTui prepends Nerd Font glyphs to non-episode/show list rows (tabs, Discover categories, Settings sections, the Feed and per-show "Fetch More" rows). Icons are hidden automatically when your terminal font is not Nerd Font capable (no tofu, no layout gaps); detection is heuristic (terminal type), so force it with `PODTUI_NERD_FONTS=1` or `=0` if it guesses wrong. A Nerd Font-patched font (e.g. JetBrainsMono Nerd Font) is recommended.
+
+## Troubleshooting
+
+**`preload not found` at startup** — this used to happen when the binary was
+launched from a Bun project directory whose `bunfig.toml` had a `preload`
+entry. Releases are compiled with bunfig autoload disabled
+(`autoloadBunfig: false`), so current binaries ignore the CWD's `bunfig.toml`
+entirely. If you still hit it, you're on an old release — upgrade.
+
+**No audio — playback is a silent no-op** — PodTui needs **mpv** on your
+`PATH`. Homebrew and AUR installs pull it in automatically; if you used the
+standalone tarball, install it yourself (`brew install mpv`, `pacman -S mpv`,
+…) and relaunch.
+
+**Homebrew prints a dylib warning** — “load commands do not fit in the header
+… needs `-headerpad`” is benign: the app loads its libraries by path, the
+install completes, and the app boots normally.
+
+**The app won't start / no spectrum after moving files** — `podtui` loads its
+two native libraries relative to the binary, so keep `podtui`,
+`libopentui.*`, and `libcavacore.*` together in the same directory (the
+tarball unpacks them side by side).
+
+## Building from source / contributing
+
+Development setup, the test suite, packaging, and the release process are
+documented in [CONTRIBUTING.md](CONTRIBUTING.md).
+
+## License
+
+MIT. See [LICENSE](LICENSE).
+
+## Related
+
+- [OpenTUI](https://github.com/opentui/opentui) — the TUI framework driving the interface

assets/App Icon/App Icon.icon/Assets/Podcast Waveform.svg

@@ -0,0 +1 @@
+<svg width="400" xmlns="http://www.w3.org/2000/svg" height="125.714" id="screenshot-993fe4cb-279d-80e0-8008-769a7b1374b8" viewBox="0 0 400 125.714" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1"><g id="shape-993fe4cb-279d-80e0-8008-769a7b1374b8" rx="0" ry="0"><g id="shape-993fe4cb-279d-80e0-8008-769a7a62c77d"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7a62c77d"><rect rx="6.857142857142833" ry="6.857142857142833" x="0" y="56" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.28571428571428" height="13.714285714285666" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7a89c956"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7a89c956"><rect rx="15" ry="15" x="45.71428571428572" y="45.714285714285666" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.28571428571428" height="34.285714285714334" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7a9fe4f2"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7a9fe4f2"><rect rx="15" ry="15" x="91.42857142857144" y="33.14285714285711" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.28571428571428" height="59.428571428571445" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7ab46172"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7ab46172"><rect rx="15" ry="15" x="137.1428571428571" y="18.285714285714306" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.285714285714334" height="89.14285714285714" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7ac82b71"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7ac82b71"><rect rx="15" ry="15" x="182.85714285714283" y="0" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.285714285714334" height="125.71428571428578" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7ad6c7b7"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7ad6c7b7"><rect rx="15" ry="15" x="228.57142857142856" y="18.285714285714306" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.28571428571428" height="89.14285714285714" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7aea70cd"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7aea70cd"><rect rx="15" ry="15" x="274.28571428571433" y="33.14285714285711" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.28571428571428" height="59.428571428571445" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7af77904"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7af77904"><rect rx="15" ry="15" x="320" y="45.714285714285666" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.28571428571428" height="34.285714285714334" style="fill: rgb(59, 66, 82); fill-opacity: 1;"/></g></g><g id="shape-993fe4cb-279d-80e0-8008-769a7b04705e"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-769a7b04705e"><rect rx="6.857142857142833" ry="6.857142857142833" x="365.7142857142858" y="56" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="34.28571428571428" height="13.714285714285666" style="fill: rgb(59, 66, 82); fill-opacity: 1;"/></g></g></g></svg>

assets/App Icon/App Icon.icon/Assets/Terminal Cursor.svg

@@ -0,0 +1 @@
+<svg width="80" xmlns="http://www.w3.org/2000/svg" height="256" id="screenshot-993fe4cb-279d-80e0-8008-76a1e45d35f1" viewBox="0 0 80 256" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1"><g id="shape-993fe4cb-279d-80e0-8008-76a1e45d35f1"><g class="fills" id="fills-993fe4cb-279d-80e0-8008-76a1e45d35f1"><rect rx="10" ry="10" x="0" y="0" transform="matrix(1.000000, 0.000000, 0.000000, 1.000000, 0.000000, 0.000000)" width="80" height="256" style="fill: rgb(136, 192, 208); fill-opacity: 1;"/></g></g></svg>

assets/App Icon/App Icon.icon/icon.json

@@ -0,0 +1,51 @@
+{
+  "fill" : {
+    "solid" : "display-p3:0.18481,0.20325,0.24683,1.00000"
+  },
+  "groups" : [
+    {
+      "layers" : [
+        {
+          "glass" : false,
+          "image-name" : "Podcast Waveform.svg",
+          "name" : "Podcast Waveform",
+          "position" : {
+            "scale" : 2,
+            "translation-in-points" : [
+              0,
+              0
+            ]
+          }
+        },
+        {
+          "blend-mode" : "normal",
+          "fill" : "automatic",
+          "glass" : false,
+          "image-name" : "Terminal Cursor.svg",
+          "name" : "Terminal Cursor",
+          "position" : {
+            "scale" : 2,
+            "translation-in-points" : [
+              320.00000000000006,
+              0
+            ]
+          }
+        }
+      ],
+      "shadow" : {
+        "kind" : "neutral",
+        "opacity" : 0.5
+      },
+      "translucency" : {
+        "enabled" : true,
+        "value" : 0.5
+      }
+    }
+  ],
+  "supported-platforms" : {
+    "circles" : [
+      "watchOS"
+    ],
+    "squares" : "shared"
+  }
+}

build.ts

@@ -1,43 +1,150 @@
-import solidPlugin from "@opentui/solid/bun-plugin"
-import { copyFileSync, existsSync, mkdirSync } from "node:fs"
-import { join, dirname } from "node:path"
+import solidPlugin from "@opentui/solid/bun-plugin";
+import { copyFileSync, existsSync, mkdirSync, rmSync } from "node:fs";
+import { join } from "node:path";
+import { plugin } from "bun";
+
+// Register the solid transform globally (dedup'd by name). This is what makes
+// `--compile` work: compile-mode builds only apply `onLoad` transform plugins
+// that are registered via `plugin()`, not the `plugins:` array. The transform
+// is fully embedded in the compiled binary.
+plugin(solidPlugin);
+
+const COMPILE =
+	process.argv.includes("--compile") || process.env.PODTUI_COMPILE === "1";
+
+const platform = process.platform;
+const arch = process.arch;
+
+// Platform/arch → OpenTUI package name
+const platformMap: Record<string, string> = {
+	"darwin-arm64": "darwin-arm64",
+	"darwin-x64": "darwin-x64",
+	"linux-x64": "linux-x64",
+	"linux-arm64": "linux-arm64",
+	"win32-x64": "win32-x64",
+	"win32-arm64": "win32-arm64",
+};
+
+const libExt =
+	platform === "win32" ? "dll" : platform === "darwin" ? "dylib" : "so";
 
 // Build the JavaScript bundle
 await Bun.build({
-  entrypoints: ["./src/index.tsx"],
-  outdir: "./dist",
-  target: "bun",
-  minify: true,
-  sourcemap: "external",
-  plugins: [solidPlugin],
-})
+	entrypoints: ["./src/index.tsx"],
+	outdir: "./dist",
+	target: "bun",
+	minify: true,
+	sourcemap: "external",
+	plugins: [solidPlugin],
+});
 
-// Copy the native library to dist for distribution
-const platform = process.platform
-const arch = process.arch
-
-// Map platform/arch to OpenTUI package names
-const platformMap: Record<string, string> = {
-  "darwin-arm64": "darwin-arm64",
-  "darwin-x64": "darwin-x64",
-  "linux-x64": "linux-x64",
-  "linux-arm64": "linux-arm64",
-  "win32-x64": "win32-x64",
-  "win32-arm64": "win32-arm64",
-}
-
-const platformKey = `${platform}-${arch}`
-const platformPkg = platformMap[platformKey]
+// Copy the opentui native library to dist for distribution.
+const platformKey = `${platform}-${arch}`;
+const platformPkg = platformMap[platformKey];
 
 if (platformPkg) {
-  const libName = platform === "win32" ? "opentui.dll" : "libopentui.dylib"
-  const srcPath = join("node_modules", `@opentui/core-${platformPkg}`, libName)
-  
-  if (existsSync(srcPath)) {
-    const destPath = join("dist", libName)
-    copyFileSync(srcPath, destPath)
-    console.log(`Copied native library: ${libName}`)
-  }
+	const libName = `libopentui.${libExt}`;
+	const srcPath = join("node_modules", `@opentui/core-${platformPkg}`, libName);
+
+	if (existsSync(srcPath)) {
+		const destPath = join("dist", libName);
+		copyFileSync(srcPath, destPath);
+		console.log(`Copied native library: ${libName}`);
+	}
 }
 
-console.log("Build complete")
+// Copy cavacore native library to dist
+const cavacoreLib = `libcavacore.${libExt}`;
+const cavacoreSrc = join("src", "native", cavacoreLib);
+
+if (existsSync(cavacoreSrc)) {
+	copyFileSync(cavacoreSrc, join("dist", cavacoreLib));
+	console.log(`Copied cavacore library: ${cavacoreLib}`);
+} else {
+	console.warn(
+		`Warning: ${cavacoreSrc} not found — run scripts/build-cavacore.sh first`,
+	);
+}
+
+// ── Standalone compiled binary (dist/podtui + libs beside it) ──────────────
+// `bun run build.ts --compile` (or PODTUI_COMPILE=1). Embeds the Bun runtime
+// so end users need nothing installed; the two FFI libs are shipped as
+// SIBLING FILES next to the binary (both loaders already resolve them that
+// way: cavacore checks dirname(process.execPath); opentui embeds via its
+// bun-plugin and handles the embedded-file path itself).
+if (COMPILE) {
+	const outfile = join("dist", "podtui");
+	await Bun.build({
+		entrypoints: ["./src/index.tsx"],
+		target: "bun",
+		minify: true,
+		sourcemap: "external",
+		plugins: [solidPlugin],
+		compile: {
+			outfile,
+			// Don't let the embedded runtime autoload the launching CWD's
+			// bunfig.toml. A top-level `preload` there (common in Bun project
+			// dirs) resolves against the CWD, not the binary, so startup dies
+			// with "preload not found". With autoload disabled, the binary is
+			// config-independent and boots from any directory.
+			autoloadBunfig: false,
+		},
+	});
+	console.log(`Compiled standalone binary: ${outfile}`);
+
+	// Ensure both native libs sit beside the binary.
+	const opentuiSrc = join(
+		"node_modules",
+		`@opentui/core-${platformPkg}`,
+		`libopentui.${libExt}`,
+	);
+	if (existsSync(opentuiSrc)) {
+		copyFileSync(opentuiSrc, join("dist", `libopentui.${libExt}`));
+	}
+	if (!existsSync(join("dist", cavacoreLib))) {
+		console.warn(
+			`Warning: ${cavacoreLib} missing beside the binary — run scripts/build-cavacore.sh`,
+		);
+	}
+
+	// Tarball: podtui + the two native libs (drop the JS bundle dir)
+	const tarRoot = join("dist", `podtui-${platform}-${arch}`);
+	rmSync(tarRoot, { recursive: true, force: true });
+	mkdirSync(tarRoot, { recursive: true });
+	copyFileSync(outfile, join(tarRoot, "podtui"));
+	for (const lib of [`libopentui.${libExt}`, cavacoreLib]) {
+		const s = join("dist", lib);
+		if (existsSync(s)) copyFileSync(s, join(tarRoot, lib));
+	}
+
+	// App icon: bundled into every platform tarball; Linux also gets the
+	// desktop entry so the AUR package can install both system-wide
+	// (icon to hicolor, entry to applications/).
+	const iconSrc = join("assets", "App Icon", "App Icon.png");
+	if (existsSync(iconSrc)) {
+		copyFileSync(iconSrc, join(tarRoot, "podtui.png"));
+	}
+	if (platform === "linux") {
+		const desktopSrc = join("packaging", "podtui.desktop");
+		if (existsSync(desktopSrc)) {
+			copyFileSync(desktopSrc, join(tarRoot, "podtui.desktop"));
+		}
+	}
+
+	const tar = Bun.spawnSync([
+		"tar",
+		"-czf",
+		`${tarRoot}.tar.gz`,
+		"-C",
+		"dist",
+		`podtui-${platform}-${arch}`,
+	]);
+	if (tar.exitCode !== 0) {
+		console.error(tar.stderr.toString());
+		process.exit(1);
+	}
+	console.log(`Tarball: ${tarRoot}.tar.gz`);
+	rmSync(tarRoot, { recursive: true, force: true });
+}
+
+console.log("Build complete");

bunfig.test.toml

@@ -0,0 +1,2 @@
+[test]
+preload = ["./tests/preload/solid-test-plugin.ts"]

bunfig.toml

@@ -1 +1,8 @@
-preload = ["@opentui/solid/preload"]
+# No top-level `preload` here — dev/test get the solid JSX transform via the
+# explicit `--preload` flags in package.json and the [test] section below.
+# Releases don't read this file at all: build.ts compiles the standalone with
+# `autoloadBunfig: false`, so its embedded runtime ignores any bunfig.toml in
+# the launching directory — no more "preload not found" from CWD bunfigs.
+
+[test]
+preload = "@opentui/solid/preload"

cava/LICENSE-cava.txt

@@ -0,0 +1,19 @@
+Copyright (c) 2015 Karl Stavestrand <karl@stavestrand.no>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

cava/cavacore.c

@@ -0,0 +1,588 @@
+#include "cavacore.h"
+#ifndef M_PI
+#define M_PI 3.1415926535897932385
+#endif
+#include <fftw3.h>
+#include <math.h>
+#include <stdlib.h>
+#include <string.h>
+#ifdef __ANDROID__
+#include <jni.h>
+struct cava_plan *plan;
+double *cava_in;
+double *cava_out;
+#endif
+
+static double amplitude_to_decibels(double value) {
+    // Magic number 20 comes from converting amplitude ratios to decibels.
+    return 20 * log10(value);
+}
+
+struct cava_plan *cava_init(int number_of_bars, unsigned int rate, int channels, int autosens,
+                            double noise_reduction, int low_cut_off, int high_cut_off,
+                            int scaling_mode) {
+    struct cava_plan *p = malloc(sizeof(struct cava_plan));
+    p->status = 0;
+
+    // sanity checks:
+    if (channels < 1 || channels > 2) {
+        snprintf(p->error_message, 1024,
+                 "cava_init called with illegal number of channels: %d, number of channels "
+                 "supported are "
+                 "1 and 2",
+                 channels);
+        p->status = -1;
+        return p;
+    }
+    if (rate < 1 || rate > 384000) {
+        snprintf(p->error_message, 1024, "cava_init called with illegal sample rate: %d\n", rate);
+        p->status = -1;
+        return p;
+    }
+
+    int fft_buffer_size = 512;
+
+    if (rate > 8125 && rate <= 16250)
+        fft_buffer_size *= 2;
+    else if (rate > 16250 && rate <= 32500)
+        fft_buffer_size *= 4;
+    else if (rate > 32500 && rate <= 75000)
+        fft_buffer_size *= 8;
+    else if (rate > 75000 && rate <= 150000)
+        fft_buffer_size *= 16;
+    else if (rate > 150000 && rate <= 300000)
+        fft_buffer_size *= 32;
+    else if (rate > 300000)
+        fft_buffer_size *= 64;
+
+    if (number_of_bars < 1) {
+        snprintf(p->error_message, 1024,
+                 "cava_init called with illegal number of bars: %d, number of channels must be "
+                 "positive integer\n",
+                 number_of_bars);
+        p->status = -1;
+        return p;
+    }
+
+    if (number_of_bars > fft_buffer_size / 2 + 1) {
+        snprintf(p->error_message, 1024,
+                 "cava_init called with illegal number of bars: %d, for %d sample rate number of "
+                 "bars can't be more than %d\n",
+                 number_of_bars, rate, fft_buffer_size / 2 + 1);
+        p->status = -1;
+        return p;
+    }
+    if (low_cut_off < 1 || high_cut_off < 1) {
+        snprintf(p->error_message, 1024, "low_cut_off must be a positive value\n");
+        p->status = -1;
+        return p;
+    }
+    if (low_cut_off >= high_cut_off) {
+        snprintf(p->error_message, 1024, "high_cut_off must be a higher than low_cut_off\n");
+        p->status = -1;
+        return p;
+    }
+    if ((unsigned int)high_cut_off > rate / 2) {
+        snprintf(p->error_message, 1024,
+                 "high_cut_off can't be higher than sample rate / 2. (Nyquist Sampling Theorem)\n");
+        p->status = -1;
+        return p;
+    }
+    if (scaling_mode != CAVA_SCALING_LINEAR && scaling_mode != CAVA_SCALING_DECIBEL) {
+        snprintf(p->error_message, 1024, "unknown scaling mode: %d\n", scaling_mode);
+        p->status = -1;
+        return p;
+    }
+
+    p->number_of_bars = number_of_bars;
+    p->audio_channels = channels;
+    p->rate = rate;
+    p->autosens = 1;
+    p->sens_init = 1;
+    p->sens = 1.0;
+    p->autosens = autosens;
+    p->framerate = 75;
+    p->frame_skip = 1;
+    p->noise_reduction = noise_reduction;
+    p->scaling_mode = scaling_mode;
+
+    int fftw_flag = FFTW_MEASURE;
+#ifdef __ANDROID__
+    fftw_flag = FFTW_ESTIMATE;
+#endif
+
+    p->FFTbassbufferSize = fft_buffer_size * 2;
+    p->FFTbufferSize = fft_buffer_size;
+
+    p->input_buffer_size = p->FFTbassbufferSize * channels;
+
+    p->input_buffer = (double *)malloc(p->input_buffer_size * sizeof(double));
+
+    p->FFTbuffer_lower_cut_off = (int *)malloc((number_of_bars + 1) * sizeof(int));
+    p->FFTbuffer_upper_cut_off = (int *)malloc((number_of_bars + 1) * sizeof(int));
+    p->eq = (double *)malloc((number_of_bars + 1) * sizeof(double));
+    p->cut_off_frequency = (float *)malloc((number_of_bars + 1) * sizeof(float));
+
+    p->cava_fall = (double *)malloc(number_of_bars * channels * sizeof(double));
+    p->cava_mem = (double *)malloc(number_of_bars * channels * sizeof(double));
+    p->cava_peak = (double *)malloc(number_of_bars * channels * sizeof(double));
+    p->prev_cava_out = (double *)malloc(number_of_bars * channels * sizeof(double));
+
+    // Hann Window calculate multipliers
+    p->bass_multiplier = (double *)malloc(p->FFTbassbufferSize * sizeof(double));
+    p->multiplier = (double *)malloc(p->FFTbufferSize * sizeof(double));
+    for (int i = 0; i < p->FFTbassbufferSize; i++) {
+        p->bass_multiplier[i] = 0.5 * (1 - cos(2 * M_PI * i / (p->FFTbassbufferSize - 1)));
+    }
+    for (int i = 0; i < p->FFTbufferSize; i++) {
+        p->multiplier[i] = 0.5 * (1 - cos(2 * M_PI * i / (p->FFTbufferSize - 1)));
+    }
+
+    // BASS
+    p->in_bass_l = fftw_alloc_real(p->FFTbassbufferSize);
+    p->in_bass_l_raw = fftw_alloc_real(p->FFTbassbufferSize);
+    p->out_bass_l = fftw_alloc_complex(p->FFTbassbufferSize / 2 + 1);
+    p->p_bass_l =
+        fftw_plan_dft_r2c_1d(p->FFTbassbufferSize, p->in_bass_l, p->out_bass_l, fftw_flag);
+
+    // MID + TREBLE
+    p->in_l = fftw_alloc_real(p->FFTbufferSize);
+    p->in_l_raw = fftw_alloc_real(p->FFTbufferSize);
+    p->out_l = fftw_alloc_complex(p->FFTbufferSize / 2 + 1);
+    p->p_l = fftw_plan_dft_r2c_1d(p->FFTbufferSize, p->in_l, p->out_l, fftw_flag);
+
+    memset(p->in_bass_l, 0, sizeof(double) * p->FFTbassbufferSize);
+    memset(p->in_l, 0, sizeof(double) * p->FFTbufferSize);
+    memset(p->in_bass_l_raw, 0, sizeof(double) * p->FFTbassbufferSize);
+    memset(p->in_l_raw, 0, sizeof(double) * p->FFTbufferSize);
+    memset(p->out_bass_l, 0, (p->FFTbassbufferSize / 2 + 1) * sizeof(fftw_complex));
+    memset(p->out_l, 0, (p->FFTbufferSize / 2 + 1) * sizeof(fftw_complex));
+    if (p->audio_channels == 2) {
+        // BASS
+        p->in_bass_r = fftw_alloc_real(p->FFTbassbufferSize);
+        p->in_bass_r_raw = fftw_alloc_real(p->FFTbassbufferSize);
+        p->out_bass_r = fftw_alloc_complex(p->FFTbassbufferSize / 2 + 1);
+        p->p_bass_r =
+            fftw_plan_dft_r2c_1d(p->FFTbassbufferSize, p->in_bass_r, p->out_bass_r, fftw_flag);
+
+        // MID + TREBLE
+        p->in_r = fftw_alloc_real(p->FFTbufferSize);
+        p->in_r_raw = fftw_alloc_real(p->FFTbufferSize);
+        p->out_r = fftw_alloc_complex(p->FFTbufferSize / 2 + 1);
+
+        p->p_r = fftw_plan_dft_r2c_1d(p->FFTbufferSize, p->in_r, p->out_r, fftw_flag);
+
+        memset(p->in_bass_r, 0, sizeof(double) * p->FFTbassbufferSize);
+        memset(p->in_r, 0, sizeof(double) * p->FFTbufferSize);
+        memset(p->in_bass_r_raw, 0, sizeof(double) * p->FFTbassbufferSize);
+        memset(p->in_r_raw, 0, sizeof(double) * p->FFTbufferSize);
+        memset(p->out_bass_r, 0, (p->FFTbassbufferSize / 2 + 1) * sizeof(fftw_complex));
+        memset(p->out_r, 0, (p->FFTbufferSize / 2 + 1) * sizeof(fftw_complex));
+    }
+
+    memset(p->input_buffer, 0, sizeof(double) * p->input_buffer_size);
+
+    memset(p->cava_fall, 0, sizeof(double) * number_of_bars * channels);
+    memset(p->cava_mem, 0, sizeof(double) * number_of_bars * channels);
+    memset(p->cava_peak, 0, sizeof(double) * number_of_bars * channels);
+    memset(p->prev_cava_out, 0, sizeof(double) * number_of_bars * channels);
+
+    // process: calculate cutoff frequencies and eq
+    int lower_cut_off = low_cut_off;
+    int upper_cut_off = high_cut_off;
+    int bass_cut_off = 100;
+
+    // calculate frequency constant (used to distribute bars across the frequency band)
+    double frequency_constant = log10((float)lower_cut_off / (float)upper_cut_off) /
+                                (1 / ((float)p->number_of_bars + 1) - 1);
+
+    float *relative_cut_off = (float *)malloc((p->number_of_bars + 1) * sizeof(float));
+
+    p->bass_cut_off_bar = 0;
+    int first_bar = 1;
+
+    float min_bandwidth = p->rate / p->FFTbassbufferSize;
+
+    for (int n = 0; n < p->number_of_bars + 1; n++) {
+        double bar_distribution_coefficient = frequency_constant * (-1);
+        bar_distribution_coefficient +=
+            ((float)n + 1) / ((float)p->number_of_bars + 1) * frequency_constant;
+        p->cut_off_frequency[n] = upper_cut_off * pow(10, bar_distribution_coefficient);
+
+        if (n > 0) {
+            if (p->cut_off_frequency[n - 1] >= p->cut_off_frequency[n])
+                p->cut_off_frequency[n] = p->cut_off_frequency[n - 1] + min_bandwidth;
+        }
+
+        // remember nyquist!
+        relative_cut_off[n] = p->cut_off_frequency[n] / (p->rate / 2);
+
+        if (p->cut_off_frequency[n] < bass_cut_off) {
+            // BASS
+            p->FFTbuffer_lower_cut_off[n] = relative_cut_off[n] * (p->FFTbassbufferSize / 2);
+            p->bass_cut_off_bar++;
+            if (p->bass_cut_off_bar > 1)
+                first_bar = 0;
+
+            if (p->FFTbuffer_lower_cut_off[n] > p->FFTbassbufferSize / 2) {
+                p->FFTbuffer_lower_cut_off[n] = p->FFTbassbufferSize / 2;
+            }
+        } else {
+            // MID + TREBLE
+            p->FFTbuffer_lower_cut_off[n] =
+                ceil(relative_cut_off[n] * (float)(p->FFTbufferSize / 2));
+            if (n == p->bass_cut_off_bar) {
+                first_bar = 1;
+                if (n > 0) {
+                    p->FFTbuffer_upper_cut_off[n - 1] =
+                        relative_cut_off[n] * (p->FFTbassbufferSize / 2) - 1;
+                }
+            } else {
+                first_bar = 0;
+            }
+
+            if (p->FFTbuffer_lower_cut_off[n] > p->FFTbufferSize / 2) {
+                p->FFTbuffer_lower_cut_off[n] = p->FFTbufferSize / 2;
+            }
+        }
+
+        if (n > 0) {
+            if (!first_bar) {
+                p->FFTbuffer_upper_cut_off[n - 1] = p->FFTbuffer_lower_cut_off[n] - 1;
+
+                // pushing the spectrum up if the exponential function gets "clumped" in the
+                // bass and calculating new cut off frequencies
+                if (p->FFTbuffer_lower_cut_off[n] <= p->FFTbuffer_lower_cut_off[n - 1]) {
+
+                    // check if there is room for more first
+                    int room_for_more = 0;
+
+                    if (n < p->bass_cut_off_bar) {
+                        if (p->FFTbuffer_lower_cut_off[n - 1] + 1 < p->FFTbassbufferSize / 2 + 1)
+                            room_for_more = 1;
+                    } else {
+                        if (p->FFTbuffer_lower_cut_off[n - 1] + 1 < p->FFTbufferSize / 2 + 1)
+                            room_for_more = 1;
+                    }
+
+                    if (room_for_more) {
+                        // push the spectrum up
+                        p->FFTbuffer_lower_cut_off[n] = p->FFTbuffer_lower_cut_off[n - 1] + 1;
+                        p->FFTbuffer_upper_cut_off[n - 1] = p->FFTbuffer_lower_cut_off[n] - 1;
+                    }
+                }
+            } else {
+                if (p->FFTbuffer_upper_cut_off[n - 1] < p->FFTbuffer_lower_cut_off[n - 1])
+                    p->FFTbuffer_upper_cut_off[n - 1] = p->FFTbuffer_lower_cut_off[n - 1] + 1;
+            }
+        }
+        // calculate actual cut off frequency
+        if (n < p->bass_cut_off_bar)
+            relative_cut_off[n] =
+                (float)(p->FFTbuffer_lower_cut_off[n]) / ((float)p->FFTbassbufferSize / 2);
+        else
+            relative_cut_off[n] =
+                (float)(p->FFTbuffer_lower_cut_off[n]) / ((float)p->FFTbufferSize / 2);
+
+        p->cut_off_frequency[n] = relative_cut_off[n] * ((float)p->rate / 2);
+    }
+
+    // hard coded eq
+    for (int n = 0; n < p->number_of_bars; n++) {
+
+        // the numbers that come out of the FFT are very high
+        // the EQ is used to "normalize" them by dividing with this very huge number
+        p->eq[n] = 1 / pow(2, 28);
+
+        // need to boost the EQ for higher frequencies
+        p->eq[n] *= pow(p->cut_off_frequency[n + 1], 0.85);
+
+        if (n < p->bass_cut_off_bar) {
+            p->eq[n] /= log2(p->FFTbassbufferSize);
+        } else {
+            p->eq[n] /= log2(p->FFTbufferSize);
+        }
+
+        p->eq[n] /= p->FFTbuffer_upper_cut_off[n] - p->FFTbuffer_lower_cut_off[n] + 1;
+    }
+    free(relative_cut_off);
+    return p;
+}
+
+void cava_execute(double *cava_in, int new_samples, double *cava_out, struct cava_plan *p) {
+
+    // do not overflow
+    if (new_samples > p->input_buffer_size) {
+        new_samples = p->input_buffer_size;
+    }
+
+    int silence = 1;
+    if (new_samples > 0) {
+        // process: approximate actual framerate. This will be off by +10% at 60 fps, but should be
+        // good enough for the autosens and smoothing algorithms to be adjusted accordingly if
+        // framerate is a lot more or less.
+        p->framerate -= p->framerate / 64.0;
+        p->framerate +=
+            (double)(p->rate * p->frame_skip) / (new_samples / p->audio_channels) / 64.0;
+        p->frame_skip = 1;
+
+        // shifting input buffer
+        for (int n = p->input_buffer_size - 1; n >= new_samples; n--) {
+            p->input_buffer[n] = p->input_buffer[n - new_samples];
+        }
+
+        // fill the input buffer
+        for (int n = 0; n < new_samples; n++) {
+            if (p->scaling_mode == CAVA_SCALING_DECIBEL) {
+                // Audio signals come in the range [-32768, 32768], normalize to [-1, 1].
+                p->input_buffer[new_samples - n - 1] = cava_in[n] / 32768.0;
+            } else {
+                p->input_buffer[new_samples - n - 1] = cava_in[n];
+            }
+            if (cava_in[n]) {
+                silence = 0;
+            }
+        }
+    } else {
+        p->frame_skip++;
+    }
+
+    // fill the bass, mid and treble buffers
+    for (int n = 0; n < p->FFTbassbufferSize; n++) {
+        if (p->audio_channels == 2) {
+            p->in_bass_r_raw[n] = p->input_buffer[n * 2];
+            p->in_bass_l_raw[n] = p->input_buffer[n * 2 + 1];
+        } else {
+            p->in_bass_l_raw[n] = p->input_buffer[n];
+        }
+    }
+    for (int n = 0; n < p->FFTbufferSize; n++) {
+        if (p->audio_channels == 2) {
+            p->in_r_raw[n] = p->input_buffer[n * 2];
+            p->in_l_raw[n] = p->input_buffer[n * 2 + 1];
+        } else {
+            p->in_l_raw[n] = p->input_buffer[n];
+        }
+    }
+
+    // Hann Window
+    for (int i = 0; i < p->FFTbassbufferSize; i++) {
+        p->in_bass_l[i] = p->bass_multiplier[i] * p->in_bass_l_raw[i];
+        if (p->audio_channels == 2)
+            p->in_bass_r[i] = p->bass_multiplier[i] * p->in_bass_r_raw[i];
+    }
+    for (int i = 0; i < p->FFTbufferSize; i++) {
+        p->in_l[i] = p->multiplier[i] * p->in_l_raw[i];
+        if (p->audio_channels == 2)
+            p->in_r[i] = p->multiplier[i] * p->in_r_raw[i];
+    }
+
+    // process: execute FFT and sort frequency bands
+
+    fftw_execute(p->p_bass_l);
+    fftw_execute(p->p_l);
+    if (p->audio_channels == 2) {
+        fftw_execute(p->p_bass_r);
+        fftw_execute(p->p_r);
+    }
+
+    // process: separate frequency bands
+    for (int n = 0; n < p->number_of_bars; n++) {
+
+        double temp_l = 0;
+        double temp_r = 0;
+
+        // process: add upp FFT values within bands
+        for (int i = p->FFTbuffer_lower_cut_off[n]; i <= p->FFTbuffer_upper_cut_off[n]; i++) {
+
+            if (n < p->bass_cut_off_bar) {
+                temp_l += hypot(p->out_bass_l[i][0], p->out_bass_l[i][1]);
+                if (p->audio_channels == 2)
+                    temp_r += hypot(p->out_bass_r[i][0], p->out_bass_r[i][1]);
+
+            } else {
+                temp_l += hypot(p->out_l[i][0], p->out_l[i][1]);
+                if (p->audio_channels == 2)
+                    temp_r += hypot(p->out_r[i][0], p->out_r[i][1]);
+            }
+        }
+
+        // getting average and applying configured scaling
+        if (p->scaling_mode == CAVA_SCALING_DECIBEL) {
+            const double max_db = 70;
+            temp_l = amplitude_to_decibels(temp_l) / max_db;
+            if (!isfinite(temp_l)) {
+                temp_l = 0;
+            }
+        } else {
+            temp_l *= p->eq[n];
+        }
+        cava_out[n] = temp_l;
+
+        if (p->audio_channels == 2) {
+            if (p->scaling_mode == CAVA_SCALING_DECIBEL) {
+                const double max_db = 70;
+                temp_r = amplitude_to_decibels(temp_r) / max_db;
+                if (!isfinite(temp_r)) {
+                    temp_r = 0;
+                }
+            } else {
+                temp_r *= p->eq[n];
+            }
+            cava_out[n + p->number_of_bars] = temp_r;
+        }
+    }
+
+    // applying sens or getting max value
+    if (p->autosens) {
+        for (int n = 0; n < p->number_of_bars * p->audio_channels; n++) {
+            cava_out[n] *= p->sens;
+        }
+    }
+    // process [smoothing]
+    int overshoot = 0;
+
+    double framerate_mod = 66 / p->framerate;
+    double gravity_mod = pow((framerate_mod), 2.5) * 2 / p->noise_reduction;
+    double integral_mod = pow((framerate_mod), 0.1);
+
+    for (int n = 0; n < p->number_of_bars * p->audio_channels; n++) {
+
+        // process [smoothing]: falloff
+
+        if (cava_out[n] < p->prev_cava_out[n] && p->noise_reduction > 0.1) {
+            cava_out[n] =
+                p->cava_peak[n] * (1.0 - (p->cava_fall[n] * p->cava_fall[n] * gravity_mod));
+
+            if (cava_out[n] < 0.0)
+                cava_out[n] = 0.0;
+            p->cava_fall[n] += 0.028;
+        } else {
+            p->cava_peak[n] = cava_out[n];
+            p->cava_fall[n] = 0.0;
+        }
+        p->prev_cava_out[n] = cava_out[n];
+
+        // process [smoothing]: integral
+        cava_out[n] = p->cava_mem[n] * p->noise_reduction / integral_mod + cava_out[n];
+
+        p->cava_mem[n] = cava_out[n];
+        if (p->autosens) {
+            // check if we overshoot target height
+            if (cava_out[n] > 1.0) {
+                overshoot = 1;
+                cava_out[n] = 1.0;
+            }
+        }
+    }
+
+    // calculating automatic sense adjustment
+    if (p->autosens) {
+        if (overshoot) {
+            p->sens = p->sens * (1 - (0.02 * framerate_mod));
+            p->sens_init = 0;
+        } else {
+            if (!silence) {
+                p->sens = p->sens * (1 + (0.001 * framerate_mod * p->autosens));
+                if (p->sens_init)
+                    p->sens = p->sens * (1 + (0.1 * framerate_mod));
+            }
+        }
+    }
+}
+
+void cava_destroy(struct cava_plan *p) {
+
+    free(p->input_buffer);
+    free(p->bass_multiplier);
+    free(p->multiplier);
+    free(p->eq);
+    free(p->cut_off_frequency);
+    free(p->FFTbuffer_lower_cut_off);
+    free(p->FFTbuffer_upper_cut_off);
+    free(p->cava_fall);
+    free(p->cava_mem);
+    free(p->cava_peak);
+    free(p->prev_cava_out);
+
+    fftw_free(p->in_bass_l);
+    fftw_free(p->in_bass_l_raw);
+    fftw_free(p->out_bass_l);
+    fftw_destroy_plan(p->p_bass_l);
+
+    fftw_free(p->in_l);
+    fftw_free(p->in_l_raw);
+    fftw_free(p->out_l);
+    fftw_destroy_plan(p->p_l);
+
+    if (p->audio_channels == 2) {
+        fftw_free(p->in_bass_r);
+        fftw_free(p->in_bass_r_raw);
+        fftw_free(p->out_bass_r);
+        fftw_destroy_plan(p->p_bass_r);
+
+        fftw_free(p->in_r);
+        fftw_free(p->out_r);
+        fftw_free(p->in_r_raw);
+        fftw_destroy_plan(p->p_r);
+    }
+}
+
+#ifdef __ANDROID__
+JNIEXPORT jfloatArray JNICALL Java_com_karlstav_cava_MyGLRenderer_InitCava(
+    JNIEnv *env, jobject thiz, jint number_of_bars_set, jint refresh_rate, jint lower_cut_off,
+    jint higher_cut_off) {
+    jfloatArray cuttOffFreq = (*env)->NewFloatArray(env, number_of_bars_set + 1);
+    float noise_reduction = pow((float)refresh_rate / 130, 0.75);
+
+    plan = cava_init(number_of_bars_set, 44100, 1, 1, noise_reduction, lower_cut_off,
+                     higher_cut_off, CAVA_SCALING_LINEAR);
+    cava_in = (double *)malloc(plan->FFTbassbufferSize * sizeof(double));
+    cava_out = (double *)malloc(plan->number_of_bars * sizeof(double));
+    (*env)->SetFloatArrayRegion(env, cuttOffFreq, 0, plan->number_of_bars + 1,
+                                plan->cut_off_frequency);
+    return cuttOffFreq;
+}
+
+JNIEXPORT jdoubleArray JNICALL Java_com_karlstav_cava_MyGLRenderer_ExecCava(JNIEnv *env,
+                                                                            jobject thiz,
+                                                                            jdoubleArray cava_input,
+                                                                            jint new_samples) {
+
+    jdoubleArray cavaReturn = (*env)->NewDoubleArray(env, plan->number_of_bars);
+
+    cava_in = (*env)->GetDoubleArrayElements(env, cava_input, NULL);
+
+    cava_execute(cava_in, new_samples, cava_out, plan);
+    (*env)->SetDoubleArrayRegion(env, cavaReturn, 0, plan->number_of_bars, cava_out);
+    (*env)->ReleaseDoubleArrayElements(env, cava_input, cava_in, JNI_ABORT);
+
+    return cavaReturn;
+}
+
+JNIEXPORT int JNICALL Java_com_karlstav_cava_CavaCoreTest_InitCava(JNIEnv *env, jobject thiz,
+                                                                   jint number_of_bars_set) {
+
+    plan = cava_init(number_of_bars_set, 44100, 1, 1, 0.7, 50, 10000, CAVA_SCALING_LINEAR);
+    return 1;
+}
+
+JNIEXPORT jdoubleArray JNICALL Java_com_karlstav_cava_CavaCoreTest_ExecCava(JNIEnv *env,
+                                                                            jobject thiz,
+                                                                            jdoubleArray cava_input,
+                                                                            jint new_samples) {
+
+    jdoubleArray cavaReturn = (*env)->NewDoubleArray(env, plan->number_of_bars);
+
+    cava_in = (*env)->GetDoubleArrayElements(env, cava_input, NULL);
+
+    cava_execute(cava_in, new_samples, cava_out, plan);
+    (*env)->SetDoubleArrayRegion(env, cavaReturn, 0, plan->number_of_bars, cava_out);
+    (*env)->ReleaseDoubleArrayElements(env, cava_input, cava_in, JNI_ABORT);
+
+    return cavaReturn;
+}
+JNIEXPORT void JNICALL Java_com_karlstav_cava_MyGLRenderer_DestroyCava(JNIEnv *env, jobject thiz) {
+    cava_destroy(plan);
+}
+#endif

cava/cavacore.h

@@ -0,0 +1,139 @@
+/*
+Copyright (c) 2022 Karl Stavestrand <karl@stavestrand.no>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+*/
+#ifdef __cplusplus
+extern "C" {
+#endif
+#pragma once
+#include <stdint.h>
+
+#include <fftw3.h>
+
+#define CAVA_SCALING_LINEAR 0
+#define CAVA_SCALING_DECIBEL 1
+
+// cava_plan, parameters used internally by cavacore, do not modify these directly
+// only the cut off frequencies is of any potential interest to read out,
+// the rest should most likely be hidden somehow
+struct cava_plan {
+    int FFTbassbufferSize;
+    int FFTbufferSize;
+    int number_of_bars;
+    int audio_channels;
+    int input_buffer_size;
+    int rate;
+    int bass_cut_off_bar;
+    int sens_init;
+    int autosens;
+    int frame_skip;
+    int status;
+    int scaling_mode;
+    char error_message[1024];
+
+    double sens;
+    double framerate;
+    double noise_reduction;
+
+    fftw_plan p_bass_l, p_bass_r;
+    fftw_plan p_l, p_r;
+
+    fftw_complex *out_bass_l, *out_bass_r;
+    fftw_complex *out_l, *out_r;
+
+    double *bass_multiplier;
+    double *multiplier;
+
+    double *in_bass_r_raw, *in_bass_l_raw;
+    double *in_r_raw, *in_l_raw;
+    double *in_bass_r, *in_bass_l;
+    double *in_r, *in_l;
+    double *prev_cava_out, *cava_mem;
+    double *input_buffer, *cava_peak;
+
+    double *eq;
+
+    float *cut_off_frequency;
+    int *FFTbuffer_lower_cut_off;
+    int *FFTbuffer_upper_cut_off;
+    double *cava_fall;
+};
+
+// cava_init, initialize visualization, takes the following parameters:
+
+// number_of_bars, number of wanted bars per channel
+
+// rate, sample rate of input signal
+
+// channels, number of interleaved channels in input
+
+// autosens, toggle automatic sensitivity adjustment 1 = on, 0 = off
+// on, gives a dynamically adjusted output signal from 0 to 1
+// the output is continuously adjusted to use the entire range
+// off, will pass the raw values from cava directly to the output
+// the max values will then be dependent on the input
+
+// noise_reduction, adjust noise reduction filters. 0 - 1, recommended 0.77
+// the raw visualization is very noisy, this factor adjusts the integral
+// and gravity filters inside cavacore to keep the signal smooth
+// 1 will be very slow and smooth, 0 will be fast but noisy.
+
+// low_cut_off, high_cut_off cut off frequencies for visualization in Hz
+// recommended: 50, 10000
+
+// scaling_mode, output scaling mode:
+// CAVA_SCALING_LINEAR = legacy linear scaling
+// CAVA_SCALING_DECIBEL = dB-based logarithmic scaling
+
+// returns a cava_plan to be used by cava_execute. If cava_plan.status is 0 all is OK.
+// If cava_plan.status is -1, cava_init was called with an illegal parameter, see error string in
+// cava_plan.error_message
+extern struct cava_plan *cava_init(int number_of_bars, unsigned int rate, int channels,
+                                   int autosens, double noise_reduction, int low_cut_off,
+                                   int high_cut_off, int scaling_mode);
+
+// cava_execute, executes visualization
+
+// cava_in, input buffer can be any size. internal buffers in cavacore is
+// 4096 * number of channels at 44100 samples rate, if new_samples is greater
+// then samples will be discarded. However it is recommended to use less
+// new samples per execution as this determines your framerate.
+// 512 samples at 44100 sample rate mono, gives about 86 frames per second.
+
+// new_samples, the number of samples in cava_in to be processed per execution
+// in case of async reading of data this number is allowed to vary from execution to execution
+
+// cava_out, output buffer. Size must be number of bars * number of channels. Bars will
+// be sorted from lowest to highest frequency. If stereo input channels are configured
+// then all left channel bars will be first then the right.
+
+// plan, the cava_plan struct returned from cava_init
+
+// cava_execute assumes cava_in samples to be interleaved if more than one channel
+// only up to two channels are supported.
+extern void cava_execute(double *cava_in, int new_samples, double *cava_out,
+                         struct cava_plan *plan);
+
+// cava_destroy, destroys the plan, frees up memory
+extern void cava_destroy(struct cava_plan *plan);
+
+#ifdef __cplusplus
+}
+#endif

discover/featured.json

@@ -0,0 +1,547 @@
+{
+  "version": 3,
+  "podcasts": [
+    {
+      "id": "discover-daily",
+      "title": "The Daily",
+      "description": "This is how the news should sound. Twenty minutes a day, five days a week, hosted by Michael Barbaro and Sabrina Tavernise. Powered by New York Times journalism.",
+      "feedUrl": "http://rss.art19.com/the-daily",
+      "author": "The New York Times",
+      "categories": [
+        "News & Politics"
+      ]
+    },
+    {
+      "id": "discover-up-first",
+      "title": "Up First",
+      "description": "NPR's Up First covers the three biggest stories of the day, with reporting and analysis from NPR News — in 10 minutes.",
+      "feedUrl": "https://feeds.npr.org/510318/podcast.xml",
+      "author": "NPR",
+      "categories": [
+        "News & Politics"
+      ]
+    },
+    {
+      "id": "discover-npr-politics",
+      "title": "The NPR Politics Podcast",
+      "description": "Where everyone gathers for the political conversation of the day. NPR's political reporters talk through the biggest news of the week.",
+      "feedUrl": "https://feeds.npr.org/510310/podcast.xml",
+      "author": "NPR",
+      "categories": [
+        "News & Politics"
+      ]
+    },
+    {
+      "id": "discover-ben-shapiro",
+      "title": "The Ben Shapiro Show",
+      "description": "Ben Shapiro delivers unapologetically conservative commentary on the biggest news stories of the day, blending sharp analysis with his trademark fact-based approach.",
+      "feedUrl": "https://feeds.megaphone.fm/benshow",
+      "author": "The Daily Wire",
+      "categories": [
+        "News & Politics"
+      ]
+    },
+    {
+      "id": "discover-advisory-opinions",
+      "title": "Advisory Opinions",
+      "description": "Host Sarah Isgur and permanent guest David French have twice-weekly conversations about the law, the courts, their collision with politics, and why it all matters — from The Dispatch.",
+      "feedUrl": "https://feeds.megaphone.fm/DISPME4573820108",
+      "author": "The Dispatch",
+      "categories": [
+        "News & Politics"
+      ]
+    },
+    {
+      "id": "discover-crime-junkie",
+      "title": "Crime Junkie",
+      "description": "Crime Junkie satisfies true crime cravings with host Ashley Flowers' obsessed yet accessible approach to real-life mysteries — from unsolved murders to missing persons.",
+      "feedUrl": "https://feeds.simplecast.com/qm_9xx0g",
+      "author": "audiochuck",
+      "categories": [
+        "True Crime"
+      ]
+    },
+    {
+      "id": "discover-serial",
+      "title": "Serial",
+      "description": "Serial Productions makes narrative podcasts that have transformed the medium. From the team that brought you the original Serial, one of the most influential podcasts of all time.",
+      "feedUrl": "https://feeds.simplecast.com/PpzWFGhg",
+      "author": "Serial Productions & The New York Times",
+      "categories": [
+        "True Crime",
+        "Storytelling"
+      ]
+    },
+    {
+      "id": "discover-intelligence-matters",
+      "title": "Intelligence Matters",
+      "description": "A deep dive into national security, intelligence, and foreign policy with top former officials and experts hosted by CBS News senior correspondent.",
+      "feedUrl": "https://rss.art19.com/intelligence-matters",
+      "author": "CBS News",
+      "categories": [
+        "True Crime",
+        "News & Politics"
+      ]
+    },
+    {
+      "id": "discover-smartless",
+      "title": "SmartLess",
+      "description": "Jason Bateman, Sean Hayes, and Will Arnett bring you unscripted conversations with surprise celebrity guests — each episode one host reveals the guest to the others.",
+      "feedUrl": "https://rss.art19.com/smartless",
+      "author": "Jason Bateman, Sean Hayes, Will Arnett",
+      "categories": [
+        "Comedy",
+        "Entertainment"
+      ]
+    },
+    {
+      "id": "discover-this-past-weekend",
+      "title": "This Past Weekend w/ Theo Von",
+      "description": "Comedian Theo Von's uniquely southern perspective blends heartfelt vulnerability and offbeat humor in conversations ranging from celebrity interviews to solo musings.",
+      "feedUrl": "https://feeds.megaphone.fm/thispastweekend",
+      "author": "Theo Von",
+      "categories": [
+        "Comedy"
+      ]
+    },
+    {
+      "id": "discover-joe-rogan",
+      "title": "The Joe Rogan Experience",
+      "description": "The official podcast of comedian Joe Rogan. Long-form conversations with guests from every corner of culture, science, comedy, and beyond.",
+      "feedUrl": "https://feeds.megaphone.fm/GLT1412515089",
+      "author": "Joe Rogan",
+      "categories": [
+        "Comedy",
+        "Entertainment"
+      ]
+    },
+    {
+      "id": "discover-comedy-bang-bang",
+      "title": "Comedy Bang Bang: The Podcast",
+      "description": "A weekly comedy podcast hosted by Scott Aukerman featuring improv, games, and hilarious conversations with celebrities and the world's best comedians.",
+      "feedUrl": "https://rss.art19.com/comedy-bang-bang",
+      "author": "Earwolf",
+      "categories": [
+        "Comedy"
+      ]
+    },
+    {
+      "id": "discover-office-ladies",
+      "title": "Office Ladies",
+      "description": "The Office stars Jenna Fischer and Angela Kinsey break down each episode of The Office with behind-the-scenes stories, fun facts, and fan Q&A.",
+      "feedUrl": "https://rss.art19.com/office-ladies",
+      "author": "Earwolf",
+      "categories": [
+        "Comedy",
+        "Entertainment"
+      ]
+    },
+    {
+      "id": "discover-how-did-this-get-made",
+      "title": "How Did This Get Made?",
+      "description": "Comedians Paul Scheer, June Diane Raphael, and Jason Mantzoukas break down the very best of the worst films ever made — blockbuster flops, cult classics, and Nic Cage movies.",
+      "feedUrl": "https://rss.art19.com/how-did-this-get-made",
+      "author": "Earwolf",
+      "categories": [
+        "Comedy",
+        "Film"
+      ]
+    },
+    {
+      "id": "discover-wait-wait",
+      "title": "Wait Wait... Don't Tell Me!",
+      "description": "NPR's weekly news quiz show. Test your knowledge against the week's biggest news, with panelists and celebrity guests competing in hilarious trivia.",
+      "feedUrl": "https://feeds.npr.org/344098539/podcast.xml",
+      "author": "NPR",
+      "categories": [
+        "Comedy",
+        "News & Politics"
+      ]
+    },
+    {
+      "id": "discover-new-heights",
+      "title": "New Heights with Jason & Travis Kelce",
+      "description": "Football's funniest family duo — Super Bowl champions Jason and Travis Kelce — drop weekly insights about the NFL and share inside perspectives on sports headlines.",
+      "feedUrl": "https://rss.art19.com/new-heights",
+      "author": "Jason & Travis Kelce",
+      "categories": [
+        "Sports",
+        "Comedy"
+      ]
+    },
+    {
+      "id": "discover-bill-simmons",
+      "title": "The Bill Simmons Podcast",
+      "description": "Bill Simmons and his cadre of opinionated guests discuss sports, pop culture, and everything in between on The Ringer's flagship podcast.",
+      "feedUrl": "https://rss.art19.com/the-bill-simmons-podcast",
+      "author": "The Ringer",
+      "categories": [
+        "Sports",
+        "Entertainment"
+      ]
+    },
+    {
+      "id": "discover-acquired",
+      "title": "Acquired",
+      "description": "Acquired tells the stories and strategies of the world's greatest companies. Each episode is a deep dive into a single company's history and the playbooks behind its success.",
+      "feedUrl": "https://feeds.transistor.fm/acquired",
+      "author": "Ben Gilbert & David Rosenthal",
+      "categories": [
+        "Business",
+        "Technology"
+      ]
+    },
+    {
+      "id": "discover-all-in",
+      "title": "All-In Podcast",
+      "description": "Four tech industry veterans share their unfiltered perspectives on technology, economics, politics, and culture. Insightful, opinionated, and occasionally controversial.",
+      "feedUrl": "https://allinchamathjason.libsyn.com/rss",
+      "author": "Chamath Palihapitiya, Jason Calacanis, David Sacks & David Friedberg",
+      "categories": [
+        "Business",
+        "Technology",
+        "Politics"
+      ]
+    },
+    {
+      "id": "discover-planet-money",
+      "title": "Planet Money",
+      "description": "The economy explained. NPR's Planet Money breaks down the economy with creative storytelling that makes sense of a complicated, ever-changing world.",
+      "feedUrl": "https://feeds.npr.org/510289/podcast.xml",
+      "author": "NPR",
+      "categories": [
+        "Business",
+        "Economics"
+      ]
+    },
+    {
+      "id": "discover-how-i-built-this",
+      "title": "How I Built This with Guy Raz",
+      "description": "Guy Raz interviews the world's best-known entrepreneurs to learn how they built their iconic brands. A master-class on innovation, creativity, and leadership.",
+      "feedUrl": "https://feeds.npr.org/510313/podcast.xml",
+      "author": "NPR / Wondery",
+      "categories": [
+        "Business",
+        "Technology"
+      ]
+    },
+    {
+      "id": "discover-freakonomics",
+      "title": "Freakonomics Radio",
+      "description": "Discover the hidden side of everything with Stephen Dubner. Each episode explores the riddles of everyday life using the tools of economics.",
+      "feedUrl": "https://feeds.feedburner.com/freakonomicsradio",
+      "author": "Stephen J. Dubner",
+      "categories": [
+        "Business",
+        "Economics",
+        "Society"
+      ]
+    },
+    {
+      "id": "discover-darknet-diaries",
+      "title": "Darknet Diaries",
+      "description": "True stories from the dark side of the Internet. Host Jack Rhysider investigates hacks, data breaches, cybercrime, and digital espionage with rigorous journalism and captivating storytelling.",
+      "feedUrl": "https://podcast.darknetdiaries.com/",
+      "author": "Jack Rhysider",
+      "categories": [
+        "Technology",
+        "True Crime"
+      ]
+    },
+    {
+      "id": "discover-changelog",
+      "title": "The Changelog",
+      "description": "Software's best weekly news brief, deep technical interviews, and talk show. Conversations with the hackers, leaders, and innovators of the open source and software world.",
+      "feedUrl": "https://changelog.fm/rss",
+      "author": "Changelog Media",
+      "categories": [
+        "Technology",
+        "Software Engineering"
+      ]
+    },
+    {
+      "id": "discover-twit",
+      "title": "This Week in Tech (TWiT)",
+      "description": "Your first podcast of the week, the last word in tech. Leo Laporte and a rotating panel of tech experts discuss the week's biggest tech news.",
+      "feedUrl": "https://feeds.twit.tv/twit.xml",
+      "author": "TWiT",
+      "categories": [
+        "Technology"
+      ]
+    },
+    {
+      "id": "discover-radiolab",
+      "title": "Radiolab",
+      "description": "Radiolab is on a curiosity bender. Each episode weaves together science, legal history, and deeply human stories with innovative sound design. Hosted by Lulu Miller and Latif Nasser.",
+      "feedUrl": "http://feeds.wnyc.org/radiolab",
+      "author": "WNYC Studios",
+      "categories": [
+        "Science",
+        "Storytelling"
+      ]
+    },
+    {
+      "id": "discover-huberman-lab",
+      "title": "Huberman Lab",
+      "description": "Regularly ranked as the #1 health podcast in the world. Dr. Andrew Huberman discusses science and science-based tools for everyday life: sleep, focus, fitness, and performance.",
+      "feedUrl": "https://feeds.megaphone.fm/hubermanlab",
+      "author": "Scicomm Media",
+      "categories": [
+        "Health",
+        "Science"
+      ]
+    },
+    {
+      "id": "discover-skeptics-guide",
+      "title": "The Skeptics' Guide to the Universe",
+      "description": "Your guide to reality. A weekly science and critical thinking podcast that explores myths, conspiracies, pseudoscience, and the latest scientific discoveries — with a skeptical eye.",
+      "feedUrl": "https://feeds.feedburner.com/TheSkepticsGuideToTheUniverse",
+      "author": "Steven Novella",
+      "categories": [
+        "Science",
+        "Philosophy"
+      ]
+    },
+    {
+      "id": "discover-throughline",
+      "title": "Throughline",
+      "description": "The past is never past. NPR's Throughline travels beyond the headlines to answer the question 'How did we get here?' Each episode brings history to life from ancient civilizations to forgotten figures.",
+      "feedUrl": "https://feeds.npr.org/510333/podcast.xml",
+      "author": "NPR",
+      "categories": [
+        "History",
+        "Politics"
+      ]
+    },
+    {
+      "id": "discover-hardcore-history",
+      "title": "Dan Carlin's Hardcore History",
+      "description": "In Hardcore History, journalist and broadcaster Dan Carlin applies his unorthodox, 'Martian' way of thinking to the past. Multi-hour deep dives into pivotal events that blend high drama with masterful narration.",
+      "feedUrl": "https://feeds.feedburner.com/dancarlin/history",
+      "author": "Dan Carlin",
+      "categories": [
+        "History"
+      ]
+    },
+    {
+      "id": "discover-history-of-rome",
+      "title": "The History of Rome",
+      "description": "A weekly chronological podcast tracing the entire history of Rome, from its mythical founding to the fall of the Western Empire. A masterclass in narrative history.",
+      "feedUrl": "https://feeds.feedburner.com/TheHistoryOfRome",
+      "author": "Mike Duncan",
+      "categories": [
+        "History"
+      ]
+    },
+    {
+      "id": "discover-philosophize-this",
+      "title": "Philosophize This!",
+      "description": "Stephen West walks through the entire history of philosophy chronologically, from the pre-Socratics to contemporary thinkers. Making profound ideas accessible without dumbing them down.",
+      "feedUrl": "https://philosophizethis.libsyn.com/rss",
+      "author": "Stephen West",
+      "categories": [
+        "Philosophy",
+        "Education"
+      ]
+    },
+    {
+      "id": "discover-very-bad-wizards",
+      "title": "Very Bad Wizards",
+      "description": "A philosopher (Tamler Sommers) and a psychologist (David Pizarro) discuss human nature, ethics, free will, and whatever movie they just watched. Irreverent, insightful, and intellectually honest.",
+      "feedUrl": "https://feeds.libsyn.com/474285/rss",
+      "author": "Tamler Sommers & David Pizarro",
+      "categories": [
+        "Philosophy",
+        "Science"
+      ]
+    },
+    {
+      "id": "discover-big-picture",
+      "title": "The Big Picture",
+      "description": "The Ringer's Sean Fennessey and Amanda Dobbins discuss the week in movies, TV, and streaming — from box office analysis to what's worth your time.",
+      "feedUrl": "https://rss.art19.com/the-big-picture",
+      "author": "The Ringer",
+      "categories": [
+        "Film",
+        "Entertainment"
+      ]
+    },
+    {
+      "id": "discover-all-songs-considered",
+      "title": "All Songs Considered",
+      "description": "NPR's flagship music discovery podcast, delivering the best new releases every week across indie rock, jazz, electronic, and everything in between. Discover music you wouldn't stumble across on your own.",
+      "feedUrl": "https://feeds.npr.org/510019/podcast.xml",
+      "author": "NPR Music",
+      "categories": [
+        "Music"
+      ]
+    },
+    {
+      "id": "discover-switched-on-pop",
+      "title": "Switched on Pop",
+      "description": "Musicologist Nate Sloan and songwriter Charlie Harding explain why pop music sounds the way it does — pulling apart chord progressions, production tricks, and cultural trends with zero snobbery.",
+      "feedUrl": "https://feeds.megaphone.fm/switchedonpop",
+      "author": "Vox Media / Panoply",
+      "categories": [
+        "Music"
+      ]
+    },
+    {
+      "id": "discover-hit-parade",
+      "title": "Hit Parade",
+      "description": "Slate's Chris Molanphy traces how songs and genres conquered the Billboard charts, weaving chart history, cultural context, and pure trivia into each episode.",
+      "feedUrl": "https://feeds.megaphone.fm/hitparade",
+      "author": "Slate",
+      "categories": [
+        "Music",
+        "History"
+      ]
+    },
+    {
+      "id": "discover-song-exploder",
+      "title": "Song Exploder",
+      "description": "Musicians take apart their songs, piece by piece, and tell the story of how they were made. Past guests include Billie Eilish, Fleetwood Mac, and Lin-Manuel Miranda.",
+      "feedUrl": "https://songexploder.net/rss",
+      "author": "Hrishikesh Hirway",
+      "categories": [
+        "Music",
+        "Arts"
+      ]
+    },
+    {
+      "id": "discover-blank-check",
+      "title": "Blank Check with Griffin & David",
+      "description": "Reviews of directors' complete filmographies, episode by episode. Specifically, auteurs whose early successes afforded them the rare 'blank check' from Hollywood. Painstakingly hilarious detail.",
+      "feedUrl": "https://audioboom.com/channels/4278829.rss",
+      "author": "Griffin Newman & David Sims",
+      "categories": [
+        "Film",
+        "Comedy"
+      ]
+    },
+    {
+      "id": "discover-99-invisible",
+      "title": "99% Invisible",
+      "description": "A sound-rich, narrative podcast about all the thought that goes into the things we don't think about — the unnoticed architecture and design that shape our world. Hosted by Roman Mars.",
+      "feedUrl": "https://feeds.simplecast.com/BqbsxVfO",
+      "author": "Roman Mars",
+      "categories": [
+        "Design",
+        "Arts",
+        "Culture"
+      ]
+    },
+    {
+      "id": "discover-gastropod",
+      "title": "Gastropod",
+      "description": "Food with a side of science and history. Co-hosts Cynthia Graber and Nicola Twilley explore the hidden history and surprising science behind a different food or farming topic every other week.",
+      "feedUrl": "https://gastropod.com/feed",
+      "author": "Cynthia Graber & Nicola Twilley",
+      "categories": [
+        "Food",
+        "Science",
+        "History"
+      ]
+    },
+    {
+      "id": "discover-this-american-life",
+      "title": "This American Life",
+      "description": "Hosted by Ira Glass, each episode weaves together stories around a single theme. Combining investigative reporting with intimate personal narratives, it sets the gold standard for audio storytelling.",
+      "feedUrl": "https://www.thisamericanlife.org/podcast/rss.xml",
+      "author": "This American Life",
+      "categories": [
+        "Storytelling",
+        "Culture"
+      ]
+    },
+    {
+      "id": "discover-ted-talks-daily",
+      "title": "TED Talks Daily",
+      "description": "Thought-provoking ideas on every subject imaginable from the world's leading thinkers and creators. A new TED Talk every weekday.",
+      "feedUrl": "https://feeds.feedburner.com/TEDTalks_audio",
+      "author": "TED",
+      "categories": [
+        "Education",
+        "Storytelling"
+      ]
+    },
+    {
+      "id": "discover-tim-ferriss",
+      "title": "The Tim Ferriss Show",
+      "description": "Tim Ferriss deconstructs world-class performers — from billionaires to chess prodigies to athletes — to extract the tools, tactics, and routines you can apply to your own life.",
+      "feedUrl": "https://rss.art19.com/tim-ferriss-show",
+      "author": "Tim Ferriss",
+      "categories": [
+        "Self-Improvement",
+        "Business"
+      ]
+    },
+    {
+      "id": "discover-jordan-harbinger",
+      "title": "The Jordan Harbinger Show",
+      "description": "In-depth conversations with fascinating minds — from Ray Dalio to arms traffickers. Jordan Harbinger unpacks guests' wisdom into practical nuggets for work, life, and relationships.",
+      "feedUrl": "https://rss.art19.com/the-jordan-harbinger-show",
+      "author": "Jordan Harbinger",
+      "categories": [
+        "Self-Improvement"
+      ]
+    },
+    {
+      "id": "discover-on-purpose",
+      "title": "On Purpose with Jay Shetty",
+      "description": "Jay Shetty hosts conversations and workshops designed to make you happier, healthier, and more healed. Interviews with experts, celebrities, and thought leaders on mindset and habit-building.",
+      "feedUrl": "https://rss.art19.com/on-purpose-with-jay-shetty",
+      "author": "Jay Shetty",
+      "categories": [
+        "Self-Improvement",
+        "Health"
+      ]
+    },
+    {
+      "id": "discover-10-percent-happier",
+      "title": "10% Happier with Dan Harris",
+      "description": "Self-help for the skeptical. ABC News anchor Dan Harris explores meditation and mindfulness with scientists, monks, and teachers, born from his own panic attack on live TV.",
+      "feedUrl": "https://rss.art19.com/ten-percent-happier",
+      "author": "Dan Harris",
+      "categories": [
+        "Self-Improvement",
+        "Health",
+        "Philosophy"
+      ]
+    },
+    {
+      "id": "discover-school-of-greatness",
+      "title": "The School of Greatness",
+      "description": "Former pro athlete Lewis Howes interviews successful people across business, sports, science, and literature to help you unlock your inner greatness and live your best life.",
+      "feedUrl": "https://rss.art19.com/the-school-of-greatness",
+      "author": "Lewis Howes",
+      "categories": [
+        "Self-Improvement",
+        "Business"
+      ]
+    },
+    {
+      "id": "discover-sysk",
+      "title": "Stuff You Should Know",
+      "description": "If you've ever wanted to know about champagne, satanism, the Stonewall Uprising, chaos theory, LSD, El Nino, true crime or Roswell — Josh and Chuck have got you covered.",
+      "feedUrl": "https://www.omnycontent.com/d/playlist/e73c998e-6e60-432f-8610-ae210140c5b1/A91018A4-EA4F-4130-BF55-AE270180C327/44710ECC-10BB-48D1-93C7-AE270180C33E/podcast.rss",
+      "author": "iHeartPodcasts (Josh Clark & Chuck Bryant)",
+      "categories": [
+        "Education",
+        "Comedy"
+      ]
+    },
+    {
+      "id": "discover-in-our-time",
+      "title": "In Our Time",
+      "description": "Melvyn Bragg and guests on BBC Radio 4 discuss the history of ideas — from the Peloponnesian War to the science of photography. A weekly graduate seminar in audio form since 1998.",
+      "feedUrl": "https://podcasts.files.bbci.co.uk/b006qykl.rss",
+      "author": "BBC Radio 4",
+      "categories": [
+        "History",
+        "Education",
+        "Philosophy"
+      ]
+    }
+  ]
+}

package.json

@@ -1,5 +1,6 @@
 {
   "name": "podcast-tui-app",
+  "version": "0.1.0",
   "module": "src/index.tsx",
   "type": "module",
   "private": true,
@@ -7,30 +8,23 @@
     "podtui": "./dist/index.js"
   },
   "scripts": {
-    "start": "bun src/index.tsx",
-    "dev": "bun --watch src/index.tsx",
+    "start": "bun --preload @opentui/solid/preload src/index.tsx",
+    "dev": "bun --preload @opentui/solid/preload --watch src/index.tsx",
+    "build:native": "bash scripts/build-cavacore.sh",
     "build": "bun run build.ts",
     "dist": "bun dist/index.js",
     "test": "bun test",
-    "lint": "bun run lint.ts"
+    "lint": "bun tsc --noEmit"
   },
   "devDependencies": {
     "@types/bun": "latest",
-    "@types/uuid": "^11.0.0",
-    "@typescript-eslint/eslint-plugin": "^8.54.0",
-    "@typescript-eslint/parser": "^8.54.0",
-    "eslint": "^9.39.2",
     "typescript": "^5.9.3"
   },
   "dependencies": {
-    "@babel/core": "^7.28.5",
-    "@babel/preset-typescript": "^7.28.5",
     "@opentui/core": "^0.1.77",
     "@opentui/solid": "^0.1.77",
-    "babel-preset-solid": "1.9.9",
     "date-fns": "^4.1.0",
-    "solid-js": "^1.9.11",
-    "uuid": "^13.0.0",
-    "zustand": "^5.0.11"
+    "effect": "^3",
+    "solid-js": "^1.9.9"
   }
 }

packaging/aur/.SRCINFO

@@ -0,0 +1,41 @@
+pkgbase = podtui-bin
+	pkgdesc = Terminal podcast and audio player with synchronized audio-waveform visualization
+	pkgver = 0.2.0
+	pkgrel = 1
+	url = https://github.com/mikefreno/podtui
+	arch = x86_64
+	arch = aarch64
+	license = MIT
+	depends = mpv
+	provides = podtui
+	conflicts = podtui
+	options = !strip
+	source_x86_64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/podtui-linux-x64.tar.gz
+	source_x86_64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/LICENSE
+	sha256sums_x86_64 = 5c2be309341bda9550ad7669b48d3f46341c687234ddfaa0c84a6a9177f049fc
+	sha256sums_x86_64 = 106a1290f2b9942a43785938cc8ccb1f72cf360babc58316f8d7feee829e98fc
+	source_aarch64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/podtui-linux-arm64.tar.gz
+	source_aarch64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/LICENSE
+	sha256sums_aarch64 = c9c22d3a18cd192f89fbd5ff712d3502c4de0cce7550156c6a0d48d76e56e0d5
+	sha256sums_aarch64 = 106a1290f2b9942a43785938cc8ccb1f72cf360babc58316f8d7feee829e98fc
+
+pkgname = podtui-bin
+	pkgver = 0.2.0
+	pkgrel = 1
+	url = https://github.com/mikefreno/podtui
+	pkgdesc = Terminal podcast and audio player with synchronized audio-waveform visualization
+	arch = x86_64
+	arch = aarch64
+	license = MIT
+	depends = mpv
+	provides = podtui
+	conflicts = podtui
+	options = !strip
+	source_x86_64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/podtui-linux-x64.tar.gz
+	source_x86_64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/LICENSE
+	sha256sums_x86_64 = 5c2be309341bda9550ad7669b48d3f46341c687234ddfaa0c84a6a9177f049fc
+	sha256sums_x86_64 = 106a1290f2b9942a43785938cc8ccb1f72cf360babc58316f8d7feee829e98fc
+	source_aarch64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/podtui-linux-arm64.tar.gz
+	source_aarch64 = https://github.com/mikefreno/podtui/releases/download/v0.2.0/LICENSE
+	sha256sums_aarch64 = c9c22d3a18cd192f89fbd5ff712d3502c4de0cce7550156c6a0d48d76e56e0d5
+	sha256sums_aarch64 = 106a1290f2b9942a43785938cc8ccb1f72cf360babc58316f8d7feee829e98fc

packaging/aur/PKGBUILD

@@ -0,0 +1,63 @@
+# Maintainer: Michael Freno <michael.freno@gmail.com>
+# Contributor: Michael Freno <michael.freno@gmail.com>
+# podtui-bin — TUI podcast/audiobook player with synchronized audio-waveform
+# visualization. Serves the official standalone release binary and its two FFI
+# sibling libraries (libcavacore.so + libopentui.so) from GitHub Releases.
+#
+# The embedded Bun runtime is statically linked into the binary — no Bun, no
+# fftw needed at runtime (fftw3 is linked statically into libcavacore.so).
+
+pkgname=podtui-bin
+_pkgname=podtui
+pkgver=0.2.0
+pkgrel=1
+pkgdesc="Terminal podcast and audio player with synchronized audio-waveform visualization"
+url="https://github.com/mikefreno/podtui"
+arch=('x86_64' 'aarch64')
+license=('MIT')
+depends=('mpv')                             # sole audio backend; no-op without it
+provides=("${_pkgname}")
+conflicts=("${_pkgname}")
+options=('!strip')                          # standalone binary, pre-minified
+source_x86_64=(
+	"https://github.com/mikefreno/podtui/releases/download/v${pkgver}/podtui-linux-x64.tar.gz"
+	"https://github.com/mikefreno/podtui/releases/download/v${pkgver}/LICENSE"
+)
+source_aarch64=(
+	"https://github.com/mikefreno/podtui/releases/download/v${pkgver}/podtui-linux-arm64.tar.gz"
+	"https://github.com/mikefreno/podtui/releases/download/v${pkgver}/LICENSE"
+)
+sha256sums_x86_64=(
+	'5c2be309341bda9550ad7669b48d3f46341c687234ddfaa0c84a6a9177f049fc'
+	'106a1290f2b9942a43785938cc8ccb1f72cf360babc58316f8d7feee829e98fc'
+)
+sha256sums_aarch64=(
+	'c9c22d3a18cd192f89fbd5ff712d3502c4de0cce7550156c6a0d48d76e56e0d5'
+	'106a1290f2b9942a43785938cc8ccb1f72cf360babc58316f8d7feee829e98fc'
+)
+
+package() {
+	local libdir
+
+	case "$CARCH" in
+	x86_64) libdir="podtui-linux-x64" ;;
+	aarch64) libdir="podtui-linux-arm64" ;;
+	esac
+
+	# Binary + native FFI libs must stay side by side in /usr/lib/podtui/;
+	# a /usr/bin symlink works because the embedded Bun runtime resolves
+	# process.execPath through symlinks (verified against the compiled binary).
+	install -Dm755 "${srcdir}/${libdir}/podtui" "${pkgdir}/usr/lib/podtui/podtui"
+	install -Dm644 "${srcdir}/${libdir}/libcavacore.so" "${pkgdir}/usr/lib/podtui/libcavacore.so"
+	install -Dm644 "${srcdir}/${libdir}/libopentui.so" "${pkgdir}/usr/lib/podtui/libopentui.so"
+	ln -s /usr/lib/podtui/podtui "${pkgdir}/usr/bin/podtui"
+
+	# App icon + desktop entry ship inside the release tarball; Terminal=true
+	# makes launchers drop the TUI into a terminal window.
+	install -Dm644 "${srcdir}/${libdir}/podtui.png" \
+		"${pkgdir}/usr/share/icons/hicolor/512x512/apps/podtui.png"
+	install -Dm644 "${srcdir}/${libdir}/podtui.desktop" \
+		"${pkgdir}/usr/share/applications/podtui.desktop"
+
+	install -Dm644 "${srcdir}/LICENSE" "${pkgdir}/usr/share/licenses/${pkgname}/LICENSE"
+}

packaging/aur/gen-srcinfo.sh

@@ -0,0 +1,60 @@
+#!/bin/bash
+# gen-srcinfo.sh — emit .SRCINFO for the podtui-bin PKGBUILD without makepkg.
+# Emits the same field set/ordering makepkg --printsrcinfo produces for this
+# PKGBUILD shape (single package, per-arch source + sha256sums arrays).
+set -euo pipefail
+
+cd "$(dirname "$0")"
+
+# shellcheck disable=SC1091
+. ./PKGBUILD
+
+emit() { printf '\t%s = %s\n' "$1" "$2"; }
+emit_multi() { # $1 field, rest values
+	local f="$1"
+	shift
+	for v in "$@"; do emit "$f" "$v"; done
+}
+
+pkgbase_section() {
+	echo "pkgbase = ${pkgname}"
+	for f in pkgdesc pkgver pkgrel url; do
+		v="${!f}"
+		[ -n "${v:-}" ] && emit "$f" "$v"
+	done
+	[ -n "${install:-}" ] && emit install "$install"
+	[ "${#arch[@]}" -gt 0 ] && emit_multi arch "${arch[@]}"
+	[ "${#license[@]}" -gt 0 ] && emit_multi license "${license[@]}"
+	[ "${#depends[@]}" -gt 0 ] && emit_multi depends "${depends[@]}"
+	[ "${#provides[@]}" -gt 0 ] && emit_multi provides "${provides[@]}"
+	[ "${#conflicts[@]}" -gt 0 ] && emit_multi conflicts "${conflicts[@]}"
+	[ "${#options[@]}" -gt 0 ] && emit_multi options "${options[@]}"
+	emit_arch_arrays
+}
+
+emit_arch_arrays() {
+	for a in "${arch[@]}"; do
+		src_name="source_${a}"
+		sha_name="sha256sums_${a}"
+		src_val="${src_name}[@]"
+		sha_val="${sha_name}[@]"
+		[ "${#src_name}" -gt 0 ] && emit_multi "source_${a}" "${!src_val}"
+		emit_multi "sha256sums_${a}" "${!sha_val}"
+	done
+}
+
+pkgbase_section
+echo ""
+echo "pkgname = ${pkgname}"
+for v in pkgver pkgrel url; do
+	val="${!v}"
+	[ -n "${val:-}" ] && emit "$v" "$val"
+done
+emit pkgdesc "$pkgdesc"
+[ "${#arch[@]}" -gt 0 ] && emit_multi arch "${arch[@]}"
+[ "${#license[@]}" -gt 0 ] && emit_multi license "${license[@]}"
+[ "${#depends[@]}" -gt 0 ] && emit_multi depends "${depends[@]}"
+[ "${#provides[@]}" -gt 0 ] && emit_multi provides "${provides[@]}"
+[ "${#conflicts[@]}" -gt 0 ] && emit_multi conflicts "${conflicts[@]}"
+[ "${#options[@]}" -gt 0 ] && emit_multi options "${options[@]}"
+emit_arch_arrays

packaging/podtui.desktop

@@ -0,0 +1,11 @@
+[Desktop Entry]
+Type=Application
+Name=PodTui
+GenericName=Podcast Player
+Comment=Terminal podcast and audio player with waveform visualization
+Exec=podtui
+Icon=podtui
+Terminal=true
+Categories=Audio;AudioVideo;Player;
+Keywords=podcast;audio;player;terminal;
+StartupNotify=false

scripts/build-cavacore.sh

@@ -0,0 +1,101 @@
+#!/usr/bin/env bash
+#
+# Build cavacore as a shared library with fftw3 statically linked.
+#
+# Prerequisites:
+#   macOS:  brew install fftw
+#   Linux:  apt install libfftw3-dev  (or equivalent)
+#
+# Output: src/native/libcavacore.{dylib,so}
+
+set -euo pipefail
+
+ROOT="$(cd "$(dirname "$0")/.." && pwd)"
+SRC="$ROOT/cava/cavacore.c"
+OUT_DIR="$ROOT/src/native"
+
+mkdir -p "$OUT_DIR"
+
+OS="$(uname -s)"
+ARCH="$(uname -m)"
+
+# Resolve fftw3 paths. The static archive lives in different places per
+# platform: Homebrew (/opt/homebrew on arm64, /usr/local on Intel) and, on
+# Debian/Ubuntu, the multiarch dir /usr/lib/<triplet> (e.g.
+# x86_64-linux-gnu, aarch64-linux-gnu).
+if [ "$OS" = "Darwin" ]; then
+	LIB_EXT="dylib"
+	SHARED_FLAG="-dynamiclib"
+	INSTALL_NAME="-install_name @rpath/libcavacore.dylib"
+	if [ "$ARCH" = "arm64" ]; then
+		FFTW_HINTS="/opt/homebrew /usr/local"
+	else
+		FFTW_HINTS="/usr/local /opt/homebrew"
+	fi
+else
+	LIB_EXT="so"
+	SHARED_FLAG="-shared"
+	INSTALL_NAME=""
+	FFTW_HINTS="/usr /usr/local"
+fi
+
+FFTW_PREFIX="${FFTW_PREFIX:-}"
+FFTW_STATIC=""
+if [ -n "$FFTW_PREFIX" ]; then
+	FFTW_STATIC="$FFTW_PREFIX/lib/libfftw3.a"
+else
+	for hint in $FFTW_HINTS; do
+		for cand in "$hint/lib/libfftw3.a" "$hint/lib/${ARCH}-linux-gnu/libfftw3.a"; do
+			if [ -f "$cand" ]; then
+				FFTW_STATIC="$cand"
+				FFTW_PREFIX="$hint"
+				break 2
+			fi
+		done
+	done
+fi
+
+if [ -z "$FFTW_STATIC" ] || [ ! -f "$FFTW_STATIC" ]; then
+	echo "Error: libfftw3.a not found (searched: ${FFTW_HINTS})"
+	echo "Install fftw3: brew install fftw (macOS) or apt install libfftw3-dev (Linux)"
+	echo "or point FFTW_PREFIX at a prefix containing lib/libfftw3.a."
+	exit 1
+fi
+
+FFTW_INCLUDE="$FFTW_PREFIX/include"
+if [ ! -d "$FFTW_INCLUDE" ]; then
+	FFTW_INCLUDE="$FFTW_PREFIX/include/$(basename "$(dirname "$FFTW_STATIC")")"
+fi
+
+if [ ! -f "$SRC" ]; then
+	echo "Error: cavacore.c not found at $SRC"
+	echo "The cava source is vendored under cava/ (from github.com/karlstav/cava, MIT)."
+	exit 1
+fi
+
+OUT="$OUT_DIR/libcavacore.$LIB_EXT"
+
+echo "Building libcavacore.$LIB_EXT ($OS $ARCH)"
+echo "  Source:  $SRC"
+echo "  FFTW3:   $FFTW_STATIC"
+echo "  Output:  $OUT"
+
+cc -O2 \
+	$SHARED_FLAG \
+	$INSTALL_NAME \
+	-fPIC \
+	-I"$FFTW_INCLUDE" \
+	-I"$ROOT/cava" \
+	-o "$OUT" \
+	"$SRC" \
+	"$FFTW_STATIC" \
+	-lm
+
+echo "Built: $OUT"
+
+# Verify exported symbols
+if [ "$OS" = "Darwin" ]; then
+	echo ""
+	echo "Exported symbols:"
+	nm -gU "$OUT" | grep "cava_"
+fi

scripts/release-tag.sh

@@ -0,0 +1,240 @@
+#!/bin/bash
+
+# release-tag.sh — PodTui version bump, commit, tag, and push.
+#
+# Mirrors the release flow from FlexLove's scripts/make-tag.sh, adapted for
+# PodTui's single version source (src/index.tsx) and dual remotes (gh, gt).
+#
+# Usage:
+#   scripts/release-tag.sh            interactive release
+#   scripts/release-tag.sh --dry-run  plan the bump/tag/pushes without doing
+#
+# Pushing a v* tag to the `gh` remote triggers .github/workflows/release.yml
+# (4-platform tarball builds) — the release and the Homebrew tap update then
+# happen automatically and need no further local action.
+
+set -e
+
+RED='\033[0;31m'
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+BLUE='\033[0;34m'
+CYAN='\033[0;36m'
+NC='\033[0m' # No Color
+
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+PROJECT_ROOT="$(cd "$SCRIPT_DIR/.." && pwd)"
+cd "$PROJECT_ROOT"
+
+DRY_RUN=0
+for arg in "$@"; do
+	case "$arg" in
+	--dry-run | -n) DRY_RUN=1 ;;
+	--help | -h)
+		echo "Usage: scripts/release-tag.sh [--dry-run]"
+		echo "  --dry-run, -n   show the plan without committing, tagging, or pushing"
+		exit 0
+		;;
+	*)
+		echo -e "${RED}Unknown option: ${arg}${NC}" >&2
+		exit 2
+		;;
+	esac
+done
+
+if [ ! -d .git ] && [ ! -f .git ]; then
+	echo -e "${RED}Error: Not in a git repository${NC}"
+	exit 1
+fi
+
+if ! git diff-index --quiet HEAD --; then
+	echo -e "${YELLOW}You have uncommitted changes:${NC}"
+	git status --short
+	echo ""
+	read -p "Continue anyway? (y/n) " -n 1 -r
+	echo
+	if [[ ! $REPLY =~ ^[Yy]$ ]]; then
+		echo -e "${RED}Aborted${NC}"
+		exit 1
+	fi
+	echo ""
+fi
+
+# Current version from the latest tag; fall back to src/index.tsx.
+CURRENT_VERSION=$(git describe --tags --abbrev=0 2>/dev/null | sed 's/^v//')
+if [ -z "$CURRENT_VERSION" ]; then
+	CURRENT_VERSION=$(grep -m 1 "^const VERSION" src/index.tsx | sed -E 's/.*"([0-9]+\.[0-9]+\.[0-9]+)".*/\1/')
+	if [ -z "$CURRENT_VERSION" ]; then
+		echo -e "${RED}Error: could not extract version from git tags or src/index.tsx${NC}"
+		exit 1
+	fi
+	echo -e "${YELLOW}No tags found; using VERSION from src/index.tsx (${CURRENT_VERSION})${NC}"
+fi
+
+echo -e "${CYAN}Current version:${NC} ${GREEN}v${CURRENT_VERSION}${NC}"
+echo ""
+
+IFS='.' read -r MAJOR MINOR PATCH <<<"$CURRENT_VERSION"
+MAJOR=$(echo "$MAJOR" | sed 's/[^0-9].*//')
+MINOR=$(echo "$MINOR" | sed 's/[^0-9].*//')
+PATCH=$(echo "$PATCH" | sed 's/[^0-9].*//')
+
+echo -e "${CYAN}Select version bump type:${NC}"
+echo "  1) Major (breaking changes)     ${MAJOR}.${MINOR}.${PATCH} → $((MAJOR + 1)).0.0"
+echo "  2) Minor (new features)          ${MAJOR}.${MINOR}.${PATCH} → ${MAJOR}.$((MINOR + 1)).0"
+echo "  3) Patch (bug fixes)             ${MAJOR}.${MINOR}.${PATCH} → ${MAJOR}.${MINOR}.$((PATCH + 1))"
+echo "  4) Custom version"
+echo "  5) Cancel"
+echo ""
+read -p "Enter choice (1-5): " -n 1 -r CHOICE
+echo ""
+echo ""
+
+case $CHOICE in
+1)
+	NEW_VERSION="$((MAJOR + 1)).0.0"
+	;;
+2)
+	NEW_VERSION="${MAJOR}.$((MINOR + 1)).0"
+	;;
+3)
+	NEW_VERSION="${MAJOR}.${MINOR}.$((PATCH + 1))"
+	;;
+4)
+	read -p "Enter custom version (e.g., 1.0.0-beta): " -r NEW_VERSION
+	;;
+5)
+	echo -e "${RED}Cancelled${NC}"
+	exit 0
+	;;
+*)
+	echo -e "${RED}Invalid choice${NC}"
+	exit 1
+	;;
+esac
+
+# Version sanity check (tags are vMAJOR.MINOR.PATCH).
+if ! echo "$NEW_VERSION" | grep -Eq '^[0-9]+\.[0-9]+\.[0-9]+$'; then
+	echo -e "${RED}Error: ${NEW_VERSION} is not a valid X.Y.Z version (v tags only)${NC}"
+	exit 1
+fi
+
+echo -e "${CYAN}New version:${NC} ${GREEN}v${NEW_VERSION}${NC}"
+echo ""
+echo -e "${YELLOW}This will:${NC}"
+echo "  1. Set src/index.tsx → VERSION = \"${NEW_VERSION}\""
+echo "  2. Commit the bump"
+echo "  3. Create annotated tag v${NEW_VERSION}"
+echo "  4. Push master and the tag to every remote"
+REMOTES=$(git remote)
+for r in $REMOTES; do
+	echo "       → $r"
+done
+echo ""
+echo -e "${YELLOW}Note: pushing the tag to ${BLUE}gh${YELLOW} triggers release.yml CI (4-platform"
+echo "binaries + GitHub Release) and the homebrew-tap tap update.${NC}"
+echo ""
+read -p "Proceed? (y/n) " -n 1 -r
+echo ""
+if [[ ! $REPLY =~ ^[Yy]$ ]]; then
+	echo -e "${YELLOW}Aborted — no changes made${NC}"
+	exit 0
+fi
+
+if [ "$DRY_RUN" -eq 1 ]; then
+	echo ""
+	echo -e "${CYAN}[dry-run]${NC} would have:"
+	echo "  sed  src/index.tsx: VERSION \"${CURRENT_VERSION}\" → \"${NEW_VERSION}\""
+	echo "  git  commit -m \"bump VERSION to ${NEW_VERSION}\""
+	echo "  git  tag -a v${NEW_VERSION} -m \"PodTUI v${NEW_VERSION}\""
+	for r in $REMOTES; do echo "  push $r master"; done
+	for r in $REMOTES; do echo "  push $r v${NEW_VERSION}"; done
+	echo ""
+	echo -e "${GREEN}Plan only — nothing written${NC}"
+	exit 0
+fi
+
+# ── Apply the bump ───────────────────────────────────────────────────────────
+echo ""
+echo -e "${CYAN}[1/4]${NC} Updating src/index.tsx..."
+sed -i.bak "s/const VERSION = \"[^\"]*\"/const VERSION = \"${NEW_VERSION}\"/" src/index.tsx
+rm -f src/index.tsx.bak
+echo -e "${GREEN}✓ src/index.tsx updated${NC}"
+
+if git diff --quiet -- src/index.tsx; then
+	if git rev-parse -q --verify "refs/tags/v${NEW_VERSION}" >/dev/null; then
+		echo -e "${YELLOW}Already at ${NEW_VERSION} and tag v${NEW_VERSION} exists — nothing to release.${NC}"
+		exit 0
+	fi
+	echo -e "${YELLOW}VERSION is already ${NEW_VERSION} (bump already committed).${NC}"
+	echo -e "${YELLOW}Will skip the commit and just create the missing tag + push.${NC}"
+	read -p "Tag v${NEW_VERSION} on current HEAD and push? (y/n) " -n 1 -r
+	echo
+	if [[ ! $REPLY =~ ^[Yy]$ ]]; then
+		echo -e "${YELLOW}Aborted — no changes made${NC}"
+		exit 0
+	fi
+else
+	git add src/index.tsx
+	echo -e "${GREEN}✓ staged${NC}"
+
+	echo -e "${CYAN}[2/4]${NC} Committing..."
+	DEFAULT_COMMIT_MSG="bump VERSION to ${NEW_VERSION}"
+	echo -e "Default commit message: ${CYAN}${DEFAULT_COMMIT_MSG}${NC}"
+	read -p "Use default? (y/n) " -n 1 -r
+	echo
+	if [[ $REPLY =~ ^[Nn]$ ]]; then
+		read -p "Enter commit message: " -r COMMIT_MSG
+	else
+		COMMIT_MSG="$DEFAULT_COMMIT_MSG"
+	fi
+	git commit -m "$COMMIT_MSG"
+	echo -e "${GREEN}✓ committed: ${COMMIT_MSG}${NC}"
+fi
+
+echo -e "${CYAN}[3/4]${NC} Tagging..."
+git tag -a "v${NEW_VERSION}" -m "PodTUI v${NEW_VERSION}"
+echo -e "${GREEN}✓ tagged v${NEW_VERSION}${NC}"
+echo ""
+
+echo -e "${CYAN}[4/4]${NC} Pushing..."
+FAILED=""
+for r in $REMOTES; do
+	if ! git push "$r" master; then
+		FAILED="${FAILED}${r} (branch) "
+	fi
+	if ! git push "$r" tag "v${NEW_VERSION}"; then
+		FAILED="${FAILED}${r} (tag) "
+	fi
+done
+
+echo ""
+if [ -n "$FAILED" ]; then
+	echo -e "${RED}═══════════════════════════════════════${NC}"
+	echo -e "${RED}✗ Push failed for: ${FAILED}${NC}"
+	echo -e "${RED}═══════════════════════════════════════${NC}"
+	echo ""
+	echo -e "${YELLOW}The commit and tag exist locally. To retry:${NC}"
+	for r in $REMOTES; do
+		echo "  git push ${r} master"
+		echo "  git push ${r} v${NEW_VERSION}"
+	done
+	echo ""
+	echo -e "${YELLOW}To undo:${NC}"
+	echo "  git tag -d v${NEW_VERSION}"
+	echo "  git reset --soft HEAD~1"
+	exit 1
+fi
+
+echo -e "${GREEN}═══════════════════════════════════════${NC}"
+echo -e "${GREEN}✓ PodTui v${NEW_VERSION} released${NC}"
+echo -e "${GREEN}═══════════════════════════════════════${NC}"
+echo ""
+echo -e "${CYAN}Version:${NC} ${CURRENT_VERSION} → ${GREEN}${NEW_VERSION}${NC}"
+echo -e "${CYAN}Tag:${NC} v${NEW_VERSION}"
+echo ""
+echo -e "${BLUE}Next steps (automatic, nothing to do):${NC}"
+echo "  1. GitHub Action release.yml builds 4 tarballs and attaches them:"
+echo -e "     ${CYAN}gh run watch \$(gh run list --limit 1 --json databaseId -q .[0].databaseId)${NC}"
+echo "  2. mikefreno/homebrew-tap self-updates within the hour (Formula"
+echo "     URLs + sha256s); brew upgrade podtui afterwards."

scripts/tui-harness.tsx

@@ -0,0 +1,679 @@
+#!/usr/bin/env bun
+/**
+ * PodTUI LLM-interactive harness — stateless per-turn snapshot bridge.
+ *
+ * Each invocation:
+ *   1. Points XDG_CONFIG_HOME / XDG_DATA_HOME / PODTUI_AUDIO_BACKEND at a
+ *      sandbox dir under .harness so your real ~/.config/podtui is never touched.
+ *   2. Replays the saved action log (.harness/actions.json) from scratch.
+ *   3. Appends + executes the new action passed on the CLI.
+ *   4. Renders, captures structured spans, and prints: plain frame + distinct
+ *      style summary (colors/attrs) + selected store state + captured issues
+ *      (stderr / uncaught rejections). Full structured spans are dumped to
+ *      .harness/last-frame.json every turn.
+ *
+ * Audio is silent (Noop) by default during the snapshot model so replaying the
+ * log each turn doesn't re-trigger real playback. Pass --audio (or set
+ * PODTUI_AUDIO_BACKEND) to flip to a real backend for the new action only.
+ *
+ * Import order mirrors src/index.tsx (lazy) to avoid a NavigationContext cycle.
+ *
+ * Usage:
+ *   bun scripts/tui-harness.tsx init [--size 100x30] [--seed]
+ *   bun scripts/tui-harness.tsx key <key> [mods...]      # mods: ctrl shift meta
+ *   bun scripts/tui-harness.tsx arrow <up|down|left|right> [mods...]
+ *   bun scripts/tui-harness.tsx enter|escape|tab|space|backspace
+ *   bun scripts/tui-harness.tsx type "<text>"
+ *   bun scripts/tui-harness.tsx wait <ms>
+ *   bun scripts/tui-harness.tsx resize <w> <h>
+ *   bun scripts/tui-harness.tsx frame                        # re-render, no new action
+ *   bun scripts/tui-harness.tsx state [all|nav|audio|feed|app]
+ *   bun scripts/tui-harness.tsx actions                      # print action log
+ *   bun scripts/tui-harness.tsx reset
+ *   bun scripts/tui-harness.tsx seed [--from ~/.config/podtui]
+ *
+ * Flags (after the subcommand):
+ *   --size WxH      terminal size (default 100x30)
+ *   --audio         enable real audio backend for the new action only
+ *   --no-settle     skip the extra render-settle loops
+ *   --styles        print the distinct-styles sample block (off by default)
+ *   --verbose       restore the original multi-line pretty output
+ */
+
+import { testRender } from "@opentui/solid";
+import {
+	existsSync,
+	mkdirSync,
+	cpSync,
+	writeFileSync,
+	readFileSync,
+} from "node:fs";
+import { join } from "node:path";
+
+// ── Paths & sandbox ────────────────────────────────────────────────────────
+const HANDLES_DIR = ".harness";
+const CONFIG_HOME = join(HANDLES_DIR, "config-home");
+const DATA_HOME = join(HANDLES_DIR, "data-home");
+const ACTIONS_FILE = join(HANDLES_DIR, "actions.json");
+const FRAME_JSON = join(HANDLES_DIR, "last-frame.json");
+const FRAME_TXT = join(HANDLES_DIR, "last-frame.txt");
+const STATE_JSON = join(HANDLES_DIR, "state.json");
+
+// Sandbox must be active BEFORE any app module is imported, so the app's
+// config-dir / persistence reads resolve into .harness/*.
+function activateSandbox(): void {
+	mkdirSync(CONFIG_HOME, { recursive: true });
+	mkdirSync(DATA_HOME, { recursive: true });
+	process.env.XDG_CONFIG_HOME = join(process.cwd(), CONFIG_HOME);
+	process.env.XDG_DATA_HOME = join(process.cwd(), DATA_HOME);
+	// Silent audio during replay by default; --audio flips this after import.
+	if (!process.env.PODTUI_AUDIO_BACKEND)
+		process.env.PODTUI_AUDIO_BACKEND = "none";
+}
+
+// ── Action log ─────────────────────────────────────────────────────────────
+type Mod = "ctrl" | "shift" | "meta" | "super" | "hyper";
+type Action =
+	| { t: "key"; k: string; mods?: Mod[] }
+	| { t: "arrow"; d: "up" | "down" | "left" | "right"; mods?: Mod[] }
+	| { t: "enter" | "escape" | "tab" | "space" | "backspace"; mods?: Mod[] }
+	| { t: "type"; s: string }
+	| { t: "wait"; ms: number }
+	| { t: "resize"; w: number; h: number };
+
+function loadActions(): Action[] {
+	try {
+		return JSON.parse(readFileSync(ACTIONS_FILE, "utf8") || "[]");
+	} catch {
+		return [];
+	}
+}
+function saveActions(a: Action[]): void {
+	writeFileSync(ACTIONS_FILE, JSON.stringify(a, null, 2));
+}
+
+// ── Issue capture ──────────────────────────────────────────────────────────
+const issues: string[] = [];
+// Captured by the StateProbe component rendered inside the provider tree —
+// Solid contexts can only be read from within the tree, not from outside.
+let navRef: any = null;
+function captureIssues(): void {
+	const origErr = console.error;
+	const origWarn = console.warn;
+	console.error = (...args: unknown[]) => {
+		issues.push("stderr: " + args.map(String).join(" "));
+		origErr(...(args as any[]));
+	};
+	console.warn = (...args: unknown[]) => {
+		issues.push("warn: " + args.map(String).join(" "));
+		origWarn(...(args as any[]));
+	};
+	process.on("uncaughtException", (e) =>
+		issues.push("uncaught: " + ((e as Error)?.stack || String(e))),
+	);
+	process.on("unhandledRejection", (e) =>
+		issues.push("unhandledRejection: " + ((e as Error)?.stack || String(e))),
+	);
+}
+
+// ── Span rendering ─────────────────────────────────────────────────────────
+type RGBA = { r: number; g: number; b: number; a: number };
+type Span = {
+	text: string;
+	fg: RGBA | null;
+	bg: RGBA | null;
+	attributes: number;
+	width: number;
+};
+
+const ATTR_NAMES: Record<string, number> = {
+	BOLD: 1,
+	DIM: 2,
+	ITALIC: 4,
+	UNDERLINE: 8,
+	BLINK: 16,
+	INVERSE: 32,
+	HIDDEN: 64,
+	STRIKETHROUGH: 128,
+};
+
+function hex(c: RGBA | null): string | null {
+	if (!c) return null;
+	if (c.a === 0) return null; // transparent → "default"
+	const [r, g, b] = [c.r, c.g, c.b].map((v) =>
+		Math.max(0, Math.min(255, Math.round(v))),
+	);
+	return "#" + [r, g, b].map((n) => n.toString(16).padStart(2, "0")).join("");
+}
+
+function attrLabels(attr: number): string[] {
+	const out: string[] = [];
+	for (const [name, bit] of Object.entries(ATTR_NAMES))
+		if (attr & bit) out.push(name.toLowerCase());
+	return out;
+}
+
+// (Plain frame text comes from captureCharFrame instead of span reconstruction.)
+
+function distinctStyles(spans: {
+	lines: { spans: Span[] }[];
+}): { tag: string; sample: string; n: number }[] {
+	const map = new Map<string, { tag: string; sample: string; n: number }>();
+	for (const line of spans.lines) {
+		for (const s of line.spans) {
+			if (!s.text || s.text.trim() === "") continue;
+			const fg = hex(s.fg as any);
+			const bg = hex(s.bg as any);
+			if (!fg && !bg && s.attributes === 0) continue; // default — skip
+			const tags = attrLabels(s.attributes);
+			const tag = `[fg=${fg ?? "·"} bg=${bg ?? "·"}${tags.length ? " " + tags.join("+") : ""}]`;
+			const ex = map.get(tag);
+			const sample = s.text.replace(/\n/g, "\\n").slice(0, 28);
+			if (ex) {
+				ex.n++;
+				if (ex.sample.length < 14 && sample.length > ex.sample.length)
+					ex.sample = sample;
+			} else {
+				map.set(tag, { tag, sample, n: 1 });
+			}
+		}
+	}
+	return [...map.values()].sort((a, b) => b.n - a.n).slice(0, 20);
+}
+
+// ── Arg parsing ────────────────────────────────────────────────────────────
+function parseFlags(rest: string[]): {
+	flags: Record<string, string | boolean>;
+	positional: string[];
+} {
+	const flags: Record<string, string | boolean> = {};
+	const positional: string[] = [];
+	for (let i = 0; i < rest.length; i++) {
+		const a = rest[i];
+		if (a.startsWith("--")) {
+			if (a === "--audio") flags.audio = true;
+			else if (a === "--no-settle") flags["no-settle"] = true;
+			else if (a === "--styles") flags.styles = true;
+			else if (a === "--verbose") flags.verbose = true;
+			else if (a === "--size") {
+				flags.size = rest[++i];
+				const m = /(\d+)x(\d+)/.exec(String(flags.size));
+				if (m) {
+					flags.w = m[1];
+					flags.h = m[2];
+				}
+			} else if (a === "--from") {
+				flags.from = rest[++i];
+			} else {
+				throw new Error(`unknown flag: ${a}`);
+			}
+		} else {
+			positional.push(a);
+		}
+	}
+	return { flags, positional };
+}
+
+function parseMods(positional: string[]): Mod[] {
+	const mods: Mod[] = [];
+	for (const p of positional)
+		if (["ctrl", "shift", "meta", "super", "hyper"].includes(p))
+			mods.push(p as Mod);
+	return mods;
+}
+
+// Per-command builders. Leading positional tokens that name a modifier
+// (ctrl/shift/...) are stripped as mods; the rest is the command's data.
+const modsOrUndefined = (positional: string[]): Mod[] | undefined => {
+	const mods = parseMods(positional);
+	return mods.length ? mods : undefined;
+};
+
+const BUILDERS: Record<string, (positional: string[]) => Action> = {
+	key: (p) => {
+		if (!p[0]) throw new Error("key requires a <key> argument");
+		return { t: "key", k: p[0], mods: modsOrUndefined(p) };
+	},
+	arrow: (p) => {
+		if (!p[0] || !["up", "down", "left", "right"].includes(p[0]))
+			throw new Error("arrow requires up|down|left|right");
+		return {
+			t: "arrow",
+			d: p[0] as "up" | "down" | "left" | "right",
+			mods: modsOrUndefined(p),
+		};
+	},
+	enter: (p) => ({ t: "enter", mods: modsOrUndefined(p) }),
+	escape: (p) => ({ t: "escape", mods: modsOrUndefined(p) }),
+	tab: (p) => ({ t: "tab", mods: modsOrUndefined(p) }),
+	space: (p) => ({ t: "space", mods: modsOrUndefined(p) }),
+	backspace: (p) => ({ t: "backspace", mods: modsOrUndefined(p) }),
+	type: (p) => {
+		if (p[0] === undefined) throw new Error("type requires <text>");
+		// Re-join the rest in case text had spaces; p[0] already is first token,
+		// caller should quote. We join all positional as the text.
+		return { t: "type", s: p.join(" ") };
+	},
+	wait: (p) => {
+		if (!p[0]) throw new Error("wait requires <ms>");
+		return { t: "wait", ms: parseInt(p[0], 10) || 0 };
+	},
+	resize: (p) => {
+		if (!p[0] || !p[1]) throw new Error("resize requires <w> <h>");
+		return {
+			t: "resize",
+			w: parseInt(p[0], 10) || 100,
+			h: parseInt(p[1], 10) || 30,
+		};
+	},
+};
+
+function buildAction(cmd: string, positional: string[]): Action | null {
+	const builder = BUILDERS[cmd];
+	if (builder) return builder(positional);
+	// Local-only commands return early in main before this is reached; keep
+	// the null contract so the public behavior is unchanged.
+	if (
+		cmd === "frame" ||
+		cmd === "state" ||
+		cmd === "reset" ||
+		cmd === "actions" ||
+		cmd === "init" ||
+		cmd === "seed"
+	)
+		return null;
+	// Single table-miss error for any unknown command.
+	throw new Error(`unknown command: ${cmd}`);
+}
+
+// ── Execute one action against a mounted setup ──────────────────────────────
+function fmtMods(mods?: Mod[]): Record<string, boolean> | undefined {
+	if (!mods || !mods.length) return undefined;
+	const o: Record<string, boolean> = {};
+	for (const m of mods) o[m] = true;
+	return o;
+}
+
+async function execAction(setup: any, a: Action): Promise<void> {
+	const mi = setup.mockInput;
+	switch (a.t) {
+		case "key":
+			mi.pressKey(a.k, fmtMods(a.mods));
+			break;
+		case "arrow":
+			mi.pressArrow(a.d, fmtMods(a.mods));
+			break;
+		case "enter":
+			mi.pressEnter(fmtMods(a.mods));
+			break;
+		case "escape":
+			mi.pressEscape(fmtMods(a.mods));
+			break;
+		case "tab":
+			mi.pressTab(fmtMods(a.mods));
+			break;
+		case "space":
+			mi.pressKey("space");
+			break;
+		case "backspace":
+			mi.pressBackspace(fmtMods(a.mods));
+			break;
+		case "type":
+			await mi.typeText(a.s, 0);
+			break;
+		case "wait":
+			await new Promise((r) => setTimeout(r, a.ms));
+			break;
+		case "resize":
+			setup.resize(a.w, a.h);
+			break;
+	}
+	await setup.renderOnce();
+	// tiny settle for reactive updates
+	await new Promise((r) => setTimeout(r, 40));
+}
+
+// ── Mount, snapshot & output (extracted from main) ─────────────────────────
+// A line is "visually empty" if it's either fully blank OR contains only
+// box-drawing chars + whitespace (i.e. empty-pane interior padding like
+// "│   │"). Runs of these collapse to a single `…N` marker so an empty
+// 24-row pane costs 1 line, not 18.
+const BOX_CHARS = "│┌┐└─┤├┬┴┼┐┘┌└┤├┬┴┼┌┐└┘─│┤├┬┴┼";
+const isVisuallyEmpty = (l: string): boolean =>
+	l === "" || [...l].every((ch) => ch === " " || BOX_CHARS.includes(ch));
+
+function trimFrame(plainFrame: string): string {
+	const lines = plainFrame
+		.replace(/\n+$/, "")
+		.split("\n")
+		.map((l) => l.replace(/\s+$/, ""));
+	while (lines.length && isVisuallyEmpty(lines[lines.length - 1]))
+		lines.pop();
+	const out: string[] = [];
+	let blank = 0;
+	const flushBlanks = () => {
+		if (blank >= 3) out.push(`  …${blank} empty`);
+		else for (let i = 0; i < blank; i++) out.push("");
+		blank = 0;
+	};
+	for (const l of lines) {
+		if (isVisuallyEmpty(l)) {
+			blank++;
+		} else {
+			flushBlanks();
+			out.push(l);
+		}
+	}
+	flushBlanks();
+	return out.join("\n");
+}
+
+// Local-only commands that don't mount. Returns true if handled (main returns).
+function runLocal(cmd: string, flags: Record<string, string | boolean>): boolean {
+	if (cmd === "reset") {
+		saveActions([]);
+		console.log("✔ actions log cleared.");
+		return true;
+	}
+	if (cmd === "actions") {
+		const a = loadActions();
+		console.log(`Action log (${a.length}):`);
+		console.log(JSON.stringify(a, null, 2));
+		return true;
+	}
+	if (cmd === "seed") {
+		const from = String(
+			flags.from || join(process.env.HOME || "~", ".config", "podtui"),
+		);
+		if (!existsSync(from)) {
+			console.error(`seed source not found: ${from}`);
+			process.exit(1);
+		}
+		const dest = join(process.env.XDG_CONFIG_HOME!, "podtui");
+		cpSync(from, dest, { recursive: true });
+		console.log(`✔ seeded sandbox config from ${from} → ${dest}`);
+		return true;
+	}
+	return false;
+}
+
+type FrameCapture = {
+	lines: { spans: Span[] }[];
+	cols: number;
+	rows: number;
+	cursor: [number, number];
+};
+
+async function mountApp(
+	flags: Record<string, string | boolean>,
+	cmd: string,
+	positional: string[],
+): Promise<{
+	setup: any;
+	spans: FrameCapture;
+	plainFrame: string;
+	audioControls: any;
+	actions: Action[];
+}> {
+	// Size settings.
+	let width = 100;
+	let height = 30;
+	if (flags.w) width = parseInt(String(flags.w), 10);
+	if (flags.h) height = parseInt(String(flags.h), 10);
+
+	let newAction: Action | null = null;
+	let actions: Action[] = [];
+	if (cmd !== "init" && cmd !== "frame" && cmd !== "state") {
+		newAction = buildAction(cmd, positional);
+	}
+	if (cmd === "init") {
+		saveActions([]);
+		actions = [];
+	} else {
+		actions = loadActions();
+	}
+
+	// Mount the real app. Lazy imports (order matters — see NavigationContext cycle).
+	const { App } = await import("../src/App");
+	const { ThemeProvider } = await import("../src/context/ThemeContext");
+	const toast = await import("../src/ui/toast");
+	const { KeybindProvider } = await import("../src/context/KeybindContext");
+	const { NavigationProvider, useNavigation } = await import(
+		"../src/context/NavigationContext"
+	);
+	const { DialogProvider } = await import("../src/ui/dialog");
+	const { CommandProvider } = await import("../src/ui/command");
+
+	// Probe rendered inside the provider tree so context hooks resolve.
+	const StateProbe = () => {
+		try {
+			navRef = useNavigation();
+		} catch (e) {
+			issues.push("StateProbe: " + String(e));
+		}
+		return null;
+	};
+
+	const HarnessRoot = () => (
+		<toast.ToastProvider>
+			<ThemeProvider mode="dark">
+				<KeybindProvider>
+					<NavigationProvider>
+						<StateProbe />
+						<DialogProvider>
+							<CommandProvider>
+								<App />
+								<toast.Toast />
+							</CommandProvider>
+						</DialogProvider>
+					</NavigationProvider>
+				</KeybindProvider>
+			</ThemeProvider>
+		</toast.ToastProvider>
+	);
+
+	const setup = await testRender(() => <HarnessRoot />, {
+		width,
+		height,
+		useThread: false,
+	});
+	(setup.renderer as any).disableStdoutInterception?.();
+
+	// Wait for providers (keybinds/theme/feeds) to settle.
+	const settleLoops = flags["no-settle"] ? 2 : 12;
+	for (let i = 0; i < settleLoops; i++) {
+		await setup.renderOnce();
+		await new Promise((r) => setTimeout(r, 60));
+	}
+
+	// Replay history silently (audio already Noop via env).
+	for (const a of actions) await execAction(setup, a);
+
+	// For the *new* action: if --audio, flip to a real backend just for it.
+	let audioControls: any = null;
+	try {
+		const { useAudio } = await import("../src/hooks/useAudio");
+		audioControls = useAudio();
+	} catch (e) {
+		issues.push("useAudio import: " + String(e));
+	}
+	if (newAction) {
+		if (flags.audio && audioControls?.switchBackend) {
+			// Force (re)creation of a real backend; useAudio caches, switchBackend resets.
+			delete process.env.PODTUI_AUDIO_BACKEND;
+			await audioControls.switchBackend("mpv").catch(() => {});
+		}
+		actions.push(newAction);
+		saveActions(actions);
+		await execAction(setup, newAction);
+	}
+
+	// Final settle + capture.
+	await setup.renderOnce();
+	await new Promise((r) => setTimeout(r, 60));
+	const spans = setup.captureSpans() as FrameCapture;
+	const plainFrame = setup.captureCharFrame();
+
+	// Dump structured spans + plain frame.
+	try {
+		writeFileSync(FRAME_JSON, JSON.stringify(spans));
+		writeFileSync(FRAME_TXT, plainFrame);
+	} catch {}
+
+	return { setup, spans, plainFrame, audioControls, actions };
+}
+
+async function snapshotState(audioControls: any): Promise<Record<string, unknown>> {
+	// Store state snapshot.
+	const state: Record<string, unknown> = {};
+	try {
+		const nav = navRef;
+		if (nav) {
+			state.nav = {
+				tab: nav.activeTab?.(),
+				pane: nav.activePane?.(),
+				mode: nav.mode?.(),
+				input: nav.inputFocused?.(),
+				sel: nav.selectedIds?.()?.length ?? 0,
+				ready: nav.ready,
+			};
+		} else {
+			state.nav = "NAV_REF not captured (probe did not run)";
+		}
+	} catch (e) {
+		state.nav = "ERR: " + String(e);
+	}
+	try {
+		if (audioControls) {
+			state.audio = {
+				backend: audioControls.backendName ? audioControls.backendName() : null,
+				playing: audioControls.isPlaying ? audioControls.isPlaying() : null,
+				pos: audioControls.position ? audioControls.position() : null,
+				dur: audioControls.duration ? audioControls.duration() : null,
+				vol: audioControls.volume ? audioControls.volume() : null,
+				err: audioControls.error ? audioControls.error() : null,
+				ep: audioControls.currentEpisode
+					? audioControls.currentEpisode()?.title
+					: null,
+			};
+		}
+	} catch (e) {
+		state.audio = "ERR: " + String(e);
+	}
+	try {
+		const { useFeedStore } = await import("../src/stores/feed");
+		const fs_ = useFeedStore();
+		const feeds = fs_.feeds ? fs_.feeds() : [];
+		state.feed = {
+			count: feeds?.length ?? 0,
+			sel: fs_.selectedFeedId ? fs_.selectedFeedId() : null,
+			loading: fs_.isLoadingFeeds ? fs_.isLoadingFeeds() : null,
+			titles: (feeds ?? []).slice(0, 8).map((f: any) => f?.podcast?.title),
+		};
+	} catch (e) {
+		state.feed = "ERR: " + String(e);
+	}
+	try {
+		writeFileSync(STATE_JSON, JSON.stringify(state));
+	} catch {}
+	return state;
+}
+
+function emitOutput(p: {
+	spans: FrameCapture;
+	plainFrame: string;
+	state: Record<string, unknown>;
+	actions: Action[];
+	cmd: string;
+	flags: Record<string, string | boolean>;
+	positional: string[];
+}): void {
+	// Compact by default: trimmed frame, one-line state per section, no styles
+	// block, no boilerplate footer. Use --styles / --verbose to opt back in.
+	const verbose = !!p.flags.verbose;
+	const scope = p.cmd === "state" ? String(p.positional[0] || "all") : "all";
+
+	console.log(
+		`FRAME ${p.spans.cols}x${p.spans.rows} cur=${p.spans.cursor[0]},${p.spans.cursor[1]} acts=${p.actions.length} ${p.cmd}`,
+	);
+	console.log(trimFrame(p.plainFrame));
+
+	// ── distinct styles: opt-in only (--styles OR --verbose) ──
+	if (scope === "all" && (p.flags.styles || verbose)) {
+		const styles = distinctStyles(p.spans);
+		if (styles.length) {
+			console.log("-- styles (top 20) --");
+			for (const s of styles) console.log(`  ${s.tag} ×${s.n} “${s.sample}”`);
+		}
+	}
+
+	// ── state: one compact line per requested section ──
+	const want = (k: string) => scope === "all" || scope === k;
+	const compact = (obj: unknown): string =>
+		verbose ? JSON.stringify(obj, null, 2) : JSON.stringify(obj);
+	if (want("nav")) console.log("nav " + compact(p.state.nav));
+	if (want("audio")) console.log("audio " + compact(p.state.audio));
+	if (want("feed")) console.log("feed " + compact(p.state.feed));
+	if (want("app")) console.log("app (not dumped in v1)");
+
+	// ── issues: terse ──
+	if (issues.length) {
+		console.log(`issues:${issues.length}`);
+		for (const i of issues.slice(0, 20)) console.log("  ! " + i);
+	} else {
+		console.log("issues:none");
+	}
+
+	// Footer is identical every run — only print on init or --verbose.
+	if (p.cmd === "init" || verbose) {
+		console.log(
+			`(spans ${FRAME_JSON} | frame ${FRAME_TXT} | state ${STATE_JSON})`,
+		);
+	}
+}
+
+async function teardown(setup: any, audioControls: any): Promise<void> {
+	// Tear down child processes (audio backend) before exit to avoid orphans.
+	try {
+		if (audioControls?.stop) await audioControls.stop().catch(() => {});
+	} catch (e) {
+		issues.push("teardown audio: " + String(e));
+	}
+	try {
+		setup.renderer.destroy();
+	} catch (e) {
+		issues.push("teardown renderer: " + String(e));
+	}
+	process.exit(0);
+}
+
+// ── Main ───────────────────────────────────────────────────────────────────
+async function main() {
+	activateSandbox();
+	captureIssues();
+
+	const argv = process.argv.slice(2);
+	const cmd = argv[0] ?? "frame";
+	const { flags, positional } = parseFlags(argv.slice(1));
+
+	// Local-only commands that don't mount.
+	if (runLocal(cmd, flags)) return;
+
+	const m = await mountApp(flags, cmd, positional);
+	const state = await snapshotState(m.audioControls);
+	emitOutput({
+		spans: m.spans,
+		plainFrame: m.plainFrame,
+		state,
+		actions: m.actions,
+		cmd,
+		flags,
+		positional,
+	});
+	await teardown(m.setup, m.audioControls);
+}
+
+main().catch((err) => {
+	console.error("HARNESS FAILED:", err?.stack || err);
+	process.exit(1);
+});

src/App.tsx

@@ -1,182 +1,93 @@
-import { createSignal } from "solid-js"
-import { Layout } from "./components/Layout"
-import { Navigation } from "./components/Navigation"
-import { TabNavigation } from "./components/TabNavigation"
-import { SyncPanel } from "./components/SyncPanel"
-import { FeedList } from "./components/FeedList"
-import { LoginScreen } from "./components/LoginScreen"
-import { CodeValidation } from "./components/CodeValidation"
-import { OAuthPlaceholder } from "./components/OAuthPlaceholder"
-import { SyncProfile } from "./components/SyncProfile"
-import { SearchPage } from "./components/SearchPage"
-import { DiscoverPage } from "./components/DiscoverPage"
-import { useAuthStore } from "./stores/auth"
-import { useFeedStore } from "./stores/feed"
-import { FeedVisibility } from "./types/feed"
-import { useAppKeyboard } from "./hooks/useAppKeyboard"
-import type { TabId } from "./components/Tab"
-import type { AuthScreen } from "./types/auth"
+import { ErrorBoundary } from "solid-js";
+import { useSelectionHandler, useRenderer } from "@opentui/solid";
+import { useAudio } from "@/hooks/useAudio";
+import { useMultimediaKeys } from "@/hooks/useMultimediaKeys";
+import { Clipboard } from "@/utils/clipboard";
+import { useToast } from "@/ui/toast";
+import { useTheme, ThemeProvider } from "./context/ThemeContext";
+import { KeybindProvider, useKeybinds } from "./context/KeybindContext";
+import {
+	NavigationProvider,
+	useNavigation,
+	NavMode,
+} from "./context/NavigationContext";
+import { TABS } from "./utils/navigation";
+import { Shell } from "./components/Shell";
+
+const DEBUG = import.meta.env.DEBUG;
 
 export function App() {
-  const [activeTab, setActiveTab] = createSignal<TabId>("discover")
-  const [authScreen, setAuthScreen] = createSignal<AuthScreen>("login")
-  const [showAuthPanel, setShowAuthPanel] = createSignal(false)
-  const [inputFocused, setInputFocused] = createSignal(false)
-  const auth = useAuthStore()
-  const feedStore = useFeedStore()
+	const nav = useNavigation();
+	const toast = useToast();
+	const renderer = useRenderer();
+	const themeContext = useTheme();
+	const theme = themeContext.theme;
+	const keybind = useKeybinds();
 
-  // Centralized keyboard handler for all tab navigation and shortcuts
-  useAppKeyboard({
-    get activeTab() { return activeTab() },
-    onTabChange: setActiveTab,
-    inputFocused: inputFocused(),
-    onAction: (action) => {
-      if (action === "escape") {
-        setShowAuthPanel(false)
-        setInputFocused(false)
-      }
-    },
-  })
+	// Multimedia keys (physical play/volume/speed keys) still feed the audio
+	// backend regardless of the on-screen yazi keybinds. Seek lives on the
+	// keybind router (< / > = shift+, / shift+.), so arrows stay on navigation.
+	useMultimediaKeys({
+		playerFocused: () =>
+			nav.activeTab() === TABS.PLAYER && nav.mode() !== NavMode.NORMAL
+				? true
+				: false,
+		inputFocused: () => nav.inputFocused(),
+	});
 
-  const renderContent = () => {
-    const tab = activeTab()
+	// Mouse text-selection → clipboard (unchanged from the old shell).
+	useSelectionHandler((selection: any) => {
+		if (!selection) return;
+		const text = selection.getSelectedText?.();
+		if (!text || text.trim().length === 0) return;
+		Clipboard.copy(text)
+			.then(() =>
+				toast.show({ message: "Copied to Clipboard!", variant: "info" }),
+			)
+			.catch(toast.error)
+			.finally(() => renderer.clearSelection());
+	});
 
-    switch (tab) {
-      case "feeds":
-        return (
-          <FeedList
-            focused={true}
-            showEpisodeCount={true}
-            showLastUpdated={true}
-            onOpenFeed={(feed) => {
-              // Would open feed detail view
-            }}
-          />
-        )
+	const backgroundColor = () =>
+		themeContext.transparentBackground() ||
+		themeContext.selected === "system"
+			? "transparent"
+			: themeContext.theme.surface;
 
-      case "settings":
-        // Show auth panel or sync panel based on state
-        if (showAuthPanel()) {
-          if (auth.isAuthenticated) {
-            return (
-              <SyncProfile
-                focused={true}
-                onLogout={() => {
-                  auth.logout()
-                  setShowAuthPanel(false)
-                }}
-                onManageSync={() => setShowAuthPanel(false)}
-              />
-            )
-          }
-
-          switch (authScreen()) {
-            case "code":
-              return (
-                <CodeValidation
-                  focused={true}
-                  onBack={() => setAuthScreen("login")}
-                />
-              )
-            case "oauth":
-              return (
-                <OAuthPlaceholder
-                  focused={true}
-                  onBack={() => setAuthScreen("login")}
-                  onNavigateToCode={() => setAuthScreen("code")}
-                />
-              )
-            case "login":
-            default:
-              return (
-                <LoginScreen
-                  focused={true}
-                  onNavigateToCode={() => setAuthScreen("code")}
-                  onNavigateToOAuth={() => setAuthScreen("oauth")}
-                />
-              )
-          }
-        }
-
-        return (
-          <box flexDirection="column" gap={1}>
-            <SyncPanel />
-            <box height={1} />
-            <box border padding={1}>
-              <box flexDirection="row" gap={2}>
-                <text fg="gray">Account:</text>
-                {auth.isAuthenticated ? (
-                  <text fg="green">Signed in as {auth.user?.email}</text>
-                ) : (
-                  <text fg="yellow">Not signed in</text>
-                )}
-                <box
-                  border
-                  padding={0}
-                  onMouseDown={() => setShowAuthPanel(true)}
-                >
-                  <text fg="cyan">
-                    {auth.isAuthenticated ? "[A] Account" : "[A] Sign In"}
-                  </text>
-                </box>
-              </box>
-            </box>
-          </box>
-        )
-
-      case "discover":
-        return (
-          <DiscoverPage focused={!inputFocused()} />
-        )
-
-      case "search":
-        return (
-          <SearchPage
-            focused={!inputFocused()}
-            onInputFocusChange={setInputFocused}
-            onSubscribe={(result) => {
-              const feeds = feedStore.feeds()
-              const alreadySubscribed = feeds.some(
-                (feed) =>
-                  feed.podcast.id === result.podcast.id ||
-                  feed.podcast.feedUrl === result.podcast.feedUrl
-              )
-
-              if (!alreadySubscribed) {
-                feedStore.addFeed(
-                  { ...result.podcast, isSubscribed: true },
-                  result.sourceId,
-                  FeedVisibility.PUBLIC
-                )
-              }
-            }}
-          />
-        )
-
-      case "player":
-      default:
-        return (
-          <box border style={{ padding: 2 }}>
-            <text>
-              <strong>{tab}</strong>
-              <br />
-              Player - coming in later phases
-            </text>
-          </box>
-        )
-    }
-  }
-
-  return (
-    <Layout
-      header={
-        <TabNavigation activeTab={activeTab()} onTabSelect={setActiveTab} />
-      }
-      footer={
-        <Navigation activeTab={activeTab()} onTabSelect={setActiveTab} />
-      }
-    >
-      <box style={{ padding: 1 }}>{renderContent()}</box>
-    </Layout>
-  )
+	return (
+		<ErrorBoundary
+			fallback={(err) => (
+				<box border padding={2} borderColor={theme.error}>
+					<text fg={theme.error}>
+						Error: {err?.message ?? String(err)}
+						{"\n"}
+						Press 1-6 to switch tabs, or : to open the command bar.
+					</text>
+				</box>
+			)}
+		>
+			<box
+				flexDirection="column"
+				width="100%"
+				height="100%"
+				backgroundColor={backgroundColor()}
+			>
+				{DEBUG && (
+					<box flexDirection="row" width="100%" height={1}>
+						<text fg={theme.primary}>█</text>
+						<text fg={theme.secondary}>█</text>
+						<text fg={theme.accent}>█</text>
+						<text fg={theme.error}>█</text>
+						<text fg={theme.warning}>█</text>
+						<text fg={theme.success}>█</text>
+						<text fg={theme.info}>█</text>
+						<text fg={theme.text}>█</text>
+						<text fg={theme.textMuted}>█</text>
+						<text fg={theme.surface}>█</text>
+					</box>
+				)}
+				<Shell />
+			</box>
+		</ErrorBoundary>
+	);
 }

src/api/rss-parser.ts

@@ -0,0 +1,206 @@
+import type { Podcast } from "../types/podcast"
+import type { Episode, EpisodeType } from "../types/episode"
+import { detectContentType, ContentType } from "../utils/rss-content-detector"
+import { htmlToText } from "../utils/html-to-text"
+
+const getTagValue = (xml: string, tag: string): string => {
+  const match = xml.match(new RegExp(`<${tag}[^>]*>([\\s\\S]*?)</${tag}>`, "i"))
+  return match?.[1]?.trim() ?? ""
+}
+
+/** Get an attribute value from a self-closing or open tag */
+const getAttr = (xml: string, tag: string, attr: string): string => {
+  const tagMatch = xml.match(new RegExp(`<${tag}[^>]*>`, "i"))
+  if (!tagMatch) return ""
+  const attrMatch = tagMatch[0].match(new RegExp(`${attr}\\s*=\\s*["']([^"']*)["']`, "i"))
+  return attrMatch?.[1] ?? ""
+}
+
+const decodeEntities = (value: string) =>
+  value
+    .replace(/&lt;/g, "<")
+    .replace(/&gt;/g, ">")
+    .replace(/&amp;/g, "&")
+    .replace(/&quot;/g, '"')
+    .replace(/&#39;/g, "'")
+
+/**
+ * Clean a field (description or title): detect HTML vs plain text, and convert
+ * HTML to readable plain text. Plain text just gets entity decoding.
+ */
+const cleanField = (raw: string): string => {
+  if (!raw) return ""
+  const decoded = decodeEntities(raw)
+  const type = detectContentType(decoded)
+  if (type === ContentType.HTML) {
+    return htmlToText(decoded)
+  }
+  return decoded
+}
+
+/**
+ * Parse an itunes:duration value which can be:
+ *   - "HH:MM:SS"
+ *   - "MM:SS"
+ *   - seconds as a plain number string (e.g. "1234")
+ * Returns duration in seconds, or 0 if unparseable.
+ */
+const parseDuration = (raw: string): number => {
+  if (!raw) return 0
+  const trimmed = raw.trim()
+
+  // Pure numeric (seconds)
+  if (/^\d+$/.test(trimmed)) {
+    return parseInt(trimmed, 10)
+  }
+
+  // HH:MM:SS or MM:SS
+  const parts = trimmed.split(":").map(Number)
+  if (parts.some(isNaN)) return 0
+  if (parts.length === 3) {
+    return parts[0] * 3600 + parts[1] * 60 + parts[2]
+  }
+  if (parts.length === 2) {
+    return parts[0] * 60 + parts[1]
+  }
+  return 0
+}
+
+const parseEpisodeType = (raw: string): EpisodeType | undefined => {
+  const lower = raw.trim().toLowerCase()
+  if (lower === "trailer") return "trailer" as EpisodeType
+  if (lower === "bonus") return "bonus" as EpisodeType
+  if (lower === "full") return "full" as EpisodeType
+  return undefined
+}
+
+/** FNV-1a 32-bit hash. Deterministic across processes and Bun versions
+ *  (unlike Bun.hash) — used to derive stable episode ids from audio URLs so
+ *  a feed's episode ids never change between refreshes. */
+const fnv1a = (input: string): number => {
+  let hash = 0x811c9dc5
+  for (let i = 0; i < input.length; i++) {
+    hash ^= input.charCodeAt(i)
+    hash = Math.imul(hash, 0x01000193)
+  }
+  return hash >>> 0
+}
+
+/**
+ * Stable per-episode identity. The old positional id (`feedUrl#index`) was
+ * invalidated by ANY feed change: a new episode or a pruned one shifted
+ * every episode's index, so progress/downloads saved under `feedUrl#5`
+ * attached to whatever episode now sat at index 5 — new episodes resumed
+ * minutes in. Identity derives from stable content instead:
+ *   1. `<guid>` — the canonical per-episode identifier (required by Apple
+ *      Podcasts; nearly universal).
+ *   2. The enclosure URL, hashed to keep the id compact (hosts serve
+ *      permanent per-episode URLs; guids can be absent in hand-rolled feeds).
+ *   3. Positional index as a last resort: no guid AND no audio URL means
+ *      the episode cannot be played, so nothing persistent keys off it.
+ */
+const stableEpisodeId = (
+  feedUrl: string,
+  item: string,
+  audioUrl: string,
+  index: number,
+): string => {
+  const guid = getTagValue(item, "guid")
+  if (guid) return `${feedUrl}#guid:${guid}`
+  if (audioUrl) return `${feedUrl}#url:${fnv1a(audioUrl).toString(36)}`
+  return `${feedUrl}#${index}`
+}
+
+/** Extract the `<item>` blocks from an RSS document. Matches items directly
+ *  on the full XML string — scoping to <channel> first is a redundant 5MB
+ *  regex pass that doubles parse cost with no practical benefit (well-formed
+ *  RSS has no items outside <channel>). */
+export const getRSSItems = (xml: string): string[] => {
+  return xml.match(/<item[\s\S]*?<\/item>/gi) ?? []
+}
+
+/** Channel-level artwork: `<itunes:image href>` (podcasts) or RSS 2.0
+ *  `<image><url>`. Works on the full XML — channel-level tags precede
+ *  <item> blocks in RSS, so the first match is the channel image. */
+export const parseChannelCoverUrl = (xml: string): string | undefined => {
+  const itunesHref = getAttr(xml, "itunes:image", "href")
+  if (itunesHref) return itunesHref
+  const url = getTagValue(xml, "image").match(/<url>([\s\S]*?)<\/url>/i)?.[1]
+  return url?.trim() || undefined
+}
+
+/** Parse a single `<item>` into an Episode. Exported so the feed store can
+ *  parse large feeds in bounded chunks (yielding to the event loop between
+ *  chunks) instead of one synchronous block. */
+export const parseRSSItem = (item: string, feedUrl: string, index: number): Episode => {
+  const epTitle = cleanField(getTagValue(item, "title")) || `Episode ${index + 1}`
+  const epDescription = cleanField(getTagValue(item, "description"))
+  const pubDate = new Date(getTagValue(item, "pubDate") || Date.now())
+
+  const enclosure = item.match(/<enclosure[^>]*url=["']([^"']+)["'][^>]*>/i)
+  const audioUrl = enclosure?.[1] ?? ""
+  const fileSizeStr = getAttr(item, "enclosure", "length")
+  const fileSize = fileSizeStr ? parseInt(fileSizeStr, 10) : undefined
+  const mimeType = getAttr(item, "enclosure", "type") || undefined
+
+  const durationRaw = getTagValue(item, "itunes:duration")
+  const duration = parseDuration(durationRaw)
+
+  const episodeNumRaw = getTagValue(item, "itunes:episode")
+  const episodeNumber = episodeNumRaw ? parseInt(episodeNumRaw, 10) : undefined
+  const seasonNumRaw = getTagValue(item, "itunes:season")
+  const seasonNumber = seasonNumRaw ? parseInt(seasonNumRaw, 10) : undefined
+
+  const episodeType = parseEpisodeType(getTagValue(item, "itunes:episodeType"))
+  const explicitRaw = getTagValue(item, "itunes:explicit").toLowerCase()
+  const explicit = explicitRaw === "yes" || explicitRaw === "true" ? true : undefined
+
+  // Episode image (itunes:image has href attribute)
+  const imageUrl = getAttr(item, "itunes:image", "href") || undefined
+
+  const ep: Episode = {
+    id: stableEpisodeId(feedUrl, item, audioUrl, index),
+    podcastId: feedUrl,
+    title: epTitle,
+    description: epDescription,
+    audioUrl,
+    duration,
+    pubDate,
+  }
+
+  if (episodeNumber !== undefined && !isNaN(episodeNumber)) ep.episodeNumber = episodeNumber
+  if (seasonNumber !== undefined && !isNaN(seasonNumber)) ep.seasonNumber = seasonNumber
+  if (episodeType) ep.episodeType = episodeType
+  if (explicit !== undefined) ep.explicit = explicit
+  if (imageUrl) ep.imageUrl = imageUrl
+  if (fileSize !== undefined && !isNaN(fileSize) && fileSize > 0) ep.fileSize = fileSize
+  if (mimeType) ep.mimeType = mimeType
+
+  return ep
+}
+
+/** Parse a full RSS document (channel metadata + all episodes). The sync
+ *  whole-feed variant — callers that parse potentially huge feeds on a UI
+ *  thread should prefer the store's chunked incremental parse instead. */
+export const parseRSSFeed = (xml: string, feedUrl: string): Podcast & { episodes: Episode[] } => {
+  const channel = xml.match(/<channel[\s\S]*?<\/channel>/i)?.[0] ?? xml
+  const title = cleanField(getTagValue(channel, "title")) || "Untitled Podcast"
+  const description = cleanField(getTagValue(channel, "description"))
+  const author = decodeEntities(getTagValue(channel, "itunes:author"))
+  const lastUpdated = new Date()
+
+  const items = getRSSItems(xml)
+  const episodes = items.map((item, index) => parseRSSItem(item, feedUrl, index))
+
+  return {
+    id: feedUrl,
+    title,
+    description,
+    author,
+    feedUrl,
+    lastUpdated,
+    isSubscribed: true,
+    coverUrl: parseChannelCoverUrl(channel),
+    episodes,
+  }
+}

src/components/BoxLayout.tsx

@@ -1,42 +0,0 @@
-import type { JSX } from "solid-js"
-
-type BoxLayoutProps = {
-  children?: JSX.Element
-  flexDirection?: "row" | "column" | "row-reverse" | "column-reverse"
-  justifyContent?:
-    | "flex-start"
-    | "flex-end"
-    | "center"
-    | "space-between"
-    | "space-around"
-    | "space-evenly"
-  alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
-  gap?: number
-  width?: number | "auto" | `${number}%`
-  height?: number | "auto" | `${number}%`
-  padding?: number
-  margin?: number
-  border?: boolean
-  title?: string
-}
-
-export function BoxLayout(props: BoxLayoutProps) {
-  return (
-    <box
-      style={{
-        flexDirection: props.flexDirection,
-        justifyContent: props.justifyContent,
-        alignItems: props.alignItems,
-        gap: props.gap,
-        width: props.width,
-        height: props.height,
-        padding: props.padding,
-        margin: props.margin,
-      }}
-      border={props.border}
-      title={props.title}
-    >
-      {props.children}
-    </box>
-  )
-}

src/components/CategoryFilter.tsx

@@ -1,40 +0,0 @@
-/**
- * CategoryFilter component - Horizontal category filter tabs
- */
-
-import { For } from "solid-js"
-import type { DiscoverCategory } from "../stores/discover"
-
-type CategoryFilterProps = {
-  categories: DiscoverCategory[]
-  selectedCategory: string
-  focused: boolean
-  onSelect?: (categoryId: string) => void
-}
-
-export function CategoryFilter(props: CategoryFilterProps) {
-  return (
-    <box flexDirection="row" gap={1} flexWrap="wrap">
-      <For each={props.categories}>
-        {(category) => {
-          const isSelected = () => props.selectedCategory === category.id
-
-          return (
-            <box
-              padding={0}
-              paddingLeft={1}
-              paddingRight={1}
-              border={isSelected()}
-              backgroundColor={isSelected() ? "#444" : undefined}
-              onMouseDown={() => props.onSelect?.(category.id)}
-            >
-              <text fg={isSelected() ? "cyan" : "gray"}>
-                {category.icon} {category.name}
-              </text>
-            </box>
-          )
-        }}
-      </For>
-    </box>
-  )
-}

src/components/CodeValidation.tsx

@@ -1,172 +0,0 @@
-/**
- * Code validation component for PodTUI
- * 8-character alphanumeric code input for sync authentication
- */
-
-import { createSignal } from "solid-js"
-import { useAuthStore } from "../stores/auth"
-import { AUTH_CONFIG } from "../config/auth"
-
-interface CodeValidationProps {
-  focused?: boolean
-  onBack?: () => void
-}
-
-type FocusField = "code" | "submit" | "back"
-
-export function CodeValidation(props: CodeValidationProps) {
-  const auth = useAuthStore()
-  const [code, setCode] = createSignal("")
-  const [focusField, setFocusField] = createSignal<FocusField>("code")
-  const [codeError, setCodeError] = createSignal<string | null>(null)
-
-  const fields: FocusField[] = ["code", "submit", "back"]
-
-  /** Format code as user types (uppercase, alphanumeric only) */
-  const handleCodeInput = (value: string) => {
-    const formatted = value.toUpperCase().replace(/[^A-Z0-9]/g, "")
-    // Limit to max length
-    const limited = formatted.slice(0, AUTH_CONFIG.codeValidation.codeLength)
-    setCode(limited)
-
-    // Clear error when typing
-    if (codeError()) {
-      setCodeError(null)
-    }
-  }
-
-  const validateCode = (value: string): boolean => {
-    if (!value) {
-      setCodeError("Code is required")
-      return false
-    }
-    if (value.length !== AUTH_CONFIG.codeValidation.codeLength) {
-      setCodeError(`Code must be ${AUTH_CONFIG.codeValidation.codeLength} characters`)
-      return false
-    }
-    if (!AUTH_CONFIG.codeValidation.allowedChars.test(value)) {
-      setCodeError("Code must contain only letters and numbers")
-      return false
-    }
-    setCodeError(null)
-    return true
-  }
-
-  const handleSubmit = async () => {
-    if (!validateCode(code())) {
-      return
-    }
-
-    const success = await auth.validateCode(code())
-    if (!success && auth.error) {
-      setCodeError(auth.error.message)
-    }
-  }
-
-  const handleKeyPress = (key: { name: string; shift?: boolean }) => {
-    if (key.name === "tab") {
-      const currentIndex = fields.indexOf(focusField())
-      const nextIndex = key.shift
-        ? (currentIndex - 1 + fields.length) % fields.length
-        : (currentIndex + 1) % fields.length
-      setFocusField(fields[nextIndex])
-    } else if (key.name === "return" || key.name === "enter") {
-      if (focusField() === "submit") {
-        handleSubmit()
-      } else if (focusField() === "back" && props.onBack) {
-        props.onBack()
-      }
-    } else if (key.name === "escape" && props.onBack) {
-      props.onBack()
-    }
-  }
-
-  const codeProgress = () => {
-    const len = code().length
-    const max = AUTH_CONFIG.codeValidation.codeLength
-    return `${len}/${max}`
-  }
-
-  const codeDisplay = () => {
-    const current = code()
-    const max = AUTH_CONFIG.codeValidation.codeLength
-    const filled = current.split("")
-    const empty = Array(max - filled.length).fill("_")
-    return [...filled, ...empty].join(" ")
-  }
-
-  return (
-    <box flexDirection="column" border padding={2} gap={1}>
-      <text>
-        <strong>Enter Sync Code</strong>
-      </text>
-
-      <box height={1} />
-
-      <text fg="gray">Enter your 8-character sync code to link your account.</text>
-      <text fg="gray">You can get this code from the web portal.</text>
-
-      <box height={1} />
-
-      {/* Code display */}
-      <box flexDirection="column" gap={0}>
-        <text fg={focusField() === "code" ? "cyan" : undefined}>
-          Code ({codeProgress()}):
-        </text>
-
-        <box border padding={1}>
-          <text fg={code().length === AUTH_CONFIG.codeValidation.codeLength ? "green" : "yellow"}>
-            {codeDisplay()}
-          </text>
-        </box>
-
-        {/* Hidden input for actual typing */}
-        <input
-          value={code()}
-          onInput={handleCodeInput}
-          placeholder=""
-          focused={props.focused && focusField() === "code"}
-          width={30}
-        />
-
-        {codeError() && (
-          <text fg="red">{codeError()}</text>
-        )}
-      </box>
-
-      <box height={1} />
-
-      {/* Action buttons */}
-      <box flexDirection="row" gap={2}>
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "submit" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "submit" ? "cyan" : undefined}>
-            {auth.isLoading ? "Validating..." : "[Enter] Validate Code"}
-          </text>
-        </box>
-
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "back" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "back" ? "yellow" : "gray"}>
-            [Esc] Back to Login
-          </text>
-        </box>
-      </box>
-
-      {/* Auth error message */}
-      {auth.error && (
-        <text fg="red">{auth.error.message}</text>
-      )}
-
-      <box height={1} />
-
-      <text fg="gray">Tab to navigate, Enter to select, Esc to go back</text>
-    </box>
-  )
-}

src/components/Column.tsx

@@ -1,35 +0,0 @@
-import type { JSX } from "solid-js"
-
-type ColumnProps = {
-  children?: JSX.Element
-  gap?: number
-  alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
-  justifyContent?:
-    | "flex-start"
-    | "flex-end"
-    | "center"
-    | "space-between"
-    | "space-around"
-    | "space-evenly"
-  width?: number | "auto" | `${number}%`
-  height?: number | "auto" | `${number}%`
-  padding?: number
-}
-
-export function Column(props: ColumnProps) {
-  return (
-    <box
-      style={{
-        flexDirection: "column",
-        gap: props.gap,
-        alignItems: props.alignItems,
-        justifyContent: props.justifyContent,
-        width: props.width,
-        height: props.height,
-        padding: props.padding,
-      }}
-    >
-      {props.children}
-    </box>
-  )
-}

src/components/DiscoverPage.tsx

@@ -1,177 +0,0 @@
-/**
- * DiscoverPage component - Main discover/browse interface for PodTUI
- */
-
-import { createSignal } from "solid-js"
-import { useKeyboard } from "@opentui/solid"
-import { useDiscoverStore, DISCOVER_CATEGORIES } from "../stores/discover"
-import { CategoryFilter } from "./CategoryFilter"
-import { TrendingShows } from "./TrendingShows"
-
-type DiscoverPageProps = {
-  focused: boolean
-}
-
-type FocusArea = "categories" | "shows"
-
-export function DiscoverPage(props: DiscoverPageProps) {
-  const discoverStore = useDiscoverStore()
-  const [focusArea, setFocusArea] = createSignal<FocusArea>("shows")
-  const [showIndex, setShowIndex] = createSignal(0)
-  const [categoryIndex, setCategoryIndex] = createSignal(0)
-
-  // Keyboard navigation
-  useKeyboard((key) => {
-    if (!props.focused) return
-
-    const area = focusArea()
-
-    // Tab switches focus between categories and shows
-    if (key.name === "tab") {
-      if (key.shift) {
-        setFocusArea((a) => (a === "categories" ? "shows" : "categories"))
-      } else {
-        setFocusArea((a) => (a === "categories" ? "shows" : "categories"))
-      }
-      return
-    }
-
-    // Category navigation
-    if (area === "categories") {
-      if (key.name === "left" || key.name === "h") {
-        setCategoryIndex((i) => Math.max(0, i - 1))
-        const cat = DISCOVER_CATEGORIES[categoryIndex()]
-        if (cat) discoverStore.setSelectedCategory(cat.id)
-        setShowIndex(0) // Reset show selection when changing category
-        return
-      }
-      if (key.name === "right" || key.name === "l") {
-        setCategoryIndex((i) => Math.min(DISCOVER_CATEGORIES.length - 1, i + 1))
-        const cat = DISCOVER_CATEGORIES[categoryIndex()]
-        if (cat) discoverStore.setSelectedCategory(cat.id)
-        setShowIndex(0)
-        return
-      }
-      if (key.name === "enter") {
-        // Select category and move to shows
-        setFocusArea("shows")
-        return
-      }
-      if (key.name === "down" || key.name === "j") {
-        setFocusArea("shows")
-        return
-      }
-    }
-
-    // Shows navigation
-    if (area === "shows") {
-      const shows = discoverStore.filteredPodcasts()
-      if (key.name === "down" || key.name === "j") {
-        setShowIndex((i) => Math.min(i + 1, shows.length - 1))
-        return
-      }
-      if (key.name === "up" || key.name === "k") {
-        const newIndex = showIndex() - 1
-        if (newIndex < 0) {
-          setFocusArea("categories")
-        } else {
-          setShowIndex(newIndex)
-        }
-        return
-      }
-      if (key.name === "enter") {
-        // Subscribe/unsubscribe
-        const podcast = shows[showIndex()]
-        if (podcast) {
-          discoverStore.toggleSubscription(podcast.id)
-        }
-        return
-      }
-    }
-
-    // Refresh with 'r'
-    if (key.name === "r") {
-      discoverStore.refresh()
-      return
-    }
-  })
-
-  const handleCategorySelect = (categoryId: string) => {
-    discoverStore.setSelectedCategory(categoryId)
-    const index = DISCOVER_CATEGORIES.findIndex((c) => c.id === categoryId)
-    if (index >= 0) setCategoryIndex(index)
-    setShowIndex(0)
-  }
-
-  const handleShowSelect = (index: number) => {
-    setShowIndex(index)
-    setFocusArea("shows")
-  }
-
-  const handleSubscribe = (podcast: { id: string }) => {
-    discoverStore.toggleSubscription(podcast.id)
-  }
-
-  return (
-    <box flexDirection="column" height="100%" gap={1}>
-      {/* Header */}
-      <box flexDirection="row" justifyContent="space-between" alignItems="center">
-          <text>
-            <strong>Discover Podcasts</strong>
-          </text>
-        <box flexDirection="row" gap={2}>
-          <text fg="gray">
-            {discoverStore.filteredPodcasts().length} shows
-          </text>
-          <box onMouseDown={() => discoverStore.refresh()}>
-            <text fg="cyan">[R] Refresh</text>
-          </box>
-        </box>
-      </box>
-
-      {/* Category Filter */}
-      <box border padding={1}>
-        <box flexDirection="column" gap={1}>
-          <text fg={focusArea() === "categories" ? "cyan" : "gray"}>
-            Categories:
-          </text>
-          <CategoryFilter
-            categories={discoverStore.categories}
-            selectedCategory={discoverStore.selectedCategory()}
-            focused={focusArea() === "categories"}
-            onSelect={handleCategorySelect}
-          />
-        </box>
-      </box>
-
-      {/* Trending Shows */}
-      <box flexDirection="column" flexGrow={1} border>
-          <box padding={1}>
-            <text fg={focusArea() === "shows" ? "cyan" : "gray"}>
-              Trending in {
-                DISCOVER_CATEGORIES.find(
-                  (c) => c.id === discoverStore.selectedCategory()
-                )?.name ?? "All"
-              }
-            </text>
-          </box>
-        <TrendingShows
-          podcasts={discoverStore.filteredPodcasts()}
-          selectedIndex={showIndex()}
-          focused={focusArea() === "shows"}
-          isLoading={discoverStore.isLoading()}
-          onSelect={handleShowSelect}
-          onSubscribe={handleSubscribe}
-        />
-      </box>
-
-      {/* Footer Hints */}
-      <box flexDirection="row" gap={2}>
-        <text fg="gray">[Tab] Switch focus</text>
-        <text fg="gray">[j/k] Navigate</text>
-        <text fg="gray">[Enter] Subscribe</text>
-        <text fg="gray">[R] Refresh</text>
-      </box>
-    </box>
-  )
-}

src/components/EpisodeList.tsx

@@ -0,0 +1,246 @@
+/**
+ * Shared list-row and preview components for the Feed and My Shows pages.
+ *
+ * Both pages render the same episode rows (marker + title, optional subtitle
+ * line, date/duration/selection/download meta line), "[Fetch More]" rows, and
+ * hovered-episode / fetch-more preview panes; the pages differ only in the
+ * props they pass (subtitle line, hint text, manual-mode wording). Extracted
+ * so the previously 3-4-level-nested render blocks run as flat named
+ * components.
+ *
+ * Anything that can change at runtime arrives as a signal getter: Solid
+ * components do not re-render, so only props that are called inside the
+ * component's own JSX stay reactive (focus, selection, download state).
+ */
+
+import { Show } from "solid-js";
+import { format } from "date-fns";
+import type { RGBA } from "@opentui/core";
+import { useTheme } from "@/context/ThemeContext";
+import { useScrollIntoView } from "@/hooks/useScrollIntoView";
+import { NF_ICONS } from "@/utils/nerd-fonts";
+import { LoadingIndicator } from "@/components/LoadingIndicator";
+import type { Episode } from "@/types/episode";
+
+// ── formatting helpers ──────────────────────────────────────────────────────
+export const formatDate = (d: Date) => format(d, "MMM d, yyyy");
+
+export const formatDuration = (s: number) => {
+	const mins = Math.floor(s / 60);
+	const hrs = Math.floor(mins / 60);
+	return hrs > 0 ? `${hrs}h ${mins % 60}m` : `${mins}m`;
+};
+
+// ── EpisodeRow ──────────────────────────────────────────────────────────────
+export function EpisodeRow(props: {
+	/** The episode this row renders. */
+	episode: Episode;
+	/** Optional second line under the title (podcast/show name). */
+	subtitle?: () => string | undefined;
+	/** For index signal (row position). */
+	index: () => number;
+	/** Focused row index in this list (-1 while the Fetch More row is
+	 *  focused, so no episode row draws the cursor). */
+	focused: () => number;
+	/** Whether the current pane has keyboard focus. */
+	active: () => boolean;
+	/** Whether this episode is selection-marked. */
+	selected: () => boolean;
+	downloadLabel: () => string;
+	downloadColor: () => RGBA;
+	marker: () => string;
+	onMouseDown: () => void;
+}) {
+	const { theme } = useTheme();
+	const muted = () => theme.muted || theme.text;
+	const ref = useScrollIntoView(() => props.index() === props.focused());
+	const isFocused = () => props.index() === props.focused();
+	const bg = () =>
+		isFocused() && props.active()
+			? theme.primary
+			: isFocused()
+				? theme.border
+				: undefined;
+	const fg = () =>
+		isFocused() && props.active()
+			? theme.surface
+			: isFocused()
+				? theme.selectedListItemText ?? theme.text
+				: theme.text;
+	return (
+		<box
+			ref={ref}
+			flexDirection="column"
+			gap={0}
+			paddingRight={1}
+			backgroundColor={bg()}
+			onMouseDown={props.onMouseDown}
+		>
+			<box flexDirection="row" gap={1}>
+				<text flexShrink={0} fg={fg()}>
+					{isFocused() ? props.marker() : " "}
+				</text>
+				<text wrapMode="none" truncate fg={fg()}>
+					{props.episode.episodeNumber ? `#${props.episode.episodeNumber} ` : ""}
+					{props.episode.title}
+				</text>
+			</box>
+			{/* podcast name on its own row — readable at a glance; the 50%
+			    current pane fits it in full for typical names, and truncate
+			    keeps the row one line tall either way */}
+			<Show when={props.subtitle?.()}>
+				<box paddingLeft={2}>
+					<text
+						wrapMode="none"
+						truncate
+						fg={isFocused() ? theme.surface : theme.textSecondary}
+					>
+						{props.subtitle?.()}
+					</text>
+				</box>
+			</Show>
+			<box flexDirection="row" gap={2} paddingLeft={2}>
+				<text flexShrink={0} fg={isFocused() ? theme.surface : theme.info}>
+					{formatDate(props.episode.pubDate)}
+				</text>
+				<text flexShrink={0} fg={isFocused() ? theme.surface : muted()}>
+					{formatDuration(props.episode.duration)}
+				</text>
+				<Show when={props.selected()}>
+					<text flexShrink={0} fg={theme.warning}>
+						●
+					</text>
+				</Show>
+				<Show when={props.downloadLabel()}>
+					<text flexShrink={0} fg={props.downloadColor()}>
+						{props.downloadLabel()}
+					</text>
+				</Show>
+			</box>
+		</box>
+	);
+}
+
+// ── FetchMoreRow ────────────────────────────────────────────────────────────
+export function FetchMoreRow(props: {
+	/** Row index of the Fetch More button within the list. */
+	index: () => number;
+	/** Focused row index. */
+	focused: () => number;
+	/** True while the Fetch More row itself is focused. */
+	onMore: () => boolean;
+	/** Whether the current pane has keyboard focus. */
+	active: () => boolean;
+	isLoadingMore: () => boolean;
+	nerd: boolean;
+	marker: () => string;
+	onMouseDown: () => void;
+}) {
+	const { theme } = useTheme();
+	const ref = useScrollIntoView(props.onMore);
+	const bg = () =>
+		props.index() === props.focused() && props.active()
+			? theme.primary
+			: props.index() === props.focused()
+				? theme.border
+				: undefined;
+	const fg = () =>
+		props.index() === props.focused() && props.active()
+			? theme.surface
+			: props.index() === props.focused()
+				? theme.selectedListItemText ?? theme.text
+				: theme.text;
+	return (
+		<box
+			ref={ref}
+			flexDirection="row"
+			gap={1}
+			paddingRight={1}
+			backgroundColor={bg()}
+			onMouseDown={props.onMouseDown}
+		>
+			<text fg={fg()}>{props.onMore() ? props.marker() : " "}</text>
+			{props.nerd && (
+				<text fg={fg()}>{NF_ICONS.more}</text>
+			)}
+			<Show
+				when={!props.isLoadingMore()}
+				fallback={<LoadingIndicator label="Fetching…" />}
+			>
+				<text fg={fg()}>[Fetch More]</text>
+			</Show>
+		</box>
+	);
+}
+
+// ── EpisodePreview ──────────────────────────────────────────────────────────
+export function EpisodePreview(props: {
+	episode: () => Episode;
+	/** Optional line under the meta row (podcast/show name). */
+	subtitle?: () => string | undefined;
+	author: () => string | undefined;
+	downloadLabel: () => string;
+	downloadColor: () => RGBA;
+	/** Page-specific action-hint line. */
+	hint: () => string;
+}) {
+	const { theme } = useTheme();
+	const muted = () => theme.muted || theme.text;
+	return (
+		<box flexDirection="column" gap={1} padding={1}>
+			<text fg={theme.textPrimary ?? theme.text}>
+				<strong>
+					{props.episode().episodeNumber ? `#${props.episode().episodeNumber} ` : ""}
+					{props.episode().title}
+				</strong>
+			</text>
+			<box flexDirection="row" gap={2}>
+				<text fg={theme.info}>{formatDate(props.episode().pubDate)}</text>
+				<text fg={muted()}>{formatDuration(props.episode().duration)}</text>
+				<Show when={props.downloadLabel()}>
+					<text fg={props.downloadColor()}>{props.downloadLabel()}</text>
+				</Show>
+			</box>
+			<Show when={props.subtitle?.()}>
+				<text fg={muted()}>{props.subtitle?.()}</text>
+			</Show>
+			<Show when={props.author()}>
+				<text fg={muted()}>by {props.author()}</text>
+			</Show>
+			<box height={1} />
+			<text fg={theme.textSecondary}>
+				{props.episode().description?.slice(0, 400) ?? "No description available."}
+				{(props.episode().description?.length ?? 0) > 400 ? "…" : ""}
+			</text>
+			<box height={1} />
+			<text fg={muted()}>{props.hint()}</text>
+		</box>
+	);
+}
+
+// ── FetchMorePreview ────────────────────────────────────────────────────────
+export function FetchMorePreview(props: {
+	isLoadingMore: () => boolean;
+	fetchMoreMode: () => string;
+	/** Manual-mode explanation line ("across all feeds" vs "for this show"). */
+	manualText: () => string;
+}) {
+	const { theme } = useTheme();
+	const muted = () => theme.muted || theme.text;
+	return (
+		<box flexDirection="column" gap={1} padding={1}>
+			<text fg={theme.textPrimary ?? theme.text}>
+				<strong>[Fetch More]</strong>
+			</text>
+			<text fg={muted()}>
+				{props.isLoadingMore()
+					? "Loading the next batch of episodes…"
+					: props.fetchMoreMode() === "auto"
+						? "Auto mode: the next batch loads automatically at the bottom of the list."
+						: props.manualText()}
+			</text>
+			<box height={1} />
+			<text fg={muted()}>enter: load more · h back</text>
+		</box>
+	);
+}

src/components/ExportDialog.tsx

@@ -1,36 +0,0 @@
-const createSignal = <T,>(value: T): [() => T, (next: T) => void] => {
-  let current = value
-  return [() => current, (next) => {
-    current = next
-  }]
-}
-
-import { SyncStatus } from "./SyncStatus"
-
-export function ExportDialog() {
-  const filename = createSignal("podcast-sync.json")
-  const format = createSignal<"json" | "xml">("json")
-
-  return (
-    <box border title="Export" style={{ padding: 1, flexDirection: "column", gap: 1 }}>
-      <box style={{ flexDirection: "row", gap: 1 }}>
-        <text>File:</text>
-        <input value={filename[0]()} onInput={filename[1]} style={{ width: 30 }} />
-      </box>
-      <box style={{ flexDirection: "row", gap: 1 }}>
-        <text>Format:</text>
-        <tab_select
-          options={[
-            { name: "JSON", description: "Portable" },
-            { name: "XML", description: "Structured" },
-          ]}
-          onSelect={(index) => format[1](index === 0 ? "json" : "xml")}
-        />
-      </box>
-      <box border>
-        <text>Export {format[0]()} to {filename[0]()}</text>
-      </box>
-      <SyncStatus />
-    </box>
-  )
-}

src/components/FeedDetail.tsx

@@ -1,172 +0,0 @@
-/**
- * Feed detail view component for PodTUI
- * Shows podcast info and episode list
- */
-
-import { createSignal, For, Show } from "solid-js"
-import type { Feed } from "../types/feed"
-import type { Episode } from "../types/episode"
-import { format } from "date-fns"
-
-interface FeedDetailProps {
-  feed: Feed
-  focused?: boolean
-  onBack?: () => void
-  onPlayEpisode?: (episode: Episode) => void
-}
-
-export function FeedDetail(props: FeedDetailProps) {
-  const [selectedIndex, setSelectedIndex] = createSignal(0)
-  const [showInfo, setShowInfo] = createSignal(true)
-
-  const episodes = () => {
-    // Sort episodes by publication date (newest first)
-    return [...props.feed.episodes].sort(
-      (a, b) => b.pubDate.getTime() - a.pubDate.getTime()
-    )
-  }
-
-  const formatDuration = (seconds: number): string => {
-    const mins = Math.floor(seconds / 60)
-    const hrs = Math.floor(mins / 60)
-    if (hrs > 0) {
-      return `${hrs}h ${mins % 60}m`
-    }
-    return `${mins}m`
-  }
-
-  const formatDate = (date: Date): string => {
-    return format(date, "MMM d, yyyy")
-  }
-
-  const handleKeyPress = (key: { name: string }) => {
-    const eps = episodes()
-
-    if (key.name === "escape" && props.onBack) {
-      props.onBack()
-      return
-    }
-
-    if (key.name === "i") {
-      setShowInfo((v) => !v)
-      return
-    }
-
-    if (key.name === "up" || key.name === "k") {
-      setSelectedIndex((i) => Math.max(0, i - 1))
-    } else if (key.name === "down" || key.name === "j") {
-      setSelectedIndex((i) => Math.min(eps.length - 1, i + 1))
-    } else if (key.name === "return" || key.name === "enter") {
-      const episode = eps[selectedIndex()]
-      if (episode && props.onPlayEpisode) {
-        props.onPlayEpisode(episode)
-      }
-    } else if (key.name === "home" || key.name === "g") {
-      setSelectedIndex(0)
-    } else if (key.name === "end") {
-      setSelectedIndex(eps.length - 1)
-    } else if (key.name === "pageup") {
-      setSelectedIndex((i) => Math.max(0, i - 10))
-    } else if (key.name === "pagedown") {
-      setSelectedIndex((i) => Math.min(eps.length - 1, i + 10))
-    }
-  }
-
-  return (
-    <box flexDirection="column" gap={1}>
-      {/* Header with back button */}
-      <box flexDirection="row" justifyContent="space-between">
-        <box border padding={0} onMouseDown={props.onBack}>
-          <text fg="cyan">[Esc] Back</text>
-        </box>
-        <box border padding={0} onMouseDown={() => setShowInfo((v) => !v)}>
-          <text fg="cyan">[i] {showInfo() ? "Hide" : "Show"} Info</text>
-        </box>
-      </box>
-
-      {/* Podcast info section */}
-      <Show when={showInfo()}>
-        <box border padding={1} flexDirection="column" gap={0}>
-          <text>
-            <strong>{props.feed.customName || props.feed.podcast.title}</strong>
-          </text>
-          {props.feed.podcast.author && (
-            <box flexDirection="row" gap={1}>
-              <text fg="gray">by</text>
-              <text fg="cyan">{props.feed.podcast.author}</text>
-            </box>
-          )}
-          <box height={1} />
-          <text fg="gray">
-            {props.feed.podcast.description?.slice(0, 200)}
-            {(props.feed.podcast.description?.length || 0) > 200 ? "..." : ""}
-          </text>
-          <box height={1} />
-          <box flexDirection="row" gap={2}>
-            <box flexDirection="row" gap={1}>
-              <text fg="gray">Episodes:</text>
-              <text fg="white">{props.feed.episodes.length}</text>
-            </box>
-            <box flexDirection="row" gap={1}>
-              <text fg="gray">Updated:</text>
-              <text fg="white">{formatDate(props.feed.lastUpdated)}</text>
-            </box>
-            <text fg={props.feed.visibility === "public" ? "green" : "yellow"}>
-              {props.feed.visibility === "public" ? "[Public]" : "[Private]"}
-            </text>
-            {props.feed.isPinned && (
-              <text fg="yellow">[Pinned]</text>
-            )}
-          </box>
-        </box>
-      </Show>
-
-      {/* Episodes header */}
-      <box flexDirection="row" justifyContent="space-between">
-        <text>
-          <strong>Episodes</strong>
-        </text>
-        <text fg="gray">({episodes().length} total)</text>
-      </box>
-
-      {/* Episode list */}
-      <scrollbox height={showInfo() ? 10 : 15} focused={props.focused}>
-        <For each={episodes()}>
-          {(episode, index) => (
-            <box
-              flexDirection="column"
-              gap={0}
-              padding={1}
-              backgroundColor={index() === selectedIndex() ? "#333" : undefined}
-              onMouseDown={() => {
-                setSelectedIndex(index())
-                if (props.onPlayEpisode) {
-                  props.onPlayEpisode(episode)
-                }
-              }}
-            >
-              <box flexDirection="row" gap={1}>
-                <text fg={index() === selectedIndex() ? "cyan" : "gray"}>
-                  {index() === selectedIndex() ? ">" : " "}
-                </text>
-                <text fg={index() === selectedIndex() ? "white" : undefined}>
-                  {episode.episodeNumber ? `#${episode.episodeNumber} - ` : ""}
-                  {episode.title}
-                </text>
-              </box>
-              <box flexDirection="row" gap={2} paddingLeft={2}>
-                <text fg="gray">{formatDate(episode.pubDate)}</text>
-                <text fg="gray">{formatDuration(episode.duration)}</text>
-              </box>
-            </box>
-          )}
-        </For>
-      </scrollbox>
-
-      {/* Help text */}
-      <text fg="gray">
-        j/k to navigate, Enter to play, i to toggle info, Esc to go back
-      </text>
-    </box>
-  )
-}

src/components/FeedFilter.tsx

@@ -1,169 +0,0 @@
-/**
- * Feed filter component for PodTUI
- * Toggle and filter options for feed list
- */
-
-import { createSignal } from "solid-js"
-import { FeedVisibility, FeedSortField } from "../types/feed"
-import type { FeedFilter } from "../types/feed"
-
-interface FeedFilterProps {
-  filter: FeedFilter
-  focused?: boolean
-  onFilterChange: (filter: FeedFilter) => void
-}
-
-type FilterField = "visibility" | "sort" | "pinned" | "search"
-
-export function FeedFilterComponent(props: FeedFilterProps) {
-  const [focusField, setFocusField] = createSignal<FilterField>("visibility")
-  const [searchValue, setSearchValue] = createSignal(props.filter.searchQuery || "")
-
-  const fields: FilterField[] = ["visibility", "sort", "pinned", "search"]
-
-  const handleKeyPress = (key: { name: string; shift?: boolean }) => {
-    if (key.name === "tab") {
-      const currentIndex = fields.indexOf(focusField())
-      const nextIndex = key.shift
-        ? (currentIndex - 1 + fields.length) % fields.length
-        : (currentIndex + 1) % fields.length
-      setFocusField(fields[nextIndex])
-    } else if (key.name === "return" || key.name === "enter") {
-      if (focusField() === "visibility") {
-        cycleVisibility()
-      } else if (focusField() === "sort") {
-        cycleSort()
-      } else if (focusField() === "pinned") {
-        togglePinned()
-      }
-    } else if (key.name === "space") {
-      if (focusField() === "pinned") {
-        togglePinned()
-      }
-    }
-  }
-
-  const cycleVisibility = () => {
-    const current = props.filter.visibility
-    let next: FeedVisibility | "all"
-    if (current === "all") next = FeedVisibility.PUBLIC
-    else if (current === FeedVisibility.PUBLIC) next = FeedVisibility.PRIVATE
-    else next = "all"
-    props.onFilterChange({ ...props.filter, visibility: next })
-  }
-
-  const cycleSort = () => {
-    const sortOptions: FeedSortField[] = [
-      FeedSortField.UPDATED,
-      FeedSortField.TITLE,
-      FeedSortField.EPISODE_COUNT,
-      FeedSortField.LATEST_EPISODE,
-    ]
-    const currentIndex = sortOptions.indexOf(props.filter.sortBy as FeedSortField)
-    const nextIndex = (currentIndex + 1) % sortOptions.length
-    props.onFilterChange({ ...props.filter, sortBy: sortOptions[nextIndex] })
-  }
-
-  const togglePinned = () => {
-    props.onFilterChange({
-      ...props.filter,
-      pinnedOnly: !props.filter.pinnedOnly,
-    })
-  }
-
-  const handleSearchInput = (value: string) => {
-    setSearchValue(value)
-    props.onFilterChange({ ...props.filter, searchQuery: value })
-  }
-
-  const visibilityLabel = () => {
-    const vis = props.filter.visibility
-    if (vis === "all") return "All"
-    if (vis === "public") return "Public"
-    return "Private"
-  }
-
-  const visibilityColor = () => {
-    const vis = props.filter.visibility
-    if (vis === "public") return "green"
-    if (vis === "private") return "yellow"
-    return "white"
-  }
-
-  const sortLabel = () => {
-    const sort = props.filter.sortBy
-    switch (sort) {
-      case "title":
-        return "Title"
-      case "episodeCount":
-        return "Episodes"
-      case "latestEpisode":
-        return "Latest"
-      case "updated":
-      default:
-        return "Updated"
-    }
-  }
-
-  return (
-    <box flexDirection="column" border padding={1} gap={1}>
-      <text>
-        <strong>Filter Feeds</strong>
-      </text>
-
-      <box flexDirection="row" gap={2} flexWrap="wrap">
-        {/* Visibility filter */}
-        <box
-          border
-          padding={0}
-          backgroundColor={focusField() === "visibility" ? "#333" : undefined}
-        >
-          <box flexDirection="row" gap={1}>
-            <text fg={focusField() === "visibility" ? "cyan" : "gray"}>Show:</text>
-            <text fg={visibilityColor()}>{visibilityLabel()}</text>
-          </box>
-        </box>
-
-        {/* Sort filter */}
-        <box
-          border
-          padding={0}
-          backgroundColor={focusField() === "sort" ? "#333" : undefined}
-        >
-          <box flexDirection="row" gap={1}>
-            <text fg={focusField() === "sort" ? "cyan" : "gray"}>Sort:</text>
-            <text fg="white">{sortLabel()}</text>
-          </box>
-        </box>
-
-        {/* Pinned filter */}
-        <box
-          border
-          padding={0}
-          backgroundColor={focusField() === "pinned" ? "#333" : undefined}
-        >
-          <box flexDirection="row" gap={1}>
-            <text fg={focusField() === "pinned" ? "cyan" : "gray"}>Pinned:</text>
-            <text fg={props.filter.pinnedOnly ? "yellow" : "gray"}>
-              {props.filter.pinnedOnly ? "Yes" : "No"}
-            </text>
-          </box>
-        </box>
-      </box>
-
-      {/* Search box */}
-      <box flexDirection="row" gap={1}>
-        <text fg={focusField() === "search" ? "cyan" : "gray"}>Search:</text>
-        <input
-          value={searchValue()}
-          onInput={handleSearchInput}
-          placeholder="Filter by name..."
-          focused={props.focused && focusField() === "search"}
-          width={25}
-        />
-      </box>
-
-      <text fg="gray">Tab to navigate, Enter/Space to toggle</text>
-    </box>
-  )
-}

src/components/FeedItem.tsx

@@ -1,109 +0,0 @@
-/**
- * Feed item component for PodTUI
- * Displays a single feed/podcast in the list
- */
-
-import type { Feed, FeedVisibility } from "../types/feed"
-import { format } from "date-fns"
-
-interface FeedItemProps {
-  feed: Feed
-  isSelected: boolean
-  showEpisodeCount?: boolean
-  showLastUpdated?: boolean
-  compact?: boolean
-}
-
-export function FeedItem(props: FeedItemProps) {
-  const formatDate = (date: Date): string => {
-    return format(date, "MMM d")
-  }
-
-  const episodeCount = () => props.feed.episodes.length
-  const unplayedCount = () => {
-    // This would be calculated based on episode status
-    return props.feed.episodes.length
-  }
-
-  const visibilityIcon = () => {
-    return props.feed.visibility === "public" ? "[P]" : "[*]"
-  }
-
-  const visibilityColor = () => {
-    return props.feed.visibility === "public" ? "green" : "yellow"
-  }
-
-  const pinnedIndicator = () => {
-    return props.feed.isPinned ? "*" : " "
-  }
-
-  if (props.compact) {
-    // Compact single-line view
-    return (
-      <box
-        flexDirection="row"
-        gap={1}
-        backgroundColor={props.isSelected ? "#333" : undefined}
-        paddingLeft={1}
-        paddingRight={1}
-      >
-        <text fg={props.isSelected ? "cyan" : "gray"}>
-          {props.isSelected ? ">" : " "}
-        </text>
-        <text fg={visibilityColor()}>{visibilityIcon()}</text>
-        <text fg={props.isSelected ? "white" : undefined}>
-          {props.feed.customName || props.feed.podcast.title}
-        </text>
-        {props.showEpisodeCount && (
-          <text fg="gray">({episodeCount()})</text>
-        )}
-      </box>
-    )
-  }
-
-  // Full view with details
-  return (
-    <box
-      flexDirection="column"
-      gap={0}
-      border={props.isSelected}
-      borderColor={props.isSelected ? "cyan" : undefined}
-      backgroundColor={props.isSelected ? "#222" : undefined}
-      padding={1}
-    >
-      {/* Title row */}
-      <box flexDirection="row" gap={1}>
-        <text fg={props.isSelected ? "cyan" : "gray"}>
-          {props.isSelected ? ">" : " "}
-        </text>
-        <text fg={visibilityColor()}>{visibilityIcon()}</text>
-        <text fg="yellow">{pinnedIndicator()}</text>
-        <text fg={props.isSelected ? "white" : undefined}>
-          <strong>{props.feed.customName || props.feed.podcast.title}</strong>
-        </text>
-      </box>
-
-      {/* Details row */}
-      <box flexDirection="row" gap={2} paddingLeft={4}>
-        {props.showEpisodeCount && (
-          <text fg="gray">
-            {episodeCount()} episodes ({unplayedCount()} new)
-          </text>
-        )}
-        {props.showLastUpdated && (
-          <text fg="gray">Updated: {formatDate(props.feed.lastUpdated)}</text>
-        )}
-      </box>
-
-      {/* Description (truncated) */}
-      {props.feed.podcast.description && (
-        <box paddingLeft={4} paddingTop={0}>
-          <text fg="gray">
-            {props.feed.podcast.description.slice(0, 60)}
-            {props.feed.podcast.description.length > 60 ? "..." : ""}
-          </text>
-        </box>
-      )}
-    </box>
-  )
-}

src/components/FeedList.tsx

@@ -1,182 +0,0 @@
-/**
- * Feed list component for PodTUI
- * Scrollable list of feeds with keyboard navigation and mouse support
- */
-
-import { createSignal, For, Show } from "solid-js"
-import { FeedItem } from "./FeedItem"
-import { useFeedStore } from "../stores/feed"
-import { FeedVisibility, FeedSortField } from "../types/feed"
-import type { Feed } from "../types/feed"
-
-interface FeedListProps {
-  focused?: boolean
-  compact?: boolean
-  showEpisodeCount?: boolean
-  showLastUpdated?: boolean
-  onSelectFeed?: (feed: Feed) => void
-  onOpenFeed?: (feed: Feed) => void
-}
-
-export function FeedList(props: FeedListProps) {
-  const feedStore = useFeedStore()
-  const [selectedIndex, setSelectedIndex] = createSignal(0)
-
-  const filteredFeeds = () => feedStore.getFilteredFeeds()
-
-  const handleKeyPress = (key: { name: string }) => {
-    const feeds = filteredFeeds()
-
-    if (key.name === "up" || key.name === "k") {
-      setSelectedIndex((i) => Math.max(0, i - 1))
-    } else if (key.name === "down" || key.name === "j") {
-      setSelectedIndex((i) => Math.min(feeds.length - 1, i + 1))
-    } else if (key.name === "return" || key.name === "enter") {
-      const feed = feeds[selectedIndex()]
-      if (feed && props.onOpenFeed) {
-        props.onOpenFeed(feed)
-      }
-    } else if (key.name === "home" || key.name === "g") {
-      setSelectedIndex(0)
-    } else if (key.name === "end") {
-      setSelectedIndex(feeds.length - 1)
-    } else if (key.name === "pageup") {
-      setSelectedIndex((i) => Math.max(0, i - 5))
-    } else if (key.name === "pagedown") {
-      setSelectedIndex((i) => Math.min(feeds.length - 1, i + 5))
-    } else if (key.name === "p") {
-      // Toggle pin on selected feed
-      const feed = feeds[selectedIndex()]
-      if (feed) {
-        feedStore.togglePinned(feed.id)
-      }
-    } else if (key.name === "f") {
-      // Cycle visibility filter
-      cycleVisibilityFilter()
-    } else if (key.name === "s") {
-      // Cycle sort
-      cycleSortField()
-    }
-
-    // Notify selection change
-    const selectedFeed = feeds[selectedIndex()]
-    if (selectedFeed && props.onSelectFeed) {
-      props.onSelectFeed(selectedFeed)
-    }
-  }
-
-  const cycleVisibilityFilter = () => {
-    const current = feedStore.filter().visibility
-    let next: FeedVisibility | "all"
-    if (current === "all") next = FeedVisibility.PUBLIC
-    else if (current === FeedVisibility.PUBLIC) next = FeedVisibility.PRIVATE
-    else next = "all"
-    feedStore.setFilter({ ...feedStore.filter(), visibility: next })
-  }
-
-  const cycleSortField = () => {
-    const sortOptions: FeedSortField[] = [
-      FeedSortField.UPDATED,
-      FeedSortField.TITLE,
-      FeedSortField.EPISODE_COUNT,
-      FeedSortField.LATEST_EPISODE,
-    ]
-    const current = feedStore.filter().sortBy as FeedSortField
-    const idx = sortOptions.indexOf(current)
-    const next = sortOptions[(idx + 1) % sortOptions.length]
-    feedStore.setFilter({ ...feedStore.filter(), sortBy: next })
-  }
-
-  const visibilityLabel = () => {
-    const vis = feedStore.filter().visibility
-    if (vis === "all") return "All"
-    if (vis === "public") return "Public"
-    return "Private"
-  }
-
-  const sortLabel = () => {
-    const sort = feedStore.filter().sortBy
-    switch (sort) {
-      case "title": return "Title"
-      case "episodeCount": return "Episodes"
-      case "latestEpisode": return "Latest"
-      default: return "Updated"
-    }
-  }
-
-  const handleFeedClick = (feed: Feed, index: number) => {
-    setSelectedIndex(index)
-    if (props.onSelectFeed) {
-      props.onSelectFeed(feed)
-    }
-  }
-
-  const handleFeedDoubleClick = (feed: Feed) => {
-    if (props.onOpenFeed) {
-      props.onOpenFeed(feed)
-    }
-  }
-
-  return (
-      <box flexDirection="column" gap={1}>
-      {/* Header with filter controls */}
-      <box flexDirection="row" justifyContent="space-between" paddingBottom={0}>
-        <text>
-          <strong>My Feeds</strong>
-        </text>
-        <text fg="gray">({filteredFeeds().length} feeds)</text>
-        <box flexDirection="row" gap={1}>
-          <box
-            border
-            padding={0}
-            onMouseDown={cycleVisibilityFilter}
-          >
-            <text fg="cyan">[f] {visibilityLabel()}</text>
-          </box>
-          <box
-            border
-            padding={0}
-            onMouseDown={cycleSortField}
-          >
-            <text fg="cyan">[s] {sortLabel()}</text>
-          </box>
-        </box>
-      </box>
-
-      {/* Feed list in scrollbox */}
-      <Show
-        when={filteredFeeds().length > 0}
-        fallback={
-          <box border padding={2}>
-            <text fg="gray">
-              No feeds found. Add podcasts from the Discover or Search tabs.
-            </text>
-          </box>
-        }
-      >
-        <scrollbox height={15} focused={props.focused}>
-          <For each={filteredFeeds()}>
-            {(feed, index) => (
-              <box onMouseDown={() => handleFeedClick(feed, index())}>
-                <FeedItem
-                  feed={feed}
-                  isSelected={index() === selectedIndex()}
-                  compact={props.compact}
-                  showEpisodeCount={props.showEpisodeCount ?? true}
-                  showLastUpdated={props.showLastUpdated ?? true}
-                />
-              </box>
-            )}
-          </For>
-        </scrollbox>
-      </Show>
-
-      {/* Navigation help */}
-      <box paddingTop={0}>
-        <text fg="gray">
-          j/k navigate | Enter open | p pin | f filter | s sort | Click to select
-        </text>
-      </box>
-    </box>
-  )
-}

src/components/FileInfo.tsx

@@ -1,17 +0,0 @@
-type FileInfoProps = {
-  path: string
-  format: string
-  size: string
-  modifiedAt: string
-}
-
-export function FileInfo(props: FileInfoProps) {
-  return (
-    <box border title="File Info" style={{ padding: 1, flexDirection: "column" }}>
-      <text>Path: {props.path}</text>
-      <text>Format: {props.format}</text>
-      <text>Size: {props.size}</text>
-      <text>Modified: {props.modifiedAt}</text>
-    </box>
-  )
-}

src/components/FilePicker.tsx

@@ -1,22 +0,0 @@
-import { detectFormat } from "../utils/file-detector"
-
-type FilePickerProps = {
-  value: string
-  onChange: (value: string) => void
-}
-
-export function FilePicker(props: FilePickerProps) {
-  const format = detectFormat(props.value)
-
-  return (
-    <box style={{ flexDirection: "column", gap: 1 }}>
-      <input
-        value={props.value}
-        onInput={props.onChange}
-        placeholder="/path/to/sync-file.json"
-        style={{ width: 40 }}
-      />
-      <text>Format: {format}</text>
-    </box>
-  )
-}

src/components/GlobalActivityIndicator.tsx

@@ -0,0 +1,35 @@
+import { Show } from "solid-js";
+import { useFeedStore } from "@/stores/feed";
+import { useSearchStore } from "@/stores/search";
+import { useDownloadStore } from "@/stores/download";
+import { useActivityStore } from "@/stores/activity";
+import { LoadingIndicator } from "@/components/LoadingIndicator";
+
+/**
+ * GlobalActivityIndicator — one global top-right signal that ANY feed
+ * refresh, fetch-more, subscribe fetch, search, or download is in flight.
+ * Per-page spinners are unchanged; this overlays the content row and status
+ * bar as a single app-wide "something is happening" indicator.
+ */
+export function GlobalActivityIndicator() {
+  const feedStore = useFeedStore();
+  const searchStore = useSearchStore();
+  const downloadStore = useDownloadStore();
+  const activity = useActivityStore();
+
+  /** True while any tracked activity is in flight */
+  const isActive = () =>
+    feedStore.isLoadingFeeds() ||
+    feedStore.isLoadingMore() ||
+    searchStore.isSearching() ||
+    downloadStore.getActiveCount() + downloadStore.getQueue().length > 0 ||
+    activity.isActive();
+
+  return (
+    <Show when={isActive()}>
+      <box position="absolute" top={0} right={0} paddingRight={1}>
+        <LoadingIndicator />
+      </box>
+    </Show>
+  );
+}

src/components/KeyboardHandler.tsx

@@ -1,17 +0,0 @@
-import type { JSX } from "solid-js"
-import type { TabId } from "./Tab"
-
-/**
- * @deprecated Use useAppKeyboard hook directly instead.
- * This component is kept for backwards compatibility.
- */
-type KeyboardHandlerProps = {
-  children?: JSX.Element
-  onTabSelect?: (tab: TabId) => void
-}
-
-export function KeyboardHandler(props: KeyboardHandlerProps) {
-  // Keyboard handling has been moved to useAppKeyboard hook
-  // This component is now just a passthrough
-  return <>{props.children}</>
-}

src/components/Layout.tsx

@@ -1,17 +0,0 @@
-import type { JSX } from "solid-js"
-
-type LayoutProps = {
-  header?: JSX.Element
-  footer?: JSX.Element
-  children?: JSX.Element
-}
-
-export function Layout(props: LayoutProps) {
-  return (
-    <box style={{ flexDirection: "column", width: "100%", height: "100%" }}>
-      {props.header ? <box style={{ height: 3 }}>{props.header}</box> : <text></text>}
-      <box style={{ flexGrow: 1 }}>{props.children}</box>
-      {props.footer ? <box style={{ height: 1 }}>{props.footer}</box> : <text></text>}
-    </box>
-  )
-}

src/components/LoadingIndicator.tsx

@@ -0,0 +1,30 @@
+import { createSignal, createMemo, Show, onCleanup } from "solid-js";
+import { useTheme } from "@/context/ThemeContext";
+
+const spinnerChars = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+
+/**
+ * Animated braille spinner with an optional label (e.g. "Refreshing…").
+ * The spinner is rendered in the theme primary color; the label in muted.
+ */
+export function LoadingIndicator(props: { label?: string }) {
+	const { theme } = useTheme();
+	const [index, setIndex] = createSignal(0);
+
+	const interval = setInterval(() => {
+		setIndex((i) => (i + 1) % spinnerChars.length);
+	}, 65);
+
+	onCleanup(() => clearInterval(interval));
+
+	const currentChar = createMemo(() => spinnerChars[index()]);
+
+	return (
+		<box flexDirection="row" gap={1} alignItems="flex-start">
+			<text fg={theme.primary} content={currentChar()} />
+			<Show when={props.label}>
+				<text fg={theme.muted || theme.text} content={props.label} />
+			</Show>
+		</box>
+	);
+}

src/components/LoginScreen.tsx

@@ -1,175 +0,0 @@
-/**
- * Login screen component for PodTUI
- * Email/password login with links to code validation and OAuth
- */
-
-import { createSignal } from "solid-js"
-import { useAuthStore } from "../stores/auth"
-import { AUTH_CONFIG } from "../config/auth"
-
-interface LoginScreenProps {
-  focused?: boolean
-  onNavigateToCode?: () => void
-  onNavigateToOAuth?: () => void
-}
-
-type FocusField = "email" | "password" | "submit" | "code" | "oauth"
-
-export function LoginScreen(props: LoginScreenProps) {
-  const auth = useAuthStore()
-  const [email, setEmail] = createSignal("")
-  const [password, setPassword] = createSignal("")
-  const [focusField, setFocusField] = createSignal<FocusField>("email")
-  const [emailError, setEmailError] = createSignal<string | null>(null)
-  const [passwordError, setPasswordError] = createSignal<string | null>(null)
-
-  const fields: FocusField[] = ["email", "password", "submit", "code", "oauth"]
-
-  const validateEmail = (value: string): boolean => {
-    if (!value) {
-      setEmailError("Email is required")
-      return false
-    }
-    if (!AUTH_CONFIG.email.pattern.test(value)) {
-      setEmailError("Invalid email format")
-      return false
-    }
-    setEmailError(null)
-    return true
-  }
-
-  const validatePassword = (value: string): boolean => {
-    if (!value) {
-      setPasswordError("Password is required")
-      return false
-    }
-    if (value.length < AUTH_CONFIG.password.minLength) {
-      setPasswordError(`Minimum ${AUTH_CONFIG.password.minLength} characters`)
-      return false
-    }
-    setPasswordError(null)
-    return true
-  }
-
-  const handleSubmit = async () => {
-    const isEmailValid = validateEmail(email())
-    const isPasswordValid = validatePassword(password())
-
-    if (!isEmailValid || !isPasswordValid) {
-      return
-    }
-
-    await auth.login({ email: email(), password: password() })
-  }
-
-  const handleKeyPress = (key: { name: string; shift?: boolean }) => {
-    if (key.name === "tab") {
-      const currentIndex = fields.indexOf(focusField())
-      const nextIndex = key.shift
-        ? (currentIndex - 1 + fields.length) % fields.length
-        : (currentIndex + 1) % fields.length
-      setFocusField(fields[nextIndex])
-    } else if (key.name === "return" || key.name === "enter") {
-      if (focusField() === "submit") {
-        handleSubmit()
-      } else if (focusField() === "code" && props.onNavigateToCode) {
-        props.onNavigateToCode()
-      } else if (focusField() === "oauth" && props.onNavigateToOAuth) {
-        props.onNavigateToOAuth()
-      }
-    }
-  }
-
-  return (
-    <box flexDirection="column" border padding={2} gap={1}>
-      <text>
-        <strong>Sign In</strong>
-      </text>
-
-      <box height={1} />
-
-      {/* Email field */}
-      <box flexDirection="column" gap={0}>
-        <text fg={focusField() === "email" ? "cyan" : undefined}>Email:</text>
-        <input
-          value={email()}
-          onInput={setEmail}
-          placeholder="your@email.com"
-          focused={props.focused && focusField() === "email"}
-          width={30}
-        />
-        {emailError() && (
-          <text fg="red">{emailError()}</text>
-        )}
-      </box>
-
-      {/* Password field */}
-      <box flexDirection="column" gap={0}>
-        <text fg={focusField() === "password" ? "cyan" : undefined}>
-          Password:
-        </text>
-        <input
-          value={password()}
-          onInput={setPassword}
-          placeholder="********"
-          focused={props.focused && focusField() === "password"}
-          width={30}
-        />
-        {passwordError() && (
-          <text fg="red">{passwordError()}</text>
-        )}
-      </box>
-
-      <box height={1} />
-
-      {/* Submit button */}
-      <box flexDirection="row" gap={2}>
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "submit" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "submit" ? "cyan" : undefined}>
-            {auth.isLoading ? "Signing in..." : "[Enter] Sign In"}
-          </text>
-        </box>
-      </box>
-
-      {/* Auth error message */}
-      {auth.error && (
-        <text fg="red">{auth.error.message}</text>
-      )}
-
-      <box height={1} />
-
-      {/* Alternative auth options */}
-      <text fg="gray">Or authenticate with:</text>
-
-      <box flexDirection="row" gap={2}>
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "code" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "code" ? "yellow" : "gray"}>
-            [C] Sync Code
-          </text>
-        </box>
-
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "oauth" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "oauth" ? "yellow" : "gray"}>
-            [O] OAuth Info
-          </text>
-        </box>
-      </box>
-
-      <box height={1} />
-
-      <text fg="gray">Tab to navigate, Enter to select</text>
-    </box>
-  )
-}

src/components/Navigation.tsx

@@ -1,24 +0,0 @@
-import type { TabId } from "./Tab"
-
-type NavigationProps = {
-  activeTab: TabId
-  onTabSelect: (tab: TabId) => void
-}
-
-export function Navigation(props: NavigationProps) {
-  return (
-    <box style={{ flexDirection: "row", width: "100%", height: 1 }}>
-      <text>
-        {props.activeTab === "discover" ? "[" : " "}Discover{props.activeTab === "discover" ? "]" : " "}
-        <span> </span>
-        {props.activeTab === "feeds" ? "[" : " "}My Feeds{props.activeTab === "feeds" ? "]" : " "}
-        <span> </span>
-        {props.activeTab === "search" ? "[" : " "}Search{props.activeTab === "search" ? "]" : " "}
-        <span> </span>
-        {props.activeTab === "player" ? "[" : " "}Player{props.activeTab === "player" ? "]" : " "}
-        <span> </span>
-        {props.activeTab === "settings" ? "[" : " "}Settings{props.activeTab === "settings" ? "]" : " "}
-      </text>
-    </box>
-  )
-}

src/components/OAuthPlaceholder.tsx

@@ -1,125 +0,0 @@
-/**
- * OAuth placeholder component for PodTUI
- * Displays OAuth limitations and alternative authentication methods
- */
-
-import { createSignal } from "solid-js"
-import { OAUTH_PROVIDERS, OAUTH_LIMITATION_MESSAGE } from "../config/auth"
-
-interface OAuthPlaceholderProps {
-  focused?: boolean
-  onBack?: () => void
-  onNavigateToCode?: () => void
-}
-
-type FocusField = "code" | "back"
-
-export function OAuthPlaceholder(props: OAuthPlaceholderProps) {
-  const [focusField, setFocusField] = createSignal<FocusField>("code")
-
-  const fields: FocusField[] = ["code", "back"]
-
-  const handleKeyPress = (key: { name: string; shift?: boolean }) => {
-    if (key.name === "tab") {
-      const currentIndex = fields.indexOf(focusField())
-      const nextIndex = key.shift
-        ? (currentIndex - 1 + fields.length) % fields.length
-        : (currentIndex + 1) % fields.length
-      setFocusField(fields[nextIndex])
-    } else if (key.name === "return" || key.name === "enter") {
-      if (focusField() === "code" && props.onNavigateToCode) {
-        props.onNavigateToCode()
-      } else if (focusField() === "back" && props.onBack) {
-        props.onBack()
-      }
-    } else if (key.name === "escape" && props.onBack) {
-      props.onBack()
-    }
-  }
-
-  return (
-    <box flexDirection="column" border padding={2} gap={1}>
-      <text>
-        <strong>OAuth Authentication</strong>
-      </text>
-
-      <box height={1} />
-
-      {/* OAuth providers list */}
-      <text fg="cyan">Available OAuth Providers:</text>
-
-      <box flexDirection="column" gap={0} paddingLeft={2}>
-        {OAUTH_PROVIDERS.map((provider) => (
-          <box flexDirection="row" gap={1}>
-            <text fg={provider.enabled ? "green" : "gray"}>
-              {provider.enabled ? "[+]" : "[-]"} {provider.name}
-            </text>
-            <text fg="gray">- {provider.description}</text>
-          </box>
-        ))}
-      </box>
-
-      <box height={1} />
-
-      {/* Limitation message */}
-      <box border padding={1} borderColor="yellow">
-        <text fg="yellow">Terminal Limitations</text>
-      </box>
-
-      <box paddingLeft={1}>
-        {OAUTH_LIMITATION_MESSAGE.split("\n").map((line) => (
-          <text fg="gray">{line}</text>
-        ))}
-      </box>
-
-      <box height={1} />
-
-      {/* Alternative options */}
-      <text fg="cyan">Recommended Alternatives:</text>
-
-      <box flexDirection="column" gap={0} paddingLeft={2}>
-        <box flexDirection="row" gap={1}>
-          <text fg="green">[1]</text>
-          <text fg="white">Use a sync code from the web portal</text>
-        </box>
-        <box flexDirection="row" gap={1}>
-          <text fg="green">[2]</text>
-          <text fg="white">Use email/password authentication</text>
-        </box>
-        <box flexDirection="row" gap={1}>
-          <text fg="green">[3]</text>
-          <text fg="white">Use file-based sync (no account needed)</text>
-        </box>
-      </box>
-
-      <box height={1} />
-
-      {/* Action buttons */}
-      <box flexDirection="row" gap={2}>
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "code" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "code" ? "cyan" : undefined}>
-            [C] Enter Sync Code
-          </text>
-        </box>
-
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "back" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "back" ? "yellow" : "gray"}>
-            [Esc] Back to Login
-          </text>
-        </box>
-      </box>
-
-      <box height={1} />
-
-      <text fg="gray">Tab to navigate, Enter to select, Esc to go back</text>
-    </box>
-  )
-}

src/components/PaneRow.tsx

@@ -0,0 +1,221 @@
+/**
+ * PaneRow — the shared parent | current | preview 3-pane layout primitive.
+ *
+ * Implements yazi's `mgr.ratio` contract: three columns grow at
+ * 20% : 50% : 30% (PANE_RATIO 2:5:3) of the row width via Yoga `flexGrow`,
+ * so every list tab renders an identical, layout-stable shell. Columns use
+ * `flexBasis={0}` so the ratio is exact regardless of content width — a
+ * column's content can never stretch its slot.
+ *
+ * Column semantics (per the yazi depth model):
+ *   parent  — the previous-depth list. Renders a muted `—` placeholder and
+ *             KEEPS its 20% slot when blank (never collapses to width 0).
+ *             Borderless (no left/right/top/bottom edge). Carries the single
+ *             header row: the CURRENT column's title renders top-left in the
+ *             parent's slot (the panes above current/preview were removed).
+ *   current — the current-depth list. The only focusable content column; it
+ *             is the ONLY bordered column — left/right edges only, always
+ *             muted (no active-border highlight, focused or not).
+ *   preview — detail of the hovered item in `current`. Borderless, no header.
+ *
+ * The primitive is purely structural: callers pass their own JSX per column
+ * (static elements or accessors) plus the current-column title. Theme colors
+ * are resolved internally via `useTheme()`. Only the current column's
+ * `<scrollbox>` receives `focused`, so scroll focus follows the cursor (j/k
+ * stay in the current pane).
+ *
+ * Example:
+ *   <PaneRow
+ *     parent={parentList}
+ *     current={currentList}
+ *     preview={detail}
+ *     currentLabel="List · 42"
+ *     focused={isActive}
+ *   />
+ */
+
+import { createMemo, Show } from "solid-js";
+import type { JSX } from "solid-js";
+import type { RGBA, BorderSides } from "@opentui/core";
+import { useTheme } from "@/context/ThemeContext";
+import { PANE_RATIO } from "@/utils/navigation";
+
+// ── Types ───────────────────────────────────────────────────────────────────
+type PaneContent = JSX.Element | (() => JSX.Element);
+type PaneLabel = string | (() => string);
+
+export type PaneRowProps = {
+	/** Parent column content (previous-depth list, or null for a muted
+	 *  placeholder — the 1/5 slot is always preserved). */
+	parent?: PaneContent;
+	/** Current column content (the focused list). */
+	current?: PaneContent;
+	/** Preview column content (detail of the hovered item). Omit/undefined
+	 *  together with `panes={2}` to render a 2-pane parent|current row. */
+	preview?: PaneContent;
+	/** Title of the current column — rendered once, top-left in the parent
+	 *  pane's header slot (the per-pane Up/Detail headers are gone). */
+	currentLabel?: PaneLabel;
+	/** Whether the current column's `<scrollbox>` receives scroll focus. Defaults to
+	 *  true; pass `false` (or a signal) when the row is inactive. Does NOT change
+	 *  border colors — the current column's border is always muted. */
+	focused?: boolean | (() => boolean);
+	/** Number of visible columns. `3` (default) = parent|current|preview;
+	 *  `2` = parent|current (preview omitted, current grows to fill). */
+	panes?: 2 | 3;
+	/** Which sides of the current column's border render. Defaults to
+	 *  `["left", "right"]` (the standard focused-list frame). */
+	currentBorder?: boolean | BorderSides[];
+};
+
+// ── Helpers ─────────────────────────────────────────────────────────────────
+function resolveLabel(v: PaneLabel | undefined): string {
+	if (v == null) return "";
+	return typeof v === "function" ? v() : v;
+}
+
+/** Normalize a PaneContent (static JSX or accessor) into a reactive accessor.
+ *  We deliberately avoid Solid's `children()` helper: it flattens accessor
+ *  children into a stable resolved-nodes array and won't re-resolve on a
+ *  truthy→truthy root swap (e.g. the current pane switching between a
+ *  depth-1 list fragment and a depth-2 editor), freezing the previous
+ *  subtree. Instead the raw accessor feeds a reactive `{ expr ?? <Placeholder/> }`
+ *  expression — a tracked `insert` effect that disposes the old subtree and
+ *  mounts the new whenever the accessor returns a different element identity. */
+function normalizeContent(
+	v: PaneContent | undefined,
+): () => JSX.Element | undefined {
+	if (v == null) return () => undefined;
+	return typeof v === "function" ? (v as () => JSX.Element) : () => v;
+}
+
+function Placeholder(props: { color: () => RGBA }) {
+	return (
+		<box padding={1}>
+			<text fg={props.color()}>—</text>
+		</box>
+	);
+}
+
+// ── Pane column ─────────────────────────────────────────────────────────────
+function Pane(props: {
+	grow: number;
+	label: () => string;
+	content: () => JSX.Element | undefined;
+	border: boolean | BorderSides[];
+	scrollFocused: () => boolean;
+}) {
+	const themeContext = useTheme();
+	const theme = themeContext.theme;
+	const muted = () => theme.muted ?? theme.textMuted ?? theme.text;
+
+	// Memoize the scroll-focus accessor result so the prop expression below
+	// stays reactive when the underlying signal (e.g. `focused`) changes.
+	const scrollFocused = createMemo(() => props.scrollFocused());
+
+	return (
+		<box
+			flexDirection="column"
+			flexGrow={props.grow}
+			flexBasis={0}
+			height="100%"
+		>
+			{/* ── title row: rendered only when the pane carries a label ────────── */}
+			<Show when={props.label() !== ""}>
+				<box
+					height={1}
+					paddingLeft={1}
+					backgroundColor={
+						themeContext.transparentBackground()
+							? "transparent"
+							: theme.background
+					}
+				>
+					<text fg={theme.textSecondary}>{props.label()}</text>
+				</box>
+			</Show>
+			{/* ── scrollbox; border always muted (focused or not) ──────────────── */}
+			<scrollbox
+				height="100%"
+				focused={scrollFocused()}
+				border={props.border}
+				// Only supply colors when a border is requested — opentui flips a
+				// borderless box to bordered when borderColor/focusedBorderColor
+				// are passed, which would frame the parent/preview panes too.
+				borderColor={props.border === false ? undefined : theme.border}
+				focusedBorderColor={
+					props.border === false ? undefined : theme.border
+				}
+				backgroundColor={
+					themeContext.transparentBackground()
+						? "transparent"
+						: theme.background
+				}
+			>
+			{props.content() ?? <Placeholder color={muted} />}
+			</scrollbox>
+		</box>
+	);
+}
+
+// ── Row primitive ───────────────────────────────────────────────────────────
+export function PaneRow(props: PaneRowProps) {
+	/** true → the current column's scrollbox is focused (scroll follows cursor). */
+	const focused = createMemo(() => {
+		const f = props.focused;
+		return typeof f === "function" ? f() : (f ?? true);
+	});
+
+	// Normalize static JSX and accessor children into reactive accessors
+	// (see normalizeContent for why we avoid Solid's `children()` helper).
+	const parentContent = normalizeContent(props.parent);
+	const currentContent = normalizeContent(props.current);
+	const previewContent = normalizeContent(props.preview);
+
+	// The single title: the CURRENT column's label, rendered in the parent
+	// pane's header slot (top-left). Current/preview panes have no headers.
+	const currentLabel = createMemo(() => resolveLabel(props.currentLabel));
+
+	// 2-pane mode (parent|current) grows the current column to fill the
+	// preview slot. Defaults to 3 (parent|current|preview).
+	const panes = createMemo(() => props.panes ?? 3);
+	const currentGrow = createMemo(() =>
+		panes() === 2
+			? PANE_RATIO.current + PANE_RATIO.preview
+			: PANE_RATIO.current,
+	);
+	const currentBorder = createMemo<boolean | BorderSides[]>(
+		() => props.currentBorder ?? ["left", "right"],
+	);
+
+	return (
+		<box flexDirection="row" flexGrow={1} width="100%" height="100%">
+			{/* ── parent (20%) — previous-depth list; title row top-left ────────── */}
+			<Pane
+				grow={PANE_RATIO.parent}
+				label={currentLabel}
+				content={parentContent}
+				border={false}
+				scrollFocused={() => false}
+			/>
+			{/* ── current — the focused list; left/right borders only ─────────── */}
+			<Pane
+				grow={currentGrow()}
+				label={() => ""}
+				content={currentContent}
+				border={currentBorder()}
+				scrollFocused={() => focused()}
+			/>
+			{/* ── preview (30%) — hovered-item detail; no border, no header ────── */}
+			<Show when={panes() === 3}>
+				<Pane
+					grow={PANE_RATIO.preview}
+					label={() => ""}
+					content={previewContent}
+					border={false}
+					scrollFocused={() => false}
+				/>
+			</Show>
+		</box>
+	);
+}

src/components/PodcastCard.tsx

@@ -1,73 +0,0 @@
-/**
- * PodcastCard component - Reusable card for displaying podcast info
- */
-
-import { Show } from "solid-js"
-import type { Podcast } from "../types/podcast"
-
-type PodcastCardProps = {
-  podcast: Podcast
-  selected: boolean
-  compact?: boolean
-  onSelect?: () => void
-  onSubscribe?: () => void
-}
-
-export function PodcastCard(props: PodcastCardProps) {
-  const handleSubscribeClick = () => {
-    props.onSubscribe?.()
-  }
-
-  return (
-    <box
-      flexDirection="column"
-      padding={1}
-      backgroundColor={props.selected ? "#333" : undefined}
-      onMouseDown={props.onSelect}
-    >
-      {/* Title Row */}
-      <box flexDirection="row" gap={2} alignItems="center">
-        <text fg={props.selected ? "cyan" : "white"}>
-          <strong>{props.podcast.title}</strong>
-        </text>
-
-        <Show when={props.podcast.isSubscribed}>
-          <text fg="green">[+]</text>
-        </Show>
-      </box>
-
-      {/* Author */}
-      <Show when={props.podcast.author && !props.compact}>
-        <text fg="gray">by {props.podcast.author}</text>
-      </Show>
-
-      {/* Description */}
-      <Show when={props.podcast.description && !props.compact}>
-        <text fg={props.selected ? "white" : "gray"}>
-          {props.podcast.description!.length > 80
-            ? props.podcast.description!.slice(0, 80) + "..."
-            : props.podcast.description}
-        </text>
-      </Show>
-
-      {/* Categories and Subscribe Button */}
-      <box flexDirection="row" justifyContent="space-between" marginTop={props.compact ? 0 : 1}>
-        <box flexDirection="row" gap={1}>
-          <Show when={(props.podcast.categories ?? []).length > 0}>
-            {(props.podcast.categories ?? []).slice(0, 2).map((cat) => (
-              <text fg="yellow">[{cat}]</text>
-            ))}
-          </Show>
-        </box>
-
-        <Show when={props.selected}>
-          <box onMouseDown={handleSubscribeClick}>
-            <text fg={props.podcast.isSubscribed ? "red" : "green"}>
-              {props.podcast.isSubscribed ? "[Unsubscribe]" : "[Subscribe]"}
-            </text>
-          </box>
-        </Show>
-      </box>
-    </box>
-  )
-}

src/components/ResponsiveContainer.tsx

@@ -1,19 +0,0 @@
-import { createMemo, type JSX } from "solid-js"
-import { useTerminalDimensions } from "@opentui/solid"
-
-type ResponsiveContainerProps = {
-  children?: (size: "small" | "medium" | "large") => JSX.Element
-}
-
-export function ResponsiveContainer(props: ResponsiveContainerProps) {
-  const dimensions = useTerminalDimensions()
-
-  const size = createMemo<"small" | "medium" | "large">(() => {
-    const width = dimensions().width
-    if (width < 60) return "small"
-    if (width < 100) return "medium"
-    return "large"
-  })
-
-  return <>{props.children?.(size())}</>
-}

src/components/ResultCard.tsx

@@ -1,79 +0,0 @@
-import { Show } from "solid-js"
-import type { SearchResult } from "../types/source"
-import { SourceBadge } from "./SourceBadge"
-
-type ResultCardProps = {
-  result: SearchResult
-  selected: boolean
-  onSelect: () => void
-  onSubscribe?: () => void
-}
-
-export function ResultCard(props: ResultCardProps) {
-  const podcast = () => props.result.podcast
-
-  return (
-    <box
-      flexDirection="column"
-      padding={1}
-      border={props.selected}
-      borderColor={props.selected ? "cyan" : undefined}
-      backgroundColor={props.selected ? "#222" : undefined}
-      onMouseDown={props.onSelect}
-    >
-      <box flexDirection="row" justifyContent="space-between" alignItems="center">
-        <box flexDirection="row" gap={2} alignItems="center">
-          <text fg={props.selected ? "cyan" : "white"}>
-            <strong>{podcast().title}</strong>
-          </text>
-          <SourceBadge
-            sourceId={props.result.sourceId}
-            sourceName={props.result.sourceName}
-            sourceType={props.result.sourceType}
-          />
-        </box>
-        <Show when={podcast().isSubscribed}>
-          <text fg="green">[Subscribed]</text>
-        </Show>
-      </box>
-
-      <Show when={podcast().author}>
-        <text fg="gray">by {podcast().author}</text>
-      </Show>
-
-      <Show when={podcast().description}>
-        {(description) => (
-          <text fg={props.selected ? "white" : "gray"}>
-            {description().length > 120
-              ? description().slice(0, 120) + "..."
-              : description()}
-          </text>
-        )}
-      </Show>
-
-      <Show when={(podcast().categories ?? []).length > 0}>
-        <box flexDirection="row" gap={1}>
-          {(podcast().categories ?? []).slice(0, 3).map((category) => (
-            <text fg="yellow">[{category}]</text>
-          ))}
-        </box>
-      </Show>
-
-      <Show when={!podcast().isSubscribed}>
-        <box
-          border
-          padding={0}
-          paddingLeft={1}
-          paddingRight={1}
-          width={18}
-          onMouseDown={(event) => {
-            event.stopPropagation?.()
-            props.onSubscribe?.()
-          }}
-        >
-          <text fg="cyan">[+] Add to Feeds</text>
-        </box>
-      </Show>
-    </box>
-  )
-}

src/components/ResultDetail.tsx

@@ -1,75 +0,0 @@
-import { Show } from "solid-js"
-import { format } from "date-fns"
-import type { SearchResult } from "../types/source"
-import { SourceBadge } from "./SourceBadge"
-
-type ResultDetailProps = {
-  result?: SearchResult
-  onSubscribe?: (result: SearchResult) => void
-}
-
-export function ResultDetail(props: ResultDetailProps) {
-  return (
-    <box flexDirection="column" border padding={1} gap={1} height="100%">
-      <Show
-        when={props.result}
-        fallback={
-          <text fg="gray">Select a result to see details.</text>
-        }
-      >
-        {(result) => (
-          <>
-          <text fg="white">
-            <strong>{result().podcast.title}</strong>
-          </text>
-
-            <SourceBadge
-              sourceId={result().sourceId}
-              sourceName={result().sourceName}
-              sourceType={result().sourceType}
-            />
-
-          <Show when={result().podcast.author}>
-            <text fg="gray">by {result().podcast.author}</text>
-          </Show>
-
-          <Show when={result().podcast.description}>
-            <text fg="gray">{result().podcast.description}</text>
-          </Show>
-
-          <Show when={(result().podcast.categories ?? []).length > 0}>
-            <box flexDirection="row" gap={1}>
-              {(result().podcast.categories ?? []).map((category) => (
-                <text fg="yellow">[{category}]</text>
-              ))}
-            </box>
-          </Show>
-
-          <text fg="gray">Feed: {result().podcast.feedUrl}</text>
-
-          <text fg="gray">
-            Updated: {format(result().podcast.lastUpdated, "MMM d, yyyy")}
-          </text>
-
-            <Show when={!result().podcast.isSubscribed}>
-              <box
-                border
-                padding={0}
-                paddingLeft={1}
-                paddingRight={1}
-                width={18}
-                onMouseDown={() => props.onSubscribe?.(result())}
-              >
-                <text fg="cyan">[+] Add to Feeds</text>
-              </box>
-            </Show>
-
-            <Show when={result().podcast.isSubscribed}>
-              <text fg="green">Already subscribed</text>
-            </Show>
-          </>
-        )}
-      </Show>
-    </box>
-  )
-}

src/components/Row.tsx

@@ -1,35 +0,0 @@
-import type { JSX } from "solid-js"
-
-type RowProps = {
-  children?: JSX.Element
-  gap?: number
-  alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
-  justifyContent?:
-    | "flex-start"
-    | "flex-end"
-    | "center"
-    | "space-between"
-    | "space-around"
-    | "space-evenly"
-  width?: number | "auto" | `${number}%`
-  height?: number | "auto" | `${number}%`
-  padding?: number
-}
-
-export function Row(props: RowProps) {
-  return (
-    <box
-      style={{
-        flexDirection: "row",
-        gap: props.gap,
-        alignItems: props.alignItems,
-        justifyContent: props.justifyContent,
-        width: props.width,
-        height: props.height,
-        padding: props.padding,
-      }}
-    >
-      {props.children}
-    </box>
-  )
-}

src/components/SearchHistory.tsx

@@ -1,78 +0,0 @@
-/**
- * SearchHistory component for displaying and managing search history
- */
-
-import { For, Show } from "solid-js"
-
-type SearchHistoryProps = {
-  history: string[]
-  focused: boolean
-  selectedIndex: number
-  onSelect?: (query: string) => void
-  onRemove?: (query: string) => void
-  onClear?: () => void
-  onChange?: (index: number) => void
-}
-
-export function SearchHistory(props: SearchHistoryProps) {
-  const handleSearchClick = (index: number, query: string) => {
-    props.onChange?.(index)
-    props.onSelect?.(query)
-  }
-
-  const handleRemoveClick = (query: string) => {
-    props.onRemove?.(query)
-  }
-
-  return (
-    <box flexDirection="column" gap={1}>
-      <box flexDirection="row" justifyContent="space-between">
-        <text fg="gray">Recent Searches</text>
-        <Show when={props.history.length > 0}>
-          <box onMouseDown={() => props.onClear?.()} padding={0}>
-            <text fg="red">[Clear All]</text>
-          </box>
-        </Show>
-      </box>
-
-      <Show
-        when={props.history.length > 0}
-        fallback={
-          <box padding={1}>
-            <text fg="gray">No recent searches</text>
-          </box>
-        }
-      >
-        <scrollbox height={10}>
-          <box flexDirection="column">
-            <For each={props.history}>
-              {(query, index) => {
-                const isSelected = () => index() === props.selectedIndex && props.focused
-
-                return (
-                  <box
-                    flexDirection="row"
-                    justifyContent="space-between"
-                    padding={0}
-                    paddingLeft={1}
-                    paddingRight={1}
-                    backgroundColor={isSelected() ? "#333" : undefined}
-                    onMouseDown={() => handleSearchClick(index(), query)}
-                  >
-                    <box flexDirection="row" gap={1}>
-                      <text fg="gray">{">"}</text>
-                      <text fg={isSelected() ? "cyan" : "white"}>{query}</text>
-                    </box>
-                    <box onMouseDown={() => handleRemoveClick(query)} padding={0}>
-                      <text fg="red">[x]</text>
-                    </box>
-                  </box>
-                )
-              }}
-            </For>
-          </box>
-        </scrollbox>
-      </Show>
-    </box>
-  )
-}

src/components/SearchPage.tsx

@@ -1,268 +0,0 @@
-/**
- * SearchPage component - Main search interface for PodTUI
- */
-
-import { createSignal, Show } from "solid-js"
-import { useKeyboard } from "@opentui/solid"
-import { useSearchStore } from "../stores/search"
-import { SearchResults } from "./SearchResults"
-import { SearchHistory } from "./SearchHistory"
-import type { SearchResult } from "../types/source"
-
-type SearchPageProps = {
-  focused: boolean
-  onSubscribe?: (result: SearchResult) => void
-  onInputFocusChange?: (focused: boolean) => void
-}
-
-type FocusArea = "input" | "results" | "history"
-
-export function SearchPage(props: SearchPageProps) {
-  const searchStore = useSearchStore()
-  const [focusArea, setFocusArea] = createSignal<FocusArea>("input")
-  const [inputValue, setInputValue] = createSignal("")
-  const [resultIndex, setResultIndex] = createSignal(0)
-  const [historyIndex, setHistoryIndex] = createSignal(0)
-
-  const handleSearch = async () => {
-    const query = inputValue().trim()
-    if (query) {
-      await searchStore.search(query)
-      if (searchStore.results().length > 0) {
-        setFocusArea("results")
-        setResultIndex(0)
-        props.onInputFocusChange?.(false)
-      }
-    }
-  }
-
-  const handleHistorySelect = async (query: string) => {
-    setInputValue(query)
-    await searchStore.search(query)
-    if (searchStore.results().length > 0) {
-      setFocusArea("results")
-      setResultIndex(0)
-    }
-  }
-
-  const handleResultSelect = (result: SearchResult) => {
-    props.onSubscribe?.(result)
-    searchStore.markSubscribed(result.podcast.id)
-  }
-
-  // Keyboard navigation
-  useKeyboard((key) => {
-    if (!props.focused) return
-
-    const area = focusArea()
-
-    // Enter to search from input
-    if (key.name === "enter" && area === "input") {
-      handleSearch()
-      return
-    }
-
-    // Tab to cycle focus areas
-    if (key.name === "tab" && !key.shift) {
-      if (area === "input") {
-        if (searchStore.results().length > 0) {
-          setFocusArea("results")
-          props.onInputFocusChange?.(false)
-        } else if (searchStore.history().length > 0) {
-          setFocusArea("history")
-          props.onInputFocusChange?.(false)
-        }
-      } else if (area === "results") {
-        if (searchStore.history().length > 0) {
-          setFocusArea("history")
-        } else {
-          setFocusArea("input")
-          props.onInputFocusChange?.(true)
-        }
-      } else {
-        setFocusArea("input")
-        props.onInputFocusChange?.(true)
-      }
-      return
-    }
-
-    if (key.name === "tab" && key.shift) {
-      if (area === "input") {
-        if (searchStore.history().length > 0) {
-          setFocusArea("history")
-          props.onInputFocusChange?.(false)
-        } else if (searchStore.results().length > 0) {
-          setFocusArea("results")
-          props.onInputFocusChange?.(false)
-        }
-      } else if (area === "history") {
-        if (searchStore.results().length > 0) {
-          setFocusArea("results")
-        } else {
-          setFocusArea("input")
-          props.onInputFocusChange?.(true)
-        }
-      } else {
-        setFocusArea("input")
-        props.onInputFocusChange?.(true)
-      }
-      return
-    }
-
-    // Up/Down for results and history
-    if (area === "results") {
-      const results = searchStore.results()
-      if (key.name === "down" || key.name === "j") {
-        setResultIndex((i) => Math.min(i + 1, results.length - 1))
-        return
-      }
-      if (key.name === "up" || key.name === "k") {
-        setResultIndex((i) => Math.max(i - 1, 0))
-        return
-      }
-      if (key.name === "enter") {
-        const result = results[resultIndex()]
-        if (result) handleResultSelect(result)
-        return
-      }
-    }
-
-    if (area === "history") {
-      const history = searchStore.history()
-      if (key.name === "down" || key.name === "j") {
-        setHistoryIndex((i) => Math.min(i + 1, history.length - 1))
-        return
-      }
-      if (key.name === "up" || key.name === "k") {
-        setHistoryIndex((i) => Math.max(i - 1, 0))
-        return
-      }
-      if (key.name === "enter") {
-        const query = history[historyIndex()]
-        if (query) handleHistorySelect(query)
-        return
-      }
-    }
-
-    // Escape goes back to input
-    if (key.name === "escape") {
-      setFocusArea("input")
-      props.onInputFocusChange?.(true)
-      return
-    }
-
-    // "/" focuses search input
-    if (key.name === "/" && area !== "input") {
-      setFocusArea("input")
-      props.onInputFocusChange?.(true)
-      return
-    }
-  })
-
-  return (
-    <box flexDirection="column" height="100%" gap={1}>
-      {/* Search Header */}
-      <box flexDirection="column" gap={1}>
-          <text>
-            <strong>Search Podcasts</strong>
-          </text>
-
-        {/* Search Input */}
-        <box flexDirection="row" gap={1} alignItems="center">
-          <text fg="gray">Search:</text>
-          <input
-            value={inputValue()}
-            onInput={(value) => {
-              setInputValue(value)
-              if (props.focused && focusArea() === "input") {
-                props.onInputFocusChange?.(true)
-              }
-            }}
-            placeholder="Enter podcast name, topic, or author..."
-            focused={props.focused && focusArea() === "input"}
-            width={50}
-          />
-          <box
-            border
-            padding={0}
-            paddingLeft={1}
-            paddingRight={1}
-            onMouseDown={handleSearch}
-          >
-            <text fg="cyan">[Enter] Search</text>
-          </box>
-        </box>
-
-        {/* Status */}
-        <Show when={searchStore.isSearching()}>
-          <text fg="yellow">Searching...</text>
-        </Show>
-        <Show when={searchStore.error()}>
-          <text fg="red">{searchStore.error()}</text>
-        </Show>
-      </box>
-
-      {/* Main Content - Results or History */}
-      <box flexDirection="row" height="100%" gap={2}>
-        {/* Results Panel */}
-        <box flexDirection="column" flexGrow={1} border>
-          <box padding={1}>
-            <text fg={focusArea() === "results" ? "cyan" : "gray"}>
-              Results ({searchStore.results().length})
-            </text>
-          </box>
-          <Show
-            when={searchStore.results().length > 0}
-            fallback={
-              <box padding={2}>
-                <text fg="gray">
-                  {searchStore.query()
-                    ? "No results found"
-                    : "Enter a search term to find podcasts"}
-                </text>
-              </box>
-            }
-          >
-            <SearchResults
-              results={searchStore.results()}
-              selectedIndex={resultIndex()}
-              focused={focusArea() === "results"}
-              onSelect={handleResultSelect}
-              onChange={setResultIndex}
-              isSearching={searchStore.isSearching()}
-              error={searchStore.error()}
-            />
-          </Show>
-        </box>
-
-        {/* History Sidebar */}
-          <box width={30} border>
-            <box padding={1} flexDirection="column">
-              <box paddingBottom={1}>
-                <text fg={focusArea() === "history" ? "cyan" : "gray"}>
-                  History
-                </text>
-              </box>
-              <SearchHistory
-                history={searchStore.history()}
-                selectedIndex={historyIndex()}
-                focused={focusArea() === "history"}
-              onSelect={handleHistorySelect}
-              onRemove={searchStore.removeFromHistory}
-              onClear={searchStore.clearHistory}
-              onChange={setHistoryIndex}
-            />
-          </box>
-        </box>
-      </box>
-
-      {/* Footer Hints */}
-      <box flexDirection="row" gap={2}>
-        <text fg="gray">[Tab] Switch focus</text>
-        <text fg="gray">[/] Focus search</text>
-        <text fg="gray">[Enter] Select</text>
-        <text fg="gray">[Esc] Back to search</text>
-      </box>
-    </box>
-  )
-}

src/components/SearchResults.tsx

@@ -1,75 +0,0 @@
-/**
- * SearchResults component for displaying podcast search results
- */
-
-import { For, Show } from "solid-js"
-import type { SearchResult } from "../types/source"
-import { ResultCard } from "./ResultCard"
-import { ResultDetail } from "./ResultDetail"
-
-type SearchResultsProps = {
-  results: SearchResult[]
-  selectedIndex: number
-  focused: boolean
-  onSelect?: (result: SearchResult) => void
-  onChange?: (index: number) => void
-  isSearching?: boolean
-  error?: string | null
-}
-
-export function SearchResults(props: SearchResultsProps) {
-  const handleSelect = (index: number) => {
-    props.onChange?.(index)
-  }
-
-  return (
-    <Show when={!props.isSearching} fallback={
-      <box padding={1}>
-        <text fg="yellow">Searching...</text>
-      </box>
-    }>
-      <Show
-        when={!props.error}
-        fallback={
-          <box padding={1}>
-            <text fg="red">{props.error}</text>
-          </box>
-        }
-      >
-        <Show
-          when={props.results.length > 0}
-          fallback={
-            <box padding={1}>
-              <text fg="gray">No results found. Try a different search term.</text>
-            </box>
-          }
-        >
-          <box flexDirection="row" gap={1} height="100%">
-            <box flexDirection="column" flexGrow={1}>
-              <scrollbox height="100%">
-                <box flexDirection="column" gap={1}>
-                  <For each={props.results}>
-                    {(result, index) => (
-                      <ResultCard
-                        result={result}
-                        selected={index() === props.selectedIndex}
-                        onSelect={() => handleSelect(index())}
-                        onSubscribe={() => props.onSelect?.(result)}
-                      />
-                    )}
-                  </For>
-                </box>
-              </scrollbox>
-            </box>
-            <box width={36}>
-              <ResultDetail
-                result={props.results[props.selectedIndex]}
-                onSubscribe={(result) => props.onSelect?.(result)}
-              />
-            </box>
-          </box>
-        </Show>
-      </Show>
-    </Show>
-  )
-}

src/components/Selectable.tsx

@@ -0,0 +1,82 @@
+import { useTheme } from "@/context/ThemeContext";
+import { children as solidChildren } from "solid-js";
+import type { ParentComponent } from "solid-js";
+import type { BoxOptions, TextOptions } from "@opentui/core";
+
+export const SelectableBox: ParentComponent<
+  {
+    selected: () => boolean;
+  } & BoxOptions
+> = (props) => {
+  const themeContext = useTheme();
+  const { theme } = themeContext;
+
+  const child = solidChildren(() => props.children);
+
+  return (
+    <box
+      border={!!props.border}
+      borderColor={props.selected() ? theme.surface : theme.border}
+      backgroundColor={
+        props.selected()
+          ? theme.primary
+          : themeContext.transparentBackground() ||
+              themeContext.selected === "system"
+            ? "transparent"
+            : themeContext.theme.surface
+      }
+      {...props}
+    >
+      {child()}
+    </box>
+  );
+};
+
+enum ColorSet {
+  PRIMARY,
+  SECONDARY,
+  TERTIARY,
+  DEFAULT,
+}
+function getTextColor(set: ColorSet, selected: () => boolean) {
+  const { theme } = useTheme();
+  switch (set) {
+    case ColorSet.PRIMARY:
+      return selected() ? theme.textSelectedPrimary : theme.textPrimary;
+    case ColorSet.SECONDARY:
+      return selected() ? theme.textSelectedSecondary : theme.textSecondary;
+    case ColorSet.TERTIARY:
+      return selected() ? theme.textSelectedTertiary : theme.textTertiary;
+    default:
+      return theme.textPrimary;
+  }
+}
+
+export const SelectableText: ParentComponent<
+  {
+    selected: () => boolean;
+    primary?: boolean;
+    secondary?: boolean;
+    tertiary?: boolean;
+  } & TextOptions
+> = (props) => {
+  const child = solidChildren(() => props.children);
+
+  return (
+    <text
+      fg={getTextColor(
+        props.primary
+          ? ColorSet.PRIMARY
+          : props.secondary
+            ? ColorSet.SECONDARY
+            : props.tertiary
+              ? ColorSet.TERTIARY
+              : ColorSet.DEFAULT,
+        props.selected,
+      )}
+      {...props}
+    >
+      {child()}
+    </text>
+  );
+};

src/components/Shell.tsx

@@ -0,0 +1,527 @@
+/**
+ * Shell — yazi-style application chrome.
+ *
+ * Renders the active page (which owns its own three-column parent | current |
+ * preview panes) full-width, with a bottom status/command bar that also
+ * carries the tab strip. A single `useKeyboard` router translates keystrokes
+ * (via the sequence-aware keybind matcher) into actions: the unified router
+ * in `@/utils/dispatch` handles tabs (digits `1`-`6`, `[`/`]`), h/l depth
+ * drill/pop + fixed-pane swipe, modes, audio, quit, help, and command; the
+ * pane/list ones are dispatched to the active page over the `nav.action`
+ * event bus. There is no sidebar pane.
+ */
+
+import { createEffect, createSignal, onCleanup, Show, For } from "solid-js";
+import { useKeyboard, useRenderer, useTerminalDimensions } from "@opentui/solid";
+import { useTheme } from "@/context/ThemeContext";
+import { useKeybinds, type KeybindActionName } from "@/context/KeybindContext";
+import { useNavigation, NavMode } from "@/context/NavigationContext";
+import { useAudio } from "@/hooks/useAudio";
+import { useAudioNavStore } from "@/stores/audio-nav";
+import { useFeedStore } from "@/stores/feed";
+import { useAppStore } from "@/stores/app";
+import { useToast } from "@/ui/toast";
+import { emit, on } from "@/utils/event-bus";
+import { LayerGraph } from "@/utils/layer-graph";
+import { TABS } from "@/utils/navigation";
+import { createDispatcher } from "@/utils/dispatch";
+import { TabListPane } from "@/components/TabPanel";
+import { PaneRow } from "@/components/PaneRow";
+import { GlobalActivityIndicator } from "@/components/GlobalActivityIndicator";
+
+export function Shell() {
+	const theme = useTheme();
+	const t = theme.theme;
+	const nav = useNavigation();
+	const k = useKeybinds();
+	const audio = useAudio();
+	const renderer = useRenderer();
+	const audioNav = useAudioNavStore();
+	const toast = useToast();
+	const feedStore = useFeedStore();
+
+	const [showHelp, setShowHelp] = createSignal(false);
+
+	// ── Auto jump to Player on podcast start ───────────────────────────────────
+	// Honor the `autoJumpToPlayer` preference: when a NEW episode starts (see
+	// "player.started" — distinct from "player.play", which also fires on
+	// resume), switch to the Player tab and drop into its content pane.
+	on("player.started", () => {
+		const app = useAppStore();
+		if (app.state().preferences.autoJumpToPlayer) {
+			nav.setActiveTab(TABS.PLAYER);
+			nav.enterTabContent(); // PLAYER is a depth-tab — enter its content.
+		}
+	});
+
+	/** Play the episode adjacent (offset ±1) to the currently-playing one,
+	 *  within its feed's episode list. Updates audio-nav context accordingly. */
+	function advanceEpisode(offset: number) {
+		const cur = audio.currentEpisode();
+		if (!cur) {
+			toast.show({ message: "Nothing playing", variant: "warning" });
+			return;
+		}
+		const pid = audioNav.getPodcastId();
+		const feeds = feedStore.getFilteredFeeds();
+		const feed =
+			feeds.find((f) => f.podcast.id === pid) ??
+			feeds.find((f) => f.episodes.some((e) => e.id === cur.id));
+		if (!feed) {
+			toast.show({ message: "Show not found", variant: "warning" });
+			return;
+		}
+		const eps = [...feed.episodes].sort(
+			(a, b) => b.pubDate.getTime() - a.pubDate.getTime(),
+		);
+		const idx = eps.findIndex((e) => e.id === cur.id);
+		const next = eps[idx + offset];
+		if (!next) {
+			toast.show({
+				message: offset > 0 ? "No next episode" : "No previous episode",
+				variant: "warning",
+			});
+			return;
+		}
+		audio.play(next).catch(() => {});
+		audioNav.next(eps.length - 1 - (idx + offset) >= 0 ? idx + offset : idx);
+		toast.show({ message: `♪ ${next.title}`.slice(0, 60), variant: "info" });
+	}
+
+	// ── Command bar dispatch ────────────────────────────────────────────────────
+	const COMMANDS: Record<string, (arg: string) => void> = {
+		quit: () => process.exit(0),
+		exit: () => process.exit(0),
+		q: () => process.exit(0),
+		refresh: () =>
+			emit("nav.action", {
+				action: "refresh",
+				tab: nav.activeTab(),
+				pane: nav.activePane(),
+				mode: nav.mode(),
+			}),
+		r: () =>
+			emit("nav.action", {
+				action: "refresh",
+				tab: nav.activeTab(),
+				pane: nav.activePane(),
+				mode: nav.mode(),
+			}),
+		play: () => audio.togglePlayback().catch(() => {}),
+		pause: () => audio.togglePlayback().catch(() => {}),
+		p: () => audio.togglePlayback().catch(() => {}),
+		next: () => advanceEpisode(1),
+		n: () => advanceEpisode(1),
+		prev: () => advanceEpisode(-1),
+		seek: (arg) => {
+			const n = Number(arg) || 0;
+			audio.seek(n).catch(() => {});
+		},
+		feed: () => nav.setActiveTab(TABS.FEED),
+		f: () => nav.setActiveTab(TABS.FEED),
+		shows: () => nav.setActiveTab(TABS.MYSHOWS),
+		myshows: () => nav.setActiveTab(TABS.MYSHOWS),
+		discover: () => nav.setActiveTab(TABS.DISCOVER),
+		d: () => nav.setActiveTab(TABS.DISCOVER),
+		search: () => nav.setActiveTab(TABS.SEARCH),
+		player: () => nav.setActiveTab(TABS.PLAYER),
+		settings: () => nav.setActiveTab(TABS.SETTINGS),
+		set: () => nav.setActiveTab(TABS.SETTINGS),
+		help: () => setShowHelp((v) => !v),
+		h: () => setShowHelp((v) => !v),
+	};
+
+	function runCommand(raw: string) {
+		const cmd = raw.trim();
+		if (!cmd) return;
+		const name = cmd.split(/\s+/)[0].toLowerCase();
+		const arg = cmd.slice(name.length).trim();
+		const unknownCommand = () => {
+			nav.setCommandError(`unknown command: ${name}`);
+			// re-enter command mode so the user sees the error + can correct
+			nav.enterCommand();
+			nav.setCommandBuffer(cmd);
+		};
+		(COMMANDS[name] ?? unknownCommand)(arg);
+	}
+
+	// ── Command-mode key handling ───────────────────────────────────────────────
+	function handleCommandKey(evt: any) {
+		if (k.match("escape", evt) || evt.name === "ctrl-c") {
+			evt.preventDefault();
+			nav.exitCommand();
+			return;
+		}
+		if (evt.name === "return" || evt.name === "enter") {
+			evt.preventDefault();
+			const cmd = nav.commandBuffer();
+			runCommand(cmd);
+			nav.exitCommand();
+			return;
+		}
+		if (evt.name === "backspace") {
+			evt.preventDefault();
+			const buf = nav.commandBuffer();
+			if (buf.length === 0) {
+				nav.exitCommand();
+				return;
+			}
+			nav.backspaceCommand();
+			return;
+		}
+		if (evt.name && evt.name.length === 1 && !evt.ctrl && !evt.meta) {
+			evt.preventDefault();
+			nav.appendCommand(evt.name);
+			return;
+		}
+	}
+
+	// ── Unified router (normal + visual) ───────────────────────────────────────
+	const { dispatch } = createDispatcher({
+		nav,
+		audio: {
+			togglePlayback: audio.togglePlayback,
+			seekRelative: audio.seekRelative,
+		},
+		k,
+		setShowHelp,
+		advanceEpisode,
+	});
+
+	useKeyboard(
+		(evt: any) => {
+			// Input fields (search boxes, dialogs) own their keys — except Escape,
+			// which defocuses the input so j/k/h navigation resumes (search: h back
+			// to the tab root, j/k to move the recent-searches list).
+			if (nav.inputFocused() && nav.mode() !== NavMode.COMMAND) {
+				if (evt.name === "escape") {
+					evt.preventDefault();
+					nav.setInputFocused(false);
+					// Actually blur the focused renderable too — setting the flag alone
+					// leaves the opentui input owning keys, so nav keys would still be
+					// typed into it. Blurring fires our useInputFocusNav BLURRED handler
+					// (and re-blurs the SearchPage input via its `focused` prop).
+					renderer.currentFocusedRenderable?.blur();
+				}
+				return;
+			}
+			if (nav.mode() === NavMode.COMMAND) {
+				handleCommandKey(evt);
+				return;
+			}
+			const action = k.tryMatch(evt);
+			if (action) dispatch(action, evt);
+		},
+		{ release: false },
+	);
+
+	// ── Status bar fragments ──────────────────────────────────────────────────
+	// Now-playing text carries the podcast name (custom name when set) when
+	// the episode's feed is resolvable, mirroring advanceEpisode's lookup.
+	const nowPlayingText = () => {
+		const ep = audio.currentEpisode();
+		if (!ep) return null;
+		const feeds = feedStore.getFilteredFeeds();
+		const feed =
+			feeds.find((f) => f.podcast.id === ep.podcastId) ??
+			feeds.find((f) => f.episodes.some((e) => e.id === ep.id));
+		return feed
+			? `♪ ${feed.customName || feed.podcast.title} — ${ep.title}`
+			: `♪ ${ep.title}`;
+	};
+	const modeLabel = () =>
+		nav.mode() === NavMode.NORMAL ? "" : `-- ${nav.mode()} --`;
+	const pendingLabel = () =>
+		k
+			.pending()
+			.map((s) => s.key)
+			.join(" ");
+
+	// ── Now-playing marquee ────────────────────────────────────────────────────
+	// The now-playing segment takes the full remaining status-bar width and
+	// marquee-scrolls when its text overflows; when it fits (or the bar is too
+	// narrow to show anything) it renders statically. Each pass scrolls at
+	// SCROLL_STEP_MS per char, then holds at the start for SCROLL_HOLD_MS
+	// before scrolling again.
+	const dims = useTerminalDimensions();
+	const GAP = 3;
+	const SCROLL_STEP_MS = 150;
+	const SCROLL_HOLD_MS = 10_000;
+	const [scrollOffset, setScrollOffset] = createSignal(0);
+	const leftFixed = () =>
+		modeLabel().length +
+		(nav.selectedIds().length > 0
+			? 4 + String(nav.selectedIds().length).length
+			: 0);
+	const rightFixed = () => k.pending().map((p) => p.key).join(" ").length + 3;
+	const availableWidth = () =>
+		Math.max(0, dims().width - leftFixed() - rightFixed() - 2);
+	const visible = () => {
+		const text = nowPlayingText();
+		const avail = availableWidth();
+		if (!text || avail <= 0) return "";
+		if (text.length <= avail) return text;
+		// Double the text with a gap so the wrap is seamless: the window
+		// slides over text + gap + text without ever hitting the tail.
+		return (text + " ".repeat(GAP) + text).slice(
+			scrollOffset(),
+			scrollOffset() + avail,
+		);
+	};
+	createEffect(() => {
+		const text = nowPlayingText();
+		const avail = availableWidth();
+		setScrollOffset(0);
+		if (!text || avail <= 0 || text.length <= avail) return;
+		const cycle = text.length + GAP - avail;
+		// Hold at the start position for SCROLL_HOLD_MS, scroll one pass,
+		// then hold again before the next pass.
+		let holdId: ReturnType<typeof setTimeout> | null = null;
+		let scrollId: ReturnType<typeof setInterval> | null = null;
+		const startHold = () => {
+			setScrollOffset(0);
+			holdId = setTimeout(() => {
+				scrollId = setInterval(() => {
+					const next = scrollOffset() + 1;
+					if (next >= cycle) {
+						clearInterval(scrollId!);
+						startHold();
+					} else {
+						setScrollOffset(next);
+					}
+				}, SCROLL_STEP_MS);
+			}, SCROLL_HOLD_MS);
+		};
+		startHold();
+		onCleanup(() => {
+			if (holdId) clearTimeout(holdId);
+			if (scrollId) clearInterval(scrollId);
+		});
+	});
+
+	return (
+		<box
+				flexDirection="column"
+				width="100%"
+				height="100%"
+				backgroundColor={
+					theme.transparentBackground() ? "transparent" : t.surface
+				}
+			>
+			{/* ── Middle row: tab list (pane 0) + active tab content (panes 1..n) ─ */}
+			<box flexDirection="row" flexGrow={1} width="100%">
+				<Show
+					when={nav.atRootTab()}
+					fallback={
+						<box flexGrow={1} width="100%">
+							{LayerGraph[nav.activeTab()]()}
+						</box>
+					}
+				>
+					{/* app root: the tab list is the CURRENT pane, nothing in UP */}
+					<PaneRow
+						parent={
+							<box padding={1}>
+								<text fg={t.textMuted}>—</text>
+							</box>
+						}
+						current={<TabListPane />}
+						preview={
+							<box padding={1}>
+								<text fg={t.textMuted}>j/k move · l/Enter open a tab</text>
+							</box>
+						}
+						currentLabel="Tabs"
+						focused
+					/>
+				</Show>
+			</box>
+			{/* ── Bottom status / command bar ─────────────────────────────────────── */}
+			<box
+				flexDirection="row"
+				height={1}
+				width="100%"
+				backgroundColor={
+					theme.transparentBackground()
+						? "transparent"
+						: (t.backgroundPanel ?? t.background)
+				}
+			>
+				<Show
+					when={nav.mode() === NavMode.COMMAND}
+					fallback={
+						<>
+							<text fg={t.accent} paddingLeft={1}>
+								{modeLabel()}
+							</text>
+							<Show when={nav.selectedIds().length > 0}>
+								<text fg={t.warning} paddingLeft={1}>
+									● {nav.selectedIds().length}
+								</text>
+							</Show>
+							<Show when={nowPlayingText()}>
+								<box flexGrow={1} paddingLeft={1}>
+									{/* content prop (not a text child): the babel-preset-solid JSX
+									 *  transform HTML-escapes static string children (`<` → `&lt;`),
+									 *  which opentui renders verbatim; content bypasses that. */}
+									<text fg={t.primary} content={visible()} />
+								</box>
+							</Show>
+							<text fg={t.textMuted} paddingRight={1}>
+								{pendingLabel()}
+							</text>
+							<text fg={t.textMuted} paddingRight={1}>
+								~
+							</text>
+						</>
+					}
+				>
+					<text fg={t.accent} paddingLeft={1}>
+						:
+					</text>
+					<text fg={t.text}>{nav.commandBuffer()}</text>
+					<text fg={t.textMuted}>▏</text>
+					<Show when={nav.commandError()}>
+						<text fg={t.error} paddingLeft={1}>
+							{nav.commandError()}
+						</text>
+					</Show>
+				</Show>
+			</box>
+			{/* ── Help overlay ─────────────────────────────────────────────────────── */}
+			<Show when={showHelp()}>
+				<HelpOverlay
+					onClose={() => setShowHelp(false)}
+					sections={helpSections(k)}
+					theme={t as any}
+				/>
+			</Show>
+			{/* ── Global activity indicator (top-right overlay) ─────────────────────── */}
+			<GlobalActivityIndicator />
+		</box>
+	);
+}
+
+function helpSections(k: ReturnType<typeof useKeybinds>) {
+	const p = (a: KeybindActionName) => k.print(a);
+	return [
+		{
+			group: "Move",
+			items: [
+				["j/k", "move"],
+				["J/K", "5 lines"],
+				["ctrl-d/u", "half page"],
+				["gg/G", "top/bottom"],
+			],
+		},
+		{
+			group: "Panes",
+			items: [
+				["j/k", "switch tab (tab panel)"],
+				["l/enter", "enter tab content"],
+				["h", "back to tab panel"],
+				["1-6 / [ ]", "switch tabs"],
+				[":", "command"],
+				["~", "help"],
+			],
+		},
+		{
+			group: "Select",
+			items: [
+				["space", "toggle"],
+				["v", "visual"],
+				["ctrl-a", "all"],
+				["esc", "clear"],
+			],
+		},
+		{
+			group: "Audio",
+			items: [
+				[p("audio-toggle"), "play/pause"],
+				[p("audio-next"), "next"],
+				[p("audio-seek-forward"), "fwd 10s"],
+				[p("audio-seek-backward"), "back 10s"],
+			],
+		},
+		{
+			group: "List",
+			items: [
+				["enter", "open"],
+				["r", "refresh"],
+				["s", "search"],
+				[p("search-scope-toggle"), "shows/episodes"],
+				["f", "filter"],
+				[",", "sort"],
+				[".", "hidden"],
+			],
+		},
+	];
+}
+
+function HelpOverlay(props: {
+	onClose: () => void;
+	sections: { group: string; items: string[][] }[];
+	theme: any;
+}) {
+	useKeyboard((evt: any) => {
+		if (k_match_escape(evt)) {
+			evt.preventDefault();
+			props.onClose();
+		}
+	});
+	const th = props.theme;
+	return (
+		<box
+			position="absolute"
+			top={2}
+			left={0}
+			width="100%"
+			alignItems="center"
+			backgroundColor="rgba(0,0,0,160)"
+			onMouseUp={() => props.onClose()}
+		>
+			<box
+				flexDirection="column"
+				border
+				borderColor={th.border}
+				backgroundColor={th.backgroundPanel ?? th.background}
+				padding={1}
+				width={60}
+				onMouseUp={(e: any) => e.stopPropagation()}
+			>
+				<text fg={th.accent}>
+					Yazi-style keybinds — press ~ or Esc to close
+				</text>
+				<For each={props.sections}>
+					{(sec) => (
+						<box flexDirection="column" marginTop={1}>
+							<text fg={th.textSecondary}>{sec.group}</text>
+							<For each={sec.items}>
+								{(it) => (
+									<box flexDirection="row" gap={2}>
+										<text fg={th.accent}>{String(it[0]).padEnd(14, " ")}</text>
+										<text fg={th.textPrimary ?? th.text}>{it[1]}</text>
+									</box>
+								)}
+							</For>
+						</box>
+					)}
+				</For>
+				<box marginTop={1}>
+					<text fg={th.textMuted}>
+						Edit ~/.config/podtui/keybinds.jsonc to remap.
+					</text>
+				</box>
+			</box>
+		</box>
+	);
+}
+
+function k_match_escape(evt: any): boolean {
+	return (
+		evt.name === "escape" || evt.name === "~" || (evt.ctrl && evt.name === "[")
+	);
+}
+
+// Re-export Episode type for callers building pane trees.
+export type { Episode } from "@/types/episode";

src/components/ShortcutHelp.tsx

@@ -1,26 +0,0 @@
-import { shortcuts } from "../config/shortcuts"
-
-export function ShortcutHelp() {
-  return (
-    <box border title="Shortcuts" style={{ padding: 1 }}>
-      <box style={{ flexDirection: "column" }}>
-        <box style={{ flexDirection: "row" }}>
-          <text>{shortcuts[0]?.keys ?? ""} </text>
-          <text>{shortcuts[0]?.action ?? ""}</text>
-        </box>
-        <box style={{ flexDirection: "row" }}>
-          <text>{shortcuts[1]?.keys ?? ""} </text>
-          <text>{shortcuts[1]?.action ?? ""}</text>
-        </box>
-        <box style={{ flexDirection: "row" }}>
-          <text>{shortcuts[2]?.keys ?? ""} </text>
-          <text>{shortcuts[2]?.action ?? ""}</text>
-        </box>
-        <box style={{ flexDirection: "row" }}>
-          <text>{shortcuts[3]?.keys ?? ""} </text>
-          <text>{shortcuts[3]?.action ?? ""}</text>
-        </box>
-      </box>
-    </box>
-  )
-}

src/components/SourceBadge.tsx

@@ -1,34 +0,0 @@
-import { SourceType } from "../types/source"
-
-type SourceBadgeProps = {
-  sourceId: string
-  sourceName?: string
-  sourceType?: SourceType
-}
-
-const typeLabel = (sourceType?: SourceType) => {
-  if (sourceType === SourceType.API) return "API"
-  if (sourceType === SourceType.RSS) return "RSS"
-  if (sourceType === SourceType.CUSTOM) return "Custom"
-  return "Source"
-}
-
-const typeColor = (sourceType?: SourceType) => {
-  if (sourceType === SourceType.API) return "cyan"
-  if (sourceType === SourceType.RSS) return "green"
-  if (sourceType === SourceType.CUSTOM) return "yellow"
-  return "gray"
-}
-
-export function SourceBadge(props: SourceBadgeProps) {
-  const label = () => props.sourceName || props.sourceId
-
-  return (
-    <box flexDirection="row" gap={1} padding={0}>
-      <text fg={typeColor(props.sourceType)}>
-        [{typeLabel(props.sourceType)}]
-      </text>
-      <text fg="gray">{label()}</text>
-    </box>
-  )
-}

src/components/SourceManager.tsx

@@ -1,300 +0,0 @@
-/**
- * Source management component for PodTUI
- * Add, remove, and configure podcast sources
- */
-
-import { createSignal, For } from "solid-js"
-import { useFeedStore } from "../stores/feed"
-import { SourceType } from "../types/source"
-import type { PodcastSource } from "../types/source"
-
-interface SourceManagerProps {
-  focused?: boolean
-  onClose?: () => void
-}
-
-type FocusArea = "list" | "add" | "url" | "country" | "explicit" | "language"
-
-export function SourceManager(props: SourceManagerProps) {
-  const feedStore = useFeedStore()
-  const [selectedIndex, setSelectedIndex] = createSignal(0)
-  const [focusArea, setFocusArea] = createSignal<FocusArea>("list")
-  const [newSourceUrl, setNewSourceUrl] = createSignal("")
-  const [newSourceName, setNewSourceName] = createSignal("")
-  const [error, setError] = createSignal<string | null>(null)
-
-  const sources = () => feedStore.sources()
-
-  const handleKeyPress = (key: { name: string; shift?: boolean }) => {
-    if (key.name === "escape") {
-      if (focusArea() !== "list") {
-        setFocusArea("list")
-        setError(null)
-      } else if (props.onClose) {
-        props.onClose()
-      }
-      return
-    }
-
-    if (key.name === "tab") {
-      const areas: FocusArea[] = [
-        "list",
-        "country",
-        "language",
-        "explicit",
-        "add",
-        "url",
-      ]
-      const idx = areas.indexOf(focusArea())
-      const nextIdx = key.shift
-        ? (idx - 1 + areas.length) % areas.length
-        : (idx + 1) % areas.length
-      setFocusArea(areas[nextIdx])
-      return
-    }
-
-    if (focusArea() === "list") {
-      if (key.name === "up" || key.name === "k") {
-        setSelectedIndex((i) => Math.max(0, i - 1))
-      } else if (key.name === "down" || key.name === "j") {
-        setSelectedIndex((i) => Math.min(sources().length - 1, i + 1))
-      } else if (key.name === "return" || key.name === "enter" || key.name === "space") {
-        const source = sources()[selectedIndex()]
-        if (source) {
-          feedStore.toggleSource(source.id)
-        }
-      } else if (key.name === "d" || key.name === "delete") {
-        const source = sources()[selectedIndex()]
-        if (source) {
-          const removed = feedStore.removeSource(source.id)
-          if (!removed) {
-            setError("Cannot remove default sources")
-          }
-        }
-      } else if (key.name === "a") {
-        setFocusArea("add")
-      }
-    }
-
-    if (focusArea() === "country") {
-      if (key.name === "enter" || key.name === "return" || key.name === "space") {
-        const source = sources()[selectedIndex()]
-        if (source && source.type === SourceType.API) {
-          const next = source.country === "US" ? "GB" : "US"
-          feedStore.updateSource(source.id, { country: next })
-        }
-      }
-    }
-
-    if (focusArea() === "explicit") {
-      if (key.name === "enter" || key.name === "return" || key.name === "space") {
-        const source = sources()[selectedIndex()]
-        if (source && source.type === SourceType.API) {
-          feedStore.updateSource(source.id, { allowExplicit: !source.allowExplicit })
-        }
-      }
-    }
-
-    if (focusArea() === "language") {
-      if (key.name === "enter" || key.name === "return" || key.name === "space") {
-        const source = sources()[selectedIndex()]
-        if (source && source.type === SourceType.API) {
-          const next = source.language === "ja_jp" ? "en_us" : "ja_jp"
-          feedStore.updateSource(source.id, { language: next })
-        }
-      }
-    }
-  }
-
-  const handleAddSource = () => {
-    const url = newSourceUrl().trim()
-    const name = newSourceName().trim() || `Custom Source`
-
-    if (!url) {
-      setError("URL is required")
-      return
-    }
-
-    try {
-      new URL(url)
-    } catch {
-      setError("Invalid URL format")
-      return
-    }
-
-    feedStore.addSource({
-      name,
-      type: "rss" as SourceType,
-      baseUrl: url,
-      enabled: true,
-      description: `Custom RSS feed: ${url}`,
-    })
-
-    setNewSourceUrl("")
-    setNewSourceName("")
-    setFocusArea("list")
-    setError(null)
-  }
-
-  const getSourceIcon = (source: PodcastSource) => {
-    if (source.type === SourceType.API) return "[API]"
-    if (source.type === SourceType.RSS) return "[RSS]"
-    return "[?]"
-  }
-
-  const selectedSource = () => sources()[selectedIndex()]
-  const isApiSource = () => selectedSource()?.type === SourceType.API
-  const sourceCountry = () => selectedSource()?.country || "US"
-  const sourceExplicit = () => selectedSource()?.allowExplicit !== false
-  const sourceLanguage = () => selectedSource()?.language || "en_us"
-
-  return (
-    <box flexDirection="column" border padding={1} gap={1}>
-      <box flexDirection="row" justifyContent="space-between">
-        <text>
-          <strong>Podcast Sources</strong>
-        </text>
-        <box border padding={0} onMouseDown={props.onClose}>
-          <text fg="cyan">[Esc] Close</text>
-        </box>
-      </box>
-
-        <text fg="gray">Manage where to search for podcasts</text>
-
-      {/* Source list */}
-      <box border padding={1} flexDirection="column" gap={1}>
-        <text fg={focusArea() === "list" ? "cyan" : "gray"}>Sources:</text>
-        <scrollbox height={6}>
-          <For each={sources()}>
-            {(source, index) => (
-              <box
-                flexDirection="row"
-                gap={1}
-                padding={0}
-                backgroundColor={
-                  focusArea() === "list" && index() === selectedIndex()
-                    ? "#333"
-                    : undefined
-                }
-                onMouseDown={() => {
-                  setSelectedIndex(index())
-                  setFocusArea("list")
-                  feedStore.toggleSource(source.id)
-                }}
-              >
-                <text fg={
-                  focusArea() === "list" && index() === selectedIndex()
-                    ? "cyan"
-                    : "gray"
-                }>
-                  {focusArea() === "list" && index() === selectedIndex()
-                    ? ">"
-                    : " "}
-                </text>
-                <text fg={source.enabled ? "green" : "red"}>
-                  {source.enabled ? "[x]" : "[ ]"}
-                </text>
-                <text fg="yellow">{getSourceIcon(source)}</text>
-                <text
-                  fg={
-                    focusArea() === "list" && index() === selectedIndex()
-                      ? "white"
-                      : undefined
-                  }
-                >
-                  {source.name}
-                </text>
-              </box>
-            )}
-          </For>
-        </scrollbox>
-        <text fg="gray">Space/Enter to toggle, d to delete, a to add</text>
-
-        {/* API settings */}
-        <box flexDirection="column" gap={1}>
-          <text fg={isApiSource() ? "gray" : "yellow"}>
-            {isApiSource() ? "API Settings" : "API Settings (select an API source)"}
-          </text>
-          <box flexDirection="row" gap={2}>
-            <box
-              border
-              padding={0}
-              backgroundColor={focusArea() === "country" ? "#333" : undefined}
-            >
-              <text fg={focusArea() === "country" ? "cyan" : "gray"}>
-                Country: {sourceCountry()}
-              </text>
-            </box>
-            <box
-              border
-              padding={0}
-              backgroundColor={focusArea() === "language" ? "#333" : undefined}
-            >
-              <text fg={focusArea() === "language" ? "cyan" : "gray"}>
-                Language: {sourceLanguage() === "ja_jp" ? "Japanese" : "English"}
-              </text>
-            </box>
-            <box
-              border
-              padding={0}
-              backgroundColor={focusArea() === "explicit" ? "#333" : undefined}
-            >
-              <text fg={focusArea() === "explicit" ? "cyan" : "gray"}>
-                Explicit: {sourceExplicit() ? "Yes" : "No"}
-              </text>
-            </box>
-          </box>
-          <text fg="gray">Enter/Space to toggle focused setting</text>
-        </box>
-      </box>
-
-      {/* Add new source form */}
-      <box border padding={1} flexDirection="column" gap={1}>
-        <text fg={focusArea() === "add" || focusArea() === "url" ? "cyan" : "gray"}>
-          Add New Source:
-        </text>
-        
-        <box flexDirection="row" gap={1}>
-          <text fg="gray">Name:</text>
-          <input
-            value={newSourceName()}
-            onInput={setNewSourceName}
-            placeholder="My Custom Feed"
-            focused={props.focused && focusArea() === "add"}
-            width={25}
-          />
-        </box>
-
-        <box flexDirection="row" gap={1}>
-          <text fg="gray">URL:</text>
-          <input
-            value={newSourceUrl()}
-            onInput={(v) => {
-              setNewSourceUrl(v)
-              setError(null)
-            }}
-            placeholder="https://example.com/feed.rss"
-            focused={props.focused && focusArea() === "url"}
-            width={35}
-          />
-        </box>
-
-        <box
-          border
-          padding={0}
-          width={15}
-          onMouseDown={handleAddSource}
-        >
-          <text fg="green">[+] Add Source</text>
-        </box>
-      </box>
-
-      {/* Error message */}
-      {error() && (
-        <text fg="red">{error()}</text>
-      )}
-
-      <text fg="gray">Tab to switch sections, Esc to close</text>
-    </box>
-  )
-}

src/components/SyncError.tsx

@@ -1,15 +0,0 @@
-type SyncErrorProps = {
-  message: string
-  onRetry: () => void
-}
-
-export function SyncError(props: SyncErrorProps) {
-  return (
-    <box border title="Error" style={{ padding: 1, flexDirection: "column", gap: 1 }}>
-      <text>{props.message}</text>
-      <box border onMouseDown={props.onRetry}>
-        <text>Retry</text>
-      </box>
-    </box>
-  )
-}

src/components/SyncPanel.tsx

@@ -1,30 +0,0 @@
-const createSignal = <T,>(value: T): [() => T, (next: T) => void] => {
-  let current = value
-  return [() => current, (next) => {
-    current = next
-  }]
-}
-
-import { ImportDialog } from "./ImportDialog"
-import { ExportDialog } from "./ExportDialog"
-import { SyncStatus } from "./SyncStatus"
-
-export function SyncPanel() {
-  const mode = createSignal<"import" | "export" | null>(null)
-
-  return (
-    <box style={{ flexDirection: "column", gap: 1 }}>
-      <box style={{ flexDirection: "row", gap: 1 }}>
-        <box border onMouseDown={() => mode[1]("import")}>
-          <text>Import</text>
-        </box>
-        <box border onMouseDown={() => mode[1]("export")}>
-          <text>Export</text>
-        </box>
-      </box>
-      <SyncStatus />
-      {mode[0]() === "import" ? <ImportDialog /> : null}
-      {mode[0]() === "export" ? <ExportDialog /> : null}
-    </box>
-  )
-}

src/components/SyncProfile.tsx

@@ -1,148 +0,0 @@
-/**
- * Sync profile component for PodTUI
- * Displays user profile information and sync status
- */
-
-import { createSignal } from "solid-js"
-import { useAuthStore } from "../stores/auth"
-import { format } from "date-fns"
-
-interface SyncProfileProps {
-  focused?: boolean
-  onLogout?: () => void
-  onManageSync?: () => void
-}
-
-type FocusField = "sync" | "export" | "logout"
-
-export function SyncProfile(props: SyncProfileProps) {
-  const auth = useAuthStore()
-  const [focusField, setFocusField] = createSignal<FocusField>("sync")
-  const [lastSyncTime] = createSignal<Date | null>(new Date())
-
-  const fields: FocusField[] = ["sync", "export", "logout"]
-
-  const handleKeyPress = (key: { name: string; shift?: boolean }) => {
-    if (key.name === "tab") {
-      const currentIndex = fields.indexOf(focusField())
-      const nextIndex = key.shift
-        ? (currentIndex - 1 + fields.length) % fields.length
-        : (currentIndex + 1) % fields.length
-      setFocusField(fields[nextIndex])
-    } else if (key.name === "return" || key.name === "enter") {
-      if (focusField() === "sync" && props.onManageSync) {
-        props.onManageSync()
-      } else if (focusField() === "logout" && props.onLogout) {
-        handleLogout()
-      }
-    }
-  }
-
-  const handleLogout = () => {
-    auth.logout()
-    if (props.onLogout) {
-      props.onLogout()
-    }
-  }
-
-  const formatDate = (date: Date | null | undefined): string => {
-    if (!date) return "Never"
-    return format(date, "MMM d, yyyy HH:mm")
-  }
-
-  const user = () => auth.state().user
-
-  // Get user initials for avatar
-  const userInitials = () => {
-    const name = user()?.name || "?"
-    return name.slice(0, 2).toUpperCase()
-  }
-
-  return (
-    <box flexDirection="column" border padding={2} gap={1}>
-      <text>
-        <strong>User Profile</strong>
-      </text>
-
-      <box height={1} />
-
-      {/* User avatar and info */}
-      <box flexDirection="row" gap={2}>
-        {/* ASCII avatar */}
-        <box border padding={1} width={8} height={4} justifyContent="center" alignItems="center">
-          <text fg="cyan">{userInitials()}</text>
-        </box>
-
-        {/* User details */}
-        <box flexDirection="column" gap={0}>
-          <text fg="white">{user()?.name || "Guest User"}</text>
-          <text fg="gray">{user()?.email || "No email"}</text>
-          <text fg="gray">Joined: {formatDate(user()?.createdAt)}</text>
-        </box>
-      </box>
-
-      <box height={1} />
-
-      {/* Sync status section */}
-      <box border padding={1} flexDirection="column" gap={0}>
-        <text fg="cyan">Sync Status</text>
-
-        <box flexDirection="row" gap={1}>
-          <text fg="gray">Status:</text>
-          <text fg={user()?.syncEnabled ? "green" : "yellow"}>
-            {user()?.syncEnabled ? "Enabled" : "Disabled"}
-          </text>
-        </box>
-
-        <box flexDirection="row" gap={1}>
-          <text fg="gray">Last Sync:</text>
-          <text fg="white">{formatDate(lastSyncTime())}</text>
-        </box>
-
-        <box flexDirection="row" gap={1}>
-          <text fg="gray">Method:</text>
-          <text fg="white">File-based (JSON/XML)</text>
-        </box>
-      </box>
-
-      <box height={1} />
-
-      {/* Action buttons */}
-      <box flexDirection="row" gap={2}>
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "sync" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "sync" ? "cyan" : undefined}>
-            [S] Manage Sync
-          </text>
-        </box>
-
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "export" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "export" ? "cyan" : undefined}>
-            [E] Export Data
-          </text>
-        </box>
-
-        <box
-          border
-          padding={1}
-          backgroundColor={focusField() === "logout" ? "#333" : undefined}
-        >
-          <text fg={focusField() === "logout" ? "red" : "gray"}>
-            [L] Logout
-          </text>
-        </box>
-      </box>
-
-      <box height={1} />
-
-      <text fg="gray">Tab to navigate, Enter to select</text>
-    </box>
-  )
-}

src/components/Tab.tsx

@@ -1,36 +0,0 @@
-export type TabId = "discover" | "feeds" | "search" | "player" | "settings"
-
-export type TabDefinition = {
-  id: TabId
-  label: string
-}
-
-export const tabs: TabDefinition[] = [
-  { id: "discover", label: "Discover" },
-  { id: "feeds", label: "My Feeds" },
-  { id: "search", label: "Search" },
-  { id: "player", label: "Player" },
-  { id: "settings", label: "Settings" },
-]
-
-type TabProps = {
-  tab: TabDefinition
-  active: boolean
-  onSelect: (tab: TabId) => void
-}
-
-export function Tab(props: TabProps) {
-  return (
-    <box
-      border
-      onMouseDown={() => props.onSelect(props.tab.id)}
-      style={{ padding: 1, backgroundColor: props.active ? "#333333" : "transparent" }}
-    >
-      <text>
-        {props.active ? "[" : " "}
-        {props.tab.label}
-        {props.active ? "]" : " "}
-      </text>
-    </box>
-  )
-}

src/components/TabNavigation.tsx

@@ -1,18 +0,0 @@
-import { Tab, type TabId } from "./Tab"
-
-type TabNavigationProps = {
-  activeTab: TabId
-  onTabSelect: (tab: TabId) => void
-}
-
-export function TabNavigation(props: TabNavigationProps) {
-  return (
-    <box style={{ flexDirection: "row", gap: 1 }}>
-      <Tab tab={{ id: "discover", label: "Discover" }} active={props.activeTab === "discover"} onSelect={props.onTabSelect} />
-      <Tab tab={{ id: "feeds", label: "My Feeds" }} active={props.activeTab === "feeds"} onSelect={props.onTabSelect} />
-      <Tab tab={{ id: "search", label: "Search" }} active={props.activeTab === "search"} onSelect={props.onTabSelect} />
-      <Tab tab={{ id: "player", label: "Player" }} active={props.activeTab === "player"} onSelect={props.onTabSelect} />
-      <Tab tab={{ id: "settings", label: "Settings" }} active={props.activeTab === "settings"} onSelect={props.onTabSelect} />
-    </box>
-  )
-}

src/components/TabPanel.tsx

@@ -0,0 +1,123 @@
+/**
+ * TabListPane — the tab list as a pane you can drop into the UP | CURRENT |
+ * PREVIEW flow (replaces the old fixed chrome tab column).
+ *
+ * Renders one row per tab (digit + label) using the same selection UI every
+ * other yazi pane uses: the CURSOR row (the one j/k hovers) gets a `❯` marker
+ * and the focus background (`theme.primary` when this pane is the CURRENT
+ * column, `theme.border` when it is the muted UP/parent column). The ACTIVE
+ * tab (the one whose content is open) always carries a `●` marker in accent so
+ * it stays readable in both positions.
+ *
+ * `muted` marks the parent-column rendering: the highlight is dimmed (border
+ * bg, text fg) rather than suppressed, so the Up pane still shows the cursor
+ * and active tab — matching how every other pane's parent column renders its
+ * focused row.
+ */
+
+import { For } from "solid-js";
+import { useTheme } from "@/context/ThemeContext";
+import { useNavigation } from "@/context/NavigationContext";
+import { useScrollIntoView } from "@/hooks/useScrollIntoView";
+import { useSelectionMarker } from "@/hooks/useSelectionMarker";
+import { TABS } from "@/utils/navigation";
+import { NF_ICONS, supportsNerdFonts } from "@/utils/nerd-fonts";
+
+const TAB_LABEL: Record<TABS, string> = {
+  [TABS.FEED]: "Feed",
+  [TABS.MYSHOWS]: "My Shows",
+  [TABS.DISCOVER]: "Discover",
+  [TABS.SEARCH]: "Search",
+  [TABS.PLAYER]: "Player",
+  [TABS.SETTINGS]: "Settings",
+};
+
+/** Nerd Font glyph per tab (rendered only when the terminal supports them). */
+const TAB_ICON: Record<TABS, string> = {
+  [TABS.FEED]: NF_ICONS.feed,
+  [TABS.MYSHOWS]: NF_ICONS.shows,
+  [TABS.DISCOVER]: NF_ICONS.discover,
+  [TABS.SEARCH]: NF_ICONS.search,
+  [TABS.PLAYER]: NF_ICONS.player,
+  [TABS.SETTINGS]: NF_ICONS.settings,
+};
+
+/** Numeric TABS values, in declaration order (1..TabsCount). */
+const TAB_ORDER = Object.values(TABS).filter(
+  (v): v is TABS => typeof v === "number",
+) as TABS[];
+
+export function TabListPane(props: { muted?: boolean }) {
+  // Static: detection never changes mid-session.
+  const nerd = supportsNerdFonts();
+  const { theme } = useTheme();
+  const nav = useNavigation();
+  const marker = useSelectionMarker();
+
+  const cursor = () => nav.tabCursor();
+  const activeTab = () => nav.activeTab();
+  /** `active=true` when this pane is the CURRENT column (Shell root);
+   *  `false` when it is the muted UP/parent column (pages' parent pane). */
+  const active = () => !props.muted;
+
+  // Same focus-bg / focus-fg contract every other pane uses.
+  const focusBg = (t: TABS) =>
+    t === cursor() && active()
+      ? theme.primary
+      : t === cursor()
+      ? theme.border
+      : undefined;
+  const focusFg = (t: TABS) =>
+    t === cursor() && active()
+      ? theme.surface
+      : t === cursor()
+      ? theme.selectedListItemText ?? theme.text
+      : theme.text;
+
+  return (
+    <For each={TAB_ORDER}>
+      {(tab) => {
+        const isCursor = () => cursor() === tab;
+        const isActive = () => activeTab() === tab;
+        // The active tab is only accented in the Up/parent position — when this
+        // pane is CURRENT, the cursor highlight is the only highlight.
+        const labelFg = () =>
+          isCursor()
+            ? focusFg(tab)
+            : isActive() && !active()
+            ? theme.accent
+            : theme.text;
+        const ref = useScrollIntoView(isCursor);
+        return (
+          <box
+            ref={ref}
+            width="100%"
+            height={1}
+            flexDirection="row"
+            paddingRight={1}
+            backgroundColor={focusBg(tab)}
+            onMouseDown={() => {
+              // Click = hover + open, the yazi "open" of the row
+              // (switches to the tab and enters its content), the same
+              // as l/Enter. Restores mouse support the tab-strip
+              // refactor dropped.
+              nav.setTabCursor(tab);
+              nav.activateTabCursor();
+            }}
+          >
+            {/* ── selection marker (j/k cursor) ─────────────────────────── */}
+            <text fg={focusFg(tab)}>{isCursor() ? marker() : " "}</text>
+            {nerd && (
+              <text fg={focusFg(tab)} paddingRight={1}>
+                {TAB_ICON[tab]}
+              </text>
+            )}
+            <text fg={labelFg()} paddingLeft={1}>
+              {TAB_LABEL[tab]}
+            </text>
+          </box>
+        );
+      }}
+    </For>
+  );
+}

src/components/TrendingShows.tsx

@@ -1,51 +0,0 @@
-/**
- * TrendingShows component - Grid/list of trending podcasts
- */
-
-import { For, Show } from "solid-js"
-import type { Podcast } from "../types/podcast"
-import { PodcastCard } from "./PodcastCard"
-
-type TrendingShowsProps = {
-  podcasts: Podcast[]
-  selectedIndex: number
-  focused: boolean
-  isLoading: boolean
-  onSelect?: (index: number) => void
-  onSubscribe?: (podcast: Podcast) => void
-}
-
-export function TrendingShows(props: TrendingShowsProps) {
-  return (
-    <box flexDirection="column" height="100%">
-      <Show when={props.isLoading}>
-        <box padding={2}>
-          <text fg="yellow">Loading trending shows...</text>
-        </box>
-      </Show>
-
-      <Show when={!props.isLoading && props.podcasts.length === 0}>
-        <box padding={2}>
-          <text fg="gray">No podcasts found in this category.</text>
-        </box>
-      </Show>
-
-      <Show when={!props.isLoading && props.podcasts.length > 0}>
-        <scrollbox height="100%">
-          <box flexDirection="column">
-            <For each={props.podcasts}>
-              {(podcast, index) => (
-                <PodcastCard
-                  podcast={podcast}
-                  selected={index() === props.selectedIndex && props.focused}
-                  onSelect={() => props.onSelect?.(index())}
-                  onSubscribe={() => props.onSubscribe?.(podcast)}
-                />
-              )}
-            </For>
-          </box>
-        </scrollbox>
-      </Show>
-    </box>
-  )
-}