fix(core,app,android): keep the password out of storage and refuse key-only 2FA

Moves to proton-sdk / proton-drive-rs 0.7.3.

The stored Proton session now holds, per account key, the passphrase derived
from the mailbox password at sign-in, and resumes through
`ProtonDriveClient::with_key_passphrases`. The mailbox password — on a
single-password account, the login password — and the key salts are no longer
stored. A session in the earlier shape, which only development builds of
1.2.0 wrote, reads as signed out: signing in again replaces it.

An account whose only second factor is a security key is refused at sign-in
with a reason, rather than asked for a code that can only fail as a wrong one.
The code prompts now say plainly that security keys are not supported.

.github/workflows/android.yml

@@ -3,7 +3,15 @@ name: Android
 on:
   push:
     branches: [main]
-    tags: ['v*']
+  # A `v*` tag reaches this workflow through release.yml, which calls it and
+  # publishes the signed APK. Triggering on the tag here as well would build
+  # the release twice.
+  workflow_call:
+    inputs:
+      signed_release:
+        required: false
+        default: false
+        type: boolean
   pull_request:
     paths:
       - 'android/**'
@@ -31,8 +39,8 @@ env:
   CARGO_TERM_COLOR: always
   ANDROID_API: '36'
   ANDROID_BUILD_TOOLS: '37.0.0'
-  ANDROID_NDK: '29.0.14206865'
+  ANDROID_NDK: '30.0.16248370'
-  ANDROID_NDK_HOME: /usr/local/lib/android/sdk/ndk/29.0.14206865
+  ANDROID_NDK_HOME: /usr/local/lib/android/sdk/ndk/30.0.16248370
 
 jobs:
   build:
@@ -74,14 +82,23 @@ jobs:
           distribution: temurin
           java-version: '17'
 
+      # The action's default `packages` includes `tools`, which cmdline-tools
+      # 16.0 no longer offers, so sdkmanager exits 1. The SDK pieces this
+      # build needs are installed explicitly below.
       - uses: android-actions/setup-android@v3
+        with:
+          packages: platform-tools
+          log-accepted-android-sdk-licenses: false
 
       - name: Install native build prerequisites
         run: |
           sudo apt-get update
           sudo apt-get install --no-install-recommends \
-            autoconf automake build-essential cmake curl git gperf libtool \
+            autoconf automake build-essential cmake curl git gperf libdbus-1-dev \
-            meson nasm ninja-build pkg-config python3 unzip wget xz-utils yasm
+            libtool nasm ninja-build pkg-config python3 unzip wget xz-utils yasm
+          # Not apt's meson: noble ships 1.3.2, and the fontconfig that the pinned
+          # mpv-android revision builds requires >= 1.11.
+          pipx install meson==1.12.1
 
       - name: Install Android SDK and NDK
         run: >-
@@ -90,12 +107,53 @@ jobs:
           "build-tools;${ANDROID_BUILD_TOOLS}"
           "ndk;${ANDROID_NDK}"
 
-      - uses: dtolnay/rust-toolchain@stable
+      - id: toolchain
+        uses: dtolnay/rust-toolchain@stable
         with:
           toolchain: '1.96'
           targets: aarch64-linux-android,x86_64-linux-android
 
+      # The registry and the installed helpers only. rust-cache reads
+      # `target/android/<triple>` as a profile directory and deletes the
+      # `release` tree under it before saving, so with its target caching on
+      # every run rebuilt both ABIs from scratch.
       - uses: Swatinem/rust-cache@v2.9.1
+        with:
+          shared-key: android-registry
+          cache-targets: false
+          cache-on-failure: true
+
+      # The target directory as is: the host build the UniFFI bindings come
+      # from and both cargo-ndk ABIs. One entry for both jobs, since the signed
+      # build compiles the same crates for the same targets. A new lockfile
+      # starts from the last one's tree, so a version bump rebuilds only the
+      # workspace crates.
+      - id: target
+        uses: actions/cache/restore@v6
+        with:
+          path: target
+          key: rust-target-android-${{ steps.toolchain.outputs.cachekey }}-${{ hashFiles('Cargo.lock') }}
+          restore-keys: rust-target-android-${{ steps.toolchain.outputs.cachekey }}-
+
+      # libmpv and its dependency tree are the slowest part of the build, and
+      # depend only on the pinned revision and the build script, which stamps
+      # its output with both and skips the build when the stamp matches. Built
+      # and saved in steps of its own, so a later failure in Gradle does not
+      # discard it the way a post-job cache save would.
+      - id: libmpv
+        uses: actions/cache/restore@v6
+        with:
+          path: android/app/build/generated/mpv
+          key: libmpv-${{ hashFiles('scripts/build-libmpv-android.sh') }}
+
+      - name: Build libmpv
+        run: bash scripts/build-libmpv-android.sh
+
+      - if: steps.libmpv.outputs.cache-hit != 'true'
+        uses: actions/cache/save@v6
+        with:
+          path: android/app/build/generated/mpv
+          key: ${{ steps.libmpv.outputs.cache-primary-key }}
 
       - uses: gradle/actions/setup-gradle@v4
         with:
@@ -124,9 +182,15 @@ jobs:
       - name: Android checks and artifacts
         run: bash scripts/build-android.sh all
 
+      - if: steps.target.outputs.cache-hit != 'true'
+        uses: actions/cache/save@v6
+        with:
+          path: target
+          key: ${{ steps.target.outputs.cache-primary-key }}
+
   signed-release:
     name: Signed release
-    if: false
+    if: startsWith(github.ref, 'refs/tags/v') || inputs.signed_release
     needs: build
     runs-on: ubuntu-24.04
     env:
@@ -141,14 +205,23 @@ jobs:
           distribution: temurin
           java-version: '17'
 
+      # The action's default `packages` includes `tools`, which cmdline-tools
+      # 16.0 no longer offers, so sdkmanager exits 1. The SDK pieces this
+      # build needs are installed explicitly below.
       - uses: android-actions/setup-android@v3
+        with:
+          packages: platform-tools
+          log-accepted-android-sdk-licenses: false
 
       - name: Install native build prerequisites
         run: |
           sudo apt-get update
           sudo apt-get install --no-install-recommends \
-            autoconf automake build-essential cmake curl git gperf libtool \
+            autoconf automake build-essential cmake curl git gperf libdbus-1-dev \
-            meson nasm ninja-build pkg-config python3 unzip wget xz-utils yasm
+            libtool nasm ninja-build pkg-config python3 unzip wget xz-utils yasm
+          # Not apt's meson: noble ships 1.3.2, and the fontconfig that the pinned
+          # mpv-android revision builds requires >= 1.11.
+          pipx install meson==1.12.1
 
       - name: Install Android SDK and NDK
         run: >-
@@ -157,12 +230,53 @@ jobs:
           "build-tools;${ANDROID_BUILD_TOOLS}"
           "ndk;${ANDROID_NDK}"
 
-      - uses: dtolnay/rust-toolchain@stable
+      - id: toolchain
+        uses: dtolnay/rust-toolchain@stable
         with:
           toolchain: '1.96'
           targets: aarch64-linux-android,x86_64-linux-android
 
+      # The registry and the installed helpers only. rust-cache reads
+      # `target/android/<triple>` as a profile directory and deletes the
+      # `release` tree under it before saving, so with its target caching on
+      # every run rebuilt both ABIs from scratch.
       - uses: Swatinem/rust-cache@v2.9.1
+        with:
+          shared-key: android-registry
+          cache-targets: false
+          cache-on-failure: true
+
+      # The target directory as is: the host build the UniFFI bindings come
+      # from and both cargo-ndk ABIs. One entry for both jobs, since the signed
+      # build compiles the same crates for the same targets. A new lockfile
+      # starts from the last one's tree, so a version bump rebuilds only the
+      # workspace crates.
+      - id: target
+        uses: actions/cache/restore@v6
+        with:
+          path: target
+          key: rust-target-android-${{ steps.toolchain.outputs.cachekey }}-${{ hashFiles('Cargo.lock') }}
+          restore-keys: rust-target-android-${{ steps.toolchain.outputs.cachekey }}-
+
+      # libmpv and its dependency tree are the slowest part of the build, and
+      # depend only on the pinned revision and the build script, which stamps
+      # its output with both and skips the build when the stamp matches. Built
+      # and saved in steps of its own, so a later failure in Gradle does not
+      # discard it the way a post-job cache save would.
+      - id: libmpv
+        uses: actions/cache/restore@v6
+        with:
+          path: android/app/build/generated/mpv
+          key: libmpv-${{ hashFiles('scripts/build-libmpv-android.sh') }}
+
+      - name: Build libmpv
+        run: bash scripts/build-libmpv-android.sh
+
+      - if: steps.libmpv.outputs.cache-hit != 'true'
+        uses: actions/cache/save@v6
+        with:
+          path: android/app/build/generated/mpv
+          key: ${{ steps.libmpv.outputs.cache-primary-key }}
 
       - uses: gradle/actions/setup-gradle@v4
         with:
@@ -188,10 +302,30 @@ jobs:
       - name: Build signed APK and AAB
         run: bash scripts/build-android.sh signed
 
+      - if: steps.target.outputs.cache-hit != 'true'
+        uses: actions/cache/save@v6
+        with:
+          path: target
+          key: ${{ steps.target.outputs.cache-primary-key }}
+
+      # The APK bundles a GPL libmpv, so its corresponding source ships next to
+      # it. The AAB is for Play only and stays out of the GitHub release.
+      - name: Stage release files
+        run: |
+          version="$(sed -n 's/^version = "\([^"]*\)"/\1/p' Cargo.toml | head -n1)"
+          mkdir -p dist/android
+          cp android/app/build/outputs/apk/release/app-release.apk \
+            "dist/android/proton-stream-$version-android.apk"
+          cp android/app/build/generated/mpv/mpv-android-source-*.tar.gz dist/android/
+
       - uses: actions/upload-artifact@v7
         with:
-          name: android-signed
+          name: android
-          path: |
+          path: dist/android/*
-            android/app/build/outputs/apk/release/*.apk
+          if-no-files-found: error
-            android/app/build/outputs/bundle/release/*.aab
+
+      - uses: actions/upload-artifact@v7
+        with:
+          name: android-bundle
+          path: android/app/build/outputs/bundle/release/*.aab
           if-no-files-found: error

.github/workflows/ci.yml

@@ -23,11 +23,11 @@ jobs:
 
       - uses: Swatinem/rust-cache@v2.9.1
 
-      # libmpv for pstr-player.
+      # libmpv for pstr-player, WebKitGTK for the CAPTCHA window.
-      - name: Install libmpv
+      - name: Install libmpv and WebKitGTK
         run: |
           sudo apt-get update
-          sudo apt-get install -y libmpv-dev
+          sudo apt-get install -y libmpv-dev libwebkit2gtk-4.1-dev
 
       - run: cargo fmt --all -- --check
 

.github/workflows/release.yml

@@ -20,9 +20,6 @@ permissions:
 
 env:
   CARGO_TERM_COLOR: always
-  # Android remains a workflow artifact only until the native libmpv adapter,
-  # corresponding-source bundle, and on-device verification are complete.
-  ANDROID_PUBLIC_RELEASE_ENABLED: 'false'
 
 jobs:
   verify:
@@ -60,11 +57,6 @@ jobs:
           ! grep -q '^\[patch\.crates-io\]' Cargo.toml ||
             { echo "::error::Cargo.toml carries [patch.crates-io]; releases build against the registry"; exit 1; }
 
-      - name: Android publication remains blocked
-        run: |
-          test "$ANDROID_PUBLIC_RELEASE_ENABLED" = false
-          echo "Android APK/AAB publication is blocked until native playback is release-ready."
-
   linux:
     name: Linux artifacts
     needs: verify
@@ -84,7 +76,7 @@ jobs:
       - name: Install build dependencies
         run: |
           sudo apt-get update
-          sudo apt-get install -y libmpv-dev rpm
+          sudo apt-get install -y libmpv-dev libwebkit2gtk-4.1-dev rpm
 
       - name: Gate
         run: |
@@ -148,25 +140,38 @@ jobs:
             dist/*.msi
           if-no-files-found: error
 
+  # The signed APK plus the corresponding source of the libmpv it bundles. The
+  # keystore and its passwords come from the ANDROID_RELEASE_* secrets.
+  android:
+    name: Android
+    needs: verify
+    uses: ./.github/workflows/android.yml
+    with:
+      signed_release: true
+    secrets: inherit
+
   publish:
-    name: Publish desktop artifacts
+    name: Publish
     if: startsWith(github.ref, 'refs/tags/')
-    needs: [linux, windows]
+    needs: [linux, windows, android]
     runs-on: ubuntu-24.04
     permissions:
       contents: write
     steps:
+      # By name: the Android workflow also uploads the AAB, which is for Play
+      # and does not belong on the release.
       - uses: actions/download-artifact@v8
         with:
+          name: linux
+          path: artifacts
+      - uses: actions/download-artifact@v8
+        with:
+          name: windows
+          path: artifacts
+      - uses: actions/download-artifact@v8
+        with:
+          name: android
           path: artifacts
-          merge-multiple: true
-
-      - name: Refuse mobile artifacts while Android publishing is blocked
-        run: |
-          if find artifacts -type f \( -name '*.apk' -o -name '*.aab' \) -print -quit | grep -q .; then
-            echo "::error::Android publishing is disabled while native playback remains incomplete"
-            exit 1
-          fi
 
       - name: Checksums
         run: |

.gitignore

@@ -20,3 +20,9 @@
 /packaging/pkg/
 /packaging/src/
 /packaging/*.pkg.tar.zst
+
+# iOS generated state: XcodeGen owns the project and the Info.plist, and
+# scripts/build-ios.sh writes the bindings and DerivedData under ios/build.
+/ios/build/
+/ios/*.xcodeproj/
+/ios/ProtonStream/Info.plist

Cargo.toml

@@ -11,7 +11,7 @@ members = [
 ]
 
 [workspace.package]
-version = "0.4.0"
+version = "1.2.0"
 edition = "2024"
 license = "MIT"
 repository = "https://github.com/narrrl/proton-stream"
@@ -28,8 +28,8 @@ authors = ["Nils Pukropp <contact@narl.io>"]
 opt-level = 2
 
 [workspace.dependencies]
-proton-sdk = { version = "0.4.0" }
+proton-sdk = { version = "0.7.3" }
-proton-drive-rs = { version = "0.4.0" }
+proton-drive-rs = { version = "0.7.3" }
 
 # Internal crates.
 pstr-core = { path = "crates/pstr-core" }
@@ -51,7 +51,11 @@ anyhow = "1"
 tracing = "0.1"
 tracing-subscriber = { version = "0.3", features = ["env-filter"] }
 directories = "5"
+# Local dates for the history page. Already in the tree through the SDK.
+chrono = { version = "0.4", default-features = false, features = ["clock"] }
 sha2 = "0.10"
+# The id a watch-history file is named by. Already in the tree through the SDK.
+getrandom = "0.3"
 # `bundled` so a Windows build needs no system SQLite.
 rusqlite = { version = "0.32", features = ["bundled"] }
 # The share URL fragment and the custom password are both secrets; they go in
@@ -77,6 +81,12 @@ eframe = { version = "0.35", default-features = false, features = [
     "x11",
 ] }
 egui = "0.35"
+# The icons on buttons. Glyphs like ⏭ and 🔊 come out of whichever fallback
+# font has them, at its own size and baseline; an icon font is one set.
+egui-phosphor = { version = "0.13", default-features = false, features = ["regular"] }
+# Tests only: reads the bundled fonts' character maps. The version epaint
+# already builds, so it costs no extra compile.
+skrifa = { version = "0.42", default-features = false, features = ["std"] }
 # Poster thumbnails only: Proton renders them as JPEG, and a decoder that also
 # pulls in every exotic format is weight this app has no use for.
 image = { version = "0.25", default-features = false, features = ["jpeg", "png", "webp"] }
@@ -84,9 +94,28 @@ image = { version = "0.25", default-features = false, features = ["jpeg", "png",
 # behind a poisoned lock for the rest of the session. Same reason
 # `proton-drive-linux` uses it.
 parking_lot = "0.12"
+# Media keys and the desktop's media widget: MPRIS on Linux, SMTC on Windows.
+# `dbus` rather than `zbus` because the keyring's Secret Service store already
+# links libdbus, so this adds no second D-Bus stack.
+souvlaki = { version = "0.8", default-features = false, features = ["use_dbus"] }
+# Holding the screensaver off while a film plays. mpv does that for a window of
+# its own, but the picture here is drawn into ours, and mpv has no window to
+# hold it for.
+dbus = "0.9"
+windows-sys = "0.61"
+# Toasts on Windows. Linux notifications go over the `dbus` above.
+tauri-winrt-notification = "0.8"
+# The exe's own icon resource, which is what Explorer and a taskbar pin draw.
+embed-resource = "3"
+# Proton's CAPTCHA page, which reports success by posting a message to its
+# host, so it needs a webview this app controls. Run in a child process of its
+# own (`pstr-app::verify`): tao and eframe's winit cannot share an event loop.
+# WebKitGTK on Linux, WebView2 on Windows, WKWebView on macOS.
+wry = { version = "0.57", default-features = false, features = ["os-webview"] }
+tao = { version = "0.37", default-features = false, features = ["rwh_06"] }
 rpassword = "7"
 libloading = "0.8"
-lru = "0.12"
+lru = "0.18"
 # `async fn` in traits is stable at MSRV 1.96 but is not dyn-compatible, and the
 # stream layer needs a `dyn` block source so its cache, ring and read-ahead can
 # be tested against a fake without a network or an account.

PLAN.md

@@ -0,0 +1,170 @@
+# Android plan
+
+Where the Android client stands against the desktop app, and what to change to
+make it feel like a modern streaming app rather than a settings form with a
+player attached. Written 2026-10-03 from a source review and four screenshots
+(Library, Title, Shares, Settings) taken on a phone running v0.5.0.
+
+Android last caught up with the desktop on 2026-08-10 (`4ef6225`); the desktop
+gained about twenty features on 2026-10-02 that Android does not have.
+
+## Status (2026-10-03)
+
+Done: section 0, every parity item, and every recommendation in section 2 —
+the Library, Title, Shares, Settings and Downloads redesigns, per-page app
+bars drawn edge to edge, search behind an icon, skeleton loading and
+generated placeholder art, Settings sub-pages and a language picker, a
+long-press Change match, Inter, light and tablet screenshots, the library
+and a title side by side from 840 dp, a poster-to-backdrop shared element
+transition, and predictive back on the title page.
+
+Two departures from the text below. The tablet layout is a two-pane `Row`
+rather than `ListDetailPaneScaffold`, which would have added the
+`adaptive-layout` artifact for one split. Pull to refresh shows the
+indicator while a crawl runs, but not the crawl's progress.
+
+Not yet verified on a device; the host gate (ktlint, unit and screenshot
+tests) passes, and Android lint runs in CI.
+
+## 0. CI (done)
+
+Every `Android` workflow run since August failed in `:app:buildRustHost`:
+`pstr-core` pulls `keyring` → `dbus-secret-service` → `libdbus-sys`, which needs
+`libdbus-1-dev` on the host. Because no run ever succeeded, no cache was ever
+saved, so each run started from nothing.
+
+- `libdbus-1-dev` added to both jobs' apt install.
+- `Swatinem/rust-cache` shares one key between the two jobs and saves on failure.
+- `android/app/build/generated/mpv` is cached on the hash of
+  `scripts/build-libmpv-android.sh`; the script writes a `STAMP` (revision plus
+  its own hash) last and skips the whole libmpv build when the stamp matches.
+
+Later runs also needed meson 1.12.1 from PyPI (noble's 1.3.2 is too old for
+the pinned fontconfig), libmpv built and cached in its own steps so a later
+failure keeps it, and lint's `OldTargetApi` made informational. A cached run
+restores libmpv in under a minute.
+
+## 1. Desktop parity
+
+Ordered by value on a phone.
+
+1. **Open share links from outside the app.** The manifest has only the
+   launcher intent. Add an `ACTION_VIEW` filter for `drive.proton.me/urls/*` and
+   an `ACTION_SEND` (`text/plain`) filter; both open the add-share dialog with
+   the link filled in. Desktop: `4a54af3`, `53a1d0a`.
+2. **Streaming cache budget.** Android runs on the fixed 4 GiB default
+   (`DiskCacheConfig::DEFAULT_BUDGET_BYTES`), large for a phone. Expose
+   `DiskCache::set_budget` through `pstr-android`, add a 1–16 GiB choice with a
+   usage readout under Storage. Desktop: `a432a93`.
+3. **Hardware-decoding switch.** `pstr_mpv.cpp` hard-codes
+   `hwdec=auto-copy-safe`; a device with green frames has no way out. A
+   Settings toggle, applied from the next file.
+4. **Episode list in the player.** A bottom sheet (portrait) or side panel
+   (landscape) with the title's episodes, opened on the playing season and
+   scrolled to the playing episode. Desktop: `7e734db`.
+5. **Long-press menu on tiles.** Play/resume, mark watched or unwatched,
+   download, change match, remove from Continue watching, in a
+   `ModalBottomSheet`. Desktop: `c5808a5`.
+6. **Undo on snackbars** for marking a title and leaving Continue watching.
+   `AppUiState.message` is a bare string today; it needs an action. Desktop:
+   `79c3f68`.
+7. **History tab.** Needs a bridge call over the `pstr-core::library` query
+   the desktop page uses. Desktop: `e7eeaa5`.
+8. **Buffered range on the seek bar** from mpv's `demuxer-cache-time`.
+9. **Up-next card** with the next episode's still and a countdown ring instead
+   of "Up next in 7s" text.
+10. **Featured banner** at the top of the library. Desktop: `7d03736`.
+11. **Bundled Inter** in `ui/theme/Type.kt`, so both clients read the same.
+    Desktop: `558446b`.
+
+## 2. UI recommendations
+
+### Everywhere
+
+- **Colours stay the theme's.** The red is the Persona theme's accent and the
+  card tint comes from the shared palette, so the redesign changes layout and
+  button hierarchy, not colours.
+- **One button hierarchy.** At most one filled accent button per screen;
+  secondary actions tonal or outlined; destructive actions behind a menu and a
+  confirmation, never a filled red button in a list row.
+- **Edge-to-edge, per-screen titles.** The "proton-stream" app bar on every
+  page wastes a band of height. Library uses a collapsing large title; Title
+  pages draw the backdrop under the status bar; other tabs use their name.
+- **Skeletons instead of spinners** for library and title loading, and
+  generated placeholder art (gradient from the accent plus the title's
+  initials) instead of a black card with a play triangle (Akira).
+- **Pull-to-refresh** (`PullToRefreshBox`) replaces the top-bar refresh icon,
+  with crawl progress shown in the indicator area.
+- **Split `ui/ProtonStreamApp.kt`** (1665 lines) into one file per screen
+  before the work below; every item touches it.
+
+### Library
+
+- Poster grid (2:3, `posterUrl`) at three columns on a phone, title under the
+  poster with no card body. The current 210 dp cropped backdrops fit two titles
+  per screen.
+- Continue watching: 16:9 still with the progress bar laid over the bottom
+  edge of the image and "S03E11 · 12 min left" under it.
+- Search becomes an icon in the app bar that expands into an M3 `SearchBar`,
+  instead of a permanent field above everything.
+- Fix "1 episodes" (line ~507; the season header already pluralises).
+
+### Title page
+
+- Full-bleed backdrop with a gradient scrim, poster, title and meta chips
+  (year, score, genres) over it, collapsing as the page scrolls.
+- Synopsis clamped to three lines with "More".
+- One full-width primary button, "Resume S03E11" or "Play S01E01", then a row
+  of icon actions: download, mark watched, and a ⋮ menu holding Start over,
+  Change match and More on AniList. Today five buttons of three styles wrap
+  over three lines.
+- Drop the "Preferred tracks" form and its Save button from this page. The
+  player already remembers tracks by name per title (`d3c5f07`); expose any
+  override from the player's track chooser.
+- Season picker as a dropdown chip or tabs, not stacked accordions; a 40
+  episode title is one long scroll today.
+- Episode rows: 16:9 still with progress overlay, "1 · Mother and Children"
+  (provider name, else "Episode 1") rather than the raw file name
+  `[Judas] Oshi no Ko - S01E01.mkv`, runtime or air date as supporting text,
+  watched and download state as small trailing icons. The red `S01E01` label
+  above each row goes.
+
+### Shares
+
+- `ListItem` rows: name, "12 titles · crawled 2 h ago" or the failure, and a ⋮
+  menu with Refresh, Re-enter link and Remove (confirmed). The current row
+  wraps "Custom password stored securely" over three lines beside three
+  differently styled actions.
+- "Add share" as an extended FAB, which is also where the share-link intent
+  from parity item 1 lands.
+
+### Settings
+
+- Grouped `ListItem` rows (headline, one line of supporting text, trailing
+  switch), with the long explanations moved into the supporting line or an
+  info dialog. Today each toggle carries a paragraph.
+- Split into sub-pages once storage and decoding settings land: Playback,
+  Downloads & storage, Appearance, Metadata, About.
+- Language fields become a picker dialog over a language list, not free text.
+- Storage shows a usage bar (cache, offline episodes) above the budget choice.
+
+### Robustness
+
+- Screenshot tests (Roborazzi, JVM, no device) for each screen in light and
+  dark, phone and tablet, at font scale 1.0 and 1.5 — the redesign changes
+  every screen, and `docs/TESTING.md` has no visual layer today.
+- 48 dp minimum touch targets and content descriptions on the new icon-only
+  actions.
+- Tablet: `ListDetailPaneScaffold` for library + title, since
+  `NavigationSuiteScaffold` already switches to a rail there.
+- Shared-element transition from a poster to its title page, and predictive
+  back.
+
+## Suggested order
+
+1. CI green (section 0).
+2. Split `ProtonStreamApp.kt`; add screenshot tests for the current screens.
+3. Parity 1–3 (small, phone-specific fixes).
+4. Button hierarchy and Inter — every later screen inherits them.
+5. Title page, then Library, then Shares and Settings.
+6. Parity 4–10.

README.md

@@ -35,8 +35,12 @@ Its toolchain, emulator, signing, and release instructions are in [`docs/ANDROID
 
 ```bash
 cargo run --release -p pstr-app          # the app
+proton-stream 'https://drive.proton.me/urls/TOKEN#fragment'   # open the Add form with a link
 ```
 
+One window at a time: a second launch brings the open window forward and
+hands it any share link it was given, then exits.
+
 The `pstr` CLI does the same work headlessly, and is what tells you which layer
 is broken:
 
@@ -67,8 +71,8 @@ against the SDK's own range download.
 | Player | Embedded libmpv, drawing into the app's own GL surface: HEVC 10-bit, HDR and ASS subtitles with hardware decode. Volume, audio-track, subtitle and chapter pickers; skip-the-opening; next/previous episode and autoplay. The language picked is preferred for the next file too. |
 | Transcoding | None. mpv demuxes and decodes natively. |
 | UI | egui/eframe on glow; mpv renders into the same GL context. |
-| Themes | The shipped near-black palette plus Catppuccin Latte, Frappé, Macchiato and Mocha, each with a choice of eight accents — pink and sky among them — drawn as a gradient unless you turn that off. Picked on the Shares page, applied without a restart. |
+| Themes | The shipped near-black palette, Catppuccin Latte, Frappé, Macchiato and Mocha, and a Persona 5 one — black, white and one loud red, which is what the Red accent is there for — each with a choice of nine accents, drawn as a gradient unless you turn that off. Picked on the Settings page, applied without a restart. |
-| Metadata | Filename parsing, with optional AniList/TMDB enrichment — **off by default**, because enabling it sends your library's titles to a third party. It brings posters, synopses and per-episode titles; a title the scorer refuses to guess about can be pinned by hand, and a pinned match is never overwritten. |
+| Metadata | Filename parsing, with optional AniList/TMDB enrichment — **off by default**, because enabling it sends your library's titles to a third party. It brings posters, synopses, fanart and per-episode titles and synopses (for AniList, from ani.zip, which is sent the matched ids); a title the scorer refuses to guess about can be pinned by hand, and a pinned match is never overwritten. The library sorts by name, watch, add or air date, rating and popularity, folds a franchise into one tile, and shelves titles by director, studio and genre. See [docs/METADATA.md](docs/METADATA.md). |
 | Platforms | Linux and Windows; macOS packaging is written but has not been run on a Mac. A native Android 12+ client is available featuring a Material 3 UI and immersive fullscreen playback. |
 
 ## Building
@@ -79,7 +83,9 @@ Rust 2024, MSRV 1.96.
 cargo build --release
 ```
 
-`pstr-player` needs libmpv development headers (`mpv` ≥ 2.0). On Windows those
+`pstr-player` needs libmpv development headers (`mpv` ≥ 2.0), and on Linux
+`pstr-app` needs WebKitGTK 4.1's, for the window Proton's CAPTCHA is shown in.
+On Windows the libmpv ones
 come from the separate **mpv-dev** archive rather than mpv's player build, and
 `libmpv-2.dll` ships next to the executable. The Proton SDK crates come from
 crates.io; nothing here builds against a sibling checkout.
@@ -103,11 +109,21 @@ see [`docs/ANDROID.md`](docs/ANDROID.md) for exact setup and release signing.
   a local HTTP server: there is no port for another process on the machine to ask
   for the plaintext, and mpv is handed an opaque token rather than a URL that
   would put a share secret in its log and window title.
-- The block cache holds decrypted content. It lives in your cache directory and
+- The block cache holds decrypted content. It lives in your cache directory,
-  can be deleted at any time the app is not running.
+  can be deleted at any time the app is not running, and can be sized or
+  emptied from Settings → Storage.
+- A share link given as a command-line argument is visible to other users of
+  the machine in the process list while that launch runs, and may land in
+  shell history. Pasting it into the window (Ctrl+V) does neither.
+- The desktop's media widget is handed the title, the episode and a `file://`
+  path to artwork already on disk — never a provider URL, so the shell never
+  contacts a metadata provider on its own.
 
 ## License
 
 The shared Rust crates and desktop application are MIT licensed. The Android
 application and its combined native distribution are GPL-3.0-or-later; see
 [`android/LICENSE.md`](android/LICENSE.md) and the bundled-component notices.
+The desktop application embeds the Inter typeface, under the SIL Open Font
+License 1.1 ([`crates/pstr-app/assets/fonts/Inter-OFL.txt`](crates/pstr-app/assets/fonts/Inter-OFL.txt)),
+and the Phosphor icon font, under MIT.

android/THIRD_PARTY_NOTICES.md

@@ -7,11 +7,12 @@ distributions.
 | Component | License |
 |---|---|
 | mpv/libmpv | GPL-2.0-or-later by default; verify the pinned build configuration |
-| LLVM libc++ shared runtime (Android NDK r29) | Apache-2.0 WITH LLVM-exception |
+| LLVM libc++ shared runtime (Android NDK r30) | Apache-2.0 WITH LLVM-exception |
 | AndroidX and Jetpack Compose | Apache-2.0 |
 | Kotlin | Apache-2.0 |
 | JNA | Apache-2.0 or LGPL-2.1-or-later |
 | UniFFI | MPL-2.0 |
+| Inter typeface (bundled, `Inter-OFL.txt`) | OFL-1.1 |
 | proton-stream shared Rust crates | MIT |
 
 This summary is not a replacement for dependency license files. Before a

android/app/build.gradle.kts

@@ -6,6 +6,7 @@ plugins {
     alias(libs.plugins.kotlin.android)
     alias(libs.plugins.kotlin.compose)
     alias(libs.plugins.ktlint)
+    alias(libs.plugins.roborazzi)
 }
 
 val repositoryRoot = rootProject.projectDir.parentFile
@@ -46,7 +47,7 @@ android {
     namespace = "io.narl.protonstream"
     compileSdk = 36
     buildToolsVersion = "37.0.0"
-    ndkVersion = "29.0.14206865"
+    ndkVersion = "30.0.16248370"
 
     defaultConfig {
         applicationId = "io.narl.protonstream"
@@ -142,6 +143,9 @@ android {
             "GradleDependency",
             "NewerVersionAvailable",
             "AndroidGradlePluginVersion",
+            // The same for the platform: raising targetSdk opts into new
+            // behaviour and needs its own pass on a device.
+            "OldTargetApi",
         )
         sarifReport = true
     }
@@ -176,20 +180,16 @@ val uniffiSourceDir = layout.buildDirectory.dir("generated/source/uniffi")
 val hostRustLibrary = repositoryRoot.resolve(
     "target/debug/${System.mapLibraryName("pstr_android")}",
 )
-val stagedMpvDir = layout.buildDirectory.dir("generated/mpv")
 
 val buildLibmpvAndroid by tasks.registering(Exec::class) {
     group = "native"
     description = "Builds the pinned GPL libmpv and stages both Android ABIs."
     workingDir(repositoryRoot)
     commandLine("bash", repositoryRoot.resolve("scripts/build-libmpv-android.sh").absolutePath)
-    inputs.file(repositoryRoot.resolve("scripts/build-libmpv-android.sh"))
+    // No declared outputs: the script's STAMP is the up-to-date check. Gradle
-    outputs.files(
+    // deletes the declared outputs of a task it has no history for, which on a
-        stagedMpvDir.map { it.file("jniLibs/arm64-v8a/libmpv.so") },
+    // fresh CI checkout threw away the tree just restored from the cache and
-        stagedMpvDir.map { it.file("jniLibs/x86_64/libmpv.so") },
+    // rebuilt libmpv from source on every run.
-        stagedMpvDir.map { it.file("include/mpv/client.h") },
-        stagedMpvDir.map { it.file("REVISION") },
-    )
 }
 
 val buildRustHost by tasks.registering(Exec::class) {
@@ -269,6 +269,11 @@ dependencies {
     testImplementation(libs.robolectric)
     testImplementation(libs.androidx.test.core)
     testImplementation(libs.androidx.work.testing)
+    testImplementation(platform(libs.androidx.compose.bom))
+    testImplementation(libs.androidx.compose.ui.test.junit4)
+    testImplementation(libs.roborazzi)
+    testImplementation(libs.roborazzi.compose)
+    testImplementation(libs.roborazzi.junit.rule)
 
     androidTestImplementation(libs.androidx.test.junit)
     androidTestImplementation(libs.androidx.test.core)
@@ -292,6 +297,13 @@ ktlint {
     }
 }
 
+// Screenshot baselines live beside the tests that draw them, so a change to how
+// a screen looks shows up in review as a changed image. `recordRoborazziDebug`
+// rewrites them; `verifyRoborazziDebug` fails on any difference.
+roborazzi {
+    outputDir.set(file("src/test/screenshots"))
+}
+
 // The generated UniFFI directory is a main source dir, so ktlint reads it even
 // though the filter above drops every file in it. Without this, Gradle refuses
 // the build for an undeclared dependency between the two tasks.

android/app/src/main/AndroidManifest.xml

@@ -11,7 +11,9 @@
         android:name=".ProtonStreamApplication"
         android:allowBackup="false"
         android:dataExtractionRules="@xml/data_extraction_rules"
-        android:icon="@drawable/ic_launcher_foreground"
+        android:enableOnBackInvokedCallback="true"
+        tools:targetApi="33"
+        android:icon="@mipmap/ic_launcher"
         android:label="@string/app_name"
         android:supportsRtl="true"
         android:theme="@style/Theme.ProtonStream">
@@ -29,6 +31,7 @@
 
         <activity
             android:name=".MainActivity"
+            android:label="@string/launcher_name"
             android:configChanges="screenSize|smallestScreenSize|screenLayout|orientation|uiMode|density|fontScale|locale|layoutDirection|keyboardHidden"
             android:exported="true"
             android:launchMode="singleTask"
@@ -38,6 +41,24 @@
                 <action android:name="android.intent.action.MAIN" />
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
+            <!--
+              Proton Drive public links. autoVerify="false", said explicitly:
+              the domain is Proton's, so this can never be a verified App Link.
+              Android only opens these here once "Open supported links" is
+              allowed in the app's settings; sharing a link to the app works
+              without that.
+            -->
+            <intent-filter android:autoVerify="false">
+                <action android:name="android.intent.action.VIEW" />
+                <category android:name="android.intent.category.DEFAULT" />
+                <category android:name="android.intent.category.BROWSABLE" />
+                <data android:scheme="https" android:host="drive.proton.me" android:pathPrefix="/urls/" />
+            </intent-filter>
+            <intent-filter>
+                <action android:name="android.intent.action.SEND" />
+                <category android:name="android.intent.category.DEFAULT" />
+                <data android:mimeType="text/plain" />
+            </intent-filter>
         </activity>
 
     </application>

android/app/src/main/assets/licenses/Inter-OFL.txt

@@ -0,0 +1,92 @@
+Copyright (c) 2016 The Inter Project Authors (https://github.com/rsms/inter)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION AND CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

android/app/src/main/assets/licenses/THIRD_PARTY_NOTICES.md

@@ -6,11 +6,12 @@ complete GNU GPL version 3 text is packaged beside this file as `GPL-3.0.txt`.
 | Component | License |
 |---|---|
 | mpv/libmpv | GPL-2.0-or-later by default; verify the pinned build configuration |
-| LLVM libc++ shared runtime (Android NDK r29) | Apache-2.0 WITH LLVM-exception |
+| LLVM libc++ shared runtime (Android NDK r30) | Apache-2.0 WITH LLVM-exception |
 | AndroidX and Jetpack Compose | Apache-2.0 |
 | Kotlin | Apache-2.0 |
 | JNA | Apache-2.0 or LGPL-2.1-or-later |
 | UniFFI | MPL-2.0 |
+| Inter typeface (bundled, `Inter-OFL.txt`) | OFL-1.1 |
 | proton-stream reusable Rust crates | MIT |
 
 Before release, replace this dependency summary with an inventory generated

android/app/src/main/cpp/pstr_mpv.cpp

@@ -31,6 +31,8 @@ extern "C" {
 namespace {
 
 constexpr const char *kProtocol = "pstr";
+/// mpv's `hwdec` when hardware decoding is on. Why this value: `Player()`.
+constexpr const char *kHardwareDecoding = "auto-copy-safe";
 
 struct StreamCookie {
     uint64_t handle;
@@ -191,6 +193,9 @@ struct PlaybackState {
     /// Between a seek being issued and playback actually resuming. The seek bar
     /// has moved but the picture has not.
     bool seeking = false;
+    /// How far into the file the demuxer has read ahead, in seconds; what the
+    /// seek bar shades, so a jump into it is known to cost no fetch.
+    double cached_until = 0.0;
     /// True between `loadfile` being issued and mpv acknowledging it with
     /// `START_FILE`. Everything mpv reports in that window still describes the
     /// *outgoing* file — including the `END_FILE(STOP)` that stopping it emits —
@@ -216,6 +221,7 @@ class Player {
         option("vo", "libmpv");
         option("force-window", "no");
         option("video-timing-offset", "0");
+        // The default; `load` sets it per file from the viewer's setting.
         // `-copy-safe`, not `-safe`. The direct MediaCodec decoders render into
         // an `ANativeWindow` the decoder is handed at init, and this player has
         // none to give: the picture goes through `vo_libmpv` and an EGL pbuffer,
@@ -224,7 +230,7 @@ class Player {
         // `hevc_mediacodec: Both surface and native_window are NULL` before
         // falling back. The copy variants decode in hardware and hand back
         // ordinary frames, which is what this render path can actually use.
-        option("hwdec", "auto-copy-safe");
+        option("hwdec", kHardwareDecoding);
         option("cache", "yes");
         option("cache-secs", "30");
         option("demuxer-readahead-secs", "30");
@@ -245,6 +251,7 @@ class Player {
         observe("video-params/dh", 7, MPV_FORMAT_INT64);
         observe("paused-for-cache", 8, MPV_FORMAT_FLAG);
         observe("cache-buffering-state", 9, MPV_FORMAT_INT64);
+        observe("demuxer-cache-time", 10, MPV_FORMAT_DOUBLE);
         // Errors mpv reports about the file itself, rather than about the
         // request that opened it. Without these a failed demux is silent.
         mpv_request_log_messages(mpv_, "error");
@@ -294,8 +301,12 @@ class Player {
     }
 
     bool load(uint64_t handle, double start, const std::string &audio,
-              const std::string &subtitle, bool subtitles) {
+              const std::string &subtitle, bool subtitles,
+              bool hardware_decoding) {
         if (!mpv_) return false;
+        // Per file, before `loadfile`: a device whose decoder shows green
+        // frames is fixed from the next episode without restarting the core.
+        set_string("hwdec", hardware_decoding ? kHardwareDecoding : "no");
         // No wait for a render context. It is created with the render thread and
         // needs no window, and a load that cannot get one plays audio anyway —
         // waiting for a surface here is what made background playback fail after
@@ -591,6 +602,7 @@ class Player {
         else if (!std::strcmp(property.name, "video-params/dh")) state_.video_height = static_cast<double>(*static_cast<int64_t *>(property.data));
         else if (!std::strcmp(property.name, "paused-for-cache")) state_.buffering = *static_cast<int *>(property.data);
         else if (!std::strcmp(property.name, "cache-buffering-state")) state_.cache_percent = static_cast<double>(*static_cast<int64_t *>(property.data));
+        else if (!std::strcmp(property.name, "demuxer-cache-time")) state_.cached_until = *static_cast<double *>(property.data);
     }
 
     static void render_update(void *opaque) noexcept {
@@ -822,7 +834,7 @@ extern "C" JNIEXPORT void JNICALL Java_io_narl_protonstream_playback_NativeMpvHo
 extern "C" JNIEXPORT void JNICALL Java_io_narl_protonstream_playback_NativeMpvHost_nativeDetachSurface(JNIEnv *, jobject, jlong handle) noexcept {
     c_boundary([=] { if (auto *p = from(handle)) p->detach(); });
 }
-extern "C" JNIEXPORT jboolean JNICALL Java_io_narl_protonstream_playback_NativeMpvHost_nativeLoad(JNIEnv *env, jobject, jlong handle, jlong stream, jdouble start, jstring audio, jstring subtitle, jboolean subtitles) noexcept {
+extern "C" JNIEXPORT jboolean JNICALL Java_io_narl_protonstream_playback_NativeMpvHost_nativeLoad(JNIEnv *env, jobject, jlong handle, jlong stream, jdouble start, jstring audio, jstring subtitle, jboolean subtitles, jboolean hardware_decoding) noexcept {
     return c_boundary<jboolean>(JNI_FALSE, [=] {
         std::string audio_text;
         std::string subtitle_text;
@@ -832,7 +844,8 @@ extern "C" JNIEXPORT jboolean JNICALL Java_io_narl_protonstream_playback_NativeM
         auto *p = from(handle);
         return static_cast<jboolean>(
             p && p->load(static_cast<uint64_t>(stream), start, audio_text,
-                         subtitle_text, subtitles == JNI_TRUE)
+                         subtitle_text, subtitles == JNI_TRUE,
+                         hardware_decoding == JNI_TRUE)
                 ? JNI_TRUE
                 : JNI_FALSE);
     });
@@ -868,8 +881,8 @@ extern "C" JNIEXPORT jdoubleArray JNICALL Java_io_narl_protonstream_playback_Nat
                                   state.video_width, state.video_height,
                                   static_cast<jdouble>(state.end_reason),
                                   state.buffering ? 1.0 : 0.0, state.cache_percent,
-                                  state.seeking ? 1.0 : 0.0};
+                                  state.seeking ? 1.0 : 0.0, state.cached_until};
-        constexpr jsize kFields = 13;
+        constexpr jsize kFields = 14;
         jdoubleArray result = env->NewDoubleArray(kFields);
         if (!result) return static_cast<jdoubleArray>(nullptr);
         env->SetDoubleArrayRegion(result, 0, kFields, values);

android/app/src/main/java/io/narl/protonstream/IncomingShareLink.kt

@@ -0,0 +1,22 @@
+package io.narl.protonstream
+
+import android.content.Intent
+
+/**
+ * A Proton Drive public link, wherever in a piece of text it sits.
+ *
+ * The fragment is kept: it is the share's secret, and a link without it cannot
+ * be opened. Matching stops at whitespace and at the quotes and brackets a
+ * message app wraps a link in, which never occur in a link itself.
+ */
+private val SHARE_LINK = Regex("""https://drive\.proton\.me/urls/[^\s"'<>()\[\]]+""")
+
+/** The share link an `ACTION_VIEW` URL or an `ACTION_SEND` text carries, if any. */
+internal fun shareLinkFrom(action: String?, url: String?, text: CharSequence?): String? = when (action) {
+    Intent.ACTION_VIEW -> url?.let { SHARE_LINK.matchEntire(it)?.value }
+    Intent.ACTION_SEND -> text?.let { SHARE_LINK.find(it)?.value }
+    else -> null
+}
+
+internal fun Intent.shareLink(): String? =
+    shareLinkFrom(action, dataString, getCharSequenceExtra(Intent.EXTRA_TEXT))

android/app/src/main/java/io/narl/protonstream/MainActivity.kt

@@ -33,6 +33,7 @@ import io.narl.protonstream.playback.MpvPlaybackState
 import io.narl.protonstream.playback.NativeMpvHost
 import io.narl.protonstream.playback.PlaybackService
 import io.narl.protonstream.settings.SettingsStore
+import io.narl.protonstream.sync.WatchSyncWorker
 import io.narl.protonstream.ui.ProtonStreamApp
 import io.narl.protonstream.ui.theme.AppearanceState
 import io.narl.protonstream.ui.theme.ProtonStreamTheme
@@ -48,6 +49,9 @@ import uniffi.pstr_android.PaletteRecord
 class MainActivity : ComponentActivity() {
     private val playerHost = mutableStateOf<NativeMpvHost?>(null)
     private val inPictureInPicture = mutableStateOf(false)
+
+    /** A share link handed over by a browser or the share sheet, until the Add form takes it. */
+    private val incomingShareLink = mutableStateOf<String?>(null)
     /**
      * Whether a bind is outstanding, which is what has to be unbound.
      *
@@ -97,6 +101,9 @@ class MainActivity : ComponentActivity() {
         // Infallible by construction — an unreadable theme file resolves to the
         // shipped default rather than throwing.
         runCatching { NativeRuntime.storedPalette() }.onSuccess(AppearanceState::seed)
+        // Only on a fresh start: a recreated activity is handed the intent it
+        // was launched with again, and would offer to add the same share twice.
+        if (savedInstanceState == null) incomingShareLink.value = intent.shareLink()
         enableEdgeToEdge()
         // Re-applied on every change, not just at startup: picking Latte from
         // the settings page has to turn the status bar's icons dark in the same
@@ -134,7 +141,12 @@ class MainActivity : ComponentActivity() {
         }
         setContent {
             ProtonStreamTheme {
-                ProtonStreamApp(playerHost.value, inPictureInPicture.value)
+                ProtonStreamApp(
+                    playerHost.value,
+                    inPictureInPicture.value,
+                    shareLink = incomingShareLink.value,
+                    onShareLinkTaken = { incomingShareLink.value = null },
+                )
             }
         }
     }
@@ -159,6 +171,13 @@ class MainActivity : ComponentActivity() {
         }
     }
 
+    // singleTask: a link opened while the app is running arrives here, not in
+    // a second activity.
+    override fun onNewIntent(intent: Intent) {
+        super.onNewIntent(intent)
+        intent.shareLink()?.let { incomingShareLink.value = it }
+    }
+
     override fun onUserLeaveHint() {
         super.onUserLeaveHint()
         // The backstop for launchers that still send this instead of arming
@@ -189,6 +208,9 @@ class MainActivity : ComponentActivity() {
 
     override fun onStop() {
         super.onStop()
+        // Where the viewer stopped is what their other devices want next, and
+        // a process in the background may not live to the next timed sync.
+        if (!isChangingConfigurations) WatchSyncWorker.enqueue(this)
         if (
             !isChangingConfigurations &&
             !isInPictureInPictureMode &&

android/app/src/main/java/io/narl/protonstream/download/DownloadStateStore.kt

@@ -13,6 +13,8 @@ data class RetainedDownload(
     val total: Long = 0,
     val status: String = STATUS_QUEUED,
     val error: String? = null,
+    /** Recent transfer rate while running; 0 when unknown or not running. */
+    val bytesPerSecond: Long = 0,
 ) {
     val key: String get() = "$shareId\u001f$linkId"
 
@@ -99,6 +101,7 @@ class DownloadStateStore(context: Context) {
         .put("total", record.total)
         .put("status", record.status)
         .put("error", record.error)
+        .put("rate", record.bytesPerSecond)
         .toString()
 
     private fun decode(encoded: String): RetainedDownload {
@@ -112,6 +115,7 @@ class DownloadStateStore(context: Context) {
             total = json.optLong("total"),
             status = json.optString("status", RetainedDownload.STATUS_QUEUED),
             error = json.optString("error").takeIf(String::isNotBlank),
+            bytesPerSecond = json.optLong("rate"),
         )
     }
 

android/app/src/main/java/io/narl/protonstream/download/OfflineDownloadWorker.kt

@@ -25,20 +25,24 @@ class OfflineDownloadWorker(
 ) : CoroutineWorker(appContext, parameters) {
     override suspend fun doWork(): Result {
         createNotificationChannel()
-        setForeground(createForegroundInfo(0))
+        setForeground(createForegroundInfo(null))
         val shareId = inputData.getString(KEY_SHARE_ID) ?: return Result.failure(error("missing share"))
         val volumeId = inputData.getString(KEY_VOLUME_ID) ?: return Result.failure(error("missing volume"))
         val linkId = inputData.getString(KEY_LINK_ID) ?: return Result.failure(error("missing link"))
         val label = inputData.getString(KEY_LABEL) ?: linkId
         val store = DownloadStateStore(applicationContext)
+        // Queued, not running: the engine lets two downloads transfer at once
+        // and holds the rest back, and only the first progress report means
+        // this one has a slot.
         var retained = store.get(shareId, linkId)
             ?: RetainedDownload(shareId, volumeId, linkId, label)
-        retained = retained.copy(status = RetainedDownload.STATUS_RUNNING, error = null)
+        retained = retained.copy(status = RetainedDownload.STATUS_QUEUED, error = null, bytesPerSecond = 0)
         store.put(retained)
 
         val observer = object : DownloadObserver {
             private var reportedAt = 0L
             private var reportedPercent = -1
+            private val rate = TransferRate()
 
             /**
              * Called once per 4 MiB block — a dozen times a second on a fast
@@ -51,6 +55,7 @@ class OfflineDownloadWorker(
                 val percent = if (total == 0UL) 0 else ((downloaded * 100UL) / total).toInt()
                 val now = SystemClock.elapsedRealtime()
                 val complete = total > 0UL && downloaded >= total
+                val bytesPerSecond = rate.sample(downloaded.toLong(), now)
                 if (!complete && percent == reportedPercent && now - reportedAt < PROGRESS_INTERVAL_MS) {
                     return
                 }
@@ -66,6 +71,7 @@ class OfflineDownloadWorker(
                     current.copy(
                         downloaded = downloaded.toLong(),
                         total = total.toLong(),
+                        bytesPerSecond = bytesPerSecond,
                         status = when (current.status) {
                             RetainedDownload.STATUS_PAUSED,
                             RetainedDownload.STATUS_CANCELLED,
@@ -114,11 +120,14 @@ class OfflineDownloadWorker(
         )
     }
 
-    private fun createForegroundInfo(progress: Int): ForegroundInfo {
+    /** [progress] is a percentage, or null while waiting for a download slot. */
+    private fun createForegroundInfo(progress: Int?): ForegroundInfo {
         val notification = NotificationCompat.Builder(applicationContext, CHANNEL_ID)
             .setSmallIcon(io.narl.protonstream.R.drawable.ic_launcher_foreground)
-            .setContentTitle("Making episode available offline")
+            .setContentTitle(
-            .setProgress(100, progress, progress == 0)
+                if (progress == null) "Waiting to download" else "Making episode available offline",
+            )
+            .setProgress(100, progress ?: 0, progress == null || progress == 0)
             .setOngoing(true)
             .build()
         return ForegroundInfo(
@@ -146,5 +155,35 @@ class OfflineDownloadWorker(
     }
 }
 
+/**
+ * Bytes per second over roughly the last few seconds.
+ *
+ * Progress arrives once per 4 MiB block, so on a slow link the bar moves in
+ * steps seconds apart; a rate beside it is what tells a slow download from a
+ * stuck one. Smoothed, because one block that took a little longer than the
+ * last would otherwise halve the figure for a moment.
+ */
+internal class TransferRate {
+    private var lastBytes = -1L
+    private var lastAt = 0L
+    private var smoothed = 0.0
+
+    /** Record [bytes] transferred at [now] (milliseconds) and return the rate. */
+    fun sample(bytes: Long, now: Long): Long {
+        if (lastBytes < 0 || bytes < lastBytes) {
+            lastBytes = bytes
+            lastAt = now
+            return smoothed.toLong()
+        }
+        val elapsed = now - lastAt
+        if (elapsed <= 0) return smoothed.toLong()
+        val instant = (bytes - lastBytes) * 1000.0 / elapsed
+        smoothed = if (smoothed > 0.0) 0.7 * smoothed + 0.3 * instant else instant
+        lastBytes = bytes
+        lastAt = now
+        return smoothed.toLong()
+    }
+}
+
 internal fun stableNotificationId(workId: UUID): Int =
     (workId.hashCode() and Int.MAX_VALUE).coerceAtLeast(1)

android/app/src/main/java/io/narl/protonstream/native/NativeRuntime.kt

@@ -1,6 +1,7 @@
 package io.narl.protonstream.native
 
 import android.content.Context
+import io.narl.protonstream.settings.SettingsStore
 import java.io.File
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.withContext
@@ -56,5 +57,9 @@ object NativeRuntime {
     }
 
     private fun createEngine(): AndroidEngine =
-        AndroidEngine(paths(), KeystoreSecretStore(appContext))
+        AndroidEngine(paths(), KeystoreSecretStore(appContext)).apply {
+            // The budget is Android's setting, so the engine starts on the
+            // default and is told the chosen one before anything streams.
+            setStreamCacheBudget(SettingsStore.gibToBytes(SettingsStore(appContext).cacheBudgetGib))
+        }
 }

android/app/src/main/java/io/narl/protonstream/playback/NativeMpvHost.kt

@@ -75,6 +75,8 @@ data class MpvPlaybackState(
     val cachePercent: Double = 0.0,
     /** A seek has been issued but playback has not resumed at the new position. */
     val seeking: Boolean = false,
+    /** How far the demuxer has read ahead, in seconds into the file. */
+    val cachedUntil: Double = 0.0,
 ) {
     /** Whether the picture is stopped for a reason the viewer did not choose. */
     val stalled: Boolean get() = (buffering || seeking) && !paused && !ended
@@ -184,12 +186,16 @@ class NativeMpvHost private constructor(private val nativeHandle: Long) : Libmpv
         audioLanguage: String?,
         subtitleLanguage: String?,
         subtitles: Boolean,
+        hardwareDecoding: Boolean,
     ) {
         check(size > 0uL) { "Cannot play an empty stream" }
         try {
             withContext(Dispatchers.IO) {
                 val loaded = withOpenHandle {
-                    nativeLoad(it, nativeHandle.toLong(), startPosition, audioLanguage, subtitleLanguage, subtitles).also { loaded ->
+                    nativeLoad(
+                        it, nativeHandle.toLong(), startPosition, audioLanguage, subtitleLanguage, subtitles,
+                        hardwareDecoding,
+                    ).also { loaded ->
                         if (loaded) {
                             // The outgoing stream is released by mpv closing it,
                             // not from here: `loadfile` is asynchronous and its
@@ -309,6 +315,7 @@ class NativeMpvHost private constructor(private val nativeHandle: Long) : Libmpv
                         buffering = values[BUFFERING] != 0.0,
                         cachePercent = values[CACHE_PERCENT],
                         seeking = values[SEEKING] != 0.0,
+                        cachedUntil = values[CACHED_UNTIL],
                     )
                     mutableState.value = next
                     // The listeners drive the media session and the player UI,
@@ -398,7 +405,15 @@ class NativeMpvHost private constructor(private val nativeHandle: Long) : Libmpv
     private external fun nativeDestroy(handle: Long)
     private external fun nativeAttachSurface(handle: Long, surface: Surface)
     private external fun nativeDetachSurface(handle: Long)
-    private external fun nativeLoad(handle: Long, stream: Long, start: Double, audio: String?, subtitle: String?, subtitles: Boolean): Boolean
+    private external fun nativeLoad(
+        handle: Long,
+        stream: Long,
+        start: Double,
+        audio: String?,
+        subtitle: String?,
+        subtitles: Boolean,
+        hardwareDecoding: Boolean,
+    ): Boolean
     private external fun nativePause(handle: Long, paused: Boolean)
     private external fun nativeSeek(handle: Long, position: Double)
     private external fun nativeVolume(handle: Long, volume: Double)
@@ -419,7 +434,7 @@ class NativeMpvHost private constructor(private val nativeHandle: Long) : Libmpv
 
     companion object {
         /** Fields `nativeState` fills, in the order `pstr_mpv.cpp` writes them. */
-        private const val FIELDS = 13
+        private const val FIELDS = 14
         private const val GENERATION = 6
         private const val WIDTH = 7
         private const val HEIGHT = 8
@@ -427,6 +442,7 @@ class NativeMpvHost private constructor(private val nativeHandle: Long) : Libmpv
         private const val BUFFERING = 10
         private const val CACHE_PERCENT = 11
         private const val SEEKING = 12
+        private const val CACHED_UNTIL = 13
 
         init {
             System.loadLibrary("pstr_android")

android/app/src/main/java/io/narl/protonstream/playback/PlayerScreen.kt

@@ -76,6 +76,7 @@ import androidx.compose.ui.viewinterop.AndroidView
 import androidx.core.view.WindowCompat
 import androidx.core.view.WindowInsetsCompat
 import androidx.core.view.WindowInsetsControllerCompat
+import io.narl.protonstream.settings.SettingsStore
 import io.narl.protonstream.native.NativeRuntime
 import io.narl.protonstream.ui.theme.AccentButton
 import io.narl.protonstream.ui.theme.AccentTrack
@@ -83,6 +84,19 @@ import io.narl.protonstream.ui.theme.EdgedButton
 import io.narl.protonstream.ui.theme.QuietButton
 import io.narl.protonstream.ui.theme.TonalButton
 import io.narl.protonstream.ui.thumbnailSource
+import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material.icons.filled.VideoLibrary
+import androidx.compose.foundation.layout.PaddingValues
+import io.narl.protonstream.ui.theme.AccentProgress
+import androidx.compose.animation.core.LinearEasing
+import androidx.compose.animation.core.animateFloatAsState
+import androidx.compose.animation.core.tween
+import io.narl.protonstream.ui.RemoteArtwork
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.ui.draw.clip
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.launch
@@ -207,6 +221,7 @@ fun PlayerScreen(
             nativeHost.play(
                 key, startup.nativeHandle, startup.size, startup.startPosition,
                 startup.audioLanguage, startup.subtitleLanguage, startup.subtitles,
+                SettingsStore(context).hardwareDecoding,
             )
             // After the load, because mpv keeps none of the three across one.
             nativeHost.setVolume(startup.volume)
@@ -272,6 +287,12 @@ fun PlayerScreen(
         nativeHost.beginTransition()
         onIndexChange(index - 1)
     }
+    fun jumpTo(target: Int) {
+        if (target == index || target !in episodes.indices) return
+        save()
+        nativeHost.beginTransition()
+        onIndexChange(target)
+    }
 
     // What the media notification, the lock screen and Picture-in-Picture show.
     // None of them can reach this composition, and all three have to name the
@@ -281,7 +302,7 @@ fun PlayerScreen(
             NowPlaying(
                 media = key,
                 title = episode.label,
-                show = title.canonicalName ?: title.name,
+                show = title.displayName,
                 detail = episode.detail,
                 artworkUrl = title.posterUrl ?: title.backdropUrl,
                 artworkFile = episode.thumbnailSource,
@@ -404,7 +425,7 @@ fun PlayerScreen(
                         style = MaterialTheme.typography.titleMedium,
                     )
                     Text(
-                        listOfNotNull(title.canonicalName ?: title.name, episode.detail.takeIf(String::isNotBlank))
+                        listOfNotNull(title.displayName, episode.detail.takeIf(String::isNotBlank))
                             .joinToString("  •  "),
                         color = Color.White.copy(alpha = 0.7f),
                         maxLines = 1,
@@ -444,6 +465,9 @@ fun PlayerScreen(
                 hasNext = next != null,
                 onPrevious = { retreat() },
                 onNext = { advance() },
+                episodes = episodes,
+                playing = index,
+                onEpisode = { jumpTo(it) },
                 onRotate = { landscapeLocked = activity?.toggleLandscape() ?: false },
                 landscapeLocked = landscapeLocked,
             )
@@ -591,11 +615,15 @@ private fun PlayerControls(
     hasNext: Boolean,
     onPrevious: () -> Unit,
     onNext: () -> Unit,
+    episodes: List<EpisodeRecord>,
+    playing: Int,
+    onEpisode: (Int) -> Unit,
     onRotate: () -> Unit,
     landscapeLocked: Boolean,
 ) {
     val scope = rememberCoroutineScope()
     var choosing by remember { mutableStateOf<String?>(null) }
+    var showEpisodes by remember { mutableStateOf(false) }
     var showChapters by remember { mutableStateOf(false) }
     var showSpeeds by remember { mutableStateOf(false) }
     // What the store says, so the dialog opens on the rate that is playing.
@@ -638,7 +666,12 @@ private fun PlayerControls(
                         scrubbing = null
                     },
                     valueRange = 0f..duration,
-                    track = { AccentTrack(it) },
+                    track = {
+                        AccentTrack(
+                            it,
+                            buffered = if (state.duration > 0) (state.cachedUntil / state.duration).toFloat() else 0f,
+                        )
+                    },
                 )
                 ChapterMarks(chapters, state.duration, Modifier.matchParentSize())
             }
@@ -664,6 +697,9 @@ private fun PlayerControls(
                 CompactIcon(Icons.Default.SkipNext, "Next episode", enabled = hasNext, onClick = onNext)
             }
             Row(verticalAlignment = Alignment.CenterVertically) {
+                if (episodes.size > 1) {
+                    CompactIcon(Icons.Default.VideoLibrary, "Episodes") { showEpisodes = true }
+                }
                 if (chapters.size > 1) {
                     CompactIcon(Icons.AutoMirrored.Filled.Toc, "Chapters") { showChapters = true }
                 }
@@ -716,6 +752,14 @@ private fun PlayerControls(
             },
         )
     }
+    if (showEpisodes) {
+        EpisodeChooser(
+            episodes = episodes,
+            playing = playing,
+            onDismiss = { showEpisodes = false },
+            onSelect = { showEpisodes = false; onEpisode(it) },
+        )
+    }
     if (showChapters) {
         ChapterChooser(
             chapters = chapters,
@@ -870,6 +914,83 @@ private fun ChapterChooser(
     )
 }
 
+/**
+ * The title's episodes, from the player: a sheet rather than a dialog, opened
+ * scrolled to the one playing so the next few are in view without a search.
+ * Each row has its still, its name, and whether it is playing, watched or
+ * part way.
+ */
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+private fun EpisodeChooser(
+    episodes: List<EpisodeRecord>,
+    playing: Int,
+    onDismiss: () -> Unit,
+    onSelect: (Int) -> Unit,
+) {
+    val list = rememberLazyListState(initialFirstVisibleItemIndex = (playing - 1).coerceAtLeast(0))
+    ModalBottomSheet(onDismissRequest = onDismiss) {
+        Text(
+            "Episodes",
+            style = MaterialTheme.typography.titleMedium,
+            modifier = Modifier.padding(horizontal = 24.dp, vertical = 8.dp),
+        )
+        LazyColumn(state = list, contentPadding = PaddingValues(bottom = 24.dp)) {
+            itemsIndexed(episodes, key = { _, it -> it.linkId }) { position, episode ->
+                val current = position == playing
+                Row(
+                    Modifier
+                        .fillMaxWidth()
+                        .clickable { onSelect(position) }
+                        .background(
+                            if (current) MaterialTheme.colorScheme.secondaryContainer else Color.Transparent,
+                        )
+                        .padding(horizontal = 16.dp, vertical = 8.dp),
+                    verticalAlignment = Alignment.CenterVertically,
+                ) {
+                    Box(Modifier.width(112.dp).aspectRatio(16f / 9f).clip(MaterialTheme.shapes.small)) {
+                        RemoteArtwork(
+                            episode.stillUrl,
+                            episode.label,
+                            Modifier.fillMaxSize(),
+                            fallback = episode.thumbnailSource,
+                            labelled = false,
+                        )
+                        episode.progress?.takeIf { !episode.watched && !current }?.let { progress ->
+                            AccentProgress(
+                                progress = { progress.toFloat().coerceIn(0f, 1f) },
+                                modifier = Modifier.fillMaxWidth().align(Alignment.BottomCenter),
+                            )
+                        }
+                    }
+                    Column(Modifier.weight(1f).padding(start = 12.dp)) {
+                        Text(
+                            episode.providerName ?: episode.label,
+                            style = MaterialTheme.typography.titleSmall,
+                            maxLines = 2,
+                            overflow = TextOverflow.Ellipsis,
+                        )
+                        Text(
+                            when {
+                                current -> "Playing"
+                                episode.watched -> "${episode.label} · Watched"
+                                episode.resumeAt != null -> "${episode.label} · Part way"
+                                else -> episode.label
+                            },
+                            style = MaterialTheme.typography.bodySmall,
+                            color = if (current) {
+                                MaterialTheme.colorScheme.primary
+                            } else {
+                                MaterialTheme.colorScheme.onSurfaceVariant
+                            },
+                        )
+                    }
+                }
+            }
+        }
+    }
+}
+
 /**
  * The countdown into the next episode, shown once the credits run starts.
  *
@@ -898,26 +1019,65 @@ private fun UpNextCard(
     }
     // `showing` already implies a non-null episode, and the compiler knows it.
     if (!showing) return
+    // Eased between ticks, so the ring runs down rather than stepping once a
+    // second.
+    val ring by animateFloatAsState(
+        targetValue = remaining.toFloat() / UP_NEXT_SECONDS,
+        animationSpec = tween(durationMillis = 1_000, easing = LinearEasing),
+        label = "up-next countdown",
+    )
     Column(
         modifier
-            .background(MaterialTheme.colorScheme.surfaceContainerHighest, MaterialTheme.shapes.small)
+            .width(280.dp)
+            .background(MaterialTheme.colorScheme.surfaceContainerHighest, MaterialTheme.shapes.medium)
             .padding(12.dp),
     ) {
-        Text(
+        Row(verticalAlignment = Alignment.CenterVertically) {
-            "Up next in ${remaining}s",
+            // The next episode's still, so the card says which episode
-            color = MaterialTheme.colorScheme.onSurfaceVariant,
+            // without being read; the ring over it is both the countdown and
-            style = MaterialTheme.typography.labelMedium,
+            // the button that skips it.
-        )
+            Box(
-        Text(
+                Modifier
-            upNext.label,
+                    .width(112.dp)
-            color = MaterialTheme.colorScheme.onSurface,
+                    .aspectRatio(16f / 9f)
-            maxLines = 1,
+                    .clip(MaterialTheme.shapes.small)
-            overflow = TextOverflow.Ellipsis,
+                    .clickable(onClick = onPlayNow),
-            style = MaterialTheme.typography.titleSmall,
+                contentAlignment = Alignment.Center,
-        )
+            ) {
-        Row(horizontalArrangement = Arrangement.spacedBy(8.dp), modifier = Modifier.padding(top = 8.dp)) {
+                RemoteArtwork(
-            AccentButton(onClick = onPlayNow) { Text("Play now") }
+                    upNext.stillUrl,
-            QuietButton(onClick = { held = true }) { Text("Watch till the end") }
+                    upNext.label,
+                    Modifier.fillMaxSize(),
+                    fallback = upNext.thumbnailSource,
+                    labelled = false,
+                )
+                Box(Modifier.size(40.dp).clip(CircleShape).background(Color.Black.copy(alpha = 0.5f)))
+                CircularProgressIndicator(
+                    progress = { ring },
+                    modifier = Modifier.size(40.dp),
+                    color = Color.White,
+                    trackColor = Color.White.copy(alpha = 0.25f),
+                    strokeWidth = 3.dp,
+                )
+                Icon(Icons.Default.PlayArrow, contentDescription = "Play now", tint = Color.White)
+            }
+            Column(Modifier.weight(1f).padding(start = 12.dp)) {
+                Text(
+                    "Up next in ${remaining}s",
+                    color = MaterialTheme.colorScheme.onSurfaceVariant,
+                    style = MaterialTheme.typography.labelMedium,
+                )
+                Text(
+                    upNext.providerName ?: upNext.label,
+                    color = MaterialTheme.colorScheme.onSurface,
+                    maxLines = 2,
+                    overflow = TextOverflow.Ellipsis,
+                    style = MaterialTheme.typography.titleSmall,
+                )
+            }
+        }
+        QuietButton(onClick = { held = true }, modifier = Modifier.padding(top = 4.dp)) {
+            Text("Watch till the end")
         }
     }
 }

android/app/src/main/java/io/narl/protonstream/playback/StreamSession.kt

@@ -92,6 +92,7 @@ interface LibmpvHost {
         audioLanguage: String? = null,
         subtitleLanguage: String? = null,
         subtitles: Boolean = true,
+        hardwareDecoding: Boolean = true,
     )
 
     /** Calls pstr_android_stream_release exactly once for a published handle. */

android/app/src/main/java/io/narl/protonstream/settings/SettingsStore.kt

@@ -20,9 +20,34 @@ class SettingsStore(context: Context) {
         get() = preferences.getBoolean(KEY_BACKGROUND_AUDIO, true)
         set(value) { preferences.edit().putBoolean(KEY_BACKGROUND_AUDIO, value).apply() }
 
-    private companion object {
+    /**
-        const val NAME = "proton_stream_settings"
+     * Whether mpv may decode in hardware. Off is the way out for a device whose
-        const val KEY_WIFI_ONLY = "wifi_only"
+     * MediaCodec decoder shows green or torn frames; it costs battery, so it is
-        const val KEY_BACKGROUND_AUDIO = "background_audio"
+     * on unless the viewer turns it off. Read at each load, so a change applies
+     * from the next file.
+     */
+    var hardwareDecoding: Boolean
+        get() = preferences.getBoolean(KEY_HARDWARE_DECODING, true)
+        set(value) { preferences.edit().putBoolean(KEY_HARDWARE_DECODING, value).apply() }
+
+    /** The streaming cache's budget, in GiB. See [CACHE_BUDGET_CHOICES]. */
+    var cacheBudgetGib: Int
+        get() = preferences.getInt(KEY_CACHE_BUDGET_GIB, DEFAULT_CACHE_BUDGET_GIB)
+        set(value) { preferences.edit().putInt(KEY_CACHE_BUDGET_GIB, value).apply() }
+
+    companion object {
+        /** The desktop's range, in the steps a phone's storage is bought in. */
+        val CACHE_BUDGET_CHOICES = listOf(1, 2, 4, 8, 16)
+
+        /** `DiskCacheConfig::DEFAULT_BUDGET_BYTES`, so an unset choice changes nothing. */
+        const val DEFAULT_CACHE_BUDGET_GIB = 4
+
+        fun gibToBytes(gib: Int): ULong = gib.toULong() * 1024uL * 1024uL * 1024uL
+
+        private const val NAME = "proton_stream_settings"
+        private const val KEY_WIFI_ONLY = "wifi_only"
+        private const val KEY_BACKGROUND_AUDIO = "background_audio"
+        private const val KEY_HARDWARE_DECODING = "hardware_decoding"
+        private const val KEY_CACHE_BUDGET_GIB = "cache_budget_gib"
     }
 }

android/app/src/main/java/io/narl/protonstream/sync/WatchSyncWorker.kt

@@ -0,0 +1,56 @@
+package io.narl.protonstream.sync
+
+import android.content.Context
+import androidx.work.BackoffPolicy
+import androidx.work.Constraints
+import androidx.work.CoroutineWorker
+import androidx.work.ExistingWorkPolicy
+import androidx.work.NetworkType
+import androidx.work.OneTimeWorkRequestBuilder
+import androidx.work.WorkManager
+import androidx.work.WorkerParameters
+import io.narl.protonstream.native.NativeRuntime
+import uniffi.pstr_android.AccountState
+import java.util.concurrent.TimeUnit
+
+/**
+ * One watch-history sync after the app leaves the screen.
+ *
+ * The model's timer only runs while the app is alive, and Android is free to
+ * kill a process in the background without notice — so the position the
+ * viewer stopped at would wait for the next launch to reach their other
+ * devices. Handed to WorkManager instead, it goes as soon as there is a
+ * network, even if the process is gone by then.
+ */
+class WatchSyncWorker(
+    appContext: Context,
+    parameters: WorkerParameters,
+) : CoroutineWorker(appContext, parameters) {
+    override suspend fun doWork(): Result {
+        val engine = NativeRuntime.engine()
+        return runCatching { engine.syncWatchHistory() }.fold(
+            onSuccess = { Result.success() },
+            onFailure = {
+                // Signed out by the engine — the session ended — is not
+                // something a retry fixes; a dropped connection is.
+                val signedOut = runCatching { engine.accountState() }.getOrNull() == AccountState.SignedOut
+                if (signedOut || runAttemptCount >= MAX_ATTEMPTS) Result.failure() else Result.retry()
+            },
+        )
+    }
+
+    companion object {
+        private const val WORK_NAME = "watch-history-sync"
+        private const val MAX_ATTEMPTS = 3
+
+        /** Replacing: one pending sync covers every position saved before it runs. */
+        fun enqueue(context: Context) {
+            val request = OneTimeWorkRequestBuilder<WatchSyncWorker>()
+                .setConstraints(Constraints.Builder().setRequiredNetworkType(NetworkType.CONNECTED).build())
+                .setBackoffCriteria(BackoffPolicy.EXPONENTIAL, 30, TimeUnit.SECONDS)
+                .build()
+            WorkManager.getInstance(context.applicationContext)
+                .enqueueUniqueWork(WORK_NAME, ExistingWorkPolicy.REPLACE, request)
+        }
+    }
+}

android/app/src/main/java/io/narl/protonstream/ui/AccountUi.kt

@@ -0,0 +1,506 @@
+package io.narl.protonstream.ui
+
+import android.annotation.SuppressLint
+import android.os.Handler
+import android.os.Looper
+import android.webkit.JavascriptInterface
+import android.webkit.WebResourceRequest
+import android.webkit.WebView
+import android.webkit.WebViewClient
+import androidx.activity.compose.BackHandler
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
+import androidx.compose.material.icons.filled.AccountCircle
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material.icons.filled.Computer
+import androidx.compose.material.icons.filled.Folder
+import androidx.compose.material.icons.filled.FolderShared
+import androidx.compose.material.icons.filled.InsertDriveFile
+import androidx.compose.material.icons.filled.Logout
+import androidx.compose.material.icons.filled.Movie
+import androidx.compose.material.icons.filled.MoreVert
+import androidx.compose.material.icons.filled.Storage
+import androidx.compose.material.icons.filled.Sync
+import androidx.compose.material3.AlertDialog
+import androidx.compose.material3.Card
+import androidx.compose.material3.CircularProgressIndicator
+import androidx.compose.material3.DropdownMenu
+import androidx.compose.material3.DropdownMenuItem
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateListOf
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.input.PasswordVisualTransformation
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.viewinterop.AndroidView
+import androidx.compose.ui.window.Dialog
+import androidx.compose.ui.window.DialogProperties
+import androidx.compose.ui.window.SecureFlagPolicy
+import io.narl.protonstream.native.NativeRuntime
+import io.narl.protonstream.ui.theme.AccentButton
+import io.narl.protonstream.ui.theme.TonalButton
+import uniffi.pstr_android.AccountState
+import uniffi.pstr_android.DriveEntryRecord
+import uniffi.pstr_android.DrivePlaceRecord
+import uniffi.pstr_android.PlaceType
+import uniffi.pstr_android.verificationToken
+
+/** What the account card and its dialogs can ask the model for. */
+internal data class AccountActions(
+    val signIn: (String, String, String?) -> Unit,
+    val submitSecondFactor: (String) -> Unit,
+    val submitMailboxPassword: (String) -> Unit,
+    val cancelSignIn: () -> Unit,
+    val dismissVerification: () -> Unit,
+    val signOut: () -> Unit,
+    val syncNow: () -> Unit,
+    val addFolder: (String, String, String) -> Unit,
+    val onError: (Throwable) -> Unit,
+)
+
+/**
+ * The Proton account, at the top of the shares page: why one would sign in,
+ * or who is signed in and how watch-history sync is doing.
+ */
+@Composable
+internal fun AccountCard(
+    account: AccountUiState,
+    actions: AccountActions,
+    onSignIn: () -> Unit,
+    onBrowse: () -> Unit,
+) {
+    val state = account.state ?: return
+    Card(Modifier.fillMaxWidth().padding(horizontal = 16.dp, vertical = 8.dp)) {
+        if (state is AccountState.SignedIn) {
+            var menu by remember { mutableStateOf(false) }
+            ListItem(
+                headlineContent = { Text(state.username, fontWeight = FontWeight.SemiBold) },
+                supportingContent = { Text(syncLine(account, System.currentTimeMillis())) },
+                leadingContent = {
+                    Icon(Icons.Default.AccountCircle, contentDescription = null, tint = MaterialTheme.colorScheme.primary)
+                },
+                trailingContent = {
+                    Box {
+                        IconButton(onClick = { menu = true }) {
+                            Icon(Icons.Default.MoreVert, contentDescription = "Account actions")
+                        }
+                        DropdownMenu(expanded = menu, onDismissRequest = { menu = false }) {
+                            DropdownMenuItem(
+                                text = { Text("Sync now") },
+                                leadingIcon = { Icon(Icons.Default.Sync, contentDescription = null) },
+                                onClick = { menu = false; actions.syncNow() },
+                            )
+                            DropdownMenuItem(
+                                text = { Text("Sign out") },
+                                leadingIcon = { Icon(Icons.Default.Logout, contentDescription = null) },
+                                onClick = { menu = false; actions.signOut() },
+                            )
+                        }
+                    }
+                },
+                colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+            )
+            TonalButton(
+                onClick = onBrowse,
+                modifier = Modifier.padding(start = 16.dp, end = 16.dp, bottom = 16.dp),
+            ) {
+                Icon(Icons.Default.Folder, contentDescription = null)
+                Text("Add from your Drive", Modifier.padding(start = 8.dp))
+            }
+        } else {
+            Column(Modifier.padding(16.dp), verticalArrangement = Arrangement.spacedBy(8.dp)) {
+                Text("Proton account", style = MaterialTheme.typography.titleMedium)
+                Text(
+                    "Optional. Signed in, watch history is kept in your own Drive so every device " +
+                        "resumes where another left off, and folders of your Drive can join the library.",
+                    style = MaterialTheme.typography.bodyMedium,
+                    color = MaterialTheme.colorScheme.onSurfaceVariant,
+                )
+                TonalButton(onClick = onSignIn) { Text("Sign in") }
+            }
+        }
+    }
+}
+
+/** "Synced 3 min ago · 2 from other devices", or why it did not. */
+internal fun syncLine(account: AccountUiState, now: Long): String {
+    account.syncError?.let { return "Watch history did not sync: $it" }
+    val at = account.syncedAt ?: return "Watch history syncs with your Drive"
+    val minutes = ((now - at).coerceAtLeast(0) / 60_000).toInt()
+    val ago = when {
+        minutes < 1 -> "just now"
+        minutes < 60 -> "$minutes min ago"
+        else -> "${minutes / 60} h ago"
+    }
+    val applied = if (account.applied > 0) " · ${account.applied} from other devices" else ""
+    return "Synced $ago$applied"
+}
+
+/**
+ * Signing in, one step at a time: address and password, then a second-factor
+ * code or the mailbox password if the account has them, with Proton's CAPTCHA
+ * over the top when it asks for one.
+ */
+@Composable
+internal fun SignInDialog(account: AccountUiState, actions: AccountActions, onDismiss: () -> Unit) {
+    var username by remember { mutableStateOf("") }
+    var password by remember { mutableStateOf("") }
+    var code by remember { mutableStateOf("") }
+    var mailbox by remember { mutableStateOf("") }
+    val state = account.state
+    LaunchedEffect(state) {
+        if (state is AccountState.SignedIn) onDismiss()
+    }
+    val dismiss = {
+        if (state == AccountState.SecondFactor || state == AccountState.MailboxPassword) actions.cancelSignIn()
+        onDismiss()
+    }
+    AlertDialog(
+        onDismissRequest = dismiss,
+        properties = DialogProperties(securePolicy = SecureFlagPolicy.SecureOn),
+        title = { Text("Sign in to Proton") },
+        text = {
+            Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
+                when (state) {
+                    AccountState.SecondFactor -> {
+                        OutlinedTextField(
+                            code,
+                            { code = it },
+                            label = { Text("Code from your authenticator app") },
+                            singleLine = true,
+                            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.NumberPassword),
+                        )
+                        Text(SECURITY_KEY_NOTE, style = MaterialTheme.typography.bodySmall)
+                    }
+                    AccountState.MailboxPassword -> {
+                        Text(
+                            "This account has a separate mailbox password. It unlocks your files.",
+                            style = MaterialTheme.typography.bodySmall,
+                        )
+                        PasswordField(mailbox, { mailbox = it }, "Mailbox password")
+                    }
+                    else -> {
+                        OutlinedTextField(
+                            username,
+                            { username = it },
+                            label = { Text("Address") },
+                            singleLine = true,
+                            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Email),
+                        )
+                        PasswordField(password, { password = it }, "Password")
+                    }
+                }
+                account.error?.let { Text(it, color = MaterialTheme.colorScheme.error) }
+                if (account.busy) CircularProgressIndicator(Modifier.padding(top = 4.dp))
+            }
+        },
+        confirmButton = {
+            when (state) {
+                AccountState.SecondFactor -> AccentButton(
+                    onClick = { actions.submitSecondFactor(code.trim()) },
+                    enabled = code.isNotBlank() && !account.busy,
+                ) { Text("Continue") }
+                AccountState.MailboxPassword -> AccentButton(
+                    onClick = { actions.submitMailboxPassword(mailbox) },
+                    enabled = mailbox.isNotEmpty() && !account.busy,
+                ) { Text("Unlock") }
+                else -> AccentButton(
+                    onClick = { actions.signIn(username.trim(), password, null) },
+                    enabled = username.isNotBlank() && password.isNotEmpty() && !account.busy,
+                ) { Text("Sign in") }
+            }
+        },
+        dismissButton = { TonalButton(onClick = dismiss) { Text("Cancel") } },
+    )
+    account.verificationUrl?.let { url ->
+        VerificationDialog(
+            url = url,
+            onToken = { token -> actions.signIn(username.trim(), password, token) },
+            onDismiss = actions.dismissVerification,
+        )
+    }
+}
+
+@Composable
+private fun PasswordField(value: String, onChange: (String) -> Unit, label: String) = OutlinedTextField(
+    value,
+    onChange,
+    label = { Text(label) },
+    singleLine = true,
+    visualTransformation = PasswordVisualTransformation(),
+    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
+)
+
+/**
+ * Proton's hosted CAPTCHA, which it puts in front of a sign-in it does not
+ * recognise — a new network, a VPN exit.
+ *
+ * In a WebView rather than the browser because the page reports success by
+ * posting a message to its host, not by redirecting: a browser has nowhere to
+ * post it back to. The page targets `window.parent`, which for a top-level
+ * page is the page itself, so a listener on its own window hears it.
+ */
+@SuppressLint("SetJavaScriptEnabled") // The verification page is a script; it does not run without.
+@Composable
+private fun VerificationDialog(url: String, onToken: (String) -> Unit, onDismiss: () -> Unit) {
+    Dialog(onDismissRequest = onDismiss, properties = DialogProperties(usePlatformDefaultWidth = false)) {
+        Card(Modifier.fillMaxWidth().padding(16.dp).height(560.dp)) {
+            Row(verticalAlignment = Alignment.CenterVertically) {
+                Text(
+                    "Confirm you are human",
+                    style = MaterialTheme.typography.titleMedium,
+                    modifier = Modifier.weight(1f).padding(start = 16.dp),
+                )
+                IconButton(onClick = onDismiss) { Icon(Icons.Default.Close, contentDescription = "Cancel") }
+            }
+            AndroidView(
+                modifier = Modifier.fillMaxSize(),
+                factory = { context ->
+                    val main = Handler(Looper.getMainLooper())
+                    var answered = false
+                    WebView(context).apply {
+                        settings.javaScriptEnabled = true
+                        settings.domStorageEnabled = true
+                        addJavascriptInterface(
+                            object {
+                                @JavascriptInterface
+                                fun post(message: String) {
+                                    // Every message the page posts lands here,
+                                    // most of them its own chatter.
+                                    val token = verificationToken(message) ?: return
+                                    main.post {
+                                        if (!answered) {
+                                            answered = true
+                                            onToken(token)
+                                        }
+                                    }
+                                }
+                            },
+                            "pstrVerification",
+                        )
+                        webViewClient = object : WebViewClient() {
+                            override fun onPageStarted(view: WebView, url: String?, favicon: android.graphics.Bitmap?) {
+                                view.evaluateJavascript(VERIFICATION_BRIDGE, null)
+                            }
+
+                            override fun onPageFinished(view: WebView, url: String?) {
+                                view.evaluateJavascript(VERIFICATION_BRIDGE, null)
+                            }
+
+                            // The bridge above is reachable by whatever the
+                            // frame shows, so the frame stays on Proton.
+                            override fun shouldOverrideUrlLoading(view: WebView, request: WebResourceRequest) =
+                                !isProtonPage(request.url.scheme, request.url.host)
+                        }
+                        loadUrl(url)
+                    }
+                },
+            )
+        }
+    }
+}
+
+/**
+ * Security keys need WebAuthn, which the sign-in here does not speak. An account
+ * with nothing else is refused before this form (`AccountStore::sign_in`).
+ */
+private const val SECURITY_KEY_NOTE =
+    "Security keys are not supported here — use the code from your authenticator app."
+
+/** Installed once per page, at start and again at finish in case the first ran too early. */
+private const val VERIFICATION_BRIDGE = """
+if (!window.__pstrVerification) {
+    window.__pstrVerification = true;
+    window.addEventListener('message', function (event) {
+        try {
+            pstrVerification.post(typeof event.data === 'string' ? event.data : JSON.stringify(event.data));
+        } catch (e) {}
+    });
+}
+"""
+
+/** Whether a page is Proton's own, over HTTPS. */
+internal fun isProtonPage(scheme: String?, host: String?): Boolean =
+    scheme == "https" && host != null && (host == "proton.me" || host.endsWith(".proton.me"))
+
+/**
+ * Walk the account's Drive and add a folder of it to the library.
+ *
+ * Full screen, because a Drive is deep and a dialog's height is a few rows of
+ * it. Listings are asked for here rather than through the model: they are
+ * this dialog's alone, and gone when it closes.
+ */
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+internal fun DriveBrowserDialog(
+    actions: AccountActions,
+    onDismiss: () -> Unit,
+) {
+    val trail = remember { mutableStateListOf<Pair<String, DrivePlaceRecord>>() }
+    var places by remember { mutableStateOf<List<DrivePlaceRecord>?>(null) }
+    var entries by remember { mutableStateOf<List<DriveEntryRecord>?>(null) }
+    var error by remember { mutableStateOf<String?>(null) }
+    val current = trail.lastOrNull()?.second
+
+    LaunchedEffect(current) {
+        error = null
+        if (current == null) {
+            if (places == null) {
+                runCatching { NativeRuntime.engine().drivePlaces() }
+                    .onSuccess { places = it }
+                    .onFailure { error = it.message }
+            }
+        } else {
+            entries = null
+            runCatching { NativeRuntime.engine().driveFolder(current.volumeId, current.linkId) }
+                .onSuccess { entries = it }
+                .onFailure { error = it.message }
+        }
+    }
+
+    Dialog(onDismissRequest = onDismiss, properties = DialogProperties(usePlatformDefaultWidth = false)) {
+        BackHandler(enabled = trail.isNotEmpty()) { trail.removeAt(trail.lastIndex) }
+        Scaffold(
+            topBar = {
+                TopAppBar(
+                    title = {
+                        Text(
+                            trail.lastOrNull()?.first ?: "Your Drive",
+                            maxLines = 1,
+                            overflow = TextOverflow.Ellipsis,
+                        )
+                    },
+                    navigationIcon = {
+                        IconButton(onClick = { if (trail.isEmpty()) onDismiss() else trail.removeAt(trail.lastIndex) }) {
+                            Icon(
+                                if (trail.isEmpty()) Icons.Default.Close else Icons.AutoMirrored.Filled.ArrowBack,
+                                contentDescription = if (trail.isEmpty()) "Close" else "Up a folder",
+                            )
+                        }
+                    },
+                )
+            },
+            bottomBar = {
+                // A folder already in the library is refused by the engine,
+                // with a message saying so.
+                val folder = current ?: return@Scaffold
+                Row(Modifier.fillMaxWidth().padding(16.dp), horizontalArrangement = Arrangement.End) {
+                    AccentButton(
+                        onClick = {
+                            actions.addFolder(trail.last().first, folder.volumeId, folder.linkId)
+                            onDismiss()
+                        },
+                    ) { Text("Add this folder") }
+                }
+            },
+        ) { padding ->
+            Box(Modifier.fillMaxSize().padding(padding)) {
+                val loading = error == null && (if (current == null) places == null else entries == null)
+                when {
+                    error != null -> EmptyState("Could not list this", error.orEmpty())
+                    loading -> CircularProgressIndicator(Modifier.align(Alignment.Center))
+                    current == null -> LazyColumn(contentPadding = PaddingValues(vertical = 8.dp)) {
+                        items(places.orEmpty(), key = { "${it.volumeId}/${it.linkId}" }) { place ->
+                            DriveRow(
+                                icon = when (place.kind) {
+                                    PlaceType.MY_FILES -> Icons.Default.Storage
+                                    PlaceType.DEVICE -> Icons.Default.Computer
+                                    PlaceType.SHARED_WITH_ME -> Icons.Default.FolderShared
+                                },
+                                name = place.name,
+                                detail = null,
+                                onClick = { trail.add(place.name to place) },
+                            )
+                        }
+                    }
+                    entries.orEmpty().isEmpty() -> EmptyState("Empty folder", "Nothing to add from here.")
+                    else -> LazyColumn(contentPadding = PaddingValues(vertical = 8.dp)) {
+                        items(entries.orEmpty(), key = { "${it.volumeId}/${it.linkId}" }) { entry ->
+                            DriveRow(
+                                icon = when {
+                                    entry.isFolder -> Icons.Default.Folder
+                                    entry.isVideo -> Icons.Default.Movie
+                                    else -> Icons.Default.InsertDriveFile
+                                },
+                                name = entry.name,
+                                detail = entry.size?.let(::formatBytes),
+                                onClick = if (entry.isFolder) {
+                                    {
+                                        trail.add(
+                                            entry.name to DrivePlaceRecord(
+                                                PlaceType.MY_FILES,
+                                                entry.name,
+                                                entry.volumeId,
+                                                entry.linkId,
+                                            ),
+                                        )
+                                    }
+                                } else {
+                                    null
+                                },
+                            )
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+
+@Composable
+private fun DriveRow(
+    icon: androidx.compose.ui.graphics.vector.ImageVector,
+    name: String,
+    detail: String?,
+    onClick: (() -> Unit)?,
+) {
+    ListItem(
+        headlineContent = { Text(name, maxLines = 2, overflow = TextOverflow.Ellipsis) },
+        supportingContent = detail?.let { { Text(it) } },
+        leadingContent = {
+            Icon(
+                icon,
+                contentDescription = null,
+                tint = if (onClick != null) {
+                    MaterialTheme.colorScheme.primary
+                } else {
+                    MaterialTheme.colorScheme.onSurfaceVariant
+                },
+            )
+        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+        modifier = if (onClick != null) Modifier.clickable(onClick = onClick) else Modifier,
+    )
+}

android/app/src/main/java/io/narl/protonstream/ui/AppViewModel.kt

@@ -25,6 +25,8 @@ import kotlinx.coroutines.flow.callbackFlow
 import kotlinx.coroutines.channels.awaitClose
 import kotlinx.coroutines.withContext
 import io.narl.protonstream.native.NativeRuntime
+import uniffi.pstr_android.ArrangementRecord
+import uniffi.pstr_android.LibrarySort
 import uniffi.pstr_android.ShareRecord
 import uniffi.pstr_android.TitleRecord
 import uniffi.pstr_android.OfflineRecord
@@ -33,12 +35,25 @@ import uniffi.pstr_android.MetadataProvider
 import uniffi.pstr_android.MetadataSettingsRecord
 import uniffi.pstr_android.StorageUsageRecord
 import uniffi.pstr_android.EpisodeRecord
+import uniffi.pstr_android.WatchStateRecord
+import uniffi.pstr_android.AccountState
+import uniffi.pstr_android.SignInOutcome
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.isActive
 
 data class AppUiState(
     val loading: Boolean = true,
     val refreshing: Boolean = false,
     val query: String = "",
     val titles: List<TitleRecord> = emptyList(),
+    /**
+     * The grid: [titles] ordered, each franchise folded into one tile when
+     * [grouped], and the shelves above it. Null until the bridge has answered,
+     * when the grid falls back to [titles] as they are.
+     */
+    val arrangement: ArrangementRecord? = null,
+    val sort: LibrarySort = LibrarySort.NAME,
+    val grouped: Boolean = true,
     val shares: List<ShareRecord> = emptyList(),
     val offline: List<OfflineRecord> = emptyList(),
     val metadataSettings: MetadataSettingsRecord = MetadataSettingsRecord(
@@ -49,8 +64,35 @@ data class AppUiState(
     ),
     val storage: StorageUsageRecord = StorageUsageRecord(0uL, 0uL, 0uL, 0uL),
     val message: String? = null,
+    /** What Undo on [message] puts back, when the message offers one. */
+    val undo: List<WatchSnapshot>? = null,
+    val account: AccountUiState = AccountUiState(),
 )
 
+/** The Proton account: where a sign-in stands, and how sync is doing. */
+data class AccountUiState(
+    /** Null until the bridge has said. */
+    val state: AccountState? = null,
+    /** A sign-in step is out and not answered yet. */
+    val busy: Boolean = false,
+    /** Why the last sign-in step was refused. */
+    val error: String? = null,
+    /** The CAPTCHA page Proton wants solved before it accepts the sign-in. */
+    val verificationUrl: String? = null,
+    /** When watch history last synced, in epoch milliseconds. */
+    val syncedAt: Long? = null,
+    /** Positions the last sync took from other devices. */
+    val applied: Int = 0,
+    /** Why the last sync failed, until one succeeds. */
+    val syncError: String? = null,
+)
+
+/**
+ * One episode's watch state as it was before a change the viewer can undo.
+ * Null [state] means it had never been played.
+ */
+data class WatchSnapshot(val shareId: String, val linkId: String, val state: WatchStateRecord?)
+
 @OptIn(FlowPreview::class)
 class AppViewModel(context: Context, private val workManager: WorkManager) : ViewModel() {
     private val appContext = context.applicationContext
@@ -65,6 +107,18 @@ class AppViewModel(context: Context, private val workManager: WorkManager) : Vie
             }
         }
         reload()
+        viewModelScope.launch {
+            val account = runCatching { withContext(Dispatchers.IO) { NativeRuntime.engine().accountState() } }
+                .getOrDefault(AccountState.SignedOut)
+            updateAccount { it.copy(state = account) }
+            // While the app is alive, on top of after sign-in and whenever the
+            // player closes. Cheap when nothing changed: one folder listing,
+            // and no upload.
+            while (isActive) {
+                syncWatchHistory()
+                delay(SYNC_INTERVAL_MS)
+            }
+        }
         viewModelScope.launch {
             searchQuery.debounce(300).distinctUntilChanged().collect { reloadLibrary(it) }
         }
@@ -77,6 +131,12 @@ class AppViewModel(context: Context, private val workManager: WorkManager) : Vie
         }
     }
 
+    /** Reorder the grid, or fold or unfold its franchises. */
+    fun arrange(sort: LibrarySort, grouped: Boolean) {
+        mutableState.update { it.copy(sort = sort, grouped = grouped) }
+        viewModelScope.launch { reloadLibrary(mutableState.value.query) }
+    }
+
     fun search(query: String) {
         mutableState.update { it.copy(query = query) }
         searchQuery.value = query
@@ -185,7 +245,243 @@ class AppViewModel(context: Context, private val workManager: WorkManager) : Vie
         }
     }
 
-    fun dismissMessage() = mutableState.update { it.copy(message = null) }
+    fun dismissMessage() = mutableState.update { it.copy(message = null, undo = null) }
+
+    private fun updateAccount(change: (AccountUiState) -> AccountUiState) =
+        mutableState.update { it.copy(account = change(it.account)) }
+
+    /**
+     * Start signing in, or start again with [verificationToken] once the
+     * CAPTCHA from a first try is solved.
+     */
+    fun signIn(username: String, password: String, verificationToken: String? = null) =
+        signInStep { engine -> engine.signIn(username, password, verificationToken) }
+
+    fun submitSecondFactor(code: String) = signInStep { engine -> engine.submitSecondFactor(code) }
+
+    fun submitMailboxPassword(password: String) =
+        signInStep(keepStepOnFailure = true) { engine -> engine.submitMailboxPassword(password) }
+
+    fun cancelSignIn() {
+        updateAccount { AccountUiState(state = AccountState.SignedOut) }
+        viewModelScope.launch { runCatching { NativeRuntime.engine().cancelSignIn() } }
+    }
+
+    /** The CAPTCHA page closed without a token. */
+    fun dismissVerification() = updateAccount { it.copy(verificationUrl = null, busy = false) }
+
+    private fun signInStep(
+        keepStepOnFailure: Boolean = false,
+        step: suspend (uniffi.pstr_android.AndroidEngine) -> SignInOutcome,
+    ) {
+        updateAccount { it.copy(busy = true, error = null, verificationUrl = null) }
+        viewModelScope.launch {
+            runCatching { withContext(Dispatchers.IO) { step(NativeRuntime.engine()) } }
+                .onSuccess { outcome ->
+                    when (outcome) {
+                        is SignInOutcome.Done -> {
+                            updateAccount {
+                                AccountUiState(state = AccountState.SignedIn(outcome.username))
+                            }
+                            mutableState.update { it.copy(message = "Signed in as ${outcome.username}") }
+                            syncWatchHistory()
+                            reload()
+                        }
+                        SignInOutcome.SecondFactor ->
+                            updateAccount { it.copy(state = AccountState.SecondFactor, busy = false) }
+                        SignInOutcome.MailboxPassword ->
+                            updateAccount { it.copy(state = AccountState.MailboxPassword, busy = false) }
+                        is SignInOutcome.HumanVerification ->
+                            updateAccount { it.copy(verificationUrl = outcome.url) }
+                    }
+                }
+                .onFailure { error ->
+                    updateAccount {
+                        it.copy(
+                            busy = false,
+                            error = error.message ?: "Sign-in failed",
+                            // A refused code spends the half-made session.
+                            state = if (keepStepOnFailure) it.state else AccountState.SignedOut,
+                        )
+                    }
+                }
+        }
+    }
+
+    fun signOut() {
+        viewModelScope.launch {
+            runCatching { withContext(Dispatchers.IO) { NativeRuntime.engine().signOut() } }
+                .onFailure(::reportError)
+            updateAccount { AccountUiState(state = AccountState.SignedOut) }
+            reload()
+        }
+    }
+
+    /** Sync now, from a tap: says so when it is done. */
+    fun syncNow() {
+        viewModelScope.launch {
+            if (syncWatchHistory()) {
+                val applied = mutableState.value.account.applied
+                mutableState.update {
+                    it.copy(
+                        message = if (applied > 0) {
+                            "Watch history synced, $applied from other devices"
+                        } else {
+                            "Watch history is up to date"
+                        },
+                    )
+                }
+            }
+        }
+    }
+
+    /**
+     * Pull other devices' positions in and push this one's out. Quiet: it runs
+     * on a timer, and a failure is shown on the account card rather than as a
+     * snackbar every five minutes of an offline evening. Returns whether it
+     * synced.
+     */
+    private suspend fun syncWatchHistory(): Boolean {
+        if (mutableState.value.account.state !is AccountState.SignedIn) return false
+        return runCatching { withContext(Dispatchers.IO) { NativeRuntime.engine().syncWatchHistory() } }
+            .fold(
+                onSuccess = { report ->
+                    if (report == null) return false
+                    updateAccount {
+                        it.copy(
+                            syncedAt = System.currentTimeMillis(),
+                            applied = report.applied.toInt(),
+                            syncError = null,
+                        )
+                    }
+                    if (report.applied > 0u) reload()
+                    true
+                },
+                onFailure = { error ->
+                    val state = runCatching { NativeRuntime.engine().accountState() }.getOrNull()
+                    updateAccount { it.copy(state = state ?: it.state, syncError = error.message) }
+                    // Signed out by the engine: the session ended, and that is
+                    // worth interrupting for, unlike a dropped connection.
+                    if (state == AccountState.SignedOut) reportError(error)
+                    false
+                },
+            )
+    }
+
+    /** After the player closes: where it stopped is what another device wants next. */
+    fun playerClosed() {
+        reload()
+        viewModelScope.launch { syncWatchHistory() }
+    }
+
+    fun addAccountFolder(name: String, volumeId: String, linkId: String) {
+        viewModelScope.launch {
+            mutableState.update { it.copy(refreshing = true) }
+            runCatching {
+                withContext(Dispatchers.IO) {
+                    val engine = NativeRuntime.engine()
+                    val share = engine.addAccountFolder(name, volumeId, linkId)
+                    engine.crawl(share.id)
+                }
+            }.onFailure(::reportError)
+            mutableState.update { it.copy(refreshing = false) }
+            reload()
+        }
+    }
+
+    /**
+     * Every episode of a title watched or unwatched, with an Undo: a whole
+     * title's positions are what this throws away, and a mis-tap on a tile's
+     * menu should not cost them.
+     */
+    fun setTitleWatched(title: TitleRecord, watched: Boolean) {
+        val episodes = title.seasons.flatMap { it.episodes }
+        changeWatch(
+            episodes,
+            "${title.displayName} marked ${if (watched) "watched" else "unwatched"}",
+        ) { engine, episode, before ->
+            val duration = before?.durationSecs
+            engine.saveWatchState(
+                episode.shareId,
+                episode.linkId,
+                if (watched) duration ?: 0.0 else 0.0,
+                duration,
+                watched,
+            )
+        }
+    }
+
+    /**
+     * Off Continue watching by forgetting where the episode stopped — what the
+     * desktop does — with an Undo that puts the position back.
+     */
+    fun forgetPosition(title: TitleRecord, episode: EpisodeRecord) {
+        changeWatch(
+            listOf(episode),
+            "${title.displayName} removed from Continue watching",
+        ) { engine, target, before ->
+            engine.saveWatchState(target.shareId, target.linkId, 0.0, before?.durationSecs, false)
+        }
+    }
+
+    /**
+     * Off the history page: the position and the watched mark both go, which
+     * is "never played", with an Undo.
+     */
+    fun removeFromHistory(title: TitleRecord, episode: EpisodeRecord) {
+        changeWatch(
+            listOf(episode),
+            "${episode.label} of ${title.displayName} removed from history",
+        ) { engine, target, before ->
+            engine.saveWatchState(target.shareId, target.linkId, 0.0, before?.durationSecs, false)
+        }
+    }
+
+    /** Put back what the last undoable change replaced. */
+    fun undo() {
+        val snapshots = mutableState.value.undo ?: return
+        mutableState.update { it.copy(message = null, undo = null) }
+        viewModelScope.launch {
+            runCatching {
+                withContext(Dispatchers.IO) {
+                    val engine = NativeRuntime.engine()
+                    snapshots.forEach { snapshot ->
+                        val state = snapshot.state
+                        engine.saveWatchState(
+                            snapshot.shareId,
+                            snapshot.linkId,
+                            state?.positionSecs ?: 0.0,
+                            state?.durationSecs,
+                            state?.watched ?: false,
+                        )
+                    }
+                }
+            }.onFailure(::reportError)
+            reload()
+        }
+    }
+
+    private fun changeWatch(
+        episodes: List<EpisodeRecord>,
+        message: String,
+        change: (uniffi.pstr_android.AndroidEngine, EpisodeRecord, WatchStateRecord?) -> Unit,
+    ) {
+        viewModelScope.launch {
+            runCatching {
+                withContext(Dispatchers.IO) {
+                    val engine = NativeRuntime.engine()
+                    episodes.map { episode ->
+                        val before = engine.watchState(episode.shareId, episode.linkId)
+                        change(engine, episode, before)
+                        WatchSnapshot(episode.shareId, episode.linkId, before)
+                    }
+                }
+            }.onSuccess { snapshots ->
+                mutableState.update { it.copy(message = message, undo = snapshots) }
+            }.onFailure(::reportError)
+            reload()
+        }
+    }
 
     fun reportError(error: Throwable) {
         mutableState.update { it.copy(message = error.message ?: "Unexpected error") }
@@ -341,9 +637,12 @@ class AppViewModel(context: Context, private val workManager: WorkManager) : Vie
                     // and cached: a full reload is the one place that has
                     // already paid for a walk of the offline files.
                     engine.pruneOfflineFiles()
+                    val current = mutableState.value
+                    val query = current.query.takeIf(String::isNotBlank)
                     Reloaded(
                         engine.shares(),
-                        engine.library(mutableState.value.query.takeIf(String::isNotBlank)),
+                        engine.library(query),
+                        engine.arrangement(query, current.sort, current.grouped),
                         engine.offlineFiles(),
                         engine.metadataSettings(),
                         engine.storageUsage(),
@@ -354,6 +653,7 @@ class AppViewModel(context: Context, private val workManager: WorkManager) : Vie
                         loading = false,
                         shares = result.shares,
                         titles = result.titles,
+                        arrangement = result.arrangement,
                         offline = result.offline,
                         metadataSettings = result.metadataSettings,
                         storage = result.storage,
@@ -366,10 +666,20 @@ class AppViewModel(context: Context, private val workManager: WorkManager) : Vie
     }
 
     private suspend fun reloadLibrary(query: String) {
+        val current = mutableState.value
         runCatching {
-            withContext(Dispatchers.IO) { NativeRuntime.engine().library(query.takeIf(String::isNotBlank)) }
+            withContext(Dispatchers.IO) {
-        }.onSuccess { titles -> mutableState.update { it.copy(titles = titles) } }
+                val engine = NativeRuntime.engine()
-            .onFailure { error -> mutableState.update { it.copy(message = error.message) } }
+                val search = query.takeIf(String::isNotBlank)
+                engine.library(search) to engine.arrangement(search, current.sort, current.grouped)
+            }
+        }.onSuccess { (titles, arrangement) ->
+            mutableState.update { it.copy(titles = titles, arrangement = arrangement) }
+        }.onFailure { error -> mutableState.update { it.copy(message = error.message) } }
+    }
+
+    private companion object {
+        const val SYNC_INTERVAL_MS = 5 * 60 * 1000L
     }
 
     class Factory(private val context: Context, private val workManager: WorkManager) : ViewModelProvider.Factory {
@@ -381,6 +691,7 @@ class AppViewModel(context: Context, private val workManager: WorkManager) : Vie
 private data class Reloaded(
     val shares: List<ShareRecord>,
     val titles: List<TitleRecord>,
+    val arrangement: ArrangementRecord,
     val offline: List<OfflineRecord>,
     val metadataSettings: MetadataSettingsRecord,
     val storage: StorageUsageRecord,

android/app/src/main/java/io/narl/protonstream/ui/Common.kt

@@ -0,0 +1,154 @@
+package io.narl.protonstream.ui
+
+import androidx.compose.animation.AnimatedVisibilityScope
+import androidx.compose.animation.ExperimentalSharedTransitionApi
+import androidx.compose.animation.SharedTransitionScope
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.RowScope
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarColors
+import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.staticCompositionLocalOf
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.input.nestedscroll.nestedScroll
+import io.narl.protonstream.download.RetainedDownload
+import uniffi.pstr_android.EpisodeRecord
+
+/**
+ * A tab's page: its own name in an app bar, over whatever the page holds.
+ *
+ * One bar for the whole app said "proton-stream" on every page, which is a band
+ * of height spent naming the app the viewer is already in. The bar draws under
+ * the status bar itself, which is why the shell hands pages no top padding;
+ * [content] gets the rest of [padding] (the navigation bar and the mini
+ * transport) to apply as it scrolls.
+ */
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+internal fun TabPage(
+    title: String,
+    padding: PaddingValues,
+    navigationIcon: @Composable () -> Unit = {},
+    actions: @Composable RowScope.() -> Unit = {},
+    content: @Composable (PaddingValues) -> Unit,
+) {
+    // Pinned: the bar stays, and takes the container tint once the page has
+    // scrolled under it, so the edge between the two is still visible.
+    val scroll = TopAppBarDefaults.pinnedScrollBehavior()
+    Column(Modifier.fillMaxSize().nestedScroll(scroll.nestedScrollConnection)) {
+        TopAppBar(
+            title = { Text(title) },
+            navigationIcon = navigationIcon,
+            actions = actions,
+            colors = pageBarColors(),
+            scrollBehavior = scroll,
+        )
+        Box(Modifier.weight(1f)) { content(padding) }
+    }
+}
+
+/**
+ * The page's own background until something scrolls under the bar, then the
+ * container tint. A bar in `surface` from the start read as a band across the
+ * top of a page drawn in `background`.
+ */
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+internal fun pageBarColors(): TopAppBarColors = TopAppBarDefaults.topAppBarColors(
+    containerColor = MaterialTheme.colorScheme.background,
+    scrolledContainerColor = MaterialTheme.colorScheme.surfaceContainer,
+)
+
+/**
+ * The shared-element scopes the library-to-title switch runs in, or null where
+ * there is none — the two-pane layout, a screenshot, a preview. Locals rather
+ * than parameters, because the poster that animates is three calls deep in the
+ * grid and nothing between needs to know.
+ */
+@OptIn(ExperimentalSharedTransitionApi::class)
+internal val LocalSharedTransition = staticCompositionLocalOf<SharedTransitionScope?> { null }
+internal val LocalPaneVisibility = staticCompositionLocalOf<AnimatedVisibilityScope?> { null }
+
+/**
+ * A title's art as one element across the switch: the poster tapped in the
+ * grid grows into the backdrop of the page it opens, and shrinks back on the
+ * way out, so the page is visibly *that* title's rather than a new screen.
+ */
+@OptIn(ExperimentalSharedTransitionApi::class)
+@Composable
+internal fun Modifier.sharedArt(key: String): Modifier {
+    val transition = LocalSharedTransition.current ?: return this
+    val visibility = LocalPaneVisibility.current ?: return this
+    return with(transition) {
+        this@sharedArt.sharedBounds(rememberSharedContentState("art/$key"), visibility)
+    }
+}
+
+@Composable
+internal fun EmptyState(title: String, body: String) {
+    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
+        Column(horizontalAlignment = Alignment.CenterHorizontally) {
+            Text(title, style = MaterialTheme.typography.titleMedium)
+            Text(body, style = MaterialTheme.typography.bodyMedium)
+        }
+    }
+}
+
+/**
+ * Where Play on a title lands: the most recently played part-watched episode,
+ * else the first unwatched one, else the first — the desktop's `next_up`.
+ */
+internal fun nextUpIndex(playlist: List<EpisodeRecord>): Int =
+    playlist.withIndex().filter { it.value.resumeAt != null }.maxByOrNull { it.value.lastPlayed }?.index
+        ?: playlist.indexOfFirst { !it.watched }.takeIf { it >= 0 }
+        ?: 0
+
+internal fun formatBytes(bytes: ULong): String {
+    val value = bytes.toDouble()
+    return when {
+        value >= 1024 * 1024 * 1024 -> "%.1f GiB".format(value / (1024 * 1024 * 1024))
+        value >= 1024 * 1024 -> "%.1f MiB".format(value / (1024 * 1024))
+        value >= 1024 -> "%.1f KiB".format(value / 1024)
+        else -> "$bytes bytes"
+    }
+}
+
+/**
+ * One line under a download that has not finished: "Running · 120.0 MiB of
+ * 1.2 GiB · 2.4 MiB/s", or "Queued" while it waits for a slot.
+ */
+internal fun downloadStatusLine(download: RetainedDownload): String = listOfNotNull(
+    download.status.replaceFirstChar { it.uppercase() },
+    download.total.takeIf { it > 0L && download.downloaded > 0L }?.let {
+        "${formatBytes(download.downloaded.toULong())} of ${formatBytes(it.toULong())}"
+    },
+    download.bytesPerSecond
+        .takeIf { it > 0L && download.status == RetainedDownload.STATUS_RUNNING }
+        ?.let { "${formatBytes(it.toULong())}/s" },
+).joinToString(" · ")
+
+/**
+ * What an episode row is headed with: "1. Mother and Children".
+ *
+ * The provider's name for the episode, else the name the filename gave it,
+ * else "Episode 1". The bare filename only when none of those exist — a column
+ * of `[Group] Show - S01E01.mkv` is forty rows that differ in two characters.
+ */
+internal fun EpisodeRecord.heading(position: Int): String {
+    val named = providerName ?: detail.takeIf { it != name }
+    val number = number?.toInt()
+    return when {
+        named != null && number != null -> "$number. $named"
+        named != null -> named
+        number != null -> "Episode $number"
+        else -> name.substringBeforeLast('.').ifBlank { "Episode ${position + 1}" }
+    }
+}

android/app/src/main/java/io/narl/protonstream/ui/DownloadsScreen.kt

@@ -0,0 +1,236 @@
+package io.narl.protonstream.ui
+
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material.icons.filled.Pause
+import androidx.compose.material.icons.filled.PlayArrow
+import androidx.compose.material.icons.outlined.Delete
+import androidx.compose.material3.AlertDialog
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import androidx.work.WorkManager
+import io.narl.protonstream.download.DownloadCoordinator
+import io.narl.protonstream.download.DownloadStateStore
+import io.narl.protonstream.download.RetainedDownload
+import io.narl.protonstream.ui.theme.AccentButton
+import io.narl.protonstream.ui.theme.AccentProgress
+import io.narl.protonstream.ui.theme.TonalButton
+import uniffi.pstr_android.OfflineRecord
+import uniffi.pstr_android.SeasonRecord
+import uniffi.pstr_android.TitleRecord
+
+/** One show's saved episodes, and the show itself where the library has it. */
+private data class OfflineGroup(val name: String, val title: TitleRecord?, val files: List<OfflineRecord>)
+
+@Composable
+internal fun DownloadsScreen(
+    state: AppUiState,
+    onRemove: (OfflineRecord) -> Unit,
+    onPause: (RetainedDownload) -> Unit,
+    onResume: (RetainedDownload) -> Unit,
+    onDeletePartial: (RetainedDownload) -> Unit,
+    padding: PaddingValues,
+) {
+    val context = LocalContext.current
+    val work = WorkManager.getInstance(context).getWorkInfosByTagLiveData(DownloadCoordinator.TAG)
+    val downloads by work.observeAsState(emptyList())
+    // Reading retained metadata on every WorkInfo transition also hydrates
+    // paused/failed/cancelled entries after WorkManager history is pruned.
+    val retained = remember(downloads) { DownloadStateStore(context).records() }
+    // Which show each saved file is from. The offline record knows its episode
+    // but not its show, and the library is the only thing that does.
+    val groups = remember(state.offline, state.titles) {
+        val shows = state.titles.flatMap { title ->
+            title.seasons.flatMap(SeasonRecord::episodes).map { "${it.shareId}/${it.linkId}" to title }
+        }.toMap()
+        state.offline
+            .groupBy { shows["${it.shareId}/${it.linkId}"] }
+            .map { (title, files) ->
+                OfflineGroup(title?.displayName ?: "Not in the library", title, files)
+            }
+            .sortedBy { it.name }
+    }
+    // Deleting a saved episode asks first: it is the viewer's own choice to
+    // keep it, and getting it back is a download, not a tap.
+    var deleting by remember { mutableStateOf<OfflineRecord?>(null) }
+    TabPage("Downloads", padding) { body ->
+        if (retained.isEmpty() && state.offline.isEmpty()) {
+            Box(Modifier.fillMaxSize().padding(body)) {
+                EmptyState("No downloads", "Episodes, seasons and shows saved offline appear here.")
+            }
+            return@TabPage
+        }
+        LazyColumn(
+            modifier = Modifier.fillMaxSize().padding(body),
+            contentPadding = PaddingValues(bottom = 24.dp),
+        ) {
+            if (state.offline.isNotEmpty()) {
+                item(key = "summary") {
+                    Text(
+                        "${state.offline.size} ${if (state.offline.size == 1) "episode" else "episodes"} · " +
+                            "${formatBytes(state.offline.sumOf { it.size })} on this device",
+                        style = MaterialTheme.typography.bodyMedium,
+                        color = MaterialTheme.colorScheme.onSurfaceVariant,
+                        modifier = Modifier.padding(horizontal = 16.dp, vertical = 4.dp),
+                    )
+                }
+            }
+            // What is still arriving comes first: it is the part of the page
+            // that changes, and the part with something to do.
+            if (retained.isNotEmpty()) {
+                item(key = "in-progress") { SectionHeading("In progress") }
+                items(retained, key = { "partial/${it.shareId}/${it.linkId}" }) { download ->
+                    PartialRow(download, onPause, onResume, onDeletePartial)
+                }
+            }
+            // Under the show they belong to, as on desktop: a saved season is
+            // fourteen rows, and fourteen rows of "Episode 3" name nothing.
+            groups.forEach { group ->
+                item(key = "group/${group.name}") {
+                    SectionHeading(
+                        group.name,
+                        "${group.files.size} ${if (group.files.size == 1) "episode" else "episodes"} · " +
+                            formatBytes(group.files.sumOf { it.size }),
+                    )
+                }
+                items(group.files, key = { "${it.shareId}/${it.linkId}" }) { file ->
+                    SavedRow(file, group.title, onDelete = { deleting = file })
+                }
+            }
+        }
+    }
+    deleting?.let { file ->
+        AlertDialog(
+            onDismissRequest = { deleting = null },
+            title = { Text("Delete this download?") },
+            text = {
+                Text(
+                    "${file.episode?.label ?: "The episode"} (${formatBytes(file.size)}) leaves this device. " +
+                        "It still streams, and can be downloaded again.",
+                )
+            },
+            confirmButton = {
+                AccentButton(onClick = {
+                    deleting = null
+                    onRemove(file)
+                }) { Text("Delete") }
+            },
+            dismissButton = { TonalButton(onClick = { deleting = null }) { Text("Cancel") } },
+        )
+    }
+}
+
+@Composable
+private fun SectionHeading(title: String, caption: String? = null) {
+    Column(Modifier.padding(start = 16.dp, end = 16.dp, top = 20.dp, bottom = 4.dp)) {
+        Text(title, style = MaterialTheme.typography.titleMedium, maxLines = 1, overflow = TextOverflow.Ellipsis)
+        caption?.let {
+            Text(it, style = MaterialTheme.typography.bodySmall, color = MaterialTheme.colorScheme.onSurfaceVariant)
+        }
+    }
+}
+
+/** A saved episode: its still, what it is, its size, and a way to remove it. */
+@Composable
+private fun SavedRow(file: OfflineRecord, title: TitleRecord?, onDelete: () -> Unit) {
+    val episode = file.episode
+    ListItem(
+        leadingContent = {
+            RemoteArtwork(
+                episode?.stillUrl ?: title?.backdropUrl,
+                title?.name ?: file.linkId,
+                Modifier.width(96.dp).aspectRatio(16f / 9f).clip(MaterialTheme.shapes.small),
+                fallback = episode?.thumbnailSource,
+                labelled = episode == null,
+            )
+        },
+        headlineContent = {
+            Text(episode?.heading(0) ?: file.linkId, maxLines = 2, overflow = TextOverflow.Ellipsis)
+        },
+        supportingContent = {
+            Text(listOfNotNull(episode?.label, formatBytes(file.size)).joinToString(" · "))
+        },
+        trailingContent = {
+            IconButton(onClick = onDelete) {
+                Icon(Icons.Outlined.Delete, contentDescription = "Delete download")
+            }
+        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+    )
+}
+
+/**
+ * A download not yet finished: how far it has got, why it stopped if it did,
+ * and pause or resume beside cancel.
+ */
+@Composable
+private fun PartialRow(
+    download: RetainedDownload,
+    onPause: (RetainedDownload) -> Unit,
+    onResume: (RetainedDownload) -> Unit,
+    onDeletePartial: (RetainedDownload) -> Unit,
+) {
+    val active = download.status == RetainedDownload.STATUS_RUNNING ||
+        download.status == RetainedDownload.STATUS_QUEUED
+    ListItem(
+        headlineContent = { Text(download.label, maxLines = 2, overflow = TextOverflow.Ellipsis) },
+        supportingContent = {
+            Column {
+                Text(downloadStatusLine(download))
+                if (download.total > 0L) {
+                    AccentProgress(
+                        progress = { (download.downloaded.toFloat() / download.total).coerceIn(0f, 1f) },
+                        modifier = Modifier.fillMaxWidth().padding(top = 8.dp),
+                    )
+                }
+                download.error?.let { Text(it, color = MaterialTheme.colorScheme.error) }
+            }
+        },
+        trailingContent = {
+            Row(verticalAlignment = Alignment.CenterVertically) {
+                if (active) {
+                    IconButton(onClick = { onPause(download) }) {
+                        Icon(Icons.Default.Pause, contentDescription = "Pause download")
+                    }
+                } else {
+                    IconButton(onClick = { onResume(download) }) {
+                        Icon(Icons.Default.PlayArrow, contentDescription = "Resume download")
+                    }
+                }
+                // What has arrived so far is discarded; nothing finished is.
+                IconButton(onClick = { onDeletePartial(download) }) {
+                    Icon(Icons.Default.Close, contentDescription = "Cancel and delete what has arrived")
+                }
+            }
+        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+    )
+}

android/app/src/main/java/io/narl/protonstream/ui/HistoryScreen.kt

@@ -0,0 +1,183 @@
+package io.narl.protonstream.ui
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import io.narl.protonstream.ui.theme.AccentProgress
+import java.time.Instant
+import java.time.LocalDate
+import java.time.ZoneId
+import java.time.format.DateTimeFormatter
+import java.time.format.TextStyle
+import java.util.Locale
+import uniffi.pstr_android.EpisodeRecord
+import uniffi.pstr_android.SeasonRecord
+import uniffi.pstr_android.TitleRecord
+
+/** One played episode, with the title it belongs to and its place in that title's playlist. */
+internal data class Played(val title: TitleRecord, val episode: EpisodeRecord, val index: Int)
+
+/**
+ * Every episode that has been started or finished, newest first — the
+ * desktop's `Library::history`, over the records the library already holds.
+ *
+ * A row marked unwatched again sits at position zero, which is "never played"
+ * for every purpose here, so it is left out. Progress stands in for the
+ * position: it is non-zero exactly when the position is.
+ */
+internal fun history(titles: List<TitleRecord>): List<Played> =
+    titles.flatMap { title ->
+        title.seasons.flatMap(SeasonRecord::episodes).withIndex()
+            .filter { (_, episode) -> episode.watched || (episode.progress ?: 0.0) > 0.0 }
+            .map { (index, episode) -> Played(title, episode, index) }
+    }.sortedByDescending { it.episode.lastPlayed }
+
+/**
+ * "Today", "Yesterday", a weekday within the last week, then a date — how the
+ * history page heads each day.
+ */
+internal fun dayHeading(day: LocalDate, today: LocalDate, locale: Locale = Locale.getDefault()): String = when {
+    day == today -> "Today"
+    day == today.minusDays(1) -> "Yesterday"
+    day.isAfter(today.minusDays(7)) -> day.dayOfWeek.getDisplayName(TextStyle.FULL, locale)
+    day.year == today.year -> day.format(DateTimeFormatter.ofPattern("d MMMM", locale))
+    else -> day.format(DateTimeFormatter.ofPattern("d MMMM yyyy", locale))
+}
+
+@Composable
+internal fun HistoryScreen(
+    state: AppUiState,
+    onPlay: (TitleRecord, Int) -> Unit,
+    onTitle: (TitleRecord) -> Unit,
+    onRemove: (TitleRecord, EpisodeRecord) -> Unit,
+    padding: PaddingValues,
+    zone: ZoneId = remember { ZoneId.systemDefault() },
+    today: LocalDate = LocalDate.now(zone),
+) {
+    val days = remember(state.titles) {
+        history(state.titles).groupBy { Instant.ofEpochSecond(it.episode.lastPlayed).atZone(zone).toLocalDate() }
+    }
+    if (days.isEmpty()) {
+        TabPage("History", padding) { body ->
+            Box(Modifier.fillMaxSize().padding(body)) {
+                EmptyState("Nothing watched yet", "Episodes you play show up here, newest first.")
+            }
+        }
+        return
+    }
+    TabPage("History", padding) { body ->
+        LazyColumn(Modifier.fillMaxSize().padding(body), contentPadding = PaddingValues(bottom = 24.dp)) {
+            days.forEach { (day, played) ->
+                item(key = "day/$day") {
+                    Text(
+                        dayHeading(day, today),
+                        style = MaterialTheme.typography.titleSmall,
+                        color = MaterialTheme.colorScheme.primary,
+                        modifier = Modifier.padding(start = 16.dp, end = 16.dp, top = 20.dp, bottom = 4.dp),
+                    )
+                }
+                items(played, key = { "${it.episode.shareId}/${it.episode.linkId}" }) { entry ->
+                    HistoryRow(
+                        entry,
+                        onPlay = { onPlay(entry.title, entry.index) },
+                        onTitle = { onTitle(entry.title) },
+                        onRemove = { onRemove(entry.title, entry.episode) },
+                    )
+                }
+            }
+        }
+    }
+}
+
+/**
+ * The still plays the episode, the text opens its title, and the cross takes
+ * it off the page — the same three targets the desktop row has.
+ */
+@Composable
+private fun HistoryRow(entry: Played, onPlay: () -> Unit, onTitle: () -> Unit, onRemove: () -> Unit) {
+    val episode = entry.episode
+    Row(
+        Modifier.fillMaxWidth().padding(start = 16.dp, end = 4.dp, top = 6.dp, bottom = 6.dp),
+        verticalAlignment = Alignment.CenterVertically,
+    ) {
+        Box(
+            Modifier
+                .width(128.dp)
+                .aspectRatio(16f / 9f)
+                .clip(MaterialTheme.shapes.small)
+                .clickable(onClick = onPlay),
+        ) {
+            RemoteArtwork(
+                episode.stillUrl ?: entry.title.backdropUrl,
+                episode.label,
+                Modifier.fillMaxSize(),
+                fallback = episode.thumbnailSource,
+                labelled = false,
+            )
+            episode.progress?.takeIf { !episode.watched }?.let { progress ->
+                AccentProgress(
+                    progress = { progress.toFloat().coerceIn(0f, 1f) },
+                    modifier = Modifier.fillMaxWidth().align(Alignment.BottomCenter),
+                )
+            }
+        }
+        Column(Modifier.weight(1f).clickable(onClick = onTitle).padding(horizontal = 12.dp, vertical = 4.dp)) {
+            Text(
+                entry.title.displayName,
+                style = MaterialTheme.typography.titleSmall,
+                maxLines = 1,
+                overflow = TextOverflow.Ellipsis,
+            )
+            Text(
+                episode.providerName?.let { "${episode.label} · $it" } ?: episode.label,
+                style = MaterialTheme.typography.bodySmall,
+                maxLines = 1,
+                overflow = TextOverflow.Ellipsis,
+            )
+            Text(
+                if (episode.watched) "Finished" else episode.stoppedAt(),
+                style = MaterialTheme.typography.bodySmall,
+                color = MaterialTheme.colorScheme.onSurfaceVariant,
+            )
+        }
+        IconButton(onClick = onRemove) {
+            Icon(Icons.Default.Close, contentDescription = "Remove from history")
+        }
+    }
+}
+
+/** "Stopped at 12:04 of 23:40", or as much of it as is known. */
+private fun EpisodeRecord.stoppedAt(): String {
+    val at = resumeAt ?: return "Started"
+    val duration = progress?.takeIf { it > 0.0 }?.let { at / it }
+    return "Stopped at ${clock(at)}" + (duration?.let { " of ${clock(it)}" } ?: "")
+}
+
+private fun clock(seconds: Double): String {
+    val total = seconds.toInt().coerceAtLeast(0)
+    val hours = total / 3_600
+    return if (hours > 0) "%d:%02d:%02d".format(hours, total % 3_600 / 60, total % 60)
+    else "%d:%02d".format(total / 60, total % 60)
+}

android/app/src/main/java/io/narl/protonstream/ui/LanguagePicker.kt

@@ -0,0 +1,183 @@
+package io.narl.protonstream.ui
+
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material3.AlertDialog
+import androidx.compose.material3.HorizontalDivider
+import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.RadioButton
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.semantics.Role
+import androidx.compose.ui.unit.dp
+import io.narl.protonstream.ui.theme.AccentButton
+import io.narl.protonstream.ui.theme.TonalButton
+
+/**
+ * The languages offered by name, as the three-letter tag a Matroska file
+ * carries.
+ *
+ * The same short list the desktop names tracks from (`pstr-player`'s
+ * `language_name`): what the shares this app is pointed at actually contain.
+ * mpv treats the two- and three-letter forms of a language as one, so the tag
+ * chosen here also matches a file that says "ja". Anything else is still one
+ * typed tag away.
+ */
+internal val LANGUAGES: List<Pair<String, String>> = listOf(
+    "jpn" to "Japanese",
+    "eng" to "English",
+    "ger" to "German",
+    "fre" to "French",
+    "spa" to "Spanish",
+    "ita" to "Italian",
+    "por" to "Portuguese",
+    "dut" to "Dutch",
+    "rus" to "Russian",
+    "pol" to "Polish",
+    "swe" to "Swedish",
+    "dan" to "Danish",
+    "nor" to "Norwegian",
+    "fin" to "Finnish",
+    "cze" to "Czech",
+    "hun" to "Hungarian",
+    "tur" to "Turkish",
+    "ara" to "Arabic",
+    "heb" to "Hebrew",
+    "hin" to "Hindi",
+    "kor" to "Korean",
+    "chi" to "Chinese",
+    "tha" to "Thai",
+    "vie" to "Vietnamese",
+    "ukr" to "Ukrainian",
+    "rum" to "Romanian",
+    "gre" to "Greek",
+    "ind" to "Indonesian",
+    "may" to "Malay",
+)
+
+/**
+ * "Japanese", for a tag in any of the forms a file or the desktop may have
+ * stored — "jpn", "ja", "JA-jp" — and the tag itself for one not on the list.
+ * Null is no preference.
+ */
+internal fun languageLabel(tag: String?): String {
+    val value = tag?.trim()?.takeIf(String::isNotEmpty) ?: return "No preference"
+    return languageOf(value)?.second ?: value
+}
+
+/** The listed language a tag names, matching either ISO 639 form. */
+private fun languageOf(tag: String): Pair<String, String>? {
+    val base = tag.split('-', '_').first().lowercase()
+    return LANGUAGES.firstOrNull { (code, _) -> code == base || TWO_LETTER[code] == base || terminology(code) == base }
+}
+
+/** ISO 639-2/T, for the handful whose bibliographic code differs. */
+private fun terminology(code: String): String? = when (code) {
+    "ger" -> "deu"
+    "fre" -> "fra"
+    "dut" -> "nld"
+    "cze" -> "ces"
+    "chi" -> "zho"
+    "rum" -> "ron"
+    "gre" -> "ell"
+    "may" -> "msa"
+    else -> null
+}
+
+/** ISO 639-1, the form a file or the desktop may also have stored. */
+private val TWO_LETTER = mapOf(
+    "jpn" to "ja", "eng" to "en", "ger" to "de", "fre" to "fr", "spa" to "es", "ita" to "it",
+    "por" to "pt", "dut" to "nl", "rus" to "ru", "pol" to "pl", "swe" to "sv", "dan" to "da",
+    "nor" to "no", "fin" to "fi", "cze" to "cs", "hun" to "hu", "tur" to "tr", "ara" to "ar",
+    "heb" to "he", "hin" to "hi", "kor" to "ko", "chi" to "zh", "tha" to "th", "vie" to "vi",
+    "ukr" to "uk", "rum" to "ro", "gre" to "el", "ind" to "id", "may" to "ms",
+)
+
+/**
+ * A language preference as a row, opening a list to choose from.
+ *
+ * It was a free-text field asking for "jpn or eng", which is a question only
+ * someone who has read a Matroska header can answer.
+ */
+@Composable
+internal fun LanguageSetting(headline: String, value: String?, onChange: (String?) -> Unit) {
+    var choosing by remember { mutableStateOf(false) }
+    ListItem(
+        headlineContent = { Text(headline) },
+        supportingContent = { Text(languageLabel(value)) },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+        modifier = Modifier.clickable(role = Role.Button) { choosing = true },
+    )
+    if (choosing) {
+        LanguageDialog(
+            headline,
+            value,
+            onDismiss = { choosing = false },
+            onChoose = {
+                choosing = false
+                onChange(it)
+            },
+        )
+    }
+}
+
+@Composable
+private fun LanguageDialog(headline: String, value: String?, onDismiss: () -> Unit, onChoose: (String?) -> Unit) {
+    val current = value?.let(::languageOf)?.first ?: value
+    // A tag that is not on the list starts in the field, so it is shown and
+    // can be edited rather than silently replaced.
+    var typed by remember { mutableStateOf(current?.takeIf { tag -> LANGUAGES.none { it.first == tag } }.orEmpty()) }
+    AlertDialog(
+        onDismissRequest = onDismiss,
+        title = { Text(headline) },
+        text = {
+            Column {
+                LazyColumn(Modifier.fillMaxWidth().heightIn(max = 360.dp)) {
+                    item(key = "none") { LanguageOption("No preference", current == null) { onChoose(null) } }
+                    items(LANGUAGES, key = { it.first }) { (code, name) ->
+                        LanguageOption(name, current == code) { onChoose(code) }
+                    }
+                }
+                HorizontalDivider(Modifier.padding(vertical = 8.dp))
+                OutlinedTextField(
+                    value = typed,
+                    onValueChange = { typed = it },
+                    label = { Text("Another tag") },
+                    supportingText = { Text("As it appears in the file, such as \"tgl\"") },
+                    singleLine = true,
+                    modifier = Modifier.fillMaxWidth(),
+                )
+            }
+        },
+        confirmButton = {
+            AccentButton(enabled = typed.isNotBlank(), onClick = { onChoose(typed.trim().lowercase()) }) {
+                Text("Use tag")
+            }
+        },
+        dismissButton = { TonalButton(onClick = onDismiss) { Text("Cancel") } },
+    )
+}
+
+@Composable
+private fun LanguageOption(name: String, selected: Boolean, onClick: () -> Unit) {
+    ListItem(
+        headlineContent = { Text(name, style = MaterialTheme.typography.bodyLarge) },
+        leadingContent = { RadioButton(selected = selected, onClick = null) },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+        modifier = Modifier.clickable(role = Role.RadioButton, onClick = onClick),
+    )
+}

android/app/src/main/java/io/narl/protonstream/ui/LibraryScreen.kt

@@ -0,0 +1,706 @@
+package io.narl.protonstream.ui
+
+import androidx.compose.foundation.background
+import androidx.activity.compose.BackHandler
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
+import androidx.compose.material.icons.filled.Refresh
+import androidx.compose.material3.LargeTopAppBar
+import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.TopAppBarDefaults
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.ui.focus.FocusRequester
+import androidx.compose.ui.focus.focusRequester
+import androidx.compose.ui.input.nestedscroll.nestedScroll
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Row
+import androidx.compose.ui.graphics.Brush
+import io.narl.protonstream.ui.theme.AccentButton
+import io.narl.protonstream.ui.theme.TonalButton
+import java.time.LocalDate
+import androidx.compose.foundation.combinedClickable
+import androidx.compose.material.icons.filled.CheckCircle
+import androidx.compose.material.icons.filled.Download
+import androidx.compose.material.icons.filled.Edit
+import androidx.compose.material.icons.filled.Info
+import androidx.compose.material.icons.filled.PlayArrow
+import androidx.compose.material.icons.filled.RemoveCircleOutline
+import androidx.compose.material.icons.outlined.CheckCircle
+import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.platform.LocalContext
+import io.narl.protonstream.download.DownloadCoordinator
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.LazyRow
+import androidx.compose.foundation.lazy.grid.GridCells
+import androidx.compose.foundation.lazy.grid.GridItemSpan
+import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
+import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material.icons.filled.Search
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextField
+import androidx.compose.material3.TextFieldDefaults
+import androidx.compose.material3.pulltorefresh.PullToRefreshBox
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import io.narl.protonstream.ui.theme.AccentProgress
+import androidx.compose.material.icons.automirrored.filled.Sort
+import androidx.compose.material.icons.filled.Check
+import androidx.compose.material3.DropdownMenu
+import androidx.compose.material3.DropdownMenuItem
+import androidx.compose.material3.HorizontalDivider
+import uniffi.pstr_android.EpisodeRecord
+import uniffi.pstr_android.LibrarySort
+import uniffi.pstr_android.SeasonRecord
+import uniffi.pstr_android.TitleRecord
+import uniffi.pstr_android.TitleType
+
+/**
+ * How many shows the continue-watching shelf holds.
+ *
+ * A shelf is a shortcut, not a second library: past about this many it is
+ * quicker to search for the thing than to scroll the shelf looking for it.
+ */
+private const val CONTINUE_WATCHING_MAX = 12
+
+/** One row of the continue-watching shelf: which episode, and where it sits. */
+private data class Resumable(val title: TitleRecord, val episode: EpisodeRecord, val index: Int)
+
+/** One tile of the grid: the title drawn, and how many more of its franchise it stands for. */
+private data class Tile(val title: TitleRecord, val folded: Int)
+
+/** A row above the grid: titles that share a director, a studio or a genre. */
+private data class Shelf(val label: String, val titles: List<TitleRecord>)
+
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+internal fun LibraryScreen(
+    state: AppUiState,
+    onSearch: (String) -> Unit,
+    onResume: (TitleRecord, Int) -> Unit,
+    onTitle: (TitleRecord) -> Unit,
+    onRefresh: () -> Unit,
+    onSetTitleWatched: (TitleRecord, Boolean) -> Unit,
+    onForgetPosition: (TitleRecord, EpisodeRecord) -> Unit,
+    padding: PaddingValues,
+    onMatchChanged: () -> Unit = {},
+    onError: (Throwable) -> Unit = {},
+    onArrange: (LibrarySort, Boolean) -> Unit = { _, _ -> },
+) {
+    val context = LocalContext.current
+    // What a long press opened a menu for: a title, or a Continue watching card.
+    var menuFor by remember { mutableStateOf<TitleRecord?>(null) }
+    var menuResume by remember { mutableStateOf<Resumable?>(null) }
+    var matching by remember { mutableStateOf<TitleRecord?>(null) }
+    // Most recently played first, one episode per show: a shelf that lists four
+    // episodes of the same series is a shelf with room for nothing else.
+    val resumable = remember(state.titles) {
+        state.titles.mapNotNull { title ->
+            val playlist = title.seasons.flatMap(SeasonRecord::episodes)
+            playlist.withIndex()
+                .filter { it.value.resumeAt != null && !it.value.watched }
+                .maxByOrNull { it.value.lastPlayed }
+                ?.let { Resumable(title, it.value, it.index) }
+        }.sortedByDescending { it.episode.lastPlayed }.take(CONTINUE_WATCHING_MAX)
+    }
+    // Search is an icon until it is wanted: a permanent field above the
+    // library spent a band of every visit on something used in few of them.
+    var searching by rememberSaveable { mutableStateOf(state.query.isNotEmpty()) }
+    val closeSearch = {
+        searching = false
+        onSearch("")
+    }
+    BackHandler(enabled = searching, onBack = closeSearch)
+    // The large title folds into the bar as the grid scrolls, and comes back
+    // only at the top: the page says what it is on arrival, then gets out of
+    // the way.
+    val scroll = TopAppBarDefaults.exitUntilCollapsedScrollBehavior()
+    Column(Modifier.fillMaxSize().nestedScroll(scroll.nestedScrollConnection)) {
+        if (searching) {
+            SearchBar(state.query, onSearch, closeSearch)
+        } else {
+            LargeTopAppBar(
+                title = { Text("Library") },
+                actions = {
+                    IconButton(onClick = { searching = true }) {
+                        Icon(Icons.Default.Search, contentDescription = "Search library")
+                    }
+                    ArrangeMenu(state.sort, state.grouped, onArrange)
+                    // Pull to refresh is the gesture; the icon stays for a
+                    // viewer who does not know it.
+                    IconButton(onClick = onRefresh, enabled = !state.refreshing) {
+                        Icon(Icons.Default.Refresh, contentDescription = "Refresh")
+                    }
+                },
+                colors = pageBarColors(),
+                scrollBehavior = scroll,
+            )
+        }
+        PullToRefreshBox(
+            isRefreshing = state.refreshing,
+            onRefresh = onRefresh,
+            modifier = Modifier.weight(1f).padding(padding),
+        ) {
+            when {
+                state.loading -> LibrarySkeleton()
+                state.titles.isEmpty() && state.query.isNotBlank() -> EmptyState(
+                    "Nothing matches",
+                    "No title in the library is called “${state.query.trim()}”.",
+                )
+                state.titles.isEmpty() -> EmptyState(
+                    "Your library is empty",
+                    "Add a Proton Drive public link under Shares, then refresh.",
+                )
+                else -> LibraryGrid(
+                    state,
+                    resumable,
+                    onResume,
+                    onTitle,
+                    onTitleMenu = { menuFor = it },
+                    onResumeMenu = { menuResume = it },
+                )
+            }
+        }
+    }
+    menuFor?.let { title ->
+        val playlist = title.seasons.flatMap(SeasonRecord::episodes)
+        val allWatched = title.episodeCount > 0uL && title.watchedCount == title.episodeCount
+        TileMenu(title.displayName, title.caption(), onDismiss = { menuFor = null }) {
+            MenuRow(Icons.Default.PlayArrow, if (playlist.any { it.resumeAt != null }) "Resume" else "Play") {
+                onResume(title, nextUpIndex(playlist))
+            }
+            MenuRow(Icons.Default.Info, "Open") { onTitle(title) }
+            MenuRow(Icons.Default.Download, "Download all") { DownloadCoordinator.enqueue(context, playlist) }
+            MenuRow(
+                if (allWatched) Icons.Outlined.CheckCircle else Icons.Default.CheckCircle,
+                if (allWatched) "Mark unwatched" else "Mark watched",
+            ) { onSetTitleWatched(title, !allWatched) }
+            // The same search the title page offers, for the tile that is
+            // plainly wrong — the wrong poster is what the grid shows.
+            MenuRow(Icons.Default.Edit, "Change match") { matching = title }
+        }
+    }
+    matching?.let { title ->
+        ChangeMatchDialog(
+            title = title,
+            onDismiss = { matching = null },
+            onChanged = {
+                matching = null
+                onMatchChanged()
+            },
+            onError = onError,
+        )
+    }
+    menuResume?.let { entry ->
+        TileMenu(
+            entry.title.displayName,
+            entry.episode.label,
+            onDismiss = { menuResume = null },
+        ) {
+            MenuRow(Icons.Default.PlayArrow, "Resume") { onResume(entry.title, entry.index) }
+            MenuRow(Icons.Default.Info, "Open") { onTitle(entry.title) }
+            MenuRow(Icons.Default.RemoveCircleOutline, "Remove from Continue watching") {
+                onForgetPosition(entry.title, entry.episode)
+            }
+        }
+    }
+}
+
+/**
+ * The grid's order, and whether a franchise is one tile or one per title —
+ * the same choices the desktop offers beside its grid, behind one icon here
+ * because a phone's bar has room for three.
+ */
+@Composable
+private fun ArrangeMenu(sort: LibrarySort, grouped: Boolean, onArrange: (LibrarySort, Boolean) -> Unit) {
+    var open by remember { mutableStateOf(false) }
+    Box {
+        IconButton(onClick = { open = true }) {
+            Icon(Icons.AutoMirrored.Filled.Sort, contentDescription = "Sort library")
+        }
+        DropdownMenu(expanded = open, onDismissRequest = { open = false }) {
+            LibrarySort.entries.forEach { option ->
+                DropdownMenuItem(
+                    text = { Text(option.label()) },
+                    leadingIcon = {
+                        if (option == sort) Icon(Icons.Default.Check, contentDescription = null)
+                    },
+                    onClick = {
+                        open = false
+                        onArrange(option, grouped)
+                    },
+                )
+            }
+            HorizontalDivider()
+            DropdownMenuItem(
+                text = { Text("One tile per franchise") },
+                leadingIcon = {
+                    if (grouped) Icon(Icons.Default.Check, contentDescription = null)
+                },
+                onClick = {
+                    open = false
+                    onArrange(sort, !grouped)
+                },
+            )
+        }
+    }
+}
+
+/** What each order is called. The desktop says the same. */
+private fun LibrarySort.label() = when (this) {
+    LibrarySort.NAME -> "A – Z"
+    LibrarySort.RECENT -> "Recently watched"
+    LibrarySort.ADDED -> "Recently added"
+    LibrarySort.RELEASE -> "Newest"
+    LibrarySort.RATING -> "Highest rated"
+    LibrarySort.POPULARITY -> "Most popular"
+}
+
+/**
+ * The bar while searching: back closes the search and clears it, and the field
+ * takes the keyboard as soon as it opens, since opening it is asking to type.
+ */
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+private fun SearchBar(query: String, onSearch: (String) -> Unit, onClose: () -> Unit) {
+    val focus = remember { FocusRequester() }
+    LaunchedEffect(Unit) { focus.requestFocus() }
+    TopAppBar(
+        navigationIcon = {
+            IconButton(onClick = onClose) {
+                Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Close search")
+            }
+        },
+        title = {
+            // A filled pill rather than an outlined form field: search is how
+            // the page is navigated, not a value being entered.
+            TextField(
+                value = query,
+                onValueChange = onSearch,
+                modifier = Modifier.fillMaxWidth().padding(end = 8.dp).focusRequester(focus),
+                singleLine = true,
+                shape = CircleShape,
+                placeholder = { Text("Search library") },
+                trailingIcon = {
+                    if (query.isNotEmpty()) {
+                        IconButton(onClick = { onSearch("") }) {
+                            Icon(Icons.Default.Close, contentDescription = "Clear search")
+                        }
+                    }
+                },
+                keyboardOptions = KeyboardOptions(imeAction = ImeAction.Search),
+                colors = TextFieldDefaults.colors(
+                    focusedIndicatorColor = Color.Transparent,
+                    unfocusedIndicatorColor = Color.Transparent,
+                    disabledIndicatorColor = Color.Transparent,
+                ),
+            )
+        },
+        colors = pageBarColors(),
+    )
+}
+
+/**
+ * A long press's menu, from the bottom of the screen where the thumb already
+ * is. Each row closes it before doing its thing.
+ */
+@OptIn(ExperimentalMaterial3Api::class)
+@Composable
+private fun TileMenu(
+    heading: String,
+    caption: String,
+    onDismiss: () -> Unit,
+    rows: @Composable MenuScope.() -> Unit,
+) {
+    ModalBottomSheet(onDismissRequest = onDismiss) {
+        Column(Modifier.padding(bottom = 24.dp)) {
+            Text(
+                heading,
+                style = MaterialTheme.typography.titleMedium,
+                maxLines = 1,
+                overflow = TextOverflow.Ellipsis,
+                modifier = Modifier.padding(horizontal = 24.dp),
+            )
+            Text(
+                caption,
+                style = MaterialTheme.typography.bodySmall,
+                color = MaterialTheme.colorScheme.onSurfaceVariant,
+                modifier = Modifier.padding(start = 24.dp, end = 24.dp, bottom = 8.dp),
+            )
+            MenuScope(onDismiss).rows()
+        }
+    }
+}
+
+private class MenuScope(val dismiss: () -> Unit)
+
+@Composable
+private fun MenuScope.MenuRow(icon: ImageVector, label: String, onClick: () -> Unit) {
+    ListItem(
+        headlineContent = { Text(label) },
+        leadingContent = { Icon(icon, contentDescription = null) },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+        modifier = Modifier.clickable { dismiss(); onClick() }.padding(horizontal = 8.dp),
+    )
+}
+
+@Composable
+private fun LibraryGrid(
+    state: AppUiState,
+    resumable: List<Resumable>,
+    onResume: (TitleRecord, Int) -> Unit,
+    onTitle: (TitleRecord) -> Unit,
+    onTitleMenu: (TitleRecord) -> Unit,
+    onResumeMenu: (Resumable) -> Unit,
+) {
+    // The arrangement names titles by key; before it has arrived, the titles
+    // as they came are the grid.
+    val byKey = remember(state.titles) { state.titles.associateBy { it.key } }
+    val tiles = remember(state.titles, state.arrangement) {
+        state.arrangement?.tiles?.mapNotNull { tile -> byKey[tile.key]?.let { Tile(it, tile.folded.toInt()) } }
+            ?: state.titles.map { Tile(it, 0) }
+    }
+    val shelves = remember(state.titles, state.arrangement) {
+        state.arrangement?.shelves.orEmpty()
+            .map { shelf -> Shelf(shelf.label, shelf.keys.mapNotNull(byKey::get)) }
+            .filter { it.titles.isNotEmpty() }
+    }
+    // Posters, three across on a phone. Cropped backdrops at full width fitted
+    // two titles to a screen, which is a library read one row at a time.
+    LazyVerticalGrid(
+        columns = GridCells.Adaptive(108.dp),
+        modifier = Modifier.fillMaxSize(),
+        horizontalArrangement = Arrangement.spacedBy(12.dp),
+        verticalArrangement = Arrangement.spacedBy(16.dp),
+        contentPadding = PaddingValues(start = 16.dp, end = 16.dp, top = 8.dp, bottom = 24.dp),
+    ) {
+        // Above the grid, and only when there is something in it: what a viewer
+        // opening the app wants is almost always the thing they were part way
+        // through. Inside the grid rather than pinned over it, so the shelf
+        // scrolls away with the rest.
+        val featured = if (state.query.isBlank()) featured(state.titles, resumable) else null
+        featured?.let { title ->
+            item(key = "featured", span = { GridItemSpan(maxLineSpan) }) {
+                FeaturedBanner(
+                    title,
+                    resume = resumable.firstOrNull { it.title.key == title.key },
+                    onPlay = { onResume(title, it) },
+                    onOpen = { onTitle(title) },
+                )
+            }
+        }
+        if (state.query.isBlank() && resumable.isNotEmpty()) {
+            item(key = "continue-watching", span = { GridItemSpan(maxLineSpan) }) {
+                Column {
+                    Text("Continue watching", style = MaterialTheme.typography.titleMedium)
+                    LazyRow(
+                        horizontalArrangement = Arrangement.spacedBy(12.dp),
+                        contentPadding = PaddingValues(top = 10.dp),
+                    ) {
+                        items(resumable, key = { "${it.episode.shareId}/${it.episode.linkId}" }) { entry ->
+                            ContinueCard(
+                                entry,
+                                onClick = { onResume(entry.title, entry.index) },
+                                onLongClick = { onResumeMenu(entry) },
+                            )
+                        }
+                    }
+                }
+            }
+        }
+        if (state.query.isBlank()) {
+            shelves.forEach { shelf ->
+                item(key = "shelf-${shelf.label}", span = { GridItemSpan(maxLineSpan) }) {
+                    Column {
+                        Text(shelf.label, style = MaterialTheme.typography.titleMedium)
+                        LazyRow(
+                            horizontalArrangement = Arrangement.spacedBy(12.dp),
+                            contentPadding = PaddingValues(top = 10.dp),
+                        ) {
+                            items(shelf.titles, key = { it.key }) { title ->
+                                PosterTile(
+                                    title,
+                                    onClick = { onTitle(title) },
+                                    onLongClick = { onTitleMenu(title) },
+                                    modifier = Modifier.width(SHELF_TILE_WIDTH),
+                                    shared = false,
+                                )
+                            }
+                        }
+                    }
+                }
+            }
+            if (resumable.isNotEmpty() || shelves.isNotEmpty()) {
+                item(key = "library-heading", span = { GridItemSpan(maxLineSpan) }) {
+                    Text("All titles", style = MaterialTheme.typography.titleMedium, modifier = Modifier.padding(top = 8.dp))
+                }
+            }
+        }
+        items(tiles, key = { it.title.key }) { tile ->
+            PosterTile(
+                tile.title,
+                onClick = { onTitle(tile.title) },
+                onLongClick = { onTitleMenu(tile.title) },
+                folded = tile.folded,
+            )
+        }
+    }
+}
+
+/**
+ * The grid's shape before the catalog has answered: posters and their two
+ * lines of text as blocks, so the page does not jump when the titles land.
+ */
+@Composable
+private fun LibrarySkeleton() {
+    LazyVerticalGrid(
+        columns = GridCells.Adaptive(108.dp),
+        modifier = Modifier.fillMaxSize(),
+        horizontalArrangement = Arrangement.spacedBy(12.dp),
+        verticalArrangement = Arrangement.spacedBy(16.dp),
+        contentPadding = PaddingValues(start = 16.dp, end = 16.dp, top = 8.dp, bottom = 24.dp),
+        userScrollEnabled = false,
+    ) {
+        items(SKELETON_TILES) {
+            Column {
+                Skeleton(Modifier.fillMaxWidth().aspectRatio(2f / 3f).clip(MaterialTheme.shapes.medium))
+                Spacer(Modifier.height(8.dp))
+                Skeleton(Modifier.fillMaxWidth(0.8f).height(12.dp).clip(MaterialTheme.shapes.small))
+                Spacer(Modifier.height(6.dp))
+                Skeleton(Modifier.fillMaxWidth(0.5f).height(10.dp).clip(MaterialTheme.shapes.small))
+            }
+        }
+    }
+}
+
+/** A shelf's covers: a little narrower than the grid's, so the row reads as a row. */
+private val SHELF_TILE_WIDTH = 112.dp
+
+/** Enough placeholder tiles to fill a tablet's first screen. */
+private const val SKELETON_TILES = 18
+
+/**
+ * The title the banner shows: the one watched last, or with nothing part
+ * watched, one of the titles the provider has a backdrop for, turning over
+ * once a day — the desktop's `featured`.
+ */
+private fun featured(titles: List<TitleRecord>, resumable: List<Resumable>): TitleRecord? {
+    resumable.firstOrNull()?.let { return it.title }
+    val pictured = titles.filter { it.backdropUrl != null }
+    if (pictured.isEmpty()) return null
+    return pictured[(LocalDate.now().toEpochDay() % pictured.size).toInt()]
+}
+
+/** Large art behind the name, rating, genres and three lines of synopsis. */
+@Composable
+private fun FeaturedBanner(title: TitleRecord, resume: Resumable?, onPlay: (Int) -> Unit, onOpen: () -> Unit) {
+    val playlist = remember(title) { title.seasons.flatMap(SeasonRecord::episodes) }
+    Box(Modifier.fillMaxWidth().aspectRatio(4f / 3f).clip(MaterialTheme.shapes.large)) {
+        RemoteArtwork(
+            title.backdropUrl ?: title.posterUrl,
+            title.displayName,
+            Modifier.fillMaxSize(),
+            fallback = title.thumbnailSource,
+            labelled = false,
+        )
+        Box(
+            Modifier.fillMaxSize().background(
+                Brush.verticalGradient(0.35f to Color.Transparent, 1f to Color.Black.copy(alpha = 0.85f)),
+            ),
+        )
+        Column(Modifier.align(Alignment.BottomStart).padding(16.dp)) {
+            Text(
+                title.displayName,
+                style = MaterialTheme.typography.headlineMedium,
+                color = Color.White,
+                maxLines = 2,
+                overflow = TextOverflow.Ellipsis,
+            )
+            Text(
+                listOfNotNull(
+                    title.rating?.let { "★ %.1f".format(it) },
+                    title.genres.takeIf { it.isNotEmpty() }?.take(3)?.joinToString(", "),
+                ).joinToString("  ·  ").ifEmpty { title.caption() },
+                style = MaterialTheme.typography.bodySmall,
+                color = Color.White.copy(alpha = 0.8f),
+            )
+            title.overview?.let {
+                Text(
+                    it.trim(),
+                    style = MaterialTheme.typography.bodySmall,
+                    color = Color.White.copy(alpha = 0.8f),
+                    maxLines = 3,
+                    overflow = TextOverflow.Ellipsis,
+                    modifier = Modifier.padding(top = 6.dp),
+                )
+            }
+            Row(horizontalArrangement = Arrangement.spacedBy(8.dp), modifier = Modifier.padding(top = 12.dp)) {
+                AccentButton(onClick = { onPlay(resume?.index ?: nextUpIndex(playlist)) }) {
+                    Icon(Icons.Default.PlayArrow, contentDescription = null)
+                    Spacer(Modifier.width(6.dp))
+                    Text(if (resume != null) "Resume" else "Play")
+                }
+                TonalButton(onClick = onOpen) { Text("More info") }
+            }
+        }
+    }
+}
+
+/** A part-watched episode: its still, where it was left, and what is left of it. */
+@Composable
+private fun ContinueCard(entry: Resumable, onClick: () -> Unit, onLongClick: () -> Unit) {
+    Column(
+        Modifier
+            .width(220.dp)
+            .clip(MaterialTheme.shapes.medium)
+            .combinedClickable(onClick = onClick, onLongClick = onLongClick),
+    ) {
+        Box(Modifier.fillMaxWidth().aspectRatio(16f / 9f).clip(MaterialTheme.shapes.medium)) {
+            RemoteArtwork(
+                entry.episode.stillUrl ?: entry.title.backdropUrl,
+                entry.title.displayName,
+                Modifier.fillMaxSize(),
+                fallback = entry.episode.thumbnailSource,
+            )
+            entry.episode.progress?.let { progress ->
+                AccentProgress(
+                    progress = { progress.toFloat().coerceIn(0f, 1f) },
+                    modifier = Modifier.fillMaxWidth().align(Alignment.BottomCenter),
+                )
+            }
+        }
+        Text(
+            entry.title.displayName,
+            fontWeight = FontWeight.SemiBold,
+            maxLines = 1,
+            overflow = TextOverflow.Ellipsis,
+            modifier = Modifier.padding(top = 8.dp),
+        )
+        Text(
+            listOfNotNull(entry.episode.label, entry.episode.timeLeft()).joinToString(" · "),
+            style = MaterialTheme.typography.bodySmall,
+            color = MaterialTheme.colorScheme.onSurfaceVariant,
+            maxLines = 1,
+            overflow = TextOverflow.Ellipsis,
+        )
+    }
+}
+
+/**
+ * One title: its poster, and its name and size under it rather than in a card.
+ *
+ * [folded] is how many more titles of its franchise the tile stands for, said
+ * in the corner. [shared] is whether the poster grows into the title page —
+ * only one copy of a title on screen can, and a shelf may hold the same title
+ * as the grid.
+ */
+@Composable
+private fun PosterTile(
+    title: TitleRecord,
+    onClick: () -> Unit,
+    onLongClick: () -> Unit,
+    modifier: Modifier = Modifier,
+    folded: Int = 0,
+    shared: Boolean = true,
+) {
+    Column(
+        modifier
+            .clip(MaterialTheme.shapes.medium)
+            .combinedClickable(onClick = onClick, onLongClick = onLongClick),
+    ) {
+        Box {
+            RemoteArtwork(
+                title.posterUrl ?: title.backdropUrl,
+                title.displayName,
+                (if (shared) Modifier.sharedArt(title.key) else Modifier)
+                    .fillMaxWidth()
+                    .aspectRatio(2f / 3f)
+                    .clip(MaterialTheme.shapes.medium),
+                fallback = title.thumbnailSource,
+            )
+            if (folded > 0) {
+                Text(
+                    "+$folded",
+                    style = MaterialTheme.typography.labelSmall,
+                    color = Color.White,
+                    modifier = Modifier
+                        .align(Alignment.TopEnd)
+                        .padding(6.dp)
+                        .clip(MaterialTheme.shapes.small)
+                        .background(Color.Black.copy(alpha = 0.7f))
+                        .padding(horizontal = 6.dp, vertical = 2.dp),
+                )
+            }
+        }
+        Spacer(Modifier.height(6.dp))
+        Text(
+            title.displayName,
+            style = MaterialTheme.typography.bodyMedium,
+            fontWeight = FontWeight.SemiBold,
+            maxLines = 2,
+            overflow = TextOverflow.Ellipsis,
+        )
+        // Two lines, not one: at a large font scale "2023 · 7 episodes" does
+        // not fit a poster's width, and one line cut it to "2023 · 7".
+        Text(
+            title.caption(),
+            style = MaterialTheme.typography.bodySmall,
+            color = MaterialTheme.colorScheme.onSurfaceVariant,
+            maxLines = 2,
+            overflow = TextOverflow.Ellipsis,
+        )
+    }
+}
+
+/** "2023 · 11 episodes", or "1988 · Film" — never "1 episodes". */
+private fun TitleRecord.caption(): String = listOfNotNull(
+    (metadataYear ?: year)?.toString(),
+    when {
+        (metadataKind ?: kind) == TitleType.FILM && episodeCount == 1uL -> "Film"
+        episodeCount == 1uL -> "1 episode"
+        else -> "$episodeCount episodes"
+    },
+).joinToString(" · ")
+
+/**
+ * "12 min left", from where the episode was left and how far through that is.
+ * Null when either is unknown — a guess would be worse than no figure.
+ */
+private fun EpisodeRecord.timeLeft(): String? {
+    val at = resumeAt ?: return null
+    val fraction = progress?.takeIf { it > 0.0 && it < 1.0 } ?: return null
+    val minutes = ((at / fraction - at) / 60).toInt()
+    return if (minutes < 1) "under a minute left" else "$minutes min left"
+}

android/app/src/main/java/io/narl/protonstream/ui/RemoteArtwork.kt

@@ -6,8 +6,13 @@ import android.graphics.BitmapFactory
 import android.util.LruCache
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.animation.core.RepeatMode
+import androidx.compose.animation.core.animateFloat
+import androidx.compose.animation.core.infiniteRepeatable
+import androidx.compose.animation.core.rememberInfiniteTransition
+import androidx.compose.animation.core.tween
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.BoxWithConstraints
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -16,12 +21,19 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
+import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Brush
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ImageBitmap
+import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.graphics.lerp
 import androidx.compose.ui.graphics.asImageBitmap
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.text.font.FontWeight
 import io.narl.protonstream.native.NativeRuntime
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.withContext
@@ -64,7 +76,9 @@ internal val EpisodeRecord.thumbnailSource: ThumbnailSource
  *
  * [fallback] is used only when there is no provider artwork or it fails to
  * load, which — with metadata off — is the common case rather than the rare
- * one.
+ * one. Until either answers, the box pulses as a skeleton; when neither has
+ * anything, it shows [ArtworkPlaceholder] rather than an empty card — without
+ * initials when [labelled] is false, for art with the name already over it.
  */
 @Composable
 internal fun RemoteArtwork(
@@ -72,19 +86,98 @@ internal fun RemoteArtwork(
     description: String,
     modifier: Modifier = Modifier,
     fallback: ThumbnailSource? = null,
+    labelled: Boolean = true,
 ) {
     val context = LocalContext.current
-    var image by remember(url, fallback) { mutableStateOf<ImageBitmap?>(null) }
+    val enabled = LocalArtworkLoading.current
-    LaunchedEffect(url, fallback) {
+    var image by remember(url, fallback) { mutableStateOf<ArtworkLoad>(ArtworkLoad.Pending) }
-        image = (loadArtwork(context, url) ?: loadThumbnail(fallback))?.asImageBitmap()
+    LaunchedEffect(url, fallback, enabled) {
+        if (!enabled) {
+            image = ArtworkLoad.Missing
+            return@LaunchedEffect
+        }
+        image = (loadArtwork(context, url) ?: loadThumbnail(fallback))
+            ?.let { ArtworkLoad.Loaded(it.asImageBitmap()) }
+            ?: ArtworkLoad.Missing
     }
-    Box(modifier.background(MaterialTheme.colorScheme.surfaceVariant), contentAlignment = Alignment.Center) {
+    when (val loaded = image) {
-        image?.let {
+        ArtworkLoad.Pending -> Skeleton(modifier)
-            Image(it, description, Modifier.fillMaxSize(), contentScale = ContentScale.Crop)
+        ArtworkLoad.Missing -> ArtworkPlaceholder(description, modifier, labelled)
-        } ?: Text("▶", style = MaterialTheme.typography.displaySmall)
+        is ArtworkLoad.Loaded -> Image(loaded.image, description, modifier, contentScale = ContentScale.Crop)
     }
 }
 
+private sealed interface ArtworkLoad {
+    data object Pending : ArtworkLoad
+    data object Missing : ArtworkLoad
+    data class Loaded(val image: ImageBitmap) : ArtworkLoad
+}
+
+/**
+ * Whether [RemoteArtwork] fetches anything at all.
+ *
+ * Off in the screenshot tests: there is no bridge on the host, and whether a
+ * failed fetch lands before or after the capture would decide between a
+ * skeleton and a placeholder in the committed image.
+ */
+internal val LocalArtworkLoading = staticCompositionLocalOf { true }
+
+/**
+ * Something being loaded: the surface tint, breathing.
+ *
+ * A spinner per tile is a grid of spinners; a shape where the poster will be
+ * says what is coming and where, and settles the layout before it arrives.
+ */
+@Composable
+internal fun Skeleton(modifier: Modifier = Modifier) {
+    val pulse by rememberInfiniteTransition(label = "skeleton").animateFloat(
+        initialValue = 0.55f,
+        targetValue = 1f,
+        animationSpec = infiniteRepeatable(tween(800), RepeatMode.Reverse),
+        label = "skeleton alpha",
+    )
+    Box(modifier.graphicsLayer { alpha = pulse }.background(MaterialTheme.colorScheme.surfaceVariant))
+}
+
+/**
+ * Art for a title that has none: the accent as a gradient, and its initials.
+ *
+ * A black card with a play triangle on it said nothing about which title it
+ * was, so a grid of unmatched titles was a grid of identical cards. Each name
+ * sets where on the accent ramp its gradient starts, so neighbours differ
+ * while every one stays in the theme's colours.
+ */
+@Composable
+internal fun ArtworkPlaceholder(name: String, modifier: Modifier = Modifier, labelled: Boolean = true) {
+    val scheme = MaterialTheme.colorScheme
+    val brush = remember(name, scheme.primary, scheme.secondary) {
+        val start = lerp(scheme.primary, scheme.secondary, (name.hashCode().mod(5)) / 4f)
+        Brush.linearGradient(listOf(start, lerp(start, Color.Black, 0.55f)))
+    }
+    BoxWithConstraints(modifier.background(brush), contentAlignment = Alignment.Center) {
+        if (!labelled) return@BoxWithConstraints
+        val size = with(LocalDensity.current) { (minOf(maxWidth, maxHeight) * 0.3f).toSp() }
+        Text(
+            initials(name),
+            color = Color.White.copy(alpha = 0.9f),
+            fontSize = size,
+            fontWeight = FontWeight.SemiBold,
+            maxLines = 1,
+        )
+    }
+}
+
+/**
+ * "Oshi no Ko" is "OK", "Akira" is "A": the first letters of up to two
+ * capitalised words, so particles and articles in a romanised name do not
+ * take a slot. A name with no capitals uses its first two words.
+ */
+internal fun initials(name: String): String {
+    val words = name.split(' ', '-', '_', '.', ':').filter { word -> word.firstOrNull()?.isLetterOrDigit() == true }
+    val picked = words.filter { it.first().isUpperCase() || it.first().isDigit() }.ifEmpty { words }
+    return picked.take(2).joinToString("") { it.first().uppercase() }
+}
+
 /**
  * The same HTTPS-only fetch behind the library grid, reusable off the composition.
  *

android/app/src/main/java/io/narl/protonstream/ui/SettingsScreen.kt

@@ -0,0 +1,623 @@
+package io.narl.protonstream.ui
+
+import androidx.activity.compose.BackHandler
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.ColumnScope
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
+import androidx.compose.material.icons.automirrored.filled.ManageSearch
+import androidx.compose.material.icons.filled.Info
+import androidx.compose.material.icons.filled.Palette
+import androidx.compose.material.icons.filled.PlayCircle
+import androidx.compose.material.icons.filled.Storage
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.runtime.saveable.rememberSaveable
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.foundation.border
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.FlowRow
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.LazyRow
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.material3.AlertDialog
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.Switch
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.text.input.PasswordVisualTransformation
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.window.DialogProperties
+import androidx.compose.ui.window.SecureFlagPolicy
+import androidx.compose.ui.unit.dp
+import io.narl.protonstream.settings.SettingsStore
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
+import kotlinx.coroutines.withContext
+import io.narl.protonstream.download.DownloadCoordinator
+import io.narl.protonstream.native.NativeRuntime
+import io.narl.protonstream.ui.theme.AccentButton
+import io.narl.protonstream.ui.theme.AppearanceState
+import io.narl.protonstream.ui.theme.EdgedButton
+import io.narl.protonstream.ui.theme.TonalButton
+import uniffi.pstr_android.MetadataProvider
+import uniffi.pstr_android.FlavorChoice
+import uniffi.pstr_android.AppearanceRecord
+import uniffi.pstr_android.TitleNamesChoice
+import uniffi.pstr_android.AccentChoice
+import uniffi.pstr_android.PlaybackPrefsRecord
+import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
+import androidx.compose.material3.FilterChip
+import androidx.compose.foundation.selection.toggleable
+import androidx.compose.ui.semantics.Role
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.height
+import io.narl.protonstream.ui.theme.AccentProgress
+
+@Composable
+internal fun SettingsScreen(
+    state: AppUiState,
+    onSaveMetadata: (Boolean, MetadataProvider, String, String) -> Unit,
+    onMatchAgain: () -> Unit,
+    onClearCache: () -> Unit,
+    onRemoveAllOffline: () -> Unit,
+    padding: PaddingValues,
+    initialPage: SettingsPage? = null,
+    // A parameter so the screenshot tests can pin it: read from the package,
+    // every version bump changed the committed image of this page.
+    version: String = appVersion(),
+    /** The library's names changed, and it has to be read again to show them. */
+    onNamesChanged: () -> Unit = {},
+) {
+    val context = LocalContext.current
+    val settings = remember { SettingsStore(context) }
+    var wifiOnly by remember { mutableStateOf(settings.wifiOnly) }
+    var backgroundAudio by remember { mutableStateOf(settings.backgroundAudio) }
+    var hardwareDecoding by remember { mutableStateOf(settings.hardwareDecoding) }
+    var cacheBudgetGib by remember { mutableStateOf(settings.cacheBudgetGib) }
+    // Playback preferences are the shared store's, not this app's: they are the
+    // same file the desktop client reads, so a language chosen on one is the
+    // language the other starts in.
+    var prefs by remember { mutableStateOf<PlaybackPrefsRecord?>(null) }
+    val scope = rememberCoroutineScope()
+    fun update(change: (PlaybackPrefsRecord) -> PlaybackPrefsRecord) {
+        val next = change(prefs ?: return)
+        prefs = next
+        scope.launch(Dispatchers.IO) {
+            runCatching { NativeRuntime.engine().setPlaybackPrefs(next) }
+        }
+    }
+    LaunchedEffect(Unit) {
+        runCatching { withContext(Dispatchers.IO) { NativeRuntime.engine().playbackPrefs() } }
+            .onSuccess { prefs = it }
+    }
+    var confirmDelete by remember { mutableStateOf(false) }
+    var showMetadata by remember { mutableStateOf(false) }
+    var legalDocument by remember { mutableStateOf<LegalDocument?>(null) }
+    // One row per area on the first page, each opening its own page: grouped
+    // on one page, the storage controls sat a long scroll below playback, and
+    // every setting added made the rest harder to find.
+    var page by rememberSaveable { mutableStateOf(initialPage) }
+    BackHandler(enabled = page != null) { page = null }
+    val back: @Composable () -> Unit = {
+        IconButton(onClick = { page = null }) {
+            Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back to settings")
+        }
+    }
+    when (page) {
+        null -> TabPage("Settings", padding) { body ->
+            Column(Modifier.fillMaxSize().padding(body).verticalScroll(rememberScrollState())) {
+                SettingsPage.entries.forEach { entry ->
+                    ListItem(
+                        headlineContent = { Text(entry.title) },
+                        supportingContent = {
+                            Text(
+                                when (entry) {
+                                    SettingsPage.Playback -> "Autoplay, languages and decoding"
+                                    SettingsPage.Storage -> "${formatBytes(state.storage.cacheBytes)} cached · " +
+                                        "${state.storage.offlineCount} offline"
+                                    SettingsPage.Appearance -> "Palette, accent and gradient"
+                                    SettingsPage.Metadata -> if (state.metadataSettings.enabled) {
+                                        "On · ${state.metadataSettings.provider.displayName()}"
+                                    } else {
+                                        "Off"
+                                    }
+                                    SettingsPage.About -> "Version $version · licences"
+                                },
+                            )
+                        },
+                        leadingContent = { Icon(entry.icon, contentDescription = null) },
+                        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+                        modifier = Modifier.clickable { page = entry },
+                    )
+                }
+            }
+        }
+        SettingsPage.Playback -> SettingsSubPage(SettingsPage.Playback, padding, back) {
+            prefs?.let { current ->
+                SettingSwitch(
+                    "Autoplay next episode",
+                    "Starts the next episode when the credits begin",
+                    current.autoplayNext,
+                ) { on -> update { it.copy(autoplayNext = on) } }
+                // Off is the safer default: a mis-named chapter then costs a tap on
+                // Skip rather than a scene.
+                SettingSwitch(
+                    "Skip openings and endings",
+                    "Uses the release's chapters; off shows a Skip button instead",
+                    current.autoSkip,
+                ) { on -> update { it.copy(autoSkip = on) } }
+                SettingSwitch("Subtitles", "Shown by default where a file has them", current.subtitles) { on ->
+                    update { it.copy(subtitles = on) }
+                }
+                // Preferences, not filters: a file with nothing in the language
+                // plays its own default track. A show that has been given its
+                // own choice keeps it.
+                LanguageSetting("Audio language", current.audioLanguage) { tag ->
+                    update { it.copy(audioLanguage = tag) }
+                }
+                LanguageSetting("Subtitle language", current.subtitleLanguage) { tag ->
+                    update { it.copy(subtitleLanguage = tag) }
+                }
+            }
+            SettingSwitch(
+                "Hardware decoding",
+                "Turn off if video shows green or torn frames",
+                hardwareDecoding,
+            ) {
+                hardwareDecoding = it
+                settings.hardwareDecoding = it
+            }
+            SettingSwitch(
+                "Background audio",
+                "Keeps playing with the app closed, from the notification",
+                backgroundAudio,
+            ) {
+                backgroundAudio = it
+                settings.backgroundAudio = it
+            }
+        }
+        SettingsPage.Storage -> SettingsSubPage(SettingsPage.Storage, padding, back) {
+            SettingSwitch("Download on Wi-Fi only", "Mobile data is never used for downloads", wifiOnly) {
+                wifiOnly = it
+                settings.wifiOnly = it
+                // Constraints are baked in at enqueue time, so a queue that already
+                // exists keeps the policy it was queued under until it is re-issued.
+                DownloadCoordinator.applyNetworkPolicy(context)
+            }
+            Column(Modifier.padding(horizontal = 16.dp, vertical = 8.dp)) {
+                Text("Streaming cache")
+                Text(
+                    "${formatBytes(state.storage.cacheBytes)} of $cacheBudgetGib GiB used",
+                    style = MaterialTheme.typography.bodySmall,
+                    color = MaterialTheme.colorScheme.onSurfaceVariant,
+                )
+                AccentProgress(
+                    progress = {
+                        (state.storage.cacheBytes.toDouble() / SettingsStore.gibToBytes(cacheBudgetGib).toDouble())
+                            .toFloat().coerceIn(0f, 1f)
+                    },
+                    modifier = Modifier.fillMaxWidth().padding(vertical = 8.dp),
+                )
+                // What has been watched is kept up to this much, so going back over
+                // a scene costs no download. A lower choice frees the difference at
+                // once. Wrapping, so five chips survive a narrow phone at a large
+                // font scale.
+                FlowRow(horizontalArrangement = Arrangement.spacedBy(8.dp)) {
+                    SettingsStore.CACHE_BUDGET_CHOICES.forEach { gib ->
+                        FilterChip(
+                            selected = gib == cacheBudgetGib,
+                            onClick = {
+                                cacheBudgetGib = gib
+                                settings.cacheBudgetGib = gib
+                                scope.launch(Dispatchers.IO) {
+                                    runCatching {
+                                        NativeRuntime.engine().setStreamCacheBudget(SettingsStore.gibToBytes(gib))
+                                    }
+                                }
+                            },
+                            label = { Text("$gib GiB") },
+                        )
+                    }
+                }
+            }
+            // The cache is rebuildable, so it goes without asking. Offline episodes
+            // are a choice the viewer made, so that one asks.
+            SettingAction("Clear streaming cache", "Frees ${formatBytes(state.storage.cacheBytes)}", onClick = onClearCache)
+            SettingAction(
+                "Delete all offline episodes",
+                "${state.storage.offlineCount} " + (if (state.storage.offlineCount == 1uL) "episode" else "episodes") +
+                    " · ${formatBytes(state.storage.offlineBytes)}" +
+                    (
+                        state.storage.partialBytes.takeIf { it > 0uL }
+                            ?.let { " · ${formatBytes(it)} unfinished" }
+                            .orEmpty()
+                        ),
+                enabled = state.storage.offlineCount > 0uL || state.storage.partialBytes > 0uL,
+                onClick = { confirmDelete = true },
+            )
+        }
+        SettingsPage.Appearance -> SettingsSubPage(SettingsPage.Appearance, padding, back) {
+            Column(Modifier.padding(horizontal = 16.dp)) { AppearancePicker(onNamesChanged) }
+        }
+        SettingsPage.Metadata -> SettingsSubPage(SettingsPage.Metadata, padding, back) {
+            SettingAction(
+                "Metadata enrichment",
+                if (state.metadataSettings.enabled) {
+                    "On · ${state.metadataSettings.provider.displayName()} · sends title names to it"
+                } else {
+                    "Off, the privacy default"
+                },
+                onClick = { showMetadata = true },
+            )
+            // Every title looked up again, matched ones included: the way out of a
+            // library the provider answered wrong, which otherwise stays wrong for
+            // as long as the match is remembered.
+            SettingAction(
+                "Match everything again",
+                "Looks every title up again, hand-picked matches excepted",
+                enabled = state.metadataSettings.enabled && !state.refreshing,
+                onClick = onMatchAgain,
+            )
+        }
+        SettingsPage.About -> SettingsSubPage(SettingsPage.About, padding, back) {
+            ListItem(
+                headlineContent = { Text("Proton Stream") },
+                supportingContent = { Text("Version $version") },
+                colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+            )
+            SettingAction("Licence", "GPL-3.0-or-later. Comes with absolutely no warranty.") {
+                legalDocument = LegalDocument("GNU GPL v3", "licenses/GPL-3.0.txt")
+            }
+            SettingAction("Third-party notices", "libmpv, Inter and the other components bundled") {
+                legalDocument = LegalDocument("Third-party notices", "licenses/THIRD_PARTY_NOTICES.md")
+            }
+        }
+    }
+    if (confirmDelete) {
+        AlertDialog(
+            onDismissRequest = { confirmDelete = false },
+            title = { Text("Delete all offline episodes?") },
+            text = {
+                Text(
+                    "${state.storage.offlineCount} episodes (${formatBytes(state.storage.offlineBytes)}) " +
+                        "will be removed from this device. Watch history is kept, and anything " +
+                        "deleted can be downloaded again.",
+                )
+            },
+            confirmButton = {
+                AccentButton(onClick = { confirmDelete = false; onRemoveAllOffline() }) { Text("Delete") }
+            },
+            dismissButton = { TonalButton(onClick = { confirmDelete = false }) { Text("Cancel") } },
+        )
+    }
+    legalDocument?.let { document ->
+        LegalDocumentDialog(document, onDismiss = { legalDocument = null })
+    }
+    if (showMetadata) {
+        MetadataSettingsDialog(
+            current = state.metadataSettings,
+            onDismiss = { showMetadata = false },
+            onSave = { enabled, provider, language, key ->
+                onSaveMetadata(enabled, provider, language, key)
+                showMetadata = false
+            },
+        )
+    }
+}
+
+/** The areas the first page lists, each a page of its own. */
+internal enum class SettingsPage(val title: String, val icon: ImageVector) {
+    Playback("Playback", Icons.Default.PlayCircle),
+    Storage("Downloads and storage", Icons.Default.Storage),
+    Appearance("Appearance", Icons.Default.Palette),
+    Metadata("Metadata", Icons.AutoMirrored.Filled.ManageSearch),
+    About("About", Icons.Default.Info),
+}
+
+/** One area's page: its name, a way back, and its rows. */
+@Composable
+private fun SettingsSubPage(
+    page: SettingsPage,
+    padding: PaddingValues,
+    back: @Composable () -> Unit,
+    rows: @Composable ColumnScope.() -> Unit,
+) {
+    TabPage(page.title, padding, navigationIcon = back) { body ->
+        Column(Modifier.fillMaxSize().padding(body).verticalScroll(rememberScrollState())) {
+            rows()
+            Spacer(Modifier.height(24.dp))
+        }
+    }
+}
+
+/** The installed version, as the launcher and the store show it. */
+@Composable
+private fun appVersion(): String {
+    val context = LocalContext.current
+    return remember {
+        runCatching { context.packageManager.getPackageInfo(context.packageName, 0).versionName }
+            .getOrNull() ?: "unknown"
+    }
+}
+
+/** A switch with its one line of explanation; the whole row toggles it. */
+@Composable
+private fun SettingSwitch(headline: String, supporting: String, checked: Boolean, onChecked: (Boolean) -> Unit) {
+    ListItem(
+        headlineContent = { Text(headline) },
+        supportingContent = { Text(supporting) },
+        trailingContent = { Switch(checked = checked, onCheckedChange = null) },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+        modifier = Modifier.toggleable(value = checked, role = Role.Switch, onValueChange = onChecked),
+    )
+}
+
+/** A row that does something when tapped: opens a dialog, clears a cache. */
+@Composable
+private fun SettingAction(
+    headline: String,
+    supporting: String,
+    enabled: Boolean = true,
+    onClick: () -> Unit,
+) {
+    val colors = ListItemDefaults.colors(containerColor = Color.Transparent)
+    ListItem(
+        headlineContent = { Text(headline) },
+        supportingContent = { Text(supporting) },
+        colors = if (enabled) {
+            colors
+        } else {
+            ListItemDefaults.colors(
+                containerColor = Color.Transparent,
+                headlineColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.38f),
+                supportingColor = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.38f),
+            )
+        },
+        modifier = Modifier.clickable(enabled = enabled, onClick = onClick),
+    )
+}
+
+@Composable
+private fun MetadataSettingsDialog(
+    current: uniffi.pstr_android.MetadataSettingsRecord,
+    onDismiss: () -> Unit,
+    onSave: (Boolean, MetadataProvider, String, String) -> Unit,
+) {
+    var enabled by remember { mutableStateOf(current.enabled) }
+    var provider by remember { mutableStateOf(current.provider) }
+    var language by remember { mutableStateOf(current.language) }
+    var apiKey by remember { mutableStateOf("") }
+    AlertDialog(
+        onDismissRequest = onDismiss,
+        properties = DialogProperties(securePolicy = SecureFlagPolicy.SecureOn),
+        title = { Text("Metadata enrichment") },
+        text = {
+            Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
+                Text("Off by default: enabling sends the titles in your library to a third party, associated with your IP address and subject to their privacy policy. With AniList, the matched ids also go to ani.zip for episode names and wide artwork.")
+                SettingToggle("Enable enrichment", enabled) { enabled = it }
+                Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) {
+                    MetadataProvider.entries.forEach { option ->
+                        if (option == provider) AccentButton(onClick = { provider = option }) { Text(option.displayName()) }
+                        else EdgedButton(onClick = { provider = option }) { Text(option.displayName()) }
+                    }
+                }
+                Text(
+                    if (provider == MetadataProvider.ANI_LIST) "Anime; no account or API key required."
+                    else "Film and television; requires a free TMDB API key.",
+                    style = MaterialTheme.typography.bodySmall,
+                )
+                if (provider == MetadataProvider.TMDB) {
+                    OutlinedTextField(language, { language = it }, label = { Text("Language") }, singleLine = true)
+                    OutlinedTextField(
+                        apiKey,
+                        { apiKey = it },
+                        label = { Text(if (current.ready) "TMDB API key (leave blank to keep)" else "TMDB API key") },
+                        visualTransformation = PasswordVisualTransformation(),
+                        keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
+                        singleLine = true,
+                    )
+                }
+            }
+        },
+        confirmButton = {
+            AccentButton(
+                enabled = !enabled || provider != MetadataProvider.TMDB || current.ready || apiKey.isNotBlank(),
+                onClick = { onSave(enabled, provider, language.ifBlank { "en" }, apiKey) },
+            ) { Text("Save") }
+        },
+        dismissButton = { TonalButton(onClick = onDismiss) { Text("Cancel") } },
+    )
+}
+
+internal fun MetadataProvider.displayName(): String = when (this) {
+    MetadataProvider.ANI_LIST -> "AniList"
+    MetadataProvider.TMDB -> "TMDB"
+}
+
+private data class LegalDocument(val title: String, val assetPath: String)
+
+@Composable
+private fun LegalDocumentDialog(document: LegalDocument, onDismiss: () -> Unit) {
+    val context = LocalContext.current
+    var contents by remember(document.assetPath) { mutableStateOf("Loading…") }
+    LaunchedEffect(document.assetPath) {
+        contents = runCatching {
+            withContext(Dispatchers.IO) {
+                context.assets.open(document.assetPath).bufferedReader().use { it.readText() }
+            }
+        }.getOrElse { error -> "Unable to load this document: ${error.message}" }
+    }
+    AlertDialog(
+        onDismissRequest = onDismiss,
+        title = { Text(document.title) },
+        text = {
+            LazyColumn(Modifier.fillMaxWidth().heightIn(max = 520.dp)) {
+                item { Text(contents, style = MaterialTheme.typography.bodySmall) }
+            }
+        },
+        confirmButton = { AccentButton(onClick = onDismiss) { Text("Close") } },
+    )
+}
+
+@Composable
+internal fun SettingToggle(label: String, checked: Boolean, onChecked: (Boolean) -> Unit) {
+    Row(Modifier.fillMaxWidth().padding(vertical = 14.dp), verticalAlignment = Alignment.CenterVertically) {
+        Text(label, Modifier.weight(1f))
+        Switch(checked = checked, onCheckedChange = onChecked)
+    }
+}
+
+/**
+ * Flavour, accent and gradients — the same three the desktop client offers.
+ *
+ * Every colour is resolved by Rust, so a swatch here is the colour the app will
+ * actually paint rather than an approximation of it, and the choice is stored in
+ * the file both clients read.
+ */
+@Composable
+private fun AppearancePicker(onNamesChanged: () -> Unit) {
+    val scope = rememberCoroutineScope()
+    var choice by remember { mutableStateOf<AppearanceRecord?>(null) }
+    var swatches by remember { mutableStateOf<Map<AccentChoice, Color>>(emptyMap()) }
+
+    suspend fun repaint(next: AppearanceRecord, store: Boolean) {
+        runCatching {
+            withContext(Dispatchers.IO) {
+                val engine = NativeRuntime.engine()
+                if (store) engine.setAppearance(next)
+                val palette = engine.previewPalette(next)
+                // Every accent as it would look in *this* flavour: a swatch row
+                // that keeps Mocha's pastels while Latte is selected is a row
+                // that lies about what the next tap does.
+                val row = AccentChoice.entries.associateWith { accent ->
+                    Color(engine.previewPalette(next.copy(accent = accent)).accent.toInt())
+                }
+                palette to row
+            }
+        }.onSuccess { (palette, row) ->
+            choice = next
+            swatches = row
+            AppearanceState.apply(palette)
+        }
+    }
+
+    LaunchedEffect(Unit) {
+        runCatching { withContext(Dispatchers.IO) { NativeRuntime.engine().appearance() } }
+            .onSuccess { repaint(it, store = false) }
+    }
+
+    val current = choice ?: return
+    Text("Palette", style = MaterialTheme.typography.bodyMedium, modifier = Modifier.padding(top = 8.dp))
+    LazyRow(horizontalArrangement = Arrangement.spacedBy(8.dp), modifier = Modifier.padding(vertical = 8.dp)) {
+        items(FlavorChoice.entries.toList(), key = { it.name }) { flavor ->
+            val selected = flavor == current.flavor
+            if (selected) {
+                AccentButton(onClick = {}) { Text(flavor.label()) }
+            } else {
+                EdgedButton(onClick = {
+                    scope.launch { repaint(current.copy(flavor = flavor), store = true) }
+                }) { Text(flavor.label()) }
+            }
+        }
+    }
+    Text("Accent", style = MaterialTheme.typography.bodyMedium)
+    LazyRow(horizontalArrangement = Arrangement.spacedBy(10.dp), modifier = Modifier.padding(vertical = 8.dp)) {
+        items(AccentChoice.entries.toList(), key = { it.name }) { accent ->
+            val swatch = swatches[accent] ?: MaterialTheme.colorScheme.surfaceVariant
+            Box(
+                Modifier
+                    .size(36.dp)
+                    .clip(CircleShape)
+                    .background(swatch)
+                    .border(
+                        width = if (accent == current.accent) 3.dp else 1.dp,
+                        color = if (accent == current.accent) {
+                            MaterialTheme.colorScheme.onBackground
+                        } else {
+                            MaterialTheme.colorScheme.outline
+                        },
+                        shape = CircleShape,
+                    )
+                    .clickable {
+                        scope.launch { repaint(current.copy(accent = accent), store = true) }
+                    },
+            )
+        }
+    }
+    Text("Title names", style = MaterialTheme.typography.bodyMedium)
+    LazyRow(horizontalArrangement = Arrangement.spacedBy(8.dp), modifier = Modifier.padding(vertical = 8.dp)) {
+        items(TitleNamesChoice.entries.toList(), key = { it.name }) { names ->
+            if (names == current.names) {
+                AccentButton(onClick = {}) { Text(names.label()) }
+            } else {
+                EdgedButton(onClick = {
+                    scope.launch {
+                        repaint(current.copy(names = names), store = true)
+                        onNamesChanged()
+                    }
+                }) { Text(names.label()) }
+            }
+        }
+    }
+    Text(
+        "What a matched title is called. Its other names still find it in search.",
+        style = MaterialTheme.typography.bodySmall,
+        modifier = Modifier.padding(bottom = 8.dp),
+    )
+    SettingToggle("Paint the accent as a gradient", current.gradients) { on ->
+        scope.launch { repaint(current.copy(gradients = on), store = true) }
+    }
+    Text(
+        "Off is the safer setting on a panel that bands: a slow ramp across a wide bar " +
+            "shows every step it is drawn from, and flat is better than striped.",
+        style = MaterialTheme.typography.bodySmall,
+        modifier = Modifier.padding(bottom = 14.dp),
+    )
+}
+
+/** What each name setting is called. The desktop client says the same. */
+private fun TitleNamesChoice.label() = when (this) {
+    TitleNamesChoice.LIBRARY -> "As in the share"
+    TitleNamesChoice.ENGLISH -> "English"
+    TitleNamesChoice.ROMAJI -> "Romaji"
+}
+
+/** What each palette family is called. The desktop client says the same. */
+private fun FlavorChoice.label() = when (this) {
+    FlavorChoice.PROTON -> "Proton"
+    FlavorChoice.LATTE -> "Catppuccin Latte"
+    FlavorChoice.FRAPPE -> "Catppuccin Frappé"
+    FlavorChoice.MACCHIATO -> "Catppuccin Macchiato"
+    FlavorChoice.MOCHA -> "Catppuccin Mocha"
+    FlavorChoice.PERSONA5 -> "Persona 5"
+}

android/app/src/main/java/io/narl/protonstream/ui/SharesScreen.kt

@@ -0,0 +1,325 @@
+package io.narl.protonstream.ui
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.material3.AlertDialog
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.Text
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Refresh
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.input.PasswordVisualTransformation
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.window.DialogProperties
+import androidx.compose.ui.window.SecureFlagPolicy
+import androidx.compose.ui.unit.dp
+import io.narl.protonstream.ui.theme.AccentButton
+import io.narl.protonstream.ui.theme.TonalButton
+import uniffi.pstr_android.AccountState
+import uniffi.pstr_android.ShareRecord
+import androidx.compose.foundation.layout.Box
+import androidx.compose.material3.ExtendedFloatingActionButton
+import androidx.compose.material3.ListItem
+import androidx.compose.material3.ListItemDefaults
+import androidx.compose.material3.DropdownMenu
+import androidx.compose.material3.DropdownMenuItem
+import androidx.compose.material.icons.filled.Add
+import androidx.compose.material.icons.filled.MoreVert
+import androidx.compose.material.icons.filled.Key
+import androidx.compose.material.icons.filled.Delete
+import androidx.compose.material.icons.filled.FolderShared
+import androidx.compose.ui.graphics.Color
+
+@Composable
+internal fun SharesScreen(
+    shares: List<ShareRecord>,
+    onAdd: (String, String, String?) -> Unit,
+    onRepair: (String, String, String?) -> Unit,
+    onRefresh: (String) -> Unit,
+    onRemove: (String) -> Unit,
+    incomingLink: String?,
+    onIncomingLinkTaken: () -> Unit,
+    padding: PaddingValues,
+    account: AccountUiState = AccountUiState(),
+    accountActions: AccountActions? = null,
+) {
+    var showAdd by remember { mutableStateOf(false) }
+    var signingIn by remember { mutableStateOf(false) }
+    var browsing by remember { mutableStateOf(false) }
+    var repairing by remember { mutableStateOf<ShareRecord?>(null) }
+    var removing by remember { mutableStateOf<ShareRecord?>(null) }
+    TabPage("Shares", padding) { body ->
+        Box(Modifier.fillMaxSize().padding(body)) {
+            if (shares.isEmpty() && account.state == null) {
+                EmptyState("No shares yet", "Add a Proton Drive public link to build your library.")
+            } else {
+                LazyColumn(contentPadding = PaddingValues(top = 8.dp, bottom = 96.dp)) {
+                    if (accountActions != null) {
+                        item(key = "account") {
+                            AccountCard(
+                                account,
+                                accountActions,
+                                onSignIn = { signingIn = true },
+                                onBrowse = { browsing = true },
+                            )
+                        }
+                    }
+                    if (shares.isEmpty()) {
+                        item(key = "empty") {
+                            Text(
+                                "No shares yet. Add a public link, or a folder of your Drive once signed in.",
+                                style = MaterialTheme.typography.bodyMedium,
+                                color = MaterialTheme.colorScheme.onSurfaceVariant,
+                                modifier = Modifier.padding(16.dp),
+                            )
+                        }
+                    }
+                    items(shares, key = { it.id }) { share ->
+                        ShareRow(
+                            share = share,
+                            onRefresh = { onRefresh(share.id) },
+                            onRepair = { repairing = share },
+                            onRemove = { removing = share },
+                        )
+                    }
+                }
+            }
+            // Where a thumb is, and the one thing this page is for. The share
+            // sheet and a tapped link land in the same form.
+            ExtendedFloatingActionButton(
+                onClick = { showAdd = true },
+                icon = { Icon(Icons.Default.Add, contentDescription = null) },
+                text = { Text("Add share") },
+                containerColor = MaterialTheme.colorScheme.primary,
+                contentColor = MaterialTheme.colorScheme.onPrimary,
+                modifier = Modifier.align(Alignment.BottomEnd).padding(16.dp),
+            )
+        }
+    }
+    if (showAdd || incomingLink != null) {
+        AddShareDialog(
+            initialUrl = incomingLink.orEmpty(),
+            onDismiss = { showAdd = false; onIncomingLinkTaken() },
+            onAdd = onAdd,
+        )
+    }
+    if (accountActions != null && (signingIn || account.state == AccountState.SecondFactor ||
+            account.state == AccountState.MailboxPassword)
+    ) {
+        SignInDialog(account, accountActions, onDismiss = { signingIn = false })
+    }
+    if (accountActions != null && browsing) {
+        DriveBrowserDialog(accountActions, onDismiss = { browsing = false })
+    }
+    repairing?.let { share ->
+        RepairShareDialog(
+            share = share,
+            onDismiss = { repairing = null },
+            onRepair = { url, password -> onRepair(share.id, url, password) },
+        )
+    }
+    removing?.let { share ->
+        // Asked, because it cannot be undone: the link's secret and its
+        // offline files go. Watch positions stay (`Catalog::remove_share`).
+        AlertDialog(
+            onDismissRequest = { removing = null },
+            title = { Text("Remove ${share.name}?") },
+            text = {
+                Text(
+                    "Its titles leave the library and its offline episodes are deleted. " +
+                        "Watch progress is kept, so adding the link again picks up where you left off.",
+                )
+            },
+            confirmButton = {
+                AccentButton(onClick = { removing = null; onRemove(share.id) }) { Text("Remove") }
+            },
+            dismissButton = { TonalButton(onClick = { removing = null }) { Text("Cancel") } },
+        )
+    }
+}
+
+/**
+ * One share: its name, how it is unlocked, and its actions behind a menu.
+ *
+ * Three differently styled controls beside the name squeezed it into a column
+ * a word wide; one icon leaves the row its width.
+ */
+@Composable
+private fun ShareRow(
+    share: ShareRecord,
+    onRefresh: () -> Unit,
+    onRepair: () -> Unit,
+    onRemove: () -> Unit,
+) {
+    var menu by remember { mutableStateOf(false) }
+    ListItem(
+        headlineContent = { Text(share.name, fontWeight = FontWeight.SemiBold) },
+        supportingContent = {
+            Text(
+                when {
+                    share.fromAccount -> "Folder of your Drive"
+                    share.hasCustomPassword -> "Link and custom password, stored securely"
+                    else -> "Public link"
+                },
+            )
+        },
+        leadingContent = {
+            Icon(
+                Icons.Default.FolderShared,
+                contentDescription = null,
+                tint = MaterialTheme.colorScheme.primary,
+            )
+        },
+        trailingContent = {
+            Box {
+                IconButton(onClick = { menu = true }) {
+                    Icon(Icons.Default.MoreVert, contentDescription = "Actions for ${share.name}")
+                }
+                DropdownMenu(expanded = menu, onDismissRequest = { menu = false }) {
+                    // One share, not the library: a link that has just had files
+                    // added should not cost a walk of every other one.
+                    DropdownMenuItem(
+                        text = { Text("Refresh") },
+                        leadingIcon = { Icon(Icons.Default.Refresh, contentDescription = null) },
+                        onClick = { menu = false; onRefresh() },
+                    )
+                    // Not a remove: a share whose secret has become unreadable
+                    // cannot be removed either, since removal deletes a secret
+                    // the store can no longer touch.
+                    if (!share.fromAccount) {
+                        DropdownMenuItem(
+                            text = { Text("Re-enter link") },
+                            leadingIcon = { Icon(Icons.Default.Key, contentDescription = null) },
+                            onClick = { menu = false; onRepair() },
+                        )
+                    }
+                    DropdownMenuItem(
+                        text = { Text("Remove") },
+                        leadingIcon = { Icon(Icons.Default.Delete, contentDescription = null) },
+                        onClick = { menu = false; onRemove() },
+                    )
+                }
+            }
+        },
+        colors = ListItemDefaults.colors(containerColor = Color.Transparent),
+    )
+}
+
+/**
+ * Re-enter the link for a share the app can no longer decrypt its secret for.
+ *
+ * It has to be the *same* link — a different token is a different share, and
+ * repointing this one at it would leave every catalog row and every offline file
+ * describing something that is not there. Rust enforces that; this only says so.
+ */
+@Composable
+private fun RepairShareDialog(
+    share: ShareRecord,
+    onDismiss: () -> Unit,
+    onRepair: (String, String?) -> Unit,
+) {
+    var url by remember { mutableStateOf("") }
+    var password by remember { mutableStateOf("") }
+    AlertDialog(
+        onDismissRequest = onDismiss,
+        properties = DialogProperties(securePolicy = SecureFlagPolicy.SecureOn),
+        title = { Text("Re-enter link for ${share.name}") },
+        text = {
+            Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
+                Text(
+                    "The stored credentials for this share cannot be read — usually after a " +
+                        "screen-lock change or a device restore. Entering the same link again " +
+                        "restores access without losing the library or anything downloaded.",
+                    style = MaterialTheme.typography.bodySmall,
+                )
+                OutlinedTextField(
+                    url,
+                    { url = it },
+                    label = { Text("Public share URL") },
+                    singleLine = true,
+                    visualTransformation = PasswordVisualTransformation(),
+                    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
+                )
+                OutlinedTextField(
+                    password,
+                    { password = it },
+                    label = { Text("Custom password (optional)") },
+                    singleLine = true,
+                    visualTransformation = PasswordVisualTransformation(),
+                    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
+                )
+            }
+        },
+        confirmButton = {
+            AccentButton(
+                onClick = { onRepair(url.trim(), password); onDismiss() },
+                enabled = url.isNotBlank(),
+            ) { Text("Restore") }
+        },
+        dismissButton = { TonalButton(onClick = onDismiss) { Text("Cancel") } },
+    )
+}
+
+@Composable
+private fun AddShareDialog(
+    initialUrl: String,
+    onDismiss: () -> Unit,
+    onAdd: (String, String, String?) -> Unit,
+) {
+    var name by remember { mutableStateOf("") }
+    var url by remember(initialUrl) { mutableStateOf(initialUrl) }
+    var password by remember { mutableStateOf("") }
+    AlertDialog(
+        onDismissRequest = onDismiss,
+        properties = DialogProperties(securePolicy = SecureFlagPolicy.SecureOn),
+        title = { Text("Add Proton Drive share") },
+        text = {
+            Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
+                OutlinedTextField(name, { name = it }, label = { Text("Library name") }, singleLine = true)
+                OutlinedTextField(
+                    url,
+                    { url = it },
+                    label = { Text("Public share URL") },
+                    singleLine = true,
+                    // The URL fragment is a secret. Password input disables
+                    // IME learning/suggestions while normal long-press paste
+                    // remains available.
+                    visualTransformation = PasswordVisualTransformation(),
+                    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
+                )
+                OutlinedTextField(
+                    password,
+                    { password = it },
+                    label = { Text("Custom password (optional)") },
+                    singleLine = true,
+                    visualTransformation = PasswordVisualTransformation(),
+                    keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
+                )
+            }
+        },
+        confirmButton = {
+            AccentButton(
+                onClick = { onAdd(name.trim(), url.trim(), password); onDismiss() },
+                enabled = name.isNotBlank() && url.isNotBlank(),
+            ) { Text("Add") }
+        },
+        dismissButton = { TonalButton(onClick = onDismiss) { Text("Cancel") } },
+    )
+}

android/app/src/main/java/io/narl/protonstream/ui/TitleScreen.kt

@@ -0,0 +1,717 @@
+package io.narl.protonstream.ui
+
+import android.content.Intent
+import androidx.activity.compose.PredictiveBackHandler
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.runtime.mutableFloatStateOf
+import androidx.compose.ui.graphics.graphicsLayer
+import kotlin.coroutines.cancellation.CancellationException
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.heightIn
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.BoxWithConstraints
+import androidx.compose.foundation.layout.statusBarsPadding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.lazy.items
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.grid.items
+import androidx.compose.material3.AlertDialog
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.OutlinedTextField
+import androidx.compose.material3.Text
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.CheckCircle
+import androidx.compose.material.icons.outlined.CheckCircle
+import androidx.compose.material.icons.filled.Download
+import androidx.compose.material.icons.filled.Edit
+import androidx.compose.material.icons.filled.Pause
+import androidx.compose.material.icons.filled.PlayArrow
+import androidx.compose.material.icons.automirrored.filled.ArrowBack
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.runtime.setValue
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+import androidx.core.net.toUri
+import androidx.work.WorkManager
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
+import kotlinx.coroutines.withContext
+import io.narl.protonstream.download.DownloadCoordinator
+import io.narl.protonstream.download.DownloadStateStore
+import io.narl.protonstream.download.RetainedDownload
+import io.narl.protonstream.native.NativeRuntime
+import io.narl.protonstream.ui.theme.AccentButton
+import io.narl.protonstream.ui.theme.AccentProgress
+import io.narl.protonstream.ui.theme.EdgedButton
+import io.narl.protonstream.ui.theme.QuietButton
+import io.narl.protonstream.ui.theme.TonalButton
+import io.narl.protonstream.ui.theme.solid
+import androidx.compose.foundation.border
+import uniffi.pstr_android.TitleRecord
+import uniffi.pstr_android.TitleType
+import uniffi.pstr_android.EpisodeRecord
+import uniffi.pstr_android.SeasonRecord
+import uniffi.pstr_android.MatchRecord
+import androidx.compose.foundation.lazy.LazyRow
+import androidx.compose.material3.FilterChip
+import androidx.compose.material.icons.filled.Replay
+import androidx.compose.material.icons.filled.DownloadDone
+import androidx.compose.material.icons.automirrored.filled.OpenInNew
+import androidx.compose.ui.graphics.Brush
+import androidx.compose.ui.graphics.vector.ImageVector
+
+@Composable
+internal fun TitleScreen(
+    title: TitleRecord,
+    playerReady: Boolean,
+    onPlay: (List<EpisodeRecord>, Int) -> Unit,
+    onBack: () -> Unit,
+    onPreferenceError: (Throwable) -> Unit,
+    onMetadataChanged: () -> Unit,
+    onSetWatched: (EpisodeRecord, Boolean) -> Unit,
+    padding: PaddingValues,
+    /** Every title of its franchise, in release order, this one included. */
+    franchise: List<TitleRecord> = emptyList(),
+    onOpenTitle: (TitleRecord) -> Unit = {},
+) {
+    val context = LocalContext.current
+    var showMatch by remember(title.key) { mutableStateOf(false) }
+    var overviewOpen by remember(title.key) { mutableStateOf(false) }
+
+    // Predictive back: the page shrinks towards the library as the gesture
+    // is dragged, and springs back if it is let go of, so the viewer sees
+    // where back goes before committing to it.
+    var backProgress by remember { mutableFloatStateOf(0f) }
+    PredictiveBackHandler { gesture ->
+        try {
+            gesture.collect { backProgress = it.progress }
+            onBack()
+        } catch (cancelled: CancellationException) {
+            backProgress = 0f
+            throw cancelled
+        }
+    }
+
+    // Display order across seasons: what previous/next and autoplay walk, and
+    // the same order the desktop client uses.
+    val playlist = remember(title) { title.seasons.flatMap(SeasonRecord::episodes) }
+    val nextUp = remember(playlist) { nextUpIndex(playlist) }
+    val upNext = playlist.getOrNull(nextUp)
+    // One season on screen at a time, opened on the one Play would land in: a
+    // forty-episode show as stacked sections is one long scroll to the part
+    // that matters.
+    var seasonIndex by remember(title.key) {
+        mutableStateOf(
+            title.seasons.indexOfFirst { season -> season.episodes.any { it.linkId == upNext?.linkId } }
+                .coerceAtLeast(0),
+        )
+    }
+    val season = title.seasons.getOrNull(seasonIndex)
+    // Live download state per episode, so a row can show progress and be paused
+    // without a trip to the Downloads tab.
+    val work by WorkManager.getInstance(context)
+        .getWorkInfosByTagLiveData(DownloadCoordinator.TAG).observeAsState(emptyList())
+    val downloads = remember(work) { DownloadStateStore(context).records() }
+
+    // On a tablet the page keeps a phone's reading width, centred: a Play
+    // button and synopsis lines two thousand pixels wide are read by turning
+    // the head. The backdrop still spans the window, but no taller than about
+    // half of it, or a landscape tablet opened on a picture and nothing else.
+    BoxWithConstraints(
+        Modifier
+            .fillMaxSize()
+            .graphicsLayer {
+                val scale = 1f - 0.1f * backProgress
+                scaleX = scale
+                scaleY = scale
+                shape = RoundedCornerShape((32 * backProgress).dp)
+                clip = backProgress > 0f
+            }
+            .padding(padding),
+    ) {
+        val side = ((maxWidth - READABLE_WIDTH) / 2).coerceAtLeast(0.dp)
+        val backdropHeight = minOf(maxWidth * 9f / 16f, maxHeight * 0.55f)
+        LazyColumn(
+            modifier = Modifier.fillMaxSize(),
+            contentPadding = PaddingValues(bottom = 24.dp),
+            verticalArrangement = Arrangement.spacedBy(8.dp),
+        ) {
+            item(key = "backdrop") {
+                // Edge to edge, fading into the page: the art is the first thing
+                // the page says, and a framed thumbnail with a margin round it read
+                // as one card among the many below it.
+                Box(Modifier.sharedArt(title.key).fillMaxWidth().height(backdropHeight)) {
+                    RemoteArtwork(
+                        title.backdropUrl ?: title.posterUrl,
+                        title.displayName,
+                        Modifier.fillMaxSize(),
+                        fallback = title.thumbnailSource,
+                        labelled = false,
+                    )
+                    Box(
+                        Modifier.fillMaxSize().background(
+                            Brush.verticalGradient(
+                                0.45f to Color.Transparent,
+                                1f to MaterialTheme.colorScheme.background,
+                            ),
+                        ),
+                    )
+                    IconButton(
+                        onClick = onBack,
+                        modifier = Modifier
+                            .statusBarsPadding()
+                            .padding(8.dp)
+                            .clip(CircleShape)
+                            .background(Color.Black.copy(alpha = 0.4f)),
+                    ) {
+                        Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back to library", tint = Color.White)
+                    }
+                }
+            }
+            item(key = "heading") {
+                Column(Modifier.padding(horizontal = side + 16.dp)) {
+                    Text(title.displayName, style = MaterialTheme.typography.headlineMedium)
+                    // The other names it goes by: the share's when the shown one
+                    // is the provider's, and the original-language one.
+                    listOfNotNull(
+                        title.name.takeIf { it != title.displayName },
+                        title.originalName?.takeIf { it != title.displayName && it != title.canonicalName },
+                    ).joinToString("  ·  ").takeIf(String::isNotEmpty)?.let {
+                        Text(it, style = MaterialTheme.typography.bodyMedium, color = MaterialTheme.colorScheme.onSurfaceVariant)
+                    }
+                    Text(
+                        listOfNotNull(
+                            title.formatLabel,
+                            title.seasonLabel ?: (title.metadataYear ?: title.year)?.toString(),
+                            title.rating?.let { "★ %.1f".format(it) },
+                            "${title.watchedCount} of ${title.episodeCount} watched".takeIf { title.episodeCount > 1uL },
+                        ).joinToString("  ·  "),
+                        style = MaterialTheme.typography.bodySmall,
+                        color = MaterialTheme.colorScheme.onSurfaceVariant,
+                        modifier = Modifier.padding(top = 6.dp),
+                    )
+                    // Who made it, and whether more is coming — the desktop's
+                    // line of facts, on a line of its own so neither wraps.
+                    listOfNotNull(
+                        title.studios.takeIf { it.isNotEmpty() }?.take(2)?.joinToString(", "),
+                        title.directors.firstOrNull()?.let { "dir. $it" },
+                        airingNote(title),
+                    ).joinToString("  ·  ").takeIf(String::isNotEmpty)?.let {
+                        Text(
+                            it,
+                            style = MaterialTheme.typography.bodySmall,
+                            color = MaterialTheme.colorScheme.onSurfaceVariant,
+                            modifier = Modifier.padding(top = 2.dp),
+                        )
+                    }
+                    // The one thing the page is for, full width and naming what it
+                    // will play: "Resume" alone left the viewer guessing which
+                    // episode of forty it meant.
+                    AccentButton(
+                        onClick = { onPlay(playlist, nextUp) },
+                        enabled = playerReady && playlist.isNotEmpty(),
+                        modifier = Modifier.fillMaxWidth().padding(top = 16.dp),
+                    ) {
+                        Icon(Icons.Default.PlayArrow, contentDescription = null, modifier = Modifier.size(20.dp))
+                        Spacer(Modifier.width(8.dp))
+                        Text(
+                            when {
+                                !playerReady -> "Player loading…"
+                                upNext == null -> "Play"
+                                upNext.resumeAt != null -> "Resume ${upNext.label}"
+                                title.watchedCount > 0uL -> "Continue with ${upNext.label}"
+                                playlist.size == 1 -> "Play"
+                                else -> "Play ${upNext.label}"
+                            },
+                            maxLines = 1,
+                            overflow = TextOverflow.Ellipsis,
+                        )
+                    }
+                    // Everything else as labelled icons in one row: four actions of
+                    // three button styles used to wrap over three lines and bury
+                    // the episodes under them.
+                    Row(Modifier.fillMaxWidth().padding(top = 12.dp)) {
+                        // Only where it would do something different: an unstarted
+                        // show already starts at the beginning.
+                        if (upNext?.resumeAt != null || title.watchedCount > 0uL) {
+                            TitleAction(Icons.Default.Replay, "Start over", Modifier.weight(1f), enabled = playerReady) {
+                                onPlay(playlist, 0)
+                            }
+                        }
+                        TitleAction(Icons.Default.Download, "Download", Modifier.weight(1f)) {
+                            DownloadCoordinator.enqueue(context, playlist)
+                        }
+                        TitleAction(Icons.Default.Edit, "Match", Modifier.weight(1f)) { showMatch = true }
+                        // The provider's own page for this title: where a viewer goes
+                        // to check that the thing the app matched is what they have.
+                        title.externalUrl?.let { url ->
+                            TitleAction(
+                                Icons.AutoMirrored.Filled.OpenInNew,
+                                title.metadataProvider?.displayName() ?: "Provider",
+                                Modifier.weight(1f),
+                            ) {
+                                runCatching {
+                                    context.startActivity(Intent(Intent.ACTION_VIEW, url.toUri()))
+                                }.onFailure(onPreferenceError)
+                            }
+                        }
+                    }
+                    title.overview?.let { overview ->
+                        // Three lines, then a tap for the rest: a synopsis with its
+                        // source notes ran to a screen and a half on a phone.
+                        Text(
+                            overview.trim(),
+                            maxLines = if (overviewOpen) Int.MAX_VALUE else 3,
+                            overflow = TextOverflow.Ellipsis,
+                            modifier = Modifier
+                                .padding(top = 12.dp)
+                                .clickable { overviewOpen = !overviewOpen },
+                        )
+                    }
+                    // Genres as chips, then the provider's tags quieter after
+                    // them: a tag is its community describing it, not what it
+                    // is filed as.
+                    if (title.genres.isNotEmpty() || title.tags.isNotEmpty()) {
+                        Text(
+                            (title.genres + title.tags.take(4)).joinToString("  ·  "),
+                            style = MaterialTheme.typography.labelMedium,
+                            color = MaterialTheme.colorScheme.onSurfaceVariant,
+                            modifier = Modifier.padding(top = 10.dp),
+                        )
+                    }
+                    // Said plainly, because it changes what a re-match will do: a
+                    // hand-picked match is not overwritten by an automatic pass.
+                    if (title.manualMatch) {
+                        Text(
+                            "Matched by hand",
+                            style = MaterialTheme.typography.labelMedium,
+                            color = MaterialTheme.colorScheme.onSurfaceVariant,
+                            modifier = Modifier.padding(top = 8.dp),
+                        )
+                    }
+                }
+            }
+            if (franchise.size > 1) {
+                item(key = "franchise") {
+                    Column(Modifier.padding(top = 12.dp)) {
+                        Text(
+                            "In this franchise",
+                            style = MaterialTheme.typography.titleMedium,
+                            modifier = Modifier.padding(horizontal = side + 16.dp),
+                        )
+                        LazyRow(
+                            horizontalArrangement = Arrangement.spacedBy(12.dp),
+                            contentPadding = PaddingValues(start = side + 16.dp, end = side + 16.dp, top = 10.dp),
+                        ) {
+                            items(franchise, key = { it.key }) { member ->
+                                FranchiseTile(member, here = member.key == title.key) { onOpenTitle(member) }
+                            }
+                        }
+                    }
+                }
+            }
+            item(key = "seasons") {
+                Row(
+                    Modifier.fillMaxWidth().padding(start = side + 16.dp, end = side + 4.dp, top = 12.dp),
+                    verticalAlignment = Alignment.CenterVertically,
+                ) {
+                    LazyRow(Modifier.weight(1f), horizontalArrangement = Arrangement.spacedBy(8.dp)) {
+                        itemsIndexed(title.seasons, key = { _, it -> it.label }) { index, entry ->
+                            FilterChip(
+                                selected = index == seasonIndex,
+                                onClick = { seasonIndex = index },
+                                label = { Text(entry.label) },
+                            )
+                        }
+                    }
+                    season?.let {
+                        IconButton(onClick = { DownloadCoordinator.enqueue(context, it.episodes) }) {
+                            Icon(Icons.Default.Download, contentDescription = "Download ${it.label}")
+                        }
+                    }
+                }
+            }
+            season?.let { shown ->
+                itemsIndexed(shown.episodes, key = { _, it -> it.linkId }) { position, episode ->
+                    Box(Modifier.padding(horizontal = side)) {
+                        EpisodeRow(
+                            episode = episode,
+                            numbering = episode.numbering(shown.number, position),
+                            position = position,
+                            download = downloads.firstOrNull {
+                                it.shareId == episode.shareId && it.linkId == episode.linkId
+                            },
+                            playerReady = playerReady,
+                            onPlay = { onPlay(playlist, playlist.indexOfFirst { it.linkId == episode.linkId }) },
+                            onDownload = { DownloadCoordinator.enqueue(context, episode) },
+                            onPause = { DownloadCoordinator.pause(context, it) },
+                            onResume = { DownloadCoordinator.resume(context, it) },
+                            onSetWatched = { onSetWatched(episode, it) },
+                        )
+                    }
+                }
+            }
+        }
+    }
+    if (showMatch) {
+        ChangeMatchDialog(
+            title = title,
+            onDismiss = { showMatch = false },
+            onChanged = { showMatch = false; onMetadataChanged() },
+            onError = onPreferenceError,
+        )
+    }
+}
+
+/**
+ * One part of the franchise: its cover, what it is and when. This title's own
+ * is marked rather than left out, so the row says where it sits in the story.
+ */
+@Composable
+private fun FranchiseTile(title: TitleRecord, here: Boolean, onClick: () -> Unit) {
+    Column(
+        Modifier
+            .width(96.dp)
+            .clip(MaterialTheme.shapes.medium)
+            .clickable(enabled = !here, onClick = onClick),
+    ) {
+        RemoteArtwork(
+            title.posterUrl ?: title.backdropUrl,
+            title.displayName,
+            Modifier
+                .fillMaxWidth()
+                .aspectRatio(2f / 3f)
+                .clip(MaterialTheme.shapes.medium)
+                .then(
+                    if (here) {
+                        Modifier.border(2.dp, MaterialTheme.colorScheme.primary, MaterialTheme.shapes.medium)
+                    } else {
+                        Modifier
+                    },
+                ),
+            fallback = title.thumbnailSource,
+        )
+        Text(
+            title.displayName,
+            style = MaterialTheme.typography.labelMedium,
+            fontWeight = if (here) FontWeight.SemiBold else null,
+            maxLines = 2,
+            overflow = TextOverflow.Ellipsis,
+            modifier = Modifier.padding(top = 6.dp),
+        )
+        Text(
+            listOfNotNull(
+                title.formatLabel ?: if (title.kind == TitleType.FILM) "Film" else "Series",
+                (title.metadataYear ?: title.year)?.toString(),
+            ).joinToString(" · "),
+            style = MaterialTheme.typography.labelSmall,
+            color = MaterialTheme.colorScheme.onSurfaceVariant,
+            maxLines = 1,
+        )
+    }
+}
+
+/**
+ * "Episode 7 on Sat 11 Oct" while one is due, "Airing" while it is airing with
+ * no date yet, else nothing.
+ */
+private fun airingNote(title: TitleRecord): String? {
+    val at = title.nextAiringAt
+    val episode = title.nextEpisode
+    if (at != null && episode != null) {
+        val day = java.time.Instant.ofEpochSecond(at).atZone(java.time.ZoneId.systemDefault())
+        return "episode $episode on " + day.format(java.time.format.DateTimeFormatter.ofPattern("EEE d MMM"))
+    }
+    return if (title.airing) "airing" else null
+}
+
+/** How wide the page's text and controls run on a window wider than a phone. */
+private val READABLE_WIDTH = 720.dp
+
+/** One of the title's secondary actions: an icon with its name under it. */
+@Composable
+private fun TitleAction(
+    icon: ImageVector,
+    label: String,
+    modifier: Modifier = Modifier,
+    enabled: Boolean = true,
+    onClick: () -> Unit,
+) {
+    Column(
+        modifier
+            .clip(MaterialTheme.shapes.medium)
+            .clickable(enabled = enabled, onClick = onClick)
+            .padding(vertical = 8.dp),
+        horizontalAlignment = Alignment.CenterHorizontally,
+    ) {
+        Icon(icon, contentDescription = null)
+        Text(
+            label,
+            style = MaterialTheme.typography.labelMedium,
+            maxLines = 1,
+            overflow = TextOverflow.Ellipsis,
+            modifier = Modifier.padding(top = 4.dp),
+        )
+    }
+}
+
+/**
+ * `S03E38`, `E38`, or the row's place in the season.
+ *
+ * Mirrors `Episode::numbering` in `pstr-core`, plus the desktop client's
+ * fallback to the season folder's number. The last case is deliberately *not*
+ * printed as an episode number — nothing in the name numbered this file, and
+ * `#4` says "fourth in the list" where `E04` would be a claim about the show.
+ * Some ordinal is required regardless: a season of rows that all read the same
+ * is a season the viewer cannot navigate at all.
+ */
+private fun EpisodeRecord.numbering(fallbackSeason: UInt?, position: Int): String {
+    val season = this.season ?: fallbackSeason
+    val number = this.number
+    return when {
+        season != null && number != null -> "S%02dE%02d".format(season.toInt(), number.toInt())
+        number != null -> "E%02d".format(number.toInt())
+        else -> "#${position + 1}"
+    }
+}
+
+/**
+ * One episode: play it, see where it was left, and drive its download.
+ *
+ * The row *is* the play button — the still, the number and the name are one
+ * target, which is what lets the trailing controls be two icons in a fixed
+ * column rather than a second row of buttons under every episode.
+ */
+@Composable
+private fun EpisodeRow(
+    episode: EpisodeRecord,
+    numbering: String,
+    position: Int,
+    download: RetainedDownload?,
+    playerReady: Boolean,
+    onPlay: () -> Unit,
+    onDownload: () -> Unit,
+    onPause: (RetainedDownload) -> Unit,
+    onResume: (RetainedDownload) -> Unit,
+    onSetWatched: (Boolean) -> Unit,
+) {
+    val running = download?.status == RetainedDownload.STATUS_RUNNING ||
+        download?.status == RetainedDownload.STATUS_QUEUED
+    val heading = episode.heading(position)
+    Column(
+        Modifier
+            .fillMaxWidth()
+            .clickable(enabled = playerReady, onClick = onPlay)
+            .padding(horizontal = 16.dp, vertical = 6.dp),
+    ) {
+        Row(verticalAlignment = Alignment.CenterVertically) {
+            // With metadata off the provider has no still, and Proton's own
+            // thumbnail is a frame of this very episode. Where it was left sits
+            // on the still's lower edge, the way every streaming app shows it.
+            Box(
+                Modifier
+                    .width(128.dp)
+                    .aspectRatio(16f / 9f)
+                    .clip(MaterialTheme.shapes.small),
+                contentAlignment = Alignment.Center,
+            ) {
+                RemoteArtwork(
+                    episode.stillUrl,
+                    heading,
+                    Modifier.fillMaxSize(),
+                    fallback = episode.thumbnailSource,
+                    labelled = false,
+                )
+                episode.progress?.takeIf { !episode.watched }?.let { progress ->
+                    AccentProgress(
+                        progress = { progress.toFloat().coerceIn(0f, 1f) },
+                        modifier = Modifier.fillMaxWidth().align(Alignment.BottomCenter),
+                    )
+                }
+            }
+            Column(Modifier.weight(1f).padding(horizontal = 12.dp)) {
+                Text(
+                    heading,
+                    style = MaterialTheme.typography.titleSmall,
+                    // Seen episodes stay legible but stop competing with the
+                    // one the viewer has not watched yet.
+                    color = if (episode.watched) {
+                        MaterialTheme.colorScheme.onSurfaceVariant
+                    } else {
+                        MaterialTheme.colorScheme.onSurface
+                    },
+                    maxLines = 2,
+                    overflow = TextOverflow.Ellipsis,
+                )
+                Text(
+                    listOfNotNull(
+                        numbering,
+                        episode.size?.let(::formatBytes),
+                        episode.airDate,
+                    ).joinToString(" · "),
+                    style = MaterialTheme.typography.bodySmall,
+                    color = MaterialTheme.colorScheme.onSurfaceVariant,
+                    maxLines = 1,
+                    overflow = TextOverflow.Ellipsis,
+                    modifier = Modifier.padding(top = 2.dp),
+                )
+            }
+            // Watched is a judgement the viewer is allowed to overrule: a
+            // half-watched episode they are done with, or one the 90 % rule
+            // marked seen because they sat through the credits.
+            IconButton(onClick = { onSetWatched(!episode.watched) }) {
+                Icon(
+                    if (episode.watched) Icons.Default.CheckCircle else Icons.Outlined.CheckCircle,
+                    contentDescription = if (episode.watched) "Mark unwatched" else "Mark watched",
+                    tint = if (episode.watched) {
+                        MaterialTheme.colorScheme.primary
+                    } else {
+                        MaterialTheme.colorScheme.outline
+                    },
+                )
+            }
+            // One slot, always the same width, whatever state the download
+            // is in — including "there is nothing to say", where an empty
+            // box keeps the rows above and below it aligned.
+            Box(Modifier.size(48.dp), contentAlignment = Alignment.Center) {
+                when {
+                    episode.offline -> Icon(
+                        Icons.Default.DownloadDone,
+                        contentDescription = "Saved offline",
+                        tint = MaterialTheme.colorScheme.tertiary,
+                    )
+                    running -> IconButton(onClick = { onPause(download!!) }) {
+                        Icon(Icons.Default.Pause, contentDescription = "Pause download")
+                    }
+                    download != null -> IconButton(onClick = { onResume(download) }) {
+                        Icon(Icons.Default.Download, contentDescription = "Resume download")
+                    }
+                    else -> IconButton(onClick = onDownload) {
+                        Icon(Icons.Default.Download, contentDescription = "Download")
+                    }
+                }
+            }
+        }
+        episode.providerOverview?.let {
+            Text(
+                it,
+                style = MaterialTheme.typography.bodySmall,
+                color = MaterialTheme.colorScheme.onSurfaceVariant,
+                maxLines = 2,
+                overflow = TextOverflow.Ellipsis,
+                modifier = Modifier.padding(top = 6.dp),
+            )
+        }
+        download?.takeIf { it.total > 0L && !episode.offline }?.let { active ->
+            AccentProgress(
+                progress = { (active.downloaded.toFloat() / active.total).coerceIn(0f, 1f) },
+                modifier = Modifier.fillMaxWidth().padding(top = 8.dp),
+                fill = solid(MaterialTheme.colorScheme.tertiary),
+            )
+            Text(
+                downloadStatusLine(active),
+                style = MaterialTheme.typography.bodySmall,
+                color = MaterialTheme.colorScheme.onSurfaceVariant,
+            )
+        }
+    }
+}
+
+@Composable
+internal fun ChangeMatchDialog(
+    title: TitleRecord,
+    onDismiss: () -> Unit,
+    onChanged: () -> Unit,
+    onError: (Throwable) -> Unit,
+) {
+    var term by remember(title.key) { mutableStateOf(title.canonicalName ?: title.name) }
+    var searching by remember { mutableStateOf(false) }
+    // Choosing fetches the entry's episodes too, which is a few requests.
+    var choosing by remember { mutableStateOf(false) }
+    var options by remember { mutableStateOf<List<MatchRecord>>(emptyList()) }
+    val scope = rememberCoroutineScope()
+    AlertDialog(
+        onDismissRequest = onDismiss,
+        title = { Text("Change match") },
+        text = {
+            Column {
+                Text("Search the configured metadata provider. Nothing is stored until you choose an entry.")
+                OutlinedTextField(term, { term = it }, Modifier.fillMaxWidth().padding(vertical = 8.dp), singleLine = true)
+                AccentButton(enabled = term.isNotBlank() && !searching, onClick = {
+                    searching = true
+                    scope.launch {
+                        runCatching {
+                            withContext(Dispatchers.IO) { NativeRuntime.engine().searchMatches(title.key, term) }
+                        }.onSuccess { options = it }.onFailure(onError)
+                        searching = false
+                    }
+                }) { Text(if (searching) "Searching…" else "Search") }
+                if (choosing) {
+                    Text(
+                        "Fetching its episodes…",
+                        style = MaterialTheme.typography.bodySmall,
+                        modifier = Modifier.padding(top = 8.dp),
+                    )
+                }
+                LazyColumn(Modifier.fillMaxWidth().heightIn(max = 300.dp)) {
+                    items(options, key = { "${it.provider}:${it.remoteId}" }) { option ->
+                        EdgedButton(
+                            onClick = {
+                                choosing = true
+                                scope.launch {
+                                    runCatching {
+                                        withContext(Dispatchers.IO) { NativeRuntime.engine().chooseMatch(title.key, option) }
+                                    }.onSuccess { onChanged() }.onFailure(onError)
+                                    choosing = false
+                                }
+                            },
+                            enabled = !choosing,
+                            modifier = Modifier.fillMaxWidth().padding(top = 6.dp),
+                        ) {
+                            Column(Modifier.fillMaxWidth()) {
+                                Text(option.name, fontWeight = FontWeight.SemiBold)
+                                Text(listOfNotNull(option.year?.toString(), option.originalName).joinToString(" · "))
+                            }
+                        }
+                    }
+                }
+            }
+        },
+        confirmButton = {
+            QuietButton(onClick = {
+                scope.launch {
+                    runCatching { withContext(Dispatchers.IO) { NativeRuntime.engine().forgetMatch(title.key) } }
+                        .onSuccess { onChanged() }.onFailure(onError)
+                }
+            }) { Text("Forget match") }
+        },
+        dismissButton = { TonalButton(onClick = onDismiss) { Text("Close") } },
+    )
+}

android/app/src/main/java/io/narl/protonstream/ui/theme/Accent.kt

@@ -2,6 +2,7 @@ package io.narl.protonstream.ui.theme
 
 import androidx.compose.foundation.Canvas
 import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@@ -9,6 +10,7 @@ import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.FilledTonalButton
+import androidx.compose.material3.LocalMinimumInteractiveComponentSize
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.NavigationBarItemDefaults
 import androidx.compose.material3.NavigationDrawerItemDefaults
@@ -18,14 +20,18 @@ import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteDefaul
 import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteItemColors
 import androidx.compose.material3.SliderState
 import androidx.compose.material3.TextButton
+import androidx.compose.material3.minimumInteractiveComponentSize
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.geometry.CornerRadius
 import androidx.compose.ui.geometry.Size
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.SolidColor
+import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 
 /**
@@ -68,17 +74,30 @@ internal fun AccentButton(
     content: @Composable RowScope.() -> Unit,
 ) {
     val shape = MaterialTheme.shapes.small
-    Button(
+    // The button pads itself out to the 48dp minimum touch target, and a
-        onClick = onClick,
+    // background on its modifier fills that whole target — 8dp taller than
-        // Only while it is live: a disabled button keeps Material's flat
+    // the 40dp container every other button draws. So the padding is taken
-        // disabled container, because a greyed control that still wears the
+    // here, outside the ramp, and the button inside is told not to add its
-        // one strong colour in the window reads as pressable.
+    // own. The box hands its size down, so a `fillMaxWidth` still reaches it.
-        modifier = if (enabled) modifier.background(accentBrush(), shape) else modifier,
+    Box(
-        enabled = enabled,
+        modifier.minimumInteractiveComponentSize(),
-        shape = shape,
+        contentAlignment = Alignment.Center,
-        colors = ButtonDefaults.buttonColors(containerColor = Color.Transparent),
+        propagateMinConstraints = true,
-        content = content,
+    ) {
-    )
+        CompositionLocalProvider(LocalMinimumInteractiveComponentSize provides Dp.Unspecified) {
+            Button(
+                onClick = onClick,
+                // Only while it is live: a disabled button keeps Material's flat
+                // disabled container, because a greyed control that still wears the
+                // one strong colour in the window reads as pressable.
+                modifier = if (enabled) Modifier.background(accentBrush(), shape) else Modifier,
+                enabled = enabled,
+                shape = shape,
+                colors = ButtonDefaults.buttonColors(containerColor = Color.Transparent),
+                content = content,
+            )
+        }
+    }
 }
 
 @Composable
@@ -168,11 +187,21 @@ internal fun AccentProgress(
  */
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-internal fun AccentTrack(state: SliderState, modifier: Modifier = Modifier) {
+internal fun AccentTrack(state: SliderState, modifier: Modifier = Modifier, buffered: Float = 0f) {
     val brush = accentBrush()
     Canvas(modifier.fillMaxWidth().height(TRACK_HEIGHT.dp)) {
         val radius = CornerRadius(size.height / 2)
         drawRoundRect(color = Color.White.copy(alpha = 0.30f), cornerRadius = radius)
+        // What is already read ahead, lighter than the rest and under the
+        // played part: a jump that lands in it costs no fetch.
+        val ahead = size.width * buffered.coerceIn(0f, 1f)
+        if (ahead >= size.height) {
+            drawRoundRect(
+                color = Color.White.copy(alpha = 0.55f),
+                size = Size(ahead, size.height),
+                cornerRadius = radius,
+            )
+        }
         val done = size.width * state.coercedValueAsFraction
         if (done >= size.height) {
             drawRoundRect(brush = brush, size = Size(done, size.height), cornerRadius = radius)

android/app/src/main/java/io/narl/protonstream/ui/theme/Shape.kt

@@ -29,7 +29,7 @@ internal val ProtonShapes = Shapes(
 /** The radius `pstr-app` draws everything at. */
 internal const val CORNER = 8f
 
-/** A badge over artwork — `ui/mod.rs` is the other place this number lives. */
+/** A badge over artwork — `theme::radius::BADGE` in pstr-app is the other place this number lives. */
 internal const val CORNER_TIGHT = 4f
 
 /** A bottom sheet, which has no desktop counterpart. */

android/app/src/main/java/io/narl/protonstream/ui/theme/Type.kt

@@ -2,9 +2,28 @@ package io.narl.protonstream.ui.theme
 
 import androidx.compose.material3.Typography
 import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.Font
+import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
+import io.narl.protonstream.R
 import androidx.compose.ui.unit.sp
 
+/**
+ * Inter, the desktop client's face, from the same two files.
+ *
+ * Only Regular and SemiBold ship, as on the desktop. A `Medium` role resolves
+ * to Regular by the usual weight matching rather than to a synthesised bold,
+ * which is how the desktop draws it too.
+ *
+ * Above [ProtonTypography] on purpose: top-level properties initialise in
+ * file order, and a ramp built first would capture this as null and fall back
+ * to the system face without a word.
+ */
+internal val Inter = FontFamily(
+    Font(R.font.inter_regular, FontWeight.Normal),
+    Font(R.font.inter_semibold, FontWeight.SemiBold),
+)
+
 /**
  * The type ramp, which is the desktop client's type ramp.
  *
@@ -72,4 +91,5 @@ private fun role(size: Float, weight: FontWeight) = TextStyle(
     fontSize = size.sp,
     lineHeight = (size * 1.35f).sp,
     fontWeight = weight,
+    fontFamily = Inter,
 )

android/app/src/main/res/drawable/ic_launcher_background.xml

@@ -0,0 +1,20 @@
+<!--
+  The launcher tile: packaging/io.narl.proton-stream.svg's face gradient, on
+  the full 108dp canvas because the launcher cuts its own shape out of it.
+-->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="108dp" android:height="108dp"
+    android:viewportWidth="108" android:viewportHeight="108">
+    <path android:pathData="M0,0h108v108h-108z">
+        <aapt:attr name="android:fillColor">
+            <gradient android:type="linear"
+                android:startX="0" android:startY="0"
+                android:endX="108" android:endY="108">
+                <item android:offset="0" android:color="#FFA48BFF" />
+                <item android:offset="0.55" android:color="#FF7552FF" />
+                <item android:offset="1" android:color="#FF5B36F2" />
+            </gradient>
+        </aapt:attr>
+    </path>
+</vector>

android/app/src/main/res/drawable/ic_launcher_foreground.xml

@@ -1,6 +1,34 @@
+<!--
+  The play mark from packaging/io.narl.proton-stream.svg, cut into the blocks a
+  revision is fetched in. The paths are in the SVG's 128-unit space; the group
+  maps its 104-unit tile onto the 72dp a launcher shows of a 108dp layer.
+  It centres x=70, between the glyph's centroid (66) and its box (73): the
+  SVG's own centre, 64, leaves it sitting visibly right in a round mask.
+-->
 <vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
     android:width="108dp" android:height="108dp"
     android:viewportWidth="108" android:viewportHeight="108">
-    <path android:fillColor="#CBA6F7" android:pathData="M24,22h60v64h-60z" />
+    <group
-    <path android:fillColor="#1E1E2E" android:pathData="M45,39l26,15 -26,15z" />
+        android:pivotX="70" android:pivotY="62"
+        android:scaleX="0.6923" android:scaleY="0.6923"
+        android:translateX="-16" android:translateY="-8">
+        <group android:translateY="3">
+            <clip-path android:pathData="M0,0h63v128h-63zM68.5,0h10v128h-10zM84,0h44v128h-44z" />
+            <path android:fillColor="#4D2E1596" android:pathData="M50,41.5v41a6,6 0,0 0,9.1 5.1l34.2,-20.5a6,6 0,0 0,0 -10.3L59.1,36.4A6,6 0,0 0,50 41.5z" />
+        </group>
+        <group>
+            <clip-path android:pathData="M0,0h63v128h-63zM68.5,0h10v128h-10zM84,0h44v128h-44z" />
+            <path android:pathData="M50,41.5v41a6,6 0,0 0,9.1 5.1l34.2,-20.5a6,6 0,0 0,0 -10.3L59.1,36.4A6,6 0,0 0,50 41.5z">
+                <aapt:attr name="android:fillColor">
+                    <gradient android:type="linear"
+                        android:startX="0" android:startY="36"
+                        android:endX="0" android:endY="88">
+                        <item android:offset="0" android:color="#FFFFFFFF" />
+                        <item android:offset="1" android:color="#FFECE6FF" />
+                    </gradient>
+                </aapt:attr>
+            </path>
+        </group>
+    </group>
 </vector>

android/app/src/main/res/drawable/ic_launcher_monochrome.xml

@@ -0,0 +1,12 @@
+<!-- The foreground's glyph as one flat shape, for themed launcher icons. -->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp" android:height="108dp"
+    android:viewportWidth="108" android:viewportHeight="108">
+    <group
+        android:pivotX="70" android:pivotY="62"
+        android:scaleX="0.6923" android:scaleY="0.6923"
+        android:translateX="-16" android:translateY="-8">
+        <clip-path android:pathData="M0,0h63v128h-63zM68.5,0h10v128h-10zM84,0h44v128h-44z" />
+        <path android:fillColor="#FFFFFFFF" android:pathData="M50,41.5v41a6,6 0,0 0,9.1 5.1l34.2,-20.5a6,6 0,0 0,0 -10.3L59.1,36.4A6,6 0,0 0,50 41.5z" />
+    </group>
+</vector>

android/app/src/main/res/drawable/ic_notification_stream.xml

@@ -1,13 +1,16 @@
 <!--
   The status-bar glyph. Android tints small icons to a single colour and drops
-  everything that is not opaque, so this is the launcher mark reduced to one
+  everything that is not opaque, so this is the launcher's sliced play mark as
-  white silhouette rather than the two-tone drawable.
+  one white silhouette, scaled from the SVG's 128-unit space onto 24dp.
 -->
 <vector xmlns:android="http://schemas.android.com/apk/res/android"
     android:width="24dp" android:height="24dp"
     android:viewportWidth="24" android:viewportHeight="24">
-    <path
+    <group
-        android:fillColor="#FFFFFFFF"
+        android:pivotX="70" android:pivotY="62"
-        android:fillType="evenOdd"
+        android:scaleX="0.37" android:scaleY="0.37"
-        android:pathData="M4,4h16v16h-16zM10,8.5l5.5,3.5 -5.5,3.5z" />
+        android:translateX="-58" android:translateY="-50">
+        <clip-path android:pathData="M0,0h63v128h-63zM68.5,0h10v128h-10zM84,0h44v128h-44z" />
+        <path android:fillColor="#FFFFFFFF" android:pathData="M50,41.5v41a6,6 0,0 0,9.1 5.1l34.2,-20.5a6,6 0,0 0,0 -10.3L59.1,36.4A6,6 0,0 0,50 41.5z" />
+    </group>
 </vector>

android/app/src/main/res/mipmap-anydpi/ic_launcher.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@drawable/ic_launcher_background" />
+    <foreground android:drawable="@drawable/ic_launcher_foreground" />
+    <monochrome android:drawable="@drawable/ic_launcher_monochrome" />
+</adaptive-icon>

android/app/src/main/res/values/strings.xml

@@ -1,3 +1,9 @@
 <resources>
-    <string name="app_name">proton-stream</string>
+    <!-- Settings, recents, notifications and the share sheet: room for the full name. -->
+    <string name="app_name">Proton Stream</string>
+    <!--
+      Under the launcher icon, where about ten characters fit before the
+      launcher cuts the label off; "proton-stream" showed as "proton-st…".
+    -->
+    <string name="launcher_name">Stream</string>
 </resources>

android/app/src/test/java/io/narl/protonstream/IncomingShareLinkTest.kt

@@ -0,0 +1,37 @@
+package io.narl.protonstream
+
+import android.content.Intent
+import org.junit.Assert.assertEquals
+import org.junit.Assert.assertNull
+import org.junit.Test
+
+class IncomingShareLinkTest {
+    private val link = "https://drive.proton.me/urls/ABC123#s3cr3t"
+
+    @Test
+    fun `a viewed share link is taken whole, fragment included`() {
+        assertEquals(link, shareLinkFrom(Intent.ACTION_VIEW, link, null))
+    }
+
+    @Test
+    fun `a viewed url that is not an https share link is ignored`() {
+        assertNull(shareLinkFrom(Intent.ACTION_VIEW, "https://drive.proton.me/u/0/", null))
+        assertNull(shareLinkFrom(Intent.ACTION_VIEW, "http://drive.proton.me/urls/ABC123#s3cr3t", null))
+    }
+
+    @Test
+    fun `a shared message yields the link inside it`() {
+        assertEquals(link, shareLinkFrom(Intent.ACTION_SEND, null, "Season two is up: $link enjoy"))
+        assertEquals(link, shareLinkFrom(Intent.ACTION_SEND, null, "(<$link>)"))
+    }
+
+    @Test
+    fun `a shared message without a link yields nothing`() {
+        assertNull(shareLinkFrom(Intent.ACTION_SEND, null, "no link here"))
+    }
+
+    @Test
+    fun `other actions are ignored`() {
+        assertNull(shareLinkFrom(Intent.ACTION_MAIN, link, link))
+    }
+}

android/app/src/test/java/io/narl/protonstream/download/TransferRateTest.kt

@@ -0,0 +1,37 @@
+package io.narl.protonstream.download
+
+import org.junit.Assert.assertEquals
+import org.junit.Assert.assertTrue
+import org.junit.Test
+
+class TransferRateTest {
+    @Test
+    fun `the first sample has no rate to report`() {
+        assertEquals(0L, TransferRate().sample(4L * 1024 * 1024, 1_000))
+    }
+
+    @Test
+    fun `a steady transfer reports its rate`() {
+        val rate = TransferRate()
+        rate.sample(0, 0)
+        assertEquals(1_000_000L, rate.sample(1_000_000, 1_000))
+        assertEquals(1_000_000L, rate.sample(2_000_000, 2_000))
+    }
+
+    @Test
+    fun `one slow block moves the rate without halving it`() {
+        val rate = TransferRate()
+        rate.sample(0, 0)
+        rate.sample(1_000_000, 1_000)
+        val after = rate.sample(2_000_000, 3_000)
+        assertTrue(after in 600_000L..999_999L)
+    }
+
+    @Test
+    fun `a resumed download starting below the last sample starts over`() {
+        val rate = TransferRate()
+        rate.sample(0, 0)
+        rate.sample(1_000_000, 1_000)
+        assertEquals(1_000_000L, rate.sample(0, 2_000))
+    }
+}

android/app/src/test/java/io/narl/protonstream/ui/AccountUiTest.kt

@@ -0,0 +1,38 @@
+package io.narl.protonstream.ui
+
+import org.junit.Assert.assertEquals
+import org.junit.Assert.assertFalse
+import org.junit.Assert.assertTrue
+import org.junit.Test
+
+class AccountUiTest {
+    @Test
+    fun `the sync line says how long ago and what came in`() {
+        val minute = 60_000L
+        assertEquals("Watch history syncs with your Drive", syncLine(AccountUiState(), 0))
+        assertEquals("Synced just now", syncLine(AccountUiState(syncedAt = 0), 30_000))
+        assertEquals("Synced 5 min ago", syncLine(AccountUiState(syncedAt = 0), 5 * minute))
+        assertEquals(
+            "Synced 2 h ago · 3 from other devices",
+            syncLine(AccountUiState(syncedAt = 0, applied = 3), 120 * minute),
+        )
+    }
+
+    @Test
+    fun `a failed sync is said in place of when it last worked`() {
+        assertEquals(
+            "Watch history did not sync: offline",
+            syncLine(AccountUiState(syncedAt = 0, syncError = "offline"), 0),
+        )
+    }
+
+    @Test
+    fun `the verification page may only navigate within Proton over https`() {
+        assertTrue(isProtonPage("https", "verify.proton.me"))
+        assertTrue(isProtonPage("https", "proton.me"))
+        assertFalse(isProtonPage("http", "verify.proton.me"))
+        assertFalse(isProtonPage("https", "proton.me.example.com"))
+        assertFalse(isProtonPage("https", "notproton.me"))
+        assertFalse(isProtonPage("https", null))
+    }
+}

android/app/src/test/java/io/narl/protonstream/ui/ArtworkTest.kt

@@ -0,0 +1,28 @@
+package io.narl.protonstream.ui
+
+import org.junit.Assert.assertEquals
+import org.junit.Test
+
+class ArtworkTest {
+    @Test
+    fun `initials skip the lower-case particles of a romanised name`() {
+        assertEquals("OK", initials("Oshi no Ko"))
+        assertEquals("AH", initials("Ano Hi Mita Hana no Namae o Bokutachi wa Mada Shiranai."))
+    }
+
+    @Test
+    fun `a one-word name has one initial`() {
+        assertEquals("A", initials("Akira"))
+    }
+
+    @Test
+    fun `a name with no capitals falls back to its first two words`() {
+        assertEquals("BW", initials("blue world order"))
+    }
+
+    @Test
+    fun `punctuation and separators are not words`() {
+        assertEquals("S2", initials("Steins;Gate - 2"))
+        assertEquals("", initials(" - "))
+    }
+}

android/app/src/test/java/io/narl/protonstream/ui/HistoryTest.kt

@@ -0,0 +1,58 @@
+package io.narl.protonstream.ui
+
+import java.time.LocalDate
+import java.util.Locale
+import org.junit.Assert.assertEquals
+import org.junit.Test
+import uniffi.pstr_android.EpisodeRecord
+import uniffi.pstr_android.SeasonRecord
+import uniffi.pstr_android.TitleRecord
+import uniffi.pstr_android.TitleType
+
+class HistoryTest {
+    private fun episode(link: String, watched: Boolean, progress: Double?, lastPlayed: Long) = EpisodeRecord(
+        shareId = "s", volumeId = "v", linkId = link, name = "$link.mkv", label = link, detail = "$link.mkv",
+        season = 1u, number = null, size = null, progress = progress, resumeAt = progress?.let { it * 1000 },
+        watched = watched, offline = false, providerName = null, providerOverview = null, stillUrl = null,
+        airDate = null, lastPlayed = lastPlayed,
+    )
+
+    private fun title(key: String, vararg episodes: EpisodeRecord) = TitleRecord(
+        key = key, name = key, year = null, kind = TitleType.SERIES, watchedCount = 0uL,
+        episodeCount = episodes.size.toULong(), canonicalName = null, originalName = null, overview = null,
+        metadataProvider = null, metadataId = null, metadataYear = null, metadataKind = null, posterUrl = null,
+        backdropUrl = null, rating = null, genres = emptyList(), providerEpisodeCount = null, externalUrl = null,
+        manualMatch = false, seasons = listOf(SeasonRecord(1u, "Season 1", episodes.toList())),
+        displayName = key, wideUrl = null, formatLabel = null, seasonLabel = null, studios = emptyList(),
+        directors = emptyList(), tags = emptyList(), airing = false, nextEpisode = null, nextAiringAt = null,
+        franchise = emptyList(),
+    )
+
+    @Test
+    fun `history is every started or finished episode, newest first, across titles`() {
+        val titles = listOf(
+            title(
+                "a",
+                episode("a1", watched = true, progress = 1.0, lastPlayed = 30),
+                // Marked unwatched again: a row at zero, which is not a play.
+                episode("a2", watched = false, progress = 0.0, lastPlayed = 40),
+                episode("a3", watched = false, progress = null, lastPlayed = 0),
+            ),
+            title("b", episode("b1", watched = false, progress = 0.4, lastPlayed = 50)),
+        )
+        val played = history(titles)
+        assertEquals(listOf("b1", "a1"), played.map { it.episode.linkId })
+        assertEquals(0, played.last().index)
+    }
+
+    @Test
+    fun `days are headed relative to today, then by date`() {
+        val today = LocalDate.of(2026, 10, 3) // a Saturday
+        val english = Locale.ENGLISH
+        assertEquals("Today", dayHeading(today, today, english))
+        assertEquals("Yesterday", dayHeading(today.minusDays(1), today, english))
+        assertEquals("Monday", dayHeading(LocalDate.of(2026, 9, 28), today, english))
+        assertEquals("26 September", dayHeading(LocalDate.of(2026, 9, 26), today, english))
+        assertEquals("3 October 2025", dayHeading(LocalDate.of(2025, 10, 3), today, english))
+    }
+}

android/app/src/test/java/io/narl/protonstream/ui/LanguagePickerTest.kt

@@ -0,0 +1,31 @@
+package io.narl.protonstream.ui
+
+import org.junit.Assert.assertEquals
+import org.junit.Test
+
+class LanguagePickerTest {
+    @Test
+    fun `a stored tag reads as its language in either ISO form`() {
+        assertEquals("Japanese", languageLabel("jpn"))
+        assertEquals("Japanese", languageLabel("ja"))
+        assertEquals("German", languageLabel("deu"))
+        assertEquals("German", languageLabel("ger"))
+    }
+
+    @Test
+    fun `a region suffix and capitals do not hide the language`() {
+        assertEquals("Portuguese", languageLabel("PT-br"))
+    }
+
+    @Test
+    fun `a tag not on the list is shown as typed, and blank is no preference`() {
+        assertEquals("tgl", languageLabel("tgl"))
+        assertEquals("No preference", languageLabel(null))
+        assertEquals("No preference", languageLabel("  "))
+    }
+
+    @Test
+    fun `every listed language has a two-letter form`() {
+        LANGUAGES.forEach { (code, name) -> assertEquals(code, name, languageLabel(code)) }
+    }
+}

android/app/src/test/java/io/narl/protonstream/ui/ScreenshotTest.kt

@@ -0,0 +1,316 @@
+package io.narl.protonstream.ui
+
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.ui.test.junit4.createComposeRule
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.test.onRoot
+import androidx.compose.ui.unit.Density
+import androidx.test.core.app.ApplicationProvider
+import androidx.work.testing.WorkManagerTestInitHelper
+import com.github.takahirom.roborazzi.RobolectricDeviceQualifiers
+import com.github.takahirom.roborazzi.captureRoboImage
+import io.narl.protonstream.ui.theme.AppearanceState
+import io.narl.protonstream.ui.theme.ProtonFallback
+import io.narl.protonstream.ui.theme.ProtonStreamTheme
+import java.time.LocalDate
+import java.time.ZoneOffset
+import org.junit.Before
+import org.junit.Rule
+import org.junit.Test
+import org.junit.runner.RunWith
+import org.robolectric.RobolectricTestRunner
+import org.robolectric.annotation.Config
+import org.robolectric.annotation.GraphicsMode
+import uniffi.pstr_android.ArrangementRecord
+import uniffi.pstr_android.EpisodeRecord
+import uniffi.pstr_android.OfflineRecord
+import uniffi.pstr_android.PaletteRecord
+import uniffi.pstr_android.SeasonRecord
+import uniffi.pstr_android.ShareRecord
+import uniffi.pstr_android.ShelfRecord
+import uniffi.pstr_android.StorageUsageRecord
+import uniffi.pstr_android.TileRecord
+import uniffi.pstr_android.TitleRecord
+import uniffi.pstr_android.TitleType
+
+/**
+ * Every screen, drawn from fixed records, against a committed image.
+ *
+ * The screens are about to be redesigned one by one, and a layout regression —
+ * a row that wraps, a button pushed off the edge — compiles and passes every
+ * other test. Here it is a changed PNG in review. No artwork is loaded: the
+ * bridge is not available on the host, so every tile shows its generated
+ * placeholder, which is also what a title without metadata looks like on a
+ * phone.
+ */
+@RunWith(RobolectricTestRunner::class)
+@GraphicsMode(GraphicsMode.Mode.NATIVE)
+@Config(qualifiers = RobolectricDeviceQualifiers.Pixel7)
+class ScreenshotTest {
+    @get:Rule val compose = createComposeRule()
+
+    @Before
+    fun setUp() {
+        WorkManagerTestInitHelper.initializeTestWorkManager(ApplicationProvider.getApplicationContext())
+        // The palette is process-wide and the sandbox outlives a test, so a
+        // light capture would otherwise repaint every one after it.
+        AppearanceState.apply(ProtonFallback)
+    }
+
+    private fun captureLight(name: String, content: @Composable () -> Unit) {
+        AppearanceState.apply(LATTE)
+        capture(name, content)
+    }
+
+    private fun capture(name: String, content: @Composable () -> Unit) {
+        compose.setContent {
+            ProtonStreamTheme {
+                CompositionLocalProvider(LocalArtworkLoading provides false) {
+                    Surface(color = MaterialTheme.colorScheme.background) { content() }
+                }
+            }
+        }
+        compose.onRoot().captureRoboImage("src/test/screenshots/$name.png")
+    }
+
+    @Test
+    fun `the library on a phone`() = capture("library-phone") {
+        LibraryScreen(LIBRARY, {}, { _, _ -> }, {}, {}, { _, _ -> }, { _, _ -> }, PaddingValues())
+    }
+
+    @Test
+    @Config(qualifiers = RobolectricDeviceQualifiers.MediumTablet)
+    fun `the library on a tablet`() = capture("library-tablet") {
+        LibraryScreen(LIBRARY, {}, { _, _ -> }, {}, {}, { _, _ -> }, { _, _ -> }, PaddingValues())
+    }
+
+    @Test
+    fun `the library in the light palette`() = captureLight("library-phone-light") {
+        LibraryScreen(LIBRARY, {}, { _, _ -> }, {}, {}, { _, _ -> }, { _, _ -> }, PaddingValues())
+    }
+
+    @Test
+    fun `a title in the light palette`() = captureLight("title-phone-light") {
+        TitleScreen(SERIES, true, { _, _ -> }, {}, {}, {}, { _, _ -> }, PaddingValues())
+    }
+
+    @Test
+    @Config(qualifiers = RobolectricDeviceQualifiers.MediumTablet)
+    fun `a title on a tablet`() = capture("title-tablet") {
+        TitleScreen(SERIES, true, { _, _ -> }, {}, {}, {}, { _, _ -> }, PaddingValues())
+    }
+
+    @Test
+    @Config(qualifiers = RobolectricDeviceQualifiers.MediumTablet)
+    fun `the history page on a tablet`() = capture("history-tablet") {
+        HistoryScreen(LIBRARY, { _, _ -> }, {}, { _, _ -> }, PaddingValues(), ZoneOffset.UTC, LocalDate.of(2026, 9, 21))
+    }
+
+    @Test
+    fun `the library at a large font scale`() = capture("library-phone-large-font") {
+        // Robolectric has no font-scale qualifier; the density is what Compose
+        // reads it from, so the scale is set there.
+        val density = LocalDensity.current
+        CompositionLocalProvider(LocalDensity provides Density(density.density, fontScale = 1.5f)) {
+            LibraryScreen(LIBRARY, {}, { _, _ -> }, {}, {}, { _, _ -> }, { _, _ -> }, PaddingValues())
+        }
+    }
+
+    @Test
+    fun `an empty library`() = capture("library-empty") {
+        LibraryScreen(AppUiState(loading = false), {}, { _, _ -> }, {}, {}, { _, _ -> }, { _, _ -> }, PaddingValues())
+    }
+
+    @Test
+    fun `the library while the catalog loads`() = capture("library-loading") {
+        LibraryScreen(AppUiState(), {}, { _, _ -> }, {}, {}, { _, _ -> }, { _, _ -> }, PaddingValues())
+    }
+
+    @Test
+    fun `a title with seasons`() = capture("title-phone") {
+        TitleScreen(SERIES, true, { _, _ -> }, {}, {}, {}, { _, _ -> }, PaddingValues(), franchise = listOf(SERIES, SEQUEL))
+    }
+
+    @Test
+    fun `the shares page`() = capture("shares-phone") {
+        SharesScreen(LIBRARY.shares, { _, _, _ -> }, { _, _, _ -> }, {}, {}, null, {}, PaddingValues())
+    }
+
+    @Test
+    fun `the settings page`() = capture("settings-phone") {
+        SettingsScreen(LIBRARY, { _, _, _, _ -> }, {}, {}, {}, PaddingValues(), version = "1.0.0")
+    }
+
+    @Test
+    fun `the playback settings`() = capture("settings-playback") {
+        SettingsScreen(LIBRARY, { _, _, _, _ -> }, {}, {}, {}, PaddingValues(), SettingsPage.Playback)
+    }
+
+    @Test
+    fun `the storage settings`() = capture("settings-storage") {
+        SettingsScreen(LIBRARY, { _, _, _, _ -> }, {}, {}, {}, PaddingValues(), SettingsPage.Storage)
+    }
+
+    @Test
+    fun `the history page`() = capture("history-phone") {
+        // Fixed day and zone: "Today" and "Yesterday" are relative, and an
+        // image that changes with the date is no baseline.
+        HistoryScreen(LIBRARY, { _, _ -> }, {}, { _, _ -> }, PaddingValues(), ZoneOffset.UTC, LocalDate.of(2026, 9, 21))
+    }
+
+    @Test
+    fun `the downloads page with a season saved`() = capture("downloads-phone") {
+        val saved = SERIES.seasons.first().episodes.take(2).map {
+            OfflineRecord(it.shareId, it.linkId, "revision", 1_300_000_000uL, it)
+        }
+        // One title: the fixtures reuse link ids across titles, so with the
+        // whole library the episodes would be filed under whichever came last.
+        DownloadsScreen(LIBRARY.copy(titles = listOf(SERIES), offline = saved), {}, {}, {}, {}, PaddingValues())
+    }
+
+    @Test
+    fun `the downloads page with nothing offline`() = capture("downloads-empty") {
+        DownloadsScreen(LIBRARY, {}, {}, {}, {}, PaddingValues())
+    }
+
+    private companion object {
+        /** Catppuccin Latte with the default accent, as `Palette::resolve` gives it. */
+        val LATTE = PaletteRecord(
+            background = 0xFFEFF1F5u,
+            surface = 0xFFE6E9EFu,
+            sunken = 0xFFDCE0E8u,
+            card = 0xFFCCD0DAu,
+            cardHover = 0xFFBCC0CCu,
+            border = 0xFFBCC0CCu,
+            text = 0xFF4C4F69u,
+            muted = 0xFF6C6F85u,
+            accent = 0xFF732FCCu,
+            accentAlt = 0xFF1856D1u,
+            accentDim = 0xFFC4BBE4u,
+            onAccent = 0xFFEFF1F5u,
+            danger = 0xFFD20F39u,
+            elevated = 0xFFAAAEBDu,
+            dangerDim = 0xFFE7D1D5u,
+            light = true,
+        )
+
+        fun episode(season: UInt, number: UInt, watched: Boolean = false, progress: Double? = null): EpisodeRecord {
+            // `detail` is the filename unless the filename named the episode,
+            // which is what the bridge sends.
+            val file = "[Group] Oshi no Ko - S%02dE%02d.mkv".format(season.toInt(), number.toInt())
+            return episodeRecord(season, number, file, watched, progress)
+        }
+
+        fun episodeRecord(season: UInt, number: UInt, file: String, watched: Boolean, progress: Double?) = EpisodeRecord(
+            shareId = "share",
+            volumeId = "volume",
+            linkId = "s${season}e$number",
+            name = file,
+            label = "S%02dE%02d".format(season.toInt(), number.toInt()),
+            detail = file,
+            season = season,
+            number = number,
+            size = 1_300_000_000uL,
+            progress = progress,
+            resumeAt = progress?.let { it * 1440 },
+            watched = watched,
+            offline = false,
+            providerName = if (number == 1u) "Mother and Children" else null,
+            providerOverview = null,
+            stillUrl = null,
+            airDate = null,
+            // 2026-09-21 for the part-watched one, the day before for the rest.
+            lastPlayed = when {
+                progress != null -> 1_790_000_000L
+                watched -> 1_789_900_000L - number.toLong() * 600
+                else -> 0L
+            },
+        )
+
+        fun title(key: String, name: String, seasons: List<SeasonRecord>, overview: String? = null) = TitleRecord(
+            key = key,
+            name = name,
+            year = 2023u,
+            kind = TitleType.SERIES,
+            watchedCount = seasons.sumOf { s -> s.episodes.count { it.watched } }.toULong(),
+            episodeCount = seasons.sumOf { it.episodes.size }.toULong(),
+            canonicalName = null,
+            originalName = null,
+            overview = overview,
+            metadataProvider = null,
+            metadataId = null,
+            metadataYear = null,
+            metadataKind = null,
+            posterUrl = null,
+            backdropUrl = null,
+            rating = 8.4,
+            genres = listOf("Drama", "Mystery"),
+            providerEpisodeCount = null,
+            externalUrl = null,
+            manualMatch = false,
+            seasons = seasons,
+            displayName = name,
+            wideUrl = null,
+            formatLabel = null,
+            seasonLabel = null,
+            studios = emptyList(),
+            directors = emptyList(),
+            tags = emptyList(),
+            airing = false,
+            nextEpisode = null,
+            nextAiringAt = null,
+            franchise = emptyList(),
+        )
+
+        val SERIES = title(
+            "oshi-no-ko",
+            "Oshi no Ko",
+            listOf(
+                SeasonRecord(1u, "Season 1", (1u..4u).map { episode(1u, it, watched = it < 3u) }),
+                SeasonRecord(2u, "Season 2", (1u..3u).map { episode(2u, it, progress = if (it == 1u) 0.4 else null) }),
+            ),
+            overview = "A doctor in a countryside clinic is reborn as the child of the idol he followed.",
+        ).copy(
+            formatLabel = "TV",
+            seasonLabel = "Spring 2023",
+            studios = listOf("Doga Kobo"),
+            directors = listOf("Daisuke Hiramaki"),
+            tags = listOf("Idol", "Reincarnation"),
+            franchise = listOf("oshi-no-ko", "oshi-no-ko-film"),
+        )
+
+        /** The rest of [SERIES]'s franchise, for the title page's row of it. */
+        val SEQUEL = title("oshi-no-ko-film", "Oshi no Ko: The Final Act", listOf(SeasonRecord(null, "Film", listOf(episode(1u, 1u)))))
+            .copy(kind = TitleType.FILM, year = 2024u, formatLabel = "Film", franchise = SERIES.franchise)
+
+        val FILM = title("akira", "Akira", listOf(SeasonRecord(null, "Film", listOf(episode(1u, 1u)))))
+            .copy(kind = TitleType.FILM, year = 1988u)
+
+        val LIBRARY = AppUiState(
+            loading = false,
+            titles = listOf(
+                FILM,
+                SERIES,
+                title("ano-hana", "Ano Hi Mita Hana no Namae o Bokutachi wa Mada Shiranai.", listOf(SeasonRecord(1u, "Season 1", (1u..11u).map { episode(1u, it) }))),
+                title("bleach", "Bleach", listOf(SeasonRecord(1u, "Season 1", (1u..2u).map { episode(1u, it) }))),
+            ),
+            // Bleach stands for one more title of its franchise, and one shelf
+            // sits above the grid: what the bridge's arrangement would give.
+            arrangement = ArrangementRecord(
+                tiles = listOf("akira", "ano-hana", "bleach", "oshi-no-ko").map {
+                    TileRecord(it, if (it == "bleach") 1u else 0u)
+                },
+                shelves = listOf(ShelfRecord("From MAPPA", listOf("oshi-no-ko", "bleach", "akira"))),
+            ),
+            shares = listOf(
+                ShareRecord("anime", "anime", true),
+                ShareRecord("films", "films", false),
+            ),
+            storage = StorageUsageRecord(6_400_000_000uL, 3uL, 0uL, 1_100_000_000uL),
+        )
+    }
+}

android/gradle/libs.versions.toml

@@ -14,6 +14,7 @@ androidx-test-core = "1.7.0"
 androidx-test-junit = "1.3.0"
 androidx-test-runner = "1.7.0"
 ktlint-plugin = "13.1.0"
+roborazzi = "1.76.0"
 
 [libraries]
 androidx-core = { module = "androidx.core:core-ktx", version = "1.17.0" }
@@ -41,9 +42,13 @@ robolectric = { module = "org.robolectric:robolectric", version.ref = "robolectr
 androidx-test-core = { module = "androidx.test:core-ktx", version.ref = "androidx-test-core" }
 androidx-test-junit = { module = "androidx.test.ext:junit", version.ref = "androidx-test-junit" }
 androidx-test-runner = { module = "androidx.test:runner", version.ref = "androidx-test-runner" }
+roborazzi = { module = "io.github.takahirom.roborazzi:roborazzi", version.ref = "roborazzi" }
+roborazzi-compose = { module = "io.github.takahirom.roborazzi:roborazzi-compose", version.ref = "roborazzi" }
+roborazzi-junit-rule = { module = "io.github.takahirom.roborazzi:roborazzi-junit-rule", version.ref = "roborazzi" }
 
 [plugins]
 android-application = { id = "com.android.application", version.ref = "agp" }
 kotlin-android = { id = "org.jetbrains.kotlin.android", version.ref = "kotlin" }
 kotlin-compose = { id = "org.jetbrains.kotlin.plugin.compose", version.ref = "kotlin" }
 ktlint = { id = "org.jlleitschuh.gradle.ktlint", version.ref = "ktlint-plugin" }
+roborazzi = { id = "io.github.takahirom.roborazzi", version.ref = "roborazzi" }

crates/pstr-android/Cargo.toml

@@ -24,6 +24,7 @@ pstr-core.workspace = true
 pstr-meta.workspace = true
 pstr-stream.workspace = true
 tokio.workspace = true
+futures.workspace = true
 parking_lot.workspace = true
 thiserror.workspace = true
 uniffi.workspace = true

crates/pstr-android/uniffi.toml

@@ -2,3 +2,9 @@
 # UniFFI's default JVM cleaner references java.lang.ref.Cleaner (API 33).
 # Android uses the JNA cleaner, which is available on our minSdk 31 runtime.
 disable_java_cleaner = true
+
+[bindings.swift]
+# The iOS client (`ios/`) compiles the generated file straight into the app
+# target and reaches the C side through its bridging header, so the names are
+# what that header and `ios/project.yml` expect.
+module_name = "PstrBridge"

crates/pstr-app/Cargo.toml

@@ -24,8 +24,30 @@ tracing.workspace = true
 tracing-subscriber.workspace = true
 eframe.workspace = true
 egui.workspace = true
+egui-phosphor.workspace = true
 image.workspace = true
 sha2.workspace = true
 parking_lot.workspace = true
 serde.workspace = true
 serde_json.workspace = true
+directories.workspace = true
+chrono.workspace = true
+souvlaki.workspace = true
+wry.workspace = true
+tao.workspace = true
+
+[build-dependencies]
+embed-resource.workspace = true
+
+[dev-dependencies]
+skrifa.workspace = true
+
+[target.'cfg(target_os = "linux")'.dependencies]
+dbus.workspace = true
+
+[target.'cfg(windows)'.dependencies]
+# Named pipes, for handing a second launch's request to the open window.
+tokio = { workspace = true, features = ["net"] }
+windows-sys = { workspace = true, features = ["Win32_System_Power", "Win32_System_Registry"] }
+tauri-winrt-notification.workspace = true
+raw-window-handle = "0.6"

crates/pstr-app/assets/fonts/Inter-OFL.txt

@@ -0,0 +1,92 @@
+Copyright (c) 2016 The Inter Project Authors (https://github.com/rsms/inter)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION AND CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

crates/pstr-app/build.rs

@@ -0,0 +1,15 @@
+//! Compiles `proton-stream.rc` into the Windows exe; nothing on any other
+//! target. `rc.exe` on an MSVC build, mingw's `windres` on the cross build
+//! from Linux.
+
+fn main() {
+    println!("cargo:rerun-if-changed=proton-stream.rc");
+    println!("cargo:rerun-if-changed=../../packaging/windows/proton-stream.ico");
+    if std::env::var("CARGO_CFG_TARGET_OS").as_deref() != Ok("windows") {
+        return;
+    }
+    // Only the GUI gets the icon; `pstr` is a console tool.
+    embed_resource::compile_for("proton-stream.rc", ["proton-stream"], embed_resource::NONE)
+        .manifest_optional()
+        .expect("compile the icon resource");
+}

crates/pstr-app/examples/embedded_video.rs

@@ -92,7 +92,12 @@ impl Harness {
             .context("eframe was built without a glow context")?;
         // SAFETY: `CreationContext` is handed to us on the UI thread with the
         // context current, which is the same guarantee `App::ui` gives.
-        let video = unsafe { VideoSurface::new(Arc::clone(&player), gl, cc.egui_ctx.clone()) }?;
+        let video = unsafe {
+            VideoSurface::new(Arc::clone(&player), gl, {
+                let ctx = cc.egui_ctx.clone();
+                move || ctx.request_repaint()
+            })
+        }?;
 
         Ok(Self {
             player,

crates/pstr-app/proton-stream.rc

@@ -0,0 +1,4 @@
+// The exe's icon. The window sets one at runtime too, but that only lasts as
+// long as the window: Explorer, the Start menu and a taskbar pin read the icon
+// out of the file, and without this one they fall back to the generic one.
+1 ICON "../../packaging/windows/proton-stream.ico"

crates/pstr-app/src/desktop_prefs.rs

@@ -0,0 +1,106 @@
+//! Settings only the desktop app has.
+//!
+//! Kept out of [`pstr_core::prefs::PlaybackPrefs`] on purpose: that one is
+//! shared with Android through a bridge record, and a field Android neither
+//! shows nor keeps would be reset to its default every time Android saved.
+
+use std::path::PathBuf;
+
+use serde::{Deserialize, Serialize};
+
+/// What the settings page offers for the streaming cache, in GiB.
+pub const CACHE_CHOICES: [u32; 5] = [1, 2, 4, 8, 16];
+
+#[derive(Debug, Clone, Copy, PartialEq, Serialize, Deserialize)]
+// A file from an older version, or edited by hand, missing a field: the rest
+// still counts, and the missing one takes its default.
+#[serde(default)]
+pub struct DesktopPrefs {
+    /// Let mpv decode on the GPU. Off is for a driver that shows green frames
+    /// or nothing; it costs CPU, not correctness.
+    pub hardware_decoding: bool,
+    /// How much decrypted video the disk cache may keep.
+    pub cache_gib: u32,
+}
+
+impl Default for DesktopPrefs {
+    fn default() -> Self {
+        Self {
+            hardware_decoding: true,
+            cache_gib: 4,
+        }
+    }
+}
+
+impl DesktopPrefs {
+    pub fn cache_bytes(&self) -> u64 {
+        u64::from(self.cache_gib.clamp(1, 64)) << 30
+    }
+}
+
+/// The prefs and where they live.
+pub struct DesktopPrefsFile {
+    path: PathBuf,
+    /// False when the file was there and would not parse. Such a file is never
+    /// overwritten — it is far more likely a bug than something to replace —
+    /// so changes then last only for the session.
+    writable: bool,
+}
+
+impl DesktopPrefsFile {
+    pub fn load(path: PathBuf) -> (Self, DesktopPrefs) {
+        match pstr_core::config::read_json::<DesktopPrefs>(&path) {
+            Ok(prefs) => (
+                Self {
+                    path,
+                    writable: true,
+                },
+                prefs.unwrap_or_default(),
+            ),
+            Err(error) => {
+                tracing::warn!("read the desktop settings: {error}");
+                (
+                    Self {
+                        path,
+                        writable: false,
+                    },
+                    DesktopPrefs::default(),
+                )
+            }
+        }
+    }
+
+    pub fn save(&self, prefs: &DesktopPrefs) -> pstr_core::Result<()> {
+        if !self.writable {
+            tracing::warn!(
+                "not saving the desktop settings over {}, which would not parse",
+                self.path.display()
+            );
+            return Ok(());
+        }
+        pstr_core::config::write_json(&self.path, prefs)
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn a_file_missing_a_field_keeps_the_rest() {
+        let prefs: DesktopPrefs = serde_json::from_str(r#"{ "cache_gib": 8 }"#).unwrap();
+        assert_eq!(prefs.cache_gib, 8);
+        assert!(prefs.hardware_decoding);
+    }
+
+    #[test]
+    fn an_unparseable_file_is_never_overwritten() {
+        let path = std::env::temp_dir().join(format!("pstr-desktop-{}.json", std::process::id()));
+        std::fs::write(&path, "{ not json").unwrap();
+        let (file, prefs) = DesktopPrefsFile::load(path.clone());
+        assert_eq!(prefs, DesktopPrefs::default());
+        file.save(&DesktopPrefs::default()).unwrap();
+        assert_eq!(std::fs::read_to_string(&path).unwrap(), "{ not json");
+        let _ = std::fs::remove_file(path);
+    }
+}

crates/pstr-app/src/inhibit.rs

@@ -0,0 +1,185 @@
+//! Keeping the screen on while a film plays.
+//!
+//! mpv does this itself for a window of its own (`stop-screensaver`), but here
+//! the picture is drawn into the app's window through the render API, and mpv
+//! has no window to hold the screensaver off for. So the app asks.
+//!
+//! Best effort, like the media controls: a desktop that does not answer means
+//! the screen may blank during a film, which is what happened before this.
+
+/// Holds the screensaver off while [`Inhibitor::set`] says so.
+pub struct Inhibitor {
+    held: bool,
+    #[cfg(target_os = "linux")]
+    orders: Option<std::sync::mpsc::Sender<bool>>,
+}
+
+impl Inhibitor {
+    pub fn new() -> Self {
+        Self {
+            held: false,
+            #[cfg(target_os = "linux")]
+            orders: linux::spawn(),
+        }
+    }
+
+    /// Hold or release. Called every frame; acts only on a change.
+    pub fn set(&mut self, hold: bool) {
+        if hold == self.held {
+            return;
+        }
+        self.held = hold;
+        #[cfg(target_os = "linux")]
+        if let Some(orders) = &self.orders {
+            let _ = orders.send(hold);
+        }
+        #[cfg(windows)]
+        windows::set(hold);
+    }
+}
+
+impl Default for Inhibitor {
+    fn default() -> Self {
+        Self::new()
+    }
+}
+
+impl Drop for Inhibitor {
+    fn drop(&mut self) {
+        self.set(false);
+    }
+}
+
+#[cfg(target_os = "linux")]
+mod linux {
+    use std::sync::mpsc::{Sender, channel};
+    use std::time::Duration;
+
+    use dbus::Path;
+    use dbus::arg::PropMap;
+    use dbus::blocking::Connection;
+
+    const TIMEOUT: Duration = Duration::from_secs(2);
+    const REASON: &str = "Playing a video";
+
+    /// What is holding the screensaver off, and how to let go of it.
+    enum Hold {
+        /// The desktop portal: released by closing the request it returned.
+        Portal(Path<'static>),
+        /// The older `org.freedesktop.ScreenSaver`: released by its cookie.
+        ScreenSaver(u32),
+    }
+
+    /// A thread of its own, holding the session bus connection. The hold is
+    /// tied to that connection — closing it releases the hold — so it has to
+    /// outlive any one call, and a D-Bus call that stalls must not stall a
+    /// frame.
+    pub fn spawn() -> Option<Sender<bool>> {
+        let (orders, receiver) = channel::<bool>();
+        std::thread::Builder::new()
+            .name("inhibit".into())
+            .spawn(move || {
+                let connection = match Connection::new_session() {
+                    Ok(connection) => connection,
+                    Err(error) => {
+                        tracing::debug!("no session bus to inhibit the screensaver on: {error}");
+                        return;
+                    }
+                };
+                let mut hold = None;
+                for wanted in receiver {
+                    match (wanted, hold.take()) {
+                        (true, None) => hold = acquire(&connection),
+                        (false, Some(held)) => release(&connection, held),
+                        (_, held) => hold = held,
+                    }
+                }
+                if let Some(held) = hold {
+                    release(&connection, held);
+                }
+            })
+            .inspect_err(|error| tracing::debug!("inhibit thread: {error}"))
+            .ok()?;
+        Some(orders)
+    }
+
+    fn acquire(connection: &Connection) -> Option<Hold> {
+        // The portal first: it is what works under Flatpak and on GNOME, which
+        // does not implement the screensaver interface's `Inhibit`.
+        let portal = connection.with_proxy(
+            "org.freedesktop.portal.Desktop",
+            "/org/freedesktop/portal/desktop",
+            TIMEOUT,
+        );
+        let mut options = PropMap::new();
+        options.insert(
+            "reason".into(),
+            dbus::arg::Variant(Box::new(REASON.to_owned())),
+        );
+        // 8 is "idle": the screen blanking or locking for want of input.
+        let answer: Result<(Path<'static>,), _> = portal.method_call(
+            "org.freedesktop.portal.Inhibit",
+            "Inhibit",
+            ("", 8u32, options),
+        );
+        match answer {
+            Ok((request,)) => return Some(Hold::Portal(request)),
+            Err(error) => tracing::debug!("portal inhibit: {error}"),
+        }
+
+        let screensaver = connection.with_proxy(
+            "org.freedesktop.ScreenSaver",
+            "/org/freedesktop/ScreenSaver",
+            TIMEOUT,
+        );
+        let answer: Result<(u32,), _> = screensaver.method_call(
+            "org.freedesktop.ScreenSaver",
+            "Inhibit",
+            ("proton-stream", REASON),
+        );
+        match answer {
+            Ok((cookie,)) => Some(Hold::ScreenSaver(cookie)),
+            Err(error) => {
+                tracing::debug!("screensaver inhibit: {error}");
+                None
+            }
+        }
+    }
+
+    fn release(connection: &Connection, hold: Hold) {
+        let result: Result<(), dbus::Error> = match hold {
+            Hold::Portal(request) => connection
+                .with_proxy("org.freedesktop.portal.Desktop", request, TIMEOUT)
+                .method_call("org.freedesktop.portal.Request", "Close", ()),
+            Hold::ScreenSaver(cookie) => connection
+                .with_proxy(
+                    "org.freedesktop.ScreenSaver",
+                    "/org/freedesktop/ScreenSaver",
+                    TIMEOUT,
+                )
+                .method_call("org.freedesktop.ScreenSaver", "UnInhibit", (cookie,)),
+        };
+        if let Err(error) = result {
+            tracing::debug!("release the screensaver: {error}");
+        }
+    }
+}
+
+#[cfg(windows)]
+mod windows {
+    use windows_sys::Win32::System::Power::{
+        ES_CONTINUOUS, ES_DISPLAY_REQUIRED, ES_SYSTEM_REQUIRED, SetThreadExecutionState,
+    };
+
+    pub fn set(hold: bool) {
+        let flags = if hold {
+            ES_CONTINUOUS | ES_DISPLAY_REQUIRED | ES_SYSTEM_REQUIRED
+        } else {
+            ES_CONTINUOUS
+        };
+        // SAFETY: takes flags by value and touches nothing of ours.
+        unsafe {
+            SetThreadExecutionState(flags);
+        }
+    }
+}

crates/pstr-app/src/instance.rs

@@ -0,0 +1,350 @@
+//! One window at a time.
+//!
+//! A second launch hands what it was started with — a share link, or nothing
+//! — to the window already open, and exits. Without this, a second click on
+//! the launcher opened a second window on the same catalog: two engines
+//! writing the same watch state, two crawls of the same shares, and two films
+//! playing over each other.
+//!
+//! The channel between the two is a Unix socket in the user's runtime
+//! directory, or a named pipe on Windows. Anything that goes wrong setting it
+//! up is logged and the app runs on without it: a second window is a nuisance,
+//! and a launch that refuses to start because of this is a bug.
+
+use std::sync::mpsc::{Receiver, Sender, channel};
+
+use pstr_core::config::AppDirs;
+
+/// What a later launch asks of the window already open.
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub enum Request {
+    /// Come to the front.
+    Raise,
+    /// Come to the front, with this share link in the Add form.
+    AddShare(String),
+}
+
+impl Request {
+    /// What a launch was started with: the first argument that is a share
+    /// link, so `proton-stream 'https://drive.proton.me/urls/…#…'` adds it.
+    pub fn from_args(args: impl IntoIterator<Item = String>) -> Self {
+        args.into_iter()
+            .map(|arg| arg.trim().to_owned())
+            .find(|arg| pstr_core::shares::share_token(arg).is_ok())
+            .map_or(Self::Raise, Self::AddShare)
+    }
+
+    /// One line on the wire.
+    fn encode(&self) -> String {
+        match self {
+            Self::Raise => "raise\n".to_owned(),
+            Self::AddShare(url) => format!("add {url}\n"),
+        }
+    }
+
+    /// The other end of [`Request::encode`]. Anything else is ignored rather
+    /// than guessed at — and a link that is not a share link is not one to
+    /// put in the form.
+    fn decode(line: &str) -> Option<Self> {
+        let line = line.trim();
+        if line == "raise" {
+            return Some(Self::Raise);
+        }
+        let url = line.strip_prefix("add ")?.trim();
+        pstr_core::shares::share_token(url)
+            .is_ok()
+            .then(|| Self::AddShare(url.to_owned()))
+    }
+}
+
+/// How long a launch spends handing its request over before giving up on it.
+const HAND_TIMEOUT: std::time::Duration = std::time::Duration::from_secs(2);
+/// The most a request may be. A share link is a few hundred bytes.
+const MOST: u64 = 8 * 1024;
+
+/// The outcome of [`claim`].
+pub enum Claim {
+    /// This is the window. The listener answers later launches.
+    First(Listener),
+    /// A window was already open and has the request. This launch is done.
+    Handed,
+}
+
+/// Become the one window, or hand `request` to the one there is.
+pub fn claim(runtime: &tokio::runtime::Runtime, dirs: &AppDirs, request: &Request) -> Claim {
+    platform::claim(runtime, dirs, request)
+}
+
+/// Requests from later launches, until the process ends.
+pub struct Listener {
+    inner: Option<platform::Inner>,
+}
+
+impl Listener {
+    /// Start answering. `first` is this launch's own request, which arrives
+    /// through the same channel as the rest so there is one place to act on it.
+    pub fn serve(
+        self,
+        runtime: &tokio::runtime::Runtime,
+        ctx: &egui::Context,
+        first: Request,
+    ) -> Receiver<Request> {
+        let (sender, receiver) = channel();
+        if first != Request::Raise {
+            let _ = sender.send(first);
+        }
+        if let Some(inner) = self.inner {
+            platform::serve(
+                inner,
+                runtime,
+                Deliver {
+                    sender,
+                    ctx: ctx.clone(),
+                },
+            );
+        }
+        receiver
+    }
+}
+
+/// Where a received request goes: the app's queue, and a repaint so it is
+/// acted on now rather than when the pointer next moves.
+struct Deliver {
+    sender: Sender<Request>,
+    ctx: egui::Context,
+}
+
+impl Deliver {
+    fn line(&self, text: &str) {
+        let Some(request) = Request::decode(text) else {
+            tracing::debug!("instance: ignored a request that did not parse");
+            return;
+        };
+        let _ = self.sender.send(request);
+        self.ctx.request_repaint();
+    }
+}
+
+#[cfg(unix)]
+mod platform {
+    use std::io::{Read, Write};
+    use std::os::unix::fs::PermissionsExt;
+    use std::os::unix::net::{UnixListener, UnixStream};
+    use std::path::PathBuf;
+
+    use super::{AppDirs, Claim, Deliver, HAND_TIMEOUT, Listener, MOST, Request};
+
+    pub struct Inner(UnixListener);
+
+    /// In the runtime directory where there is one: it is the user's alone and
+    /// emptied at logout, which is exactly the life a socket should have.
+    fn socket(dirs: &AppDirs) -> PathBuf {
+        directories::BaseDirs::new()
+            .and_then(|base| base.runtime_dir().map(std::path::Path::to_path_buf))
+            .unwrap_or_else(|| dirs.cache.clone())
+            .join("io.narl.proton-stream.sock")
+    }
+
+    pub fn claim(_: &tokio::runtime::Runtime, dirs: &AppDirs, request: &Request) -> Claim {
+        let path = socket(dirs);
+        if let Ok(mut stream) = UnixStream::connect(&path) {
+            let _ = stream.set_write_timeout(Some(HAND_TIMEOUT));
+            match stream.write_all(request.encode().as_bytes()) {
+                Ok(()) => return Claim::Handed,
+                Err(error) => tracing::warn!("instance: hand over to the open window: {error}"),
+            }
+        }
+        // Nobody answered, so a socket file still there is left over from a
+        // window that did not exit cleanly.
+        let _ = std::fs::remove_file(&path);
+        let listener = match UnixListener::bind(&path) {
+            Ok(listener) => listener,
+            Err(error) => {
+                tracing::warn!("instance: listen at {}: {error}", path.display());
+                return Claim::First(Listener { inner: None });
+            }
+        };
+        // The runtime directory is private already; the cache fallback is
+        // not necessarily, and a share link is a secret.
+        let _ = std::fs::set_permissions(&path, std::fs::Permissions::from_mode(0o600));
+        Claim::First(Listener {
+            inner: Some(Inner(listener)),
+        })
+    }
+
+    pub fn serve(inner: Inner, _: &tokio::runtime::Runtime, deliver: Deliver) {
+        let spawned = std::thread::Builder::new()
+            .name("instance".into())
+            .spawn(move || {
+                for stream in inner.0.incoming() {
+                    let Ok(stream) = stream else { continue };
+                    let _ = stream.set_read_timeout(Some(HAND_TIMEOUT));
+                    let mut text = String::new();
+                    if stream.take(MOST).read_to_string(&mut text).is_ok() {
+                        deliver.line(&text);
+                    }
+                }
+            });
+        if let Err(error) = spawned {
+            tracing::warn!("instance thread: {error}");
+        }
+    }
+}
+
+#[cfg(windows)]
+mod platform {
+    use std::hash::{BuildHasher, Hasher};
+    use std::io::Write;
+
+    use tokio::io::AsyncReadExt;
+    use tokio::net::windows::named_pipe::{NamedPipeServer, ServerOptions};
+
+    use super::{AppDirs, Claim, Deliver, HAND_TIMEOUT, Listener, MOST, Request};
+
+    pub struct Inner {
+        name: String,
+        first: NamedPipeServer,
+    }
+
+    /// The pipe's name. Pipe names are machine-wide, so a fixed one could be
+    /// taken first by another account on the same machine, which would then
+    /// be handed this user's share links. The name carries a random part kept
+    /// in this user's own config directory, which nobody else can read.
+    fn pipe(dirs: &AppDirs) -> String {
+        let path = dirs.config.join("instance.key");
+        let key = std::fs::read_to_string(&path)
+            .ok()
+            .map(|key| key.trim().to_owned())
+            .filter(|key| key.len() == 32 && key.bytes().all(|b| b.is_ascii_hexdigit()))
+            .unwrap_or_else(|| {
+                // `RandomState` is seeded from the OS's random source, once
+                // per process and stepped per instance after that.
+                let mut key = String::new();
+                for _ in 0..2 {
+                    let word = std::collections::hash_map::RandomState::new()
+                        .build_hasher()
+                        .finish();
+                    key.push_str(&format!("{word:016x}"));
+                }
+                if let Err(error) = std::fs::write(&path, &key) {
+                    tracing::warn!("instance: store the pipe key: {error}");
+                }
+                key
+            });
+        format!(r"\\.\pipe\io.narl.proton-stream.{key}")
+    }
+
+    fn server(name: &str, first: bool) -> std::io::Result<NamedPipeServer> {
+        ServerOptions::new()
+            .first_pipe_instance(first)
+            .reject_remote_clients(true)
+            .access_outbound(false)
+            .create(name)
+    }
+
+    pub fn claim(runtime: &tokio::runtime::Runtime, dirs: &AppDirs, request: &Request) -> Claim {
+        let name = pipe(dirs);
+        // Registering a pipe with tokio needs its reactor.
+        let _entered = runtime.enter();
+        match server(&name, true) {
+            Ok(first) => Claim::First(Listener {
+                inner: Some(Inner { name, first }),
+            }),
+            // Taken: there is a window. Hand it the request.
+            Err(_) => {
+                let started = std::time::Instant::now();
+                loop {
+                    match std::fs::OpenOptions::new().write(true).open(&name) {
+                        Ok(mut pipe) => {
+                            if let Err(error) = pipe.write_all(request.encode().as_bytes()) {
+                                tracing::warn!("instance: hand over to the open window: {error}");
+                            }
+                            return Claim::Handed;
+                        }
+                        // Every instance busy with another launch: wait a turn.
+                        Err(_) if started.elapsed() < HAND_TIMEOUT => {
+                            std::thread::sleep(std::time::Duration::from_millis(50));
+                        }
+                        Err(error) => {
+                            tracing::warn!("instance: reach the open window: {error}");
+                            return Claim::First(Listener { inner: None });
+                        }
+                    }
+                }
+            }
+        }
+    }
+
+    pub fn serve(inner: Inner, runtime: &tokio::runtime::Runtime, deliver: Deliver) {
+        runtime.spawn(async move {
+            let Inner { name, mut first } = inner;
+            loop {
+                if first.connect().await.is_err() {
+                    continue;
+                }
+                let connected = first;
+                // The next instance is up before this one is read, so a launch
+                // right behind this one finds a pipe to connect to.
+                first = match server(&name, false) {
+                    Ok(next) => next,
+                    Err(error) => {
+                        tracing::warn!("instance: reopen the pipe: {error}");
+                        return;
+                    }
+                };
+                let mut text = String::new();
+                let mut limited = connected.take(MOST);
+                let read = limited.read_to_string(&mut text);
+                if let Ok(Ok(_)) = tokio::time::timeout(HAND_TIMEOUT, read).await {
+                    deliver.line(&text);
+                }
+            }
+        });
+    }
+}
+
+#[cfg(not(any(unix, windows)))]
+mod platform {
+    use super::{AppDirs, Claim, Deliver, Listener, Request};
+
+    pub struct Inner;
+
+    pub fn claim(_: &tokio::runtime::Runtime, _: &AppDirs, _: &Request) -> Claim {
+        Claim::First(Listener { inner: None })
+    }
+
+    pub fn serve(_: Inner, _: &tokio::runtime::Runtime, _: Deliver) {}
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    const LINK: &str = "https://drive.proton.me/urls/ABCDEFGHIJ#fragmentsecret";
+
+    #[test]
+    fn a_launch_with_a_share_link_asks_for_it_to_be_added() {
+        let args = ["--verbose".to_owned(), format!("  {LINK} ")];
+        assert_eq!(Request::from_args(args), Request::AddShare(LINK.to_owned()));
+    }
+
+    #[test]
+    fn a_launch_with_no_share_link_only_raises_the_window() {
+        let args = ["https://example.com/".to_owned()];
+        assert_eq!(Request::from_args(args), Request::Raise);
+        assert_eq!(Request::from_args(Vec::new()), Request::Raise);
+    }
+
+    #[test]
+    fn a_request_survives_the_wire() {
+        for request in [Request::Raise, Request::AddShare(LINK.to_owned())] {
+            assert_eq!(Request::decode(&request.encode()), Some(request));
+        }
+    }
+
+    #[test]
+    fn a_line_that_is_not_a_request_is_ignored() {
+        assert_eq!(Request::decode("add https://example.com/"), None);
+        assert_eq!(Request::decode("open the pod bay doors"), None);
+    }
+}

crates/pstr-app/src/lib.rs

@@ -20,8 +20,16 @@
 //! `examples/embedded_video.rs`, which is the smoke test for [`video`].
 
 pub mod app;
+pub mod desktop_prefs;
 pub mod engine;
+pub mod inhibit;
+pub mod instance;
+pub mod media;
+pub mod notify;
+pub mod pacing;
 pub mod playback;
 pub mod theme;
 pub mod ui;
+pub mod verify;
 pub mod video;
+pub mod window;

crates/pstr-app/src/main.rs

@@ -16,6 +16,12 @@ use anyhow::Context;
 use pstr_core::config::AppDirs;
 
 fn main() -> anyhow::Result<()> {
+    // Before anything else: a verification window is a child process of the
+    // app, and must not claim the single instance or open a library.
+    if let Some(code) = pstr_app::verify::run_if_requested() {
+        std::process::exit(code);
+    }
+
     tracing_subscriber::fmt()
         .with_env_filter(
             tracing_subscriber::EnvFilter::try_from_default_env()
@@ -31,20 +37,44 @@ fn main() -> anyhow::Result<()> {
     );
     let dirs = AppDirs::ensure().context("resolve app directories")?;
 
-    let options = eframe::NativeOptions {
+    // Before the window: a second launch hands its request to the first and
-        viewport: egui::ViewportBuilder::default()
+    // never opens one.
+    let request = pstr_app::instance::Request::from_args(std::env::args().skip(1));
+    let instance = match pstr_app::instance::claim(&runtime, &dirs, &request) {
+        pstr_app::instance::Claim::First(listener) => listener,
+        pstr_app::instance::Claim::Handed => {
+            tracing::info!("handed over to the window already open");
+            return Ok(());
+        }
+    };
+
+    let window = pstr_app::window::WindowState::load(&dirs.window_file());
+    let mut viewport = egui::ViewportBuilder::default();
+    // X11 and Windows take the icon from the window. Wayland ignores this and
+    // looks the app id up in the installed desktop entry instead.
+    match eframe::icon_data::from_png_bytes(include_bytes!("../assets/icon-256.png")) {
+        Ok(icon) => viewport = viewport.with_icon(icon),
+        Err(error) => tracing::debug!("window icon: {error}"),
+    }
+    let mut options = eframe::NativeOptions {
+        viewport: viewport
             .with_title("proton-stream")
-            .with_inner_size([1180.0, 780.0])
+            .with_inner_size(window.map_or([1180.0, 780.0], |state| [state.width, state.height]))
+            .with_maximized(window.is_some_and(|state| state.maximized))
             .with_min_inner_size([720.0, 480.0])
             .with_app_id("io.narl.proton-stream"),
         ..Default::default()
     };
+    // Off on Wayland, where a swap on a window nobody is looking at never
+    // returns and the compositor decides the app has hung. `pstr_app::pacing`
+    // has the whole of it, and caps the frame rate in vsync's place.
+    options.glow_options.vsync = pstr_app::pacing::vsync();
 
     eframe::run_native(
         "proton-stream",
         options,
         Box::new(move |cc| {
-            pstr_app::app::App::new(cc, runtime, dirs)
+            pstr_app::app::App::new(cc, runtime, dirs, instance, request)
                 .map(|app| Box::new(app) as Box<dyn eframe::App>)
                 .map_err(|error| error.into())
         }),

crates/pstr-app/src/media.rs

@@ -0,0 +1,170 @@
+//! The desktop's view of what is playing: media keys, the media widget in the
+//! panel, the lock screen.
+//!
+//! MPRIS on Linux, the System Media Transport Controls on Windows, through
+//! `souvlaki`. Both are optional in the strongest sense — a session with no
+//! D-Bus, or a desktop with nothing listening, plays exactly as before — so
+//! every failure here is a debug line and nothing more.
+
+use std::sync::mpsc::{Receiver, channel};
+use std::time::Duration;
+
+use souvlaki::{
+    MediaControlEvent, MediaControls, MediaMetadata, MediaPlayback, MediaPosition, PlatformConfig,
+    SeekDirection,
+};
+
+use crate::app::{Action, Adjacent};
+use crate::playback::{Command, Playback};
+
+/// How far one press of a seek key moves, when the desktop does not say.
+const SEEK_SECONDS: f64 = 10.0;
+
+/// What was last told to the desktop, so it is told again only on a change.
+#[derive(Debug, Clone, PartialEq)]
+struct Told {
+    /// What the metadata was built from: the player, whether its duration was
+    /// known yet, and the cover. Any of them changing means sending it again.
+    item: Option<(u64, bool, Option<String>)>,
+    paused: bool,
+    /// Where the playhead was, to the second. A desktop interpolates between
+    /// updates, so this only has to be sent when the playhead jumps.
+    second: i64,
+}
+
+pub struct MediaSession {
+    controls: Option<MediaControls>,
+    events: Receiver<MediaControlEvent>,
+    told: Option<Told>,
+}
+
+impl MediaSession {
+    /// Register with the desktop. `window` is the handle SMTC needs on
+    /// Windows; elsewhere it is not used.
+    pub fn new(ctx: &egui::Context, window: Option<*mut std::ffi::c_void>) -> Self {
+        let (sender, events) = channel();
+        let config = PlatformConfig {
+            display_name: "proton-stream",
+            dbus_name: "proton_stream",
+            hwnd: window,
+        };
+        let ctx = ctx.clone();
+        let controls = MediaControls::new(config)
+            .and_then(|mut controls| {
+                controls.attach(move |event| {
+                    // The press arrives on the D-Bus thread; it is acted on in
+                    // the next frame, which this is what asks for.
+                    let _ = sender.send(event);
+                    ctx.request_repaint();
+                })?;
+                Ok(controls)
+            })
+            .inspect_err(|error| tracing::debug!("media controls unavailable: {error:?}"))
+            .ok();
+        Self {
+            controls,
+            events,
+            told: None,
+        }
+    }
+
+    /// Turn the presses since the last frame into actions.
+    pub fn drain(&mut self, playback: Option<&Playback>, actions: &mut Vec<Action>) {
+        while let Ok(event) = self.events.try_recv() {
+            if let Some(action) = action_for(event, playback) {
+                actions.push(action);
+            }
+        }
+    }
+
+    /// Tell the desktop what is playing, if that changed since the last frame.
+    ///
+    /// `cover` is a `file://` URL to the title's artwork when it is on disk.
+    pub fn show(&mut self, playback: Option<&Playback>, cover: Option<&str>) {
+        let Some(controls) = self.controls.as_mut() else {
+            return;
+        };
+        let told = Told {
+            item: playback.map(|playback| {
+                (
+                    playback.id,
+                    playback.duration.is_some(),
+                    cover.map(str::to_owned),
+                )
+            }),
+            paused: playback.is_none_or(|playback| playback.paused),
+            second: playback.map_or(0, |playback| playback.position as i64),
+        };
+        let previous = self.told.replace(told.clone());
+        // Within the second, or one second on from it: playback carrying on,
+        // which the desktop already shows without being told.
+        if let Some(previous) = &previous
+            && previous.item == told.item
+            && previous.paused == told.paused
+            && (0..=1).contains(&(told.second - previous.second))
+        {
+            return;
+        }
+
+        let Some(playback) = playback else {
+            if let Err(error) = controls.set_playback(MediaPlayback::Stopped) {
+                tracing::debug!("media controls: {error:?}");
+            }
+            return;
+        };
+        if previous.is_none_or(|previous| previous.item != told.item) {
+            let target = &playback.target;
+            let episode = target.caption();
+            let metadata = MediaMetadata {
+                title: Some(if episode.is_empty() {
+                    &target.title_name
+                } else {
+                    &episode
+                }),
+                album: Some(&target.title_name),
+                artist: None,
+                cover_url: cover,
+                duration: playback.duration.map(Duration::from_secs_f64),
+            };
+            if let Err(error) = controls.set_metadata(metadata) {
+                tracing::debug!("media controls: {error:?}");
+            }
+        }
+        let progress = Some(MediaPosition(Duration::from_secs_f64(
+            playback.position.max(0.0),
+        )));
+        let state = if playback.paused {
+            MediaPlayback::Paused { progress }
+        } else {
+            MediaPlayback::Playing { progress }
+        };
+        if let Err(error) = controls.set_playback(state) {
+            tracing::debug!("media controls: {error:?}");
+        }
+    }
+}
+
+/// What a press means here. `None` for the ones with nothing to act on.
+fn action_for(event: MediaControlEvent, playback: Option<&Playback>) -> Option<Action> {
+    let playback = playback?;
+    let seek = |direction: SeekDirection, seconds: f64| {
+        Action::Player(Command::SeekBy(match direction {
+            SeekDirection::Forward => seconds,
+            SeekDirection::Backward => -seconds,
+        }))
+    };
+    Some(match event {
+        MediaControlEvent::Toggle => Action::Player(Command::TogglePause),
+        MediaControlEvent::Play if playback.paused => Action::Player(Command::TogglePause),
+        MediaControlEvent::Pause if !playback.paused => Action::Player(Command::TogglePause),
+        MediaControlEvent::Next => Action::PlayAdjacent(Adjacent::Next),
+        MediaControlEvent::Previous => Action::PlayAdjacent(Adjacent::Previous),
+        MediaControlEvent::Stop => Action::LeavePlayer,
+        MediaControlEvent::Seek(direction) => seek(direction, SEEK_SECONDS),
+        MediaControlEvent::SeekBy(direction, by) => seek(direction, by.as_secs_f64()),
+        MediaControlEvent::SetPosition(MediaPosition(at)) => {
+            Action::Player(Command::SeekTo(at.as_secs_f64()))
+        }
+        _ => return None,
+    })
+}

crates/pstr-app/src/notify.rs

@@ -0,0 +1,190 @@
+//! Desktop notifications, for things that finish while nobody is looking.
+//!
+//! Only when the window does not have focus: a viewer who is looking at the
+//! app already has the toast, and a second copy of it from the panel is noise.
+//! That rule is the caller's — see `App::notify`.
+//!
+//! Linux over `org.freedesktop.Notifications`; Windows as a toast. Nothing on
+//! macOS yet.
+//!
+//! A Windows toast is shown under an application id, and Windows drops a toast
+//! whose id it does not know without a word. The id is registered for the
+//! current user under `HKCU\Software\Classes\AppUserModelId` — the same
+//! registration the Windows App SDK makes for an app with no package — which
+//! works for the MSI and the portable zip alike. If that write fails, the
+//! toast goes out under PowerShell's id instead, which Windows always knows: a
+//! notification that names the wrong program beats one that never appears.
+
+use std::path::Path;
+
+/// Sends notifications from a thread of its own, so a notification daemon
+/// that is slow to answer never costs a frame.
+pub struct Notifier {
+    #[cfg(any(target_os = "linux", windows))]
+    orders: Option<std::sync::mpsc::Sender<(String, String)>>,
+}
+
+impl Notifier {
+    /// `cache` is where Windows is pointed for the toast's icon.
+    pub fn new(cache: &Path) -> Self {
+        let _ = cache;
+        Self {
+            #[cfg(target_os = "linux")]
+            orders: linux::spawn(),
+            #[cfg(windows)]
+            orders: windows::spawn(cache.join("notification-icon.png")),
+        }
+    }
+
+    pub fn send(&self, summary: impl Into<String>, body: impl Into<String>) {
+        #[cfg(any(target_os = "linux", windows))]
+        if let Some(orders) = &self.orders {
+            let _ = orders.send((summary.into(), body.into()));
+        }
+        #[cfg(not(any(target_os = "linux", windows)))]
+        let _ = (summary.into(), body.into());
+    }
+}
+
+#[cfg(target_os = "linux")]
+mod linux {
+    use std::sync::mpsc::{Sender, channel};
+    use std::time::Duration;
+
+    use dbus::arg::PropMap;
+    use dbus::blocking::Connection;
+
+    pub fn spawn() -> Option<Sender<(String, String)>> {
+        let (orders, receiver) = channel::<(String, String)>();
+        std::thread::Builder::new()
+            .name("notify".into())
+            .spawn(move || {
+                // Connected on first use rather than at startup: most sessions
+                // never send one.
+                let mut connection: Option<Connection> = None;
+                for (summary, body) in receiver {
+                    if connection.is_none() {
+                        connection = Connection::new_session()
+                            .inspect_err(|error| tracing::debug!("notifications: {error}"))
+                            .ok();
+                    }
+                    let Some(connection) = &connection else {
+                        continue;
+                    };
+                    let proxy = connection.with_proxy(
+                        "org.freedesktop.Notifications",
+                        "/org/freedesktop/Notifications",
+                        Duration::from_secs(2),
+                    );
+                    let answer: Result<(u32,), _> = proxy.method_call(
+                        "org.freedesktop.Notifications",
+                        "Notify",
+                        (
+                            "proton-stream",
+                            0u32,
+                            "io.narl.proton-stream",
+                            summary,
+                            body,
+                            Vec::<String>::new(),
+                            PropMap::new(),
+                            -1i32,
+                        ),
+                    );
+                    if let Err(error) = answer {
+                        tracing::debug!("notification: {error}");
+                    }
+                }
+            })
+            .inspect_err(|error| tracing::debug!("notify thread: {error}"))
+            .ok()?;
+        Some(orders)
+    }
+}
+
+#[cfg(windows)]
+mod windows {
+    use std::path::{Path, PathBuf};
+    use std::sync::mpsc::{Sender, channel};
+
+    use tauri_winrt_notification::Toast;
+
+    /// The id toasts are shown under, and the key it is registered at.
+    const APP_ID: &str = "io.narl.proton-stream";
+    const ICON: &[u8] = include_bytes!("../assets/icon-256.png");
+
+    pub fn spawn(icon: PathBuf) -> Option<Sender<(String, String)>> {
+        let (orders, receiver) = channel::<(String, String)>();
+        std::thread::Builder::new()
+            .name("notify".into())
+            .spawn(move || {
+                // Registered on first use rather than at startup: most
+                // sessions never send one.
+                let mut app_id: Option<&str> = None;
+                for (summary, body) in receiver {
+                    let id = *app_id.get_or_insert_with(|| {
+                        let _ = std::fs::write(&icon, ICON);
+                        if register(&icon) {
+                            APP_ID
+                        } else {
+                            Toast::POWERSHELL_APP_ID
+                        }
+                    });
+                    let shown = Toast::new(id).title(&summary).text1(&body).show();
+                    if let Err(error) = shown {
+                        tracing::debug!("notification: {error}");
+                    }
+                }
+            })
+            .inspect_err(|error| tracing::debug!("notify thread: {error}"))
+            .ok()?;
+        Some(orders)
+    }
+
+    /// Tell Windows the app id's display name and icon. Per user, no rights
+    /// needed, and written again every session so a moved install points at
+    /// a live icon.
+    fn register(icon: &Path) -> bool {
+        use windows_sys::Win32::System::Registry::{
+            HKEY, HKEY_CURRENT_USER, KEY_WRITE, REG_OPTION_NON_VOLATILE, REG_SZ, RegCloseKey,
+            RegCreateKeyExW, RegSetValueExW,
+        };
+
+        fn wide(text: &str) -> Vec<u16> {
+            text.encode_utf16().chain(std::iter::once(0)).collect()
+        }
+
+        let path = wide(&format!(r"Software\Classes\AppUserModelId\{APP_ID}"));
+        let mut key: HKEY = std::ptr::null_mut();
+        // SAFETY: every pointer is to a live, NUL-terminated buffer or an out
+        // parameter on this stack frame, and the key is closed before return.
+        unsafe {
+            let created = RegCreateKeyExW(
+                HKEY_CURRENT_USER,
+                path.as_ptr(),
+                0,
+                std::ptr::null(),
+                REG_OPTION_NON_VOLATILE,
+                KEY_WRITE,
+                std::ptr::null(),
+                &mut key,
+                std::ptr::null_mut(),
+            );
+            if created != 0 {
+                tracing::debug!("register the notification id: error {created}");
+                return false;
+            }
+            let icon = icon.to_string_lossy();
+            let mut written = true;
+            for (name, value) in [("DisplayName", "Proton Stream"), ("IconUri", icon.as_ref())] {
+                let name = wide(name);
+                let value = wide(value);
+                let bytes = u32::try_from(value.len() * 2).unwrap_or(u32::MAX);
+                let set =
+                    RegSetValueExW(key, name.as_ptr(), 0, REG_SZ, value.as_ptr().cast(), bytes);
+                written &= set == 0;
+            }
+            RegCloseKey(key);
+            written
+        }
+    }
+}

crates/pstr-app/src/pacing.rs

@@ -0,0 +1,186 @@
+//! How often the window is allowed to draw — and why it does not simply let
+//! vsync decide on Wayland.
+//!
+//! ## The bug this exists for
+//!
+//! A Wayland compositor throttles a client by *withholding* the `wl_surface`
+//! frame callback, and it withholds it for as long as the surface is not being
+//! shown — a window on another workspace, or behind a fullscreen one. Mesa's
+//! EGL implements a swap interval of 1 by waiting on exactly that callback, so
+//! `eglSwapBuffers` on a hidden surface does not return late, it does not
+//! return at all:
+//!
+//! ```text
+//!   eframe run_ui_and_paint ─▶ glutin swap_buffers ─▶ eglSwapBuffers
+//!                                                          │
+//!                              wl_display_dispatch_queue ◀─┘   ppoll, forever
+//! ```
+//!
+//! That is the whole of the UI thread, and the same thread is the one that
+//! answers `xdg_wm_base.ping`. Hyprland pings a client it has not heard from
+//! and puts up an "application is not responding" dialog when the pong does not
+//! come, which is what a viewer sees a few seconds after switching away from a
+//! playing window. Nothing is actually wrong — coming back releases the frame
+//! callback and the app carries on — but a dialog offering to kill the player
+//! is not an acceptable way to say "this window is not visible".
+//!
+//! winit cannot rescue this for us: `WindowEvent::Occluded` is X11, macOS and
+//! web only — its Wayland implementation was deliberately removed in 0.29 — so
+//! eframe never learns the window is hidden and keeps painting it.
+//!
+//! ## What is done instead
+//!
+//! On Wayland the swap interval is set to 0 ([`vsync`]), which makes
+//! `eglSwapBuffers` return immediately whether the surface is being shown or
+//! not, and the frame rate is capped here instead ([`Pacer`]). Nothing is lost
+//! by dropping vsync there: a Wayland compositor composites from the last
+//! buffer a client committed, at its own refresh, so a client that commits too
+//! often wastes work but cannot tear. X11 and Windows keep vsync, where a
+//! client really does drive the scanout and hidden windows do not block.
+//!
+//! The cap is a ceiling and not a rate: frames are drawn when something asks
+//! for one — a new mpv frame, an animation, a keystroke — so an idle window
+//! still draws nothing, and a 24 fps film still draws 24 times a second.
+
+use std::time::{Duration, Instant};
+
+/// The default ceiling, in frames a second.
+///
+/// Above the rate of any video this plays and of every animation in the app.
+/// It is deliberately not the display's refresh rate, which neither eframe nor
+/// egui gives us — a window on a 144 Hz panel therefore animates at 60 while
+/// vsync is off. [`CAP_VAR`] is the way out for someone who minds.
+const DEFAULT_CAP: f32 = 60.0;
+
+/// Overrides [`DEFAULT_CAP`]. `0` removes the ceiling altogether.
+const CAP_VAR: &str = "PSTR_FRAME_CAP";
+
+/// Whether this process is talking to a Wayland compositor, decided the way
+/// winit decides it: either variable, non-empty, Wayland first.
+pub fn on_wayland() -> bool {
+    ["WAYLAND_DISPLAY", "WAYLAND_SOCKET"]
+        .iter()
+        .any(|name| std::env::var_os(name).is_some_and(|value| !value.is_empty()))
+}
+
+/// Whether to ask for a swap interval of 1. False on Wayland — see the module
+/// documentation.
+pub fn vsync() -> bool {
+    !on_wayland()
+}
+
+/// The ceiling to pace to, or `None` when vsync is doing the pacing.
+fn cap() -> Option<f32> {
+    if vsync() {
+        return None;
+    }
+    let Ok(value) = std::env::var(CAP_VAR) else {
+        return Some(DEFAULT_CAP);
+    };
+    // Not a number, or a negative one, is a typo rather than a request to
+    // free-run — free-running is what `0` says, explicitly.
+    let parsed = value
+        .trim()
+        .parse::<f32>()
+        .ok()
+        .filter(|fps| fps.is_finite() && *fps >= 0.0);
+    match parsed {
+        Some(fps) if fps > 0.0 => Some(fps),
+        Some(_) => None,
+        None => {
+            tracing::warn!("{CAP_VAR}={value:?} is not a frame rate; using {DEFAULT_CAP}");
+            Some(DEFAULT_CAP)
+        }
+    }
+}
+
+/// Holds the draw loop to a maximum rate.
+///
+/// Sleeping is the only thing that can do this: a frame is under way by the
+/// time the app sees it, and every other source of repaints — mpv, egui's own
+/// animations — asks for the *next* one immediately. The sleep is at most one
+/// frame's worth, which is far inside the several seconds a compositor waits
+/// for a pong.
+pub struct Pacer {
+    interval: Option<Duration>,
+    last: Instant,
+}
+
+impl Default for Pacer {
+    fn default() -> Self {
+        Self::new()
+    }
+}
+
+impl Pacer {
+    /// The pacer this session wants: capped when vsync is off, a no-op when it
+    /// is on.
+    pub fn new() -> Self {
+        Self::with_cap(cap())
+    }
+
+    fn with_cap(fps: Option<f32>) -> Self {
+        Self {
+            interval: fps.map(|fps| Duration::from_secs_f32(1.0 / fps)),
+            last: Instant::now(),
+        }
+    }
+
+    /// Whether this pacer does anything at all.
+    pub fn is_capped(&self) -> bool {
+        self.interval.is_some()
+    }
+
+    /// Called once at the top of a frame: sleeps out whatever is left of the
+    /// last one's budget.
+    pub fn wait(&mut self) {
+        let Some(interval) = self.interval else {
+            return;
+        };
+        let elapsed = self.last.elapsed();
+        if let Some(left) = interval.checked_sub(elapsed) {
+            std::thread::sleep(left);
+        }
+        self.last = Instant::now();
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn an_uncapped_pacer_never_sleeps() {
+        let mut pacer = Pacer::with_cap(None);
+        assert!(!pacer.is_capped());
+        let before = Instant::now();
+        pacer.wait();
+        pacer.wait();
+        assert!(before.elapsed() < Duration::from_millis(50));
+    }
+
+    #[test]
+    fn a_capped_pacer_holds_the_second_frame_back() {
+        let mut pacer = Pacer::with_cap(Some(50.0));
+        assert!(pacer.is_capped());
+        pacer.wait();
+        let before = Instant::now();
+        pacer.wait();
+        // 20 ms apart, less whatever the first call spent. Sleeping is only
+        // ever long, so the lower bound is the one worth asserting on.
+        assert!(
+            before.elapsed() >= Duration::from_millis(10),
+            "second frame was not held back: {:?}",
+            before.elapsed()
+        );
+    }
+
+    #[test]
+    fn a_frame_that_took_longer_than_the_budget_is_not_delayed_further() {
+        let mut pacer = Pacer::with_cap(Some(1000.0));
+        std::thread::sleep(Duration::from_millis(5));
+        let before = Instant::now();
+        pacer.wait();
+        assert!(before.elapsed() < Duration::from_millis(2));
+    }
+}

crates/pstr-app/src/playback.rs

@@ -110,6 +110,16 @@ impl PlaybackTarget {
 
     /// The line under the title while this plays: the numbering, and the
     /// episode's name when a provider has given one.
+    /// How to name this file to someone not looking at its title page:
+    /// the title and the episode, or the file name when there is no title.
+    pub fn caption_or_name(&self) -> String {
+        match (self.title_name.is_empty(), self.caption()) {
+            (false, caption) if !caption.is_empty() => format!("{} — {caption}", self.title_name),
+            (false, _) => self.title_name.clone(),
+            (true, _) => self.name.clone(),
+        }
+    }
+
     pub fn caption(&self) -> String {
         match &self.episode_name {
             Some(name) if !self.subtitle.is_empty() => format!("{}  ·  {name}", self.subtitle),
@@ -120,7 +130,7 @@ impl PlaybackTarget {
 }
 
 /// What the UI can ask the player to do.
-#[derive(Debug, Clone, Copy)]
+#[derive(Debug, Clone)]
 pub enum Command {
     TogglePause,
     SeekBy(f64),
@@ -134,6 +144,13 @@ pub enum Command {
     /// every file it loads afterwards, so picking Japanese audio for one
     /// episode picks it for the next one too.
     SelectTrack(TrackKind, Option<i64>),
+    /// Move subtitles, as a percentage of the window's height. See
+    /// [`Playback::lift_subtitles`].
+    SetSubtitlePosition(f64),
+    /// 1.0 is normal speed.
+    SetSpeed(f64),
+    /// Save the current frame to this file.
+    Screenshot(std::path::PathBuf),
     Stop,
 }
 
@@ -162,6 +179,11 @@ pub struct Playback {
     /// 0–100, as mpv has it.
     pub volume: f64,
     pub muted: bool,
+    /// Playback speed, 1.0 being normal.
+    pub speed: f64,
+    /// Where subtitles were last put, so they are only moved when that changes
+    /// rather than once a frame.
+    subtitle_position: f64,
     /// What the file contains. Empty until mpv has demuxed it.
     pub tracks: Vec<Track>,
     /// The file's chapters, in order. Empty for a file muxed without them.
@@ -179,6 +201,10 @@ pub struct Playback {
     /// A seek was issued and the picture has not come back yet — the thing
     /// worth showing a spinner for on a link this slow.
     pub seeking: bool,
+    /// The end of what mpv has read ahead, in seconds from the start.
+    pub buffered: Option<f64>,
+    /// Playback is held waiting for data.
+    pub buffering: bool,
 }
 
 impl Playback {
@@ -196,10 +222,9 @@ impl Playback {
         target: PlaybackTarget,
         stream: VideoStream,
         gl: Option<&Arc<glow::Context>>,
-        ctx: &egui::Context,
     ) -> Result<Self, String> {
         let prefs = engine.playback_prefs();
-        let (player, video) = build_player(engine, &target, &prefs, gl, ctx)?;
+        let (player, video) = build_player(engine, &target, &prefs, gl)?;
 
         let (commands, orders) = channel::<Command>();
         let id = NEXT_ID.fetch_add(1, Ordering::Relaxed);
@@ -234,6 +259,8 @@ impl Playback {
             paused: false,
             volume: prefs.volume,
             muted: prefs.muted,
+            subtitle_position: 100.0,
+            speed: prefs.speed,
             tracks: Vec::new(),
             chapters: Vec::new(),
             roles: Vec::new(),
@@ -242,10 +269,30 @@ impl Playback {
             duration: None,
             loaded: false,
             seeking: false,
+            buffered: None,
+            buffering: false,
             target,
         })
     }
 
+    /// Keep subtitles clear of `covered` points at the bottom of a picture
+    /// `height` points tall — the controls, while they are up.
+    ///
+    /// Without it the line being read sits under the seek bar for as long as
+    /// the mouse is moving, which is exactly when someone is looking at the
+    /// screen.
+    pub fn lift_subtitles(&mut self, covered: f32, height: f32) {
+        let position = if covered > 0.0 && height > 0.0 {
+            (100.0 * (1.0 - f64::from(covered / height))).round()
+        } else {
+            100.0
+        };
+        if position != self.subtitle_position {
+            self.subtitle_position = position;
+            self.send(Command::SetSubtitlePosition(position));
+        }
+    }
+
     /// Whether the picture is drawn in this window rather than mpv's own.
     pub fn is_embedded(&self) -> bool {
         self.video.is_some()
@@ -329,6 +376,8 @@ impl Playback {
             PlayerEvent::Paused(paused) => self.paused = *paused,
             PlayerEvent::Seek => self.seeking = true,
             PlayerEvent::PlaybackRestart => self.seeking = false,
+            PlayerEvent::Buffered(end) => self.buffered = Some(*end),
+            PlayerEvent::Buffering(held) => self.buffering = *held,
             _ => {}
         }
     }
@@ -365,7 +414,6 @@ fn build_player(
     target: &PlaybackTarget,
     prefs: &PlaybackPrefs,
     gl: Option<&Arc<glow::Context>>,
-    ctx: &egui::Context,
 ) -> Result<(Arc<Player>, Option<VideoSurface>), String> {
     let title = format!("proton-stream — {}", target.name);
 
@@ -377,6 +425,7 @@ fn build_player(
             // controller would be a second set of controls over the same file.
             on_screen_controller: false,
             default_keybindings: false,
+            hardware_decoding: engine.desktop_prefs().hardware_decoding,
             ..from_prefs(prefs, target.track_prefs.as_deref())
         };
 
@@ -386,8 +435,12 @@ fn build_player(
                 // SAFETY: called from `App::ui`, where eframe has made this
                 // context current, and the surface is dropped from the same
                 // place — see `video.rs`.
-                match unsafe { VideoSurface::new(Arc::clone(&player), Arc::clone(gl), ctx.clone()) }
+                match unsafe {
-                {
+                    VideoSurface::new(Arc::clone(&player), Arc::clone(gl), {
+                        let engine = engine.clone();
+                        move || engine.wake()
+                    })
+                } {
                     Ok(video) => return Ok((player, Some(video))),
                     Err(error) => {
                         tracing::warn!("embed the video: {error}; falling back to a window");
@@ -406,6 +459,7 @@ fn build_player(
 
     let config = PlayerConfig {
         window_title: title,
+        hardware_decoding: engine.desktop_prefs().hardware_decoding,
         ..from_prefs(prefs, target.track_prefs.as_deref())
     };
     let player = Player::new(engine.runtime().clone(), config)
@@ -428,6 +482,9 @@ fn from_prefs(
             .and_then(|p| p.subtitle_language.clone())
             .or_else(|| prefs.subtitle_language.clone()),
         subtitles: show.map(|p| p.subtitles).unwrap_or(prefs.subtitles),
+        // Carried from file to file, like the volume: somebody who watches at
+        // 1.25 watches the next episode at 1.25 too.
+        options: vec![("speed".into(), format!("{:.2}", prefs.speed))],
         ..PlayerConfig::default()
     }
 }
@@ -487,8 +544,12 @@ fn run(
             PlayerEvent::FileLoaded => {
                 duration = player.duration();
                 // The first moment there is a track list to read: mpv has
-                // demuxed the file and made its own default selection, which
+                // demuxed the file and made its own default selection. Put the
-                // is what the menus have to open showing.
+                // title's own choice over it before the menus are told, so they
+                // open showing what is actually playing.
+                if let Some(show) = target.track_prefs.as_deref() {
+                    restore_tracks(&player, show);
+                }
                 emit_tracks(&engine, id, &player);
                 // Only now is there a timeline to seek within.
                 if !resumed && let Some(at) = target.resume_at {
@@ -565,6 +626,9 @@ fn apply_command(
         Command::SeekTo(seconds) => player.seek_to(seconds),
         Command::SetVolume(volume) => player.set_volume(volume),
         Command::SetMuted(muted) => player.set_muted(muted),
+        Command::SetSubtitlePosition(percent) => player.set_subtitle_position(percent),
+        Command::SetSpeed(speed) => player.set_speed(speed),
+        Command::Screenshot(path) => player.screenshot(&path),
         Command::SelectTrack(kind, track) => select_track(engine, id, player, kind, track),
         Command::Stop => {
             let _ = player.quit();
@@ -611,6 +675,44 @@ fn select_track(
     Ok(())
 }
 
+/// Put back the tracks this title was last watched with.
+///
+/// `alang`/`slang` already steered mpv's pick by language. This is for what a
+/// language cannot say — which of two English subtitle tracks, or an audio track
+/// with a name and no tag — so only a remembered *title* acts here; a title with
+/// nothing but a language keeps mpv's selection, which honours it already.
+fn restore_tracks(player: &Player, show: &pstr_core::catalog::TitleTrackPrefs) {
+    let tracks = player.tracks();
+    let wanted = [
+        (
+            TrackKind::Audio,
+            show.audio_language.as_deref(),
+            show.audio_title.as_deref(),
+            true,
+        ),
+        (
+            TrackKind::Subtitle,
+            show.subtitle_language.as_deref(),
+            show.subtitle_title.as_deref(),
+            show.subtitles,
+        ),
+    ];
+    for (kind, language, title, enabled) in wanted {
+        if !enabled || title.is_none() {
+            continue;
+        }
+        let Some(track) = pstr_player::pick_track(&tracks, kind, language, title) else {
+            continue;
+        };
+        let playing = tracks
+            .iter()
+            .any(|candidate| candidate.kind == kind && candidate.id == track && candidate.selected);
+        if !playing && let Err(error) = player.select_track(kind, Some(track)) {
+            tracing::warn!("restore {} track {track}: {error}", kind.label());
+        }
+    }
+}
+
 /// Tell the UI what the file contains and what of it is playing.
 fn emit_tracks(engine: &Engine, id: u64, player: &Player) {
     engine.emit(Event::Player {

crates/pstr-app/src/theme.rs

@@ -35,6 +35,12 @@ pub const CARD_WIDTH: f32 = 232.0;
 /// Video stills are 16:9. A poster shape would letterbox every one of them.
 pub const CARD_ASPECT: f32 = 9.0 / 16.0;
 pub const CARD_GAP: f32 = 14.0;
+/// The poster grid's minimum width: narrower than a still, because a cover is
+/// read by its art rather than by detail, and six across a laptop screen is
+/// what makes a wall of covers look like a shelf.
+pub const POSTER_WIDTH: f32 = 168.0;
+/// Covers are 2:3.
+pub const POSTER_ASPECT: f32 = 3.0 / 2.0;
 
 /// The type ramp, named once.
 ///
@@ -84,38 +90,171 @@ impl Role {
         }
     }
 
+    /// Headings are set in the semibold cut; everything below them in the
+    /// regular one.
+    pub fn family(self) -> egui::FontFamily {
+        match self {
+            Self::Display | Self::Title | Self::Heading | Self::Section => semibold(),
+            _ => egui::FontFamily::Proportional,
+        }
+    }
+
     /// For the hand-painted parts, which lay text out through a `Painter` and
     /// never see a `RichText`.
     pub fn font(self) -> egui::FontId {
-        egui::FontId::proportional(self.size())
+        egui::FontId::new(self.size(), self.family())
     }
 
     /// For the parts that go through egui's widgets.
     pub fn rich(self, text: impl Into<String>) -> egui::RichText {
-        egui::RichText::new(text).size(self.size())
+        egui::RichText::new(text)
+            .size(self.size())
+            .family(self.family())
     }
 }
 
-/// Install a real CJK fallback before the default egui fonts.  egui ships a
+/// The spacing scale. Gaps between things come from here rather than being
-/// compact Latin font, but it intentionally does not bundle the multi-megabyte
+/// picked per call site, so two neighbouring groups are 12 apart or 16 apart
-/// CJK families.  Native desktops already provide one, so use it when present.
+/// and never 14 in one place and 15 in the next.
-pub fn install_font_fallbacks(ctx: &egui::Context) {
+pub mod space {
+    /// Between lines that belong to one thing: a title and its caption.
+    pub const XXS: f32 = 2.0;
+    pub const XS: f32 = 4.0;
+    /// Between controls in one cluster.
+    pub const S: f32 = 6.0;
+    pub const M: f32 = 8.0;
+    /// Between clusters on one row, and between rows of a form.
+    pub const L: f32 = 12.0;
+    /// Between the groups on a page.
+    pub const XL: f32 = 16.0;
+    /// Between sections.
+    pub const XXL: f32 = 24.0;
+}
+
+/// Corner radii, as `egui::CornerRadius::same` takes them.
+pub mod radius {
+    /// A progress bar, or a strip along an edge.
+    pub const BAR: u8 = 3;
+    /// A badge over artwork. Android's `Shape.kt` has the same number.
+    pub const BADGE: u8 = 4;
+    /// A small control inside something else: a menu entry, a chip.
+    pub const SM: u8 = 6;
+    /// Everything else either client paints: cards, buttons, the tab pill.
+    pub const MD: u8 = 8;
+    /// Something that floats: a row card, a dialog, a toast, the hero.
+    pub const LG: u8 = 12;
+}
+
+/// How long things take to change, in seconds, for `Context::animate_*`.
+pub mod motion {
+    /// A press, which has to answer before the finger is off the button.
+    pub const PRESS: f32 = 0.05;
+    /// A hover arriving and leaving.
+    pub const HOVER: f32 = 0.12;
+    /// A control changing state: a switch flipping, the tab pill travelling,
+    /// one page giving way to the next.
+    pub const STATE: f32 = 0.15;
+    /// Chrome fading in and out: the player's controls, a toast.
+    pub const FADE: f32 = 0.18;
+    /// Artwork arriving over its placeholder. Slower, because it replaces
+    /// something rather than adding to it, and a fast swap reads as a flicker.
+    pub const ARRIVE: f32 = 0.24;
+
+    /// Fast out, slow in: the curve every hand-driven transition uses.
+    pub fn ease_out(t: f32) -> f32 {
+        1.0 - (1.0 - t.clamp(0.0, 1.0)).powi(3)
+    }
+}
+
+/// The UI typeface, bundled rather than taken from the system so a title
+/// sets the same on every desktop. Inter, under the OFL — the licence is
+/// beside the files.
+///
+/// Both files have their private use area mappings removed, because the
+/// Phosphor icons live there. Inter maps 745 codepoints in that area to its
+/// own alternate glyphs, and as the first font in the family it won: the
+/// refresh arrow drew as an accented letter. The glyphs themselves are still
+/// in the files; only the character map entries are gone. Strip them again
+/// after any Inter update (fontTools: drop every `cmap` subtable entry in
+/// U+E000..=U+F8FF).
+const INTER: &[u8] = include_bytes!("../assets/fonts/Inter-Regular.ttf");
+const INTER_SEMIBOLD: &[u8] = include_bytes!("../assets/fonts/Inter-SemiBold.ttf");
+
+/// The family the headings are set in. egui has no notion of weight, so the
+/// semibold cut is a family of its own.
+pub fn semibold() -> egui::FontFamily {
+    egui::FontFamily::Name("semibold".into())
+}
+
+/// Inter, the icon font, and egui's own fonts behind them for the emoji and
+/// symbols Inter does not carry. `cjk` goes last, when there is one.
+fn font_definitions(cjk: Option<egui::FontData>) -> egui::FontDefinitions {
+    use egui::FontFamily::{Monospace, Proportional};
+
+    let mut fonts = egui::FontDefinitions::default();
+    fonts
+        .font_data
+        .insert("inter".into(), Arc::new(egui::FontData::from_static(INTER)));
+    fonts.font_data.insert(
+        "inter-semibold".into(),
+        Arc::new(egui::FontData::from_static(INTER_SEMIBOLD)),
+    );
+    fonts
+        .families
+        .entry(Proportional)
+        .or_default()
+        .insert(0, "inter".into());
+    // Right behind Inter. The icons are in the private use area, which the
+    // bundled Inter no longer maps, so neither font shadows the other.
+    egui_phosphor::add_to_fonts(&mut fonts, egui_phosphor::Variant::Regular);
+    if let Some(cjk) = cjk {
+        let name = "system-cjk-fallback".to_owned();
+        fonts.font_data.insert(name.clone(), Arc::new(cjk));
+        for family in [Proportional, Monospace] {
+            fonts.families.entry(family).or_default().push(name.clone());
+        }
+    }
+    let fallbacks = fonts.families[&Proportional]
+        .iter()
+        .filter(|name| *name != "inter")
+        .cloned();
+    let semibold_chain = std::iter::once("inter-semibold".to_owned())
+        .chain(fallbacks)
+        .collect();
+    fonts.families.insert(semibold(), semibold_chain);
+    fonts
+}
+
+/// Install the bundled fonts now, and a CJK fallback when the system has one.
+///
+/// The bundled ones are compiled in and cost nothing to hand over. The CJK
+/// fallback is on a thread of its own: `fc-match` and reading a font file of
+/// tens of megabytes held the first frame back by a visible moment, and every
+/// name that needs the fallback is still loading from the catalog by then
+/// anyway. egui deliberately does not bundle the multi-megabyte CJK families,
+/// and native desktops already provide one.
+pub fn install_fonts(ctx: &egui::Context) {
+    ctx.set_fonts(font_definitions(None));
+    let ctx = ctx.clone();
+    let spawned = std::thread::Builder::new()
+        .name("fonts".into())
+        .spawn(move || install_cjk_fallback(&ctx));
+    if let Err(error) = spawned {
+        tracing::debug!("font fallback thread: {error}");
+    }
+}
+
+fn install_cjk_fallback(ctx: &egui::Context) {
     let Some((path, index)) = system_cjk_font() else {
         return;
     };
     let Ok(bytes) = std::fs::read(path) else {
         return;
     };
-
-    let mut fonts = egui::FontDefinitions::default();
     let mut data = egui::FontData::from_owned(bytes);
     data.index = index;
-    let name = "system-cjk-fallback".to_owned();
+    ctx.set_fonts(font_definitions(Some(data)));
-    fonts.font_data.insert(name.clone(), Arc::new(data));
+    ctx.request_repaint();
-    for family in [egui::FontFamily::Proportional, egui::FontFamily::Monospace] {
-        fonts.families.entry(family).or_default().push(name.clone());
-    }
-    ctx.set_fonts(fonts);
 }
 
 #[cfg(target_os = "linux")]
@@ -358,6 +497,36 @@ fn fill(painter: &egui::Painter, rect: Rect, corner_radius: CornerRadius, palett
     painter.add(textured(rect, corner_radius, &texture));
 }
 
+/// A rounded rectangle running from one colour to another, at `opacity`.
+///
+/// For colours that are not the palette's — a title's own, on a tile with no
+/// picture. Drawn flat when the viewer has ramps off, like every other ramp.
+pub fn ramp_fill(
+    painter: &egui::Painter,
+    rect: Rect,
+    corner_radius: CornerRadius,
+    (from, to): (Color32, Color32),
+    direction: Direction,
+    opacity: f32,
+) {
+    let tint = Color32::WHITE.gamma_multiply(opacity);
+    if !ramps_on() {
+        painter.rect_filled(
+            rect,
+            corner_radius,
+            mix(from, to, 0.5).gamma_multiply(opacity),
+        );
+        return;
+    }
+    let texture = ramp(painter.ctx(), from, to, direction);
+    painter.add(
+        egui::epaint::RectShape::filled(rect, corner_radius, tint).with_texture(
+            texture.id(),
+            Rect::from_min_max(egui::pos2(0.0, 0.0), egui::pos2(1.0, 1.0)),
+        ),
+    );
+}
+
 /// A ramp from `color` to nothing, for laying artwork into the page.
 ///
 /// The other ramps here run between two opaque colours; this one runs down its
@@ -524,7 +693,7 @@ pub fn apply(ctx: &egui::Context, appearance: Appearance) {
     visuals.selection.stroke = Stroke::new(1.0, palette.text);
     visuals.hyperlink_color = palette.accent;
 
-    let radius = CornerRadius::same(8);
+    let radius = CornerRadius::same(radius::MD);
     visuals.widgets.noninteractive.bg_fill = palette.surface;
     visuals.widgets.noninteractive.corner_radius = radius;
     visuals.widgets.noninteractive.bg_stroke = Stroke::new(1.0, palette.border);
@@ -686,6 +855,27 @@ const RAMP_STOPS: usize = 64;
 mod tests {
     use super::*;
 
+    #[test]
+    fn the_bundled_inter_leaves_the_icon_codepoints_to_phosphor() {
+        use skrifa::MetadataProvider as _;
+
+        for (name, bytes) in [("regular", INTER), ("semibold", INTER_SEMIBOLD)] {
+            let font = skrifa::FontRef::new(bytes).expect("bundled Inter parses");
+            let shadowed: Vec<u32> = font
+                .charmap()
+                .mappings()
+                .map(|(codepoint, _)| codepoint)
+                .filter(|codepoint| (0xE000..=0xF8FF).contains(codepoint))
+                .collect();
+            assert!(
+                shadowed.is_empty(),
+                "Inter {name} maps {} private use codepoints, starting U+{:04X}",
+                shadowed.len(),
+                shadowed[0]
+            );
+        }
+    }
+
     #[test]
     fn the_shipped_default_is_the_palette_that_was_here_before() {
         let resolved = Palette::resolve(Appearance::default());

crates/pstr-app/src/ui/account.rs

@@ -0,0 +1,602 @@
+//! The Proton account, on the shares page: signing in, watch-history sync, and
+//! picking folders of the viewer's own Drive as library shares.
+//!
+//! Optional and said so: public links need no account, and the page reads the
+//! same without one. What signing in adds is spelled out next to the form,
+//! because "sign in" alone does not say why an app that streams public links
+//! would want a password.
+
+use pstr_core::account::{DriveEntry, DrivePlace, PlaceKind};
+use pstr_core::proton_sdk::ids::NodeUid;
+use pstr_core::sync::SyncReport;
+
+use crate::app::Action;
+use crate::engine::AccountStatus;
+use crate::theme;
+use crate::ui;
+
+/// What the account section holds between frames.
+#[derive(Default)]
+pub struct AccountPanel {
+    pub status: AccountStatus,
+    pub username: String,
+    pub password: String,
+    pub code: String,
+    pub mailbox: String,
+    /// A request is out and not answered yet.
+    pub busy: bool,
+    /// Why the last sign-in step was refused.
+    pub error: Option<String>,
+    /// When watch history last synced, in Unix seconds, and what it did.
+    pub synced: Option<(i64, SyncReport)>,
+    /// Why the last sync failed, until one succeeds.
+    pub sync_error: Option<String>,
+    pub browser: DriveBrowser,
+}
+
+impl AccountPanel {
+    /// Apply where the account now stands. The typed secrets go as soon as
+    /// they are not needed: a password has no business sitting in a struct for
+    /// the rest of the session.
+    pub fn set_status(&mut self, status: AccountStatus) {
+        self.busy = false;
+        match &status {
+            AccountStatus::SignedIn(_) | AccountStatus::SignedOut => {
+                self.password.clear();
+                self.code.clear();
+                self.mailbox.clear();
+                if matches!(status, AccountStatus::SignedIn(_)) {
+                    self.error = None;
+                } else {
+                    self.browser = DriveBrowser::default();
+                    self.synced = None;
+                    self.sync_error = None;
+                }
+            }
+            AccountStatus::SecondFactor => self.error = None,
+            AccountStatus::MailboxPassword => {
+                self.code.clear();
+                self.error = None;
+            }
+            AccountStatus::Unknown => {}
+        }
+        self.status = status;
+    }
+
+    pub fn refused(&mut self, error: String) {
+        self.busy = false;
+        self.error = Some(error);
+    }
+}
+
+/// Where the Drive browser is.
+#[derive(Default)]
+pub struct DriveBrowser {
+    pub open: bool,
+    /// The folders descended through, each by name. Empty means the places.
+    pub trail: Vec<(String, NodeUid)>,
+    pub places: Option<Vec<DrivePlace>>,
+    /// The listing of the folder at the end of the trail, once it arrives.
+    pub entries: Option<(NodeUid, Vec<DriveEntry>)>,
+    pub loading: bool,
+    pub error: Option<String>,
+}
+
+impl DriveBrowser {
+    pub fn places_arrived(&mut self, places: Vec<DrivePlace>) {
+        self.loading = false;
+        self.error = None;
+        self.places = Some(places);
+    }
+
+    /// Take a listing, unless the viewer has already moved on from it.
+    pub fn folder_arrived(&mut self, uid: NodeUid, entries: Vec<DriveEntry>) {
+        if self
+            .trail
+            .last()
+            .is_some_and(|(_, current)| *current == uid)
+        {
+            self.loading = false;
+            self.error = None;
+            self.entries = Some((uid, entries));
+        }
+    }
+
+    pub fn failed(&mut self, error: String) {
+        self.loading = false;
+        self.error = Some(error);
+    }
+
+    fn enter(&mut self, name: String, uid: NodeUid, actions: &mut Vec<Action>) {
+        self.trail.push((name, uid.clone()));
+        self.entries = None;
+        self.loading = true;
+        self.error = None;
+        actions.push(Action::BrowseFolder(uid));
+    }
+
+    fn up(&mut self, actions: &mut Vec<Action>) {
+        self.trail.pop();
+        self.entries = None;
+        self.error = None;
+        match self.trail.last() {
+            Some((_, uid)) => {
+                self.loading = true;
+                actions.push(Action::BrowseFolder(uid.clone()));
+            }
+            None => self.loading = self.places.is_none(),
+        }
+    }
+}
+
+/// The account card: a sign-in form, or who is signed in and how sync is doing.
+pub fn section(ui: &mut egui::Ui, panel: &mut AccountPanel, actions: &mut Vec<Action>) {
+    ui::section(ui, "Proton account");
+    ui.label(ui::muted(
+        "Optional. Signed in, your watch history is kept in your own Drive and every device \
+         resumes where another left off, and folders of your Drive — your files, other \
+         devices, what was shared with you — can be added to the library.",
+    ));
+    ui.add_space(theme::space::L);
+
+    card(ui, |ui| match panel.status.clone() {
+        AccountStatus::Unknown => {
+            ui.horizontal(|ui| {
+                ui.add(egui::Spinner::new().size(14.0));
+                ui.label(ui::muted("reading the stored session…"));
+            });
+        }
+        AccountStatus::SignedOut => sign_in_form(ui, panel, actions),
+        AccountStatus::SecondFactor => code_form(ui, panel, actions),
+        AccountStatus::MailboxPassword => mailbox_form(ui, panel, actions),
+        AccountStatus::SignedIn(username) => signed_in(ui, panel, &username, actions),
+    });
+}
+
+fn card(ui: &mut egui::Ui, add: impl FnOnce(&mut egui::Ui)) {
+    egui::Frame::new()
+        .fill(theme::card())
+        .corner_radius(egui::CornerRadius::same(theme::radius::MD))
+        .inner_margin(egui::Margin::same(14))
+        .show(ui, |ui| {
+            ui.set_width(ui.available_width().min(640.0));
+            add(ui);
+        });
+}
+
+fn sign_in_form(ui: &mut egui::Ui, panel: &mut AccountPanel, actions: &mut Vec<Action>) {
+    ui.label(ui::muted("Address"));
+    ui.add(
+        egui::TextEdit::singleline(&mut panel.username)
+            .hint_text("you@proton.me")
+            .desired_width(f32::INFINITY),
+    );
+    ui.add_space(theme::space::M);
+    ui.label(ui::muted("Password"));
+    let field = ui.add(
+        egui::TextEdit::singleline(&mut panel.password)
+            .password(true)
+            .desired_width(f32::INFINITY),
+    );
+    ui.add_space(theme::space::L);
+    error_line(ui, panel);
+    let ready = !panel.username.trim().is_empty() && !panel.password.is_empty() && !panel.busy;
+    let submitted = field.lost_focus() && ui.input(|input| input.key_pressed(egui::Key::Enter));
+    ui.horizontal(|ui| {
+        let clicked = ui
+            .add_enabled_ui(ready, |ui| ui::accent_button(ui, "Sign in"))
+            .inner
+            .clicked();
+        if ready && (clicked || submitted) {
+            panel.busy = true;
+            panel.error = None;
+            actions.push(Action::SignIn {
+                username: panel.username.trim().to_owned(),
+                password: panel.password.clone(),
+            });
+        }
+        busy_line(ui, panel, "signing in…");
+    });
+}
+
+fn code_form(ui: &mut egui::Ui, panel: &mut AccountPanel, actions: &mut Vec<Action>) {
+    ui.label(ui::muted("Two-factor code from your authenticator app"));
+    let field = ui.add(
+        egui::TextEdit::singleline(&mut panel.code)
+            .hint_text("123456")
+            .desired_width(160.0),
+    );
+    field.request_focus();
+    ui.add_space(theme::space::S);
+    // Security keys need WebAuthn, which the sign-in here does not speak. An
+    // account with nothing else is refused before this form (`AccountStore`).
+    ui.label(ui::muted(
+        "Security keys are not supported here — use the code from your authenticator app.",
+    ));
+    ui.add_space(theme::space::L);
+    error_line(ui, panel);
+    let ready = !panel.code.trim().is_empty() && !panel.busy;
+    let submitted = field.lost_focus() && ui.input(|input| input.key_pressed(egui::Key::Enter));
+    ui.horizontal(|ui| {
+        let clicked = ui
+            .add_enabled_ui(ready, |ui| ui::accent_button(ui, "Continue"))
+            .inner
+            .clicked();
+        if ready && (clicked || submitted) {
+            panel.busy = true;
+            actions.push(Action::SubmitSecondFactor(panel.code.trim().to_owned()));
+        }
+        if ui.button("Cancel").clicked() {
+            actions.push(Action::CancelSignIn);
+        }
+        busy_line(ui, panel, "checking…");
+    });
+}
+
+fn mailbox_form(ui: &mut egui::Ui, panel: &mut AccountPanel, actions: &mut Vec<Action>) {
+    ui.label(ui::muted(
+        "This account has a separate mailbox password. It unlocks your files, and is kept \
+         in your system keyring.",
+    ));
+    ui.add_space(theme::space::S);
+    let field = ui.add(
+        egui::TextEdit::singleline(&mut panel.mailbox)
+            .password(true)
+            .hint_text("Mailbox password")
+            .desired_width(f32::INFINITY),
+    );
+    ui.add_space(theme::space::L);
+    error_line(ui, panel);
+    let ready = !panel.mailbox.is_empty() && !panel.busy;
+    let submitted = field.lost_focus() && ui.input(|input| input.key_pressed(egui::Key::Enter));
+    ui.horizontal(|ui| {
+        let clicked = ui
+            .add_enabled_ui(ready, |ui| ui::accent_button(ui, "Unlock"))
+            .inner
+            .clicked();
+        if ready && (clicked || submitted) {
+            panel.busy = true;
+            actions.push(Action::SubmitMailboxPassword(panel.mailbox.clone()));
+        }
+        if ui.button("Cancel").clicked() {
+            actions.push(Action::CancelSignIn);
+        }
+        busy_line(ui, panel, "unlocking…");
+    });
+}
+
+fn signed_in(
+    ui: &mut egui::Ui,
+    panel: &mut AccountPanel,
+    username: &str,
+    actions: &mut Vec<Action>,
+) {
+    ui.horizontal(|ui| {
+        ui.vertical(|ui| {
+            ui.label(
+                egui::RichText::new(format!(
+                    "{}  {username}",
+                    egui_phosphor::regular::USER_CIRCLE
+                ))
+                .strong(),
+            );
+            let status = match (&panel.sync_error, &panel.synced) {
+                (Some(error), _) => format!("Watch history did not sync: {error}"),
+                (None, Some((at, report))) => sync_line(*at, report, unix_now()),
+                (None, None) => "Watch history syncs with your Drive".to_owned(),
+            };
+            ui.label(ui::muted(status));
+        });
+        ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
+            if ui
+                .add(
+                    egui::Button::new(format!("{}  Sign out", egui_phosphor::regular::SIGN_OUT))
+                        .fill(theme::card_hover()),
+                )
+                .clicked()
+            {
+                actions.push(Action::SignOut);
+            }
+            if ui
+                .button(format!(
+                    "{}  Sync now",
+                    egui_phosphor::regular::ARROWS_CLOCKWISE
+                ))
+                .clicked()
+            {
+                actions.push(Action::SyncNow);
+            }
+        });
+    });
+}
+
+/// "Synced 3 min ago · 2 positions from other devices".
+fn sync_line(at: i64, report: &SyncReport, now: i64) -> String {
+    let ago = (now - at).max(0);
+    let when = match ago {
+        0..60 => "just now".to_owned(),
+        60..3600 => format!("{} min ago", ago / 60),
+        _ => format!("{} h ago", ago / 3600),
+    };
+    let mut line = format!("Synced {when}");
+    if report.applied > 0 {
+        line.push_str(&format!(
+            "  ·  {} from other devices",
+            ui::library::plural(report.applied, "position")
+        ));
+    }
+    line
+}
+
+fn error_line(ui: &mut egui::Ui, panel: &AccountPanel) {
+    if let Some(error) = &panel.error {
+        ui.label(theme::Role::Caption.rich(error).color(theme::danger()));
+        ui.add_space(theme::space::S);
+    }
+}
+
+fn busy_line(ui: &mut egui::Ui, panel: &AccountPanel, text: &str) {
+    if panel.busy {
+        ui.add(egui::Spinner::new().size(14.0));
+        ui.label(ui::muted(text));
+    }
+}
+
+/// Browse the account's Drive and add a folder of it to the library.
+pub fn browser(
+    ui: &mut egui::Ui,
+    panel: &mut AccountPanel,
+    shares: &[pstr_core::Share],
+    actions: &mut Vec<Action>,
+) {
+    if !matches!(panel.status, AccountStatus::SignedIn(_)) {
+        return;
+    }
+    ui.add_space(theme::space::XXL);
+    ui::section(ui, "Add from your Drive");
+    let browser = &mut panel.browser;
+    if !browser.open {
+        ui.label(ui::muted(
+            "A folder of your own Drive becomes a share like any link: crawled, browsable and \
+             streamed through your account.",
+        ));
+        ui.add_space(theme::space::L);
+        if ui
+            .button(format!(
+                "{}  Browse your Drive",
+                egui_phosphor::regular::FOLDER
+            ))
+            .clicked()
+        {
+            browser.open = true;
+            if browser.places.is_none() {
+                browser.loading = true;
+                actions.push(Action::BrowsePlaces);
+            }
+        }
+        return;
+    }
+
+    card(ui, |ui| {
+        ui.horizontal(|ui| {
+            if !browser.trail.is_empty()
+                && ui
+                    .button(egui_phosphor::regular::ARROW_LEFT)
+                    .on_hover_text("Up a folder")
+                    .clicked()
+            {
+                browser.up(actions);
+            }
+            let mut crumbs = vec!["Drive".to_owned()];
+            crumbs.extend(browser.trail.iter().map(|(name, _)| name.clone()));
+            ui.label(
+                egui::RichText::new(
+                    crumbs.join(&format!("  {}  ", egui_phosphor::regular::CARET_RIGHT)),
+                )
+                .strong(),
+            );
+            ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
+                if ui.button("Close").clicked() {
+                    browser.open = false;
+                }
+            });
+        });
+        ui.add_space(theme::space::M);
+
+        if let Some(error) = &browser.error {
+            ui.label(theme::Role::Caption.rich(error).color(theme::danger()));
+            ui.add_space(theme::space::S);
+        }
+        if browser.loading {
+            ui.horizontal(|ui| {
+                ui.add(egui::Spinner::new().size(14.0));
+                ui.label(ui::muted("listing…"));
+            });
+            return;
+        }
+
+        let mut entered = None;
+        egui::ScrollArea::vertical()
+            .max_height(320.0)
+            .auto_shrink([false, true])
+            .show(ui, |ui| match browser.trail.last() {
+                None => {
+                    for place in browser.places.iter().flatten() {
+                        let icon = match place.kind {
+                            PlaceKind::MyFiles => egui_phosphor::regular::HARD_DRIVES,
+                            PlaceKind::Device => egui_phosphor::regular::DESKTOP,
+                            PlaceKind::SharedWithMe => egui_phosphor::regular::USERS,
+                        };
+                        if row(ui, icon, &place.name, None, true).clicked() {
+                            entered = Some((place.name.clone(), place.uid.clone()));
+                        }
+                    }
+                }
+                Some(_) => {
+                    let entries = browser
+                        .entries
+                        .as_ref()
+                        .map(|(_, entries)| entries.as_slice());
+                    if entries.is_some_and(<[DriveEntry]>::is_empty) {
+                        ui.label(ui::muted("This folder is empty."));
+                    }
+                    for entry in entries.unwrap_or_default() {
+                        let (icon, detail) = if entry.is_folder {
+                            (egui_phosphor::regular::FOLDER, None)
+                        } else if entry
+                            .media_type
+                            .as_deref()
+                            .is_some_and(|media| media.starts_with("video/"))
+                        {
+                            (
+                                egui_phosphor::regular::FILE_VIDEO,
+                                entry.size.map(format_size),
+                            )
+                        } else {
+                            (egui_phosphor::regular::FILE, entry.size.map(format_size))
+                        };
+                        if row(ui, icon, &entry.name, detail.as_deref(), entry.is_folder).clicked()
+                            && entry.is_folder
+                        {
+                            entered = Some((entry.name.clone(), entry.uid.clone()));
+                        }
+                    }
+                }
+            });
+        if let Some((name, uid)) = entered {
+            browser.enter(name, uid, actions);
+        }
+
+        if let Some((name, uid)) = browser.trail.last() {
+            ui.add_space(theme::space::L);
+            let added = shares.iter().any(|share| {
+                share
+                    .folder
+                    .as_ref()
+                    .is_some_and(|folder| folder.uid() == *uid)
+            });
+            ui.horizontal(|ui| {
+                if added {
+                    ui.label(ui::muted("This folder is already in the library."));
+                } else if ui::accent_button(ui, "Add this folder").clicked() {
+                    actions.push(Action::AddAccountFolder {
+                        name: name.clone(),
+                        uid: uid.clone(),
+                    });
+                    browser.open = false;
+                }
+            });
+        }
+    });
+}
+
+/// One line of the browser. Only folders and places are clickable.
+fn row(
+    ui: &mut egui::Ui,
+    icon: &str,
+    name: &str,
+    detail: Option<&str>,
+    clickable: bool,
+) -> egui::Response {
+    let mut text = egui::text::LayoutJob::default();
+    let body = ui.style().text_styles[&egui::TextStyle::Body].clone();
+    text.append(
+        &format!("{icon}  {name}"),
+        0.0,
+        egui::TextFormat::simple(
+            body.clone(),
+            if clickable {
+                theme::text()
+            } else {
+                theme::muted()
+            },
+        ),
+    );
+    if let Some(detail) = detail {
+        text.append(
+            &format!("   {detail}"),
+            0.0,
+            egui::TextFormat::simple(body, theme::muted()),
+        );
+    }
+    let sense = if clickable {
+        egui::Sense::click()
+    } else {
+        egui::Sense::hover()
+    };
+    let response = ui.add(egui::Label::new(text).sense(sense).truncate());
+    if clickable && response.hovered() {
+        ui.ctx().set_cursor_icon(egui::CursorIcon::PointingHand);
+    }
+    response
+}
+
+fn format_size(bytes: i64) -> String {
+    let bytes = bytes.max(0) as f64;
+    const GIB: f64 = 1024.0 * 1024.0 * 1024.0;
+    const MIB: f64 = 1024.0 * 1024.0;
+    if bytes >= GIB {
+        format!("{:.1} GiB", bytes / GIB)
+    } else {
+        format!("{:.0} MiB", bytes / MIB)
+    }
+}
+
+pub(crate) fn unix_now() -> i64 {
+    std::time::SystemTime::now()
+        .duration_since(std::time::UNIX_EPOCH)
+        .map(|since| since.as_secs() as i64)
+        .unwrap_or(0)
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn the_sync_line_says_how_long_ago_and_what_came_in() {
+        let quiet = SyncReport::default();
+        assert_eq!(sync_line(100, &quiet, 130), "Synced just now");
+        assert_eq!(sync_line(100, &quiet, 400), "Synced 5 min ago");
+        let busy = SyncReport {
+            applied: 2,
+            ..SyncReport::default()
+        };
+        assert_eq!(
+            sync_line(0, &busy, 7200),
+            "Synced 2 h ago  ·  2 positions from other devices"
+        );
+    }
+
+    #[test]
+    fn signing_out_forgets_what_was_typed_and_browsed() {
+        let mut panel = AccountPanel {
+            password: "secret".into(),
+            mailbox: "also secret".into(),
+            ..AccountPanel::default()
+        };
+        panel.browser.open = true;
+        panel.set_status(AccountStatus::SignedOut);
+        assert!(panel.password.is_empty() && panel.mailbox.is_empty());
+        assert!(!panel.browser.open);
+    }
+
+    #[test]
+    fn a_listing_for_a_folder_already_left_is_dropped() {
+        let uid = |link: &str| {
+            NodeUid::new(
+                pstr_core::proton_sdk::ids::VolumeId::new("v".to_owned()),
+                pstr_core::proton_sdk::ids::LinkId::new(link.to_owned()),
+            )
+        };
+        let mut browser = DriveBrowser {
+            trail: vec![("b".into(), uid("b"))],
+            loading: true,
+            ..DriveBrowser::default()
+        };
+        browser.folder_arrived(uid("a"), Vec::new());
+        assert!(browser.loading && browser.entries.is_none());
+        browser.folder_arrived(uid("b"), Vec::new());
+        assert!(!browser.loading && browser.entries.is_some());
+    }
+}

crates/pstr-app/src/ui/downloads.rs

@@ -5,70 +5,120 @@ use crate::engine::{DownloadItem, DownloadState};
 use crate::{theme, ui};
 
 pub fn show(ui: &mut egui::Ui, downloads: &[DownloadItem], actions: &mut Vec<Action>) {
-    ui.heading("Downloads");
-    ui.label(ui::muted(
-        "Pause and Cancel keep complete downloaded blocks. Delete partial discards them.",
-    ));
-    ui.add_space(12.0);
-
     if downloads.is_empty() {
-        ui.label("No offline downloads.");
+        ui::empty_state(
+            ui,
+            "No downloads",
+            "Download an episode, a season or a whole show from its page, and it plays \
+             without a connection.",
+        );
         return;
     }
 
-    let mut start = 0;
+    egui::ScrollArea::vertical()
-    while start < downloads.len() {
+        .auto_shrink([false, false])
-        let title_key = &downloads[start].target.title_key;
+        .show(ui, |ui| {
-        let title = &downloads[start].target.title_name;
+            ui.set_max_width(960.0);
-        let end = downloads[start..]
+            summary(ui, downloads);
-            .iter()
+            ui.add_space(theme::space::L);
-            .position(|item| item.target.title_key != *title_key)
-            .map_or(downloads.len(), |offset| start + offset);
-        let group = &downloads[start..end];
-        let downloaded: u64 = group.iter().map(|item| item.downloaded).sum();
-        let total: u64 = group.iter().map(|item| item.total).sum();
-        let completed = group
-            .iter()
-            .filter(|item| item.state == DownloadState::Completed)
-            .count();
 
-        ui.label(theme::Role::Section.rich(title).strong());
+            let mut start = 0;
-        let totals_known = group.iter().all(|item| item.total > 0);
+            while start < downloads.len() {
-        ui.horizontal(|ui| {
+                let title_key = &downloads[start].target.title_key;
-            if totals_known {
+                let end = downloads[start..]
-                ui.add(
+                    .iter()
-                    egui::ProgressBar::new(fraction(downloaded, total))
+                    .position(|item| item.target.title_key != *title_key)
-                        .desired_width(260.0)
+                    .map_or(downloads.len(), |offset| start + offset);
-                        .show_percentage(),
+                group(ui, &downloads[start..end], actions);
-                );
+                ui.add_space(theme::space::L);
-            } else {
+                start = end;
-                ui.add(egui::Spinner::new().size(16.0));
-                ui.label(ui::muted("Calculating size…"));
             }
-            ui.label(ui::muted(format!(
-                "{} / {} · {completed}/{} files",
-                bytes(downloaded),
-                if !totals_known {
-                    "calculating…".to_owned()
-                } else {
-                    bytes(total)
-                },
-                group.len()
-            )));
         });
-        for item in group {
+}
-            row(ui, item, actions);
+
+/// The line under the heading: how much, how fast, how long.
+fn summary(ui: &mut egui::Ui, downloads: &[DownloadItem]) {
+    ui::section(ui, "Downloads");
+    let running: Vec<_> = downloads
+        .iter()
+        .filter(|item| item.state == DownloadState::Running)
+        .collect();
+    let rate: f64 = running.iter().map(|item| item.rate).sum();
+    let left: u64 = downloads
+        .iter()
+        .filter(|item| {
+            matches!(
+                item.state,
+                DownloadState::Queued | DownloadState::Running | DownloadState::Paused
+            )
+        })
+        .map(|item| item.total.saturating_sub(item.downloaded))
+        .sum();
+    let mut parts = vec![format!(
+        "{} available offline",
+        ui::library::plural(
+            downloads
+                .iter()
+                .filter(|item| item.state == DownloadState::Completed)
+                .count(),
+            "file"
+        )
+    )];
+    if !running.is_empty() {
+        parts.push(format!("{}/s", size(rate as u64)));
+    }
+    if left > 0 {
+        parts.push(format!("{} to go", size(left)));
+        if rate > 0.0 {
+            parts.push(format!("about {}", ui::format_time(left as f64 / rate)));
         }
-        ui.add_space(12.0);
+    }
-        start = end;
+    ui.label(ui::muted(parts.join("  ·  ")));
+    ui.label(ui::muted(
+        "Pausing or cancelling keeps every block already downloaded.",
+    ));
+}
+
+/// One title's downloads, under a bar for all of them together.
+fn group(ui: &mut egui::Ui, group: &[DownloadItem], actions: &mut Vec<Action>) {
+    let title = &group[0].target.title_name;
+    let downloaded: u64 = group.iter().map(|item| item.downloaded).sum();
+    let total: u64 = group.iter().map(|item| item.total).sum();
+    let completed = group
+        .iter()
+        .filter(|item| item.state == DownloadState::Completed)
+        .count();
+    let totals_known = group.iter().all(|item| item.total > 0);
+
+    ui.horizontal(|ui| {
+        ui.label(theme::Role::Subhead.rich(title).strong());
+        ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
+            ui.label(ui::muted(if totals_known {
+                format!(
+                    "{completed} of {}  ·  {} of {}",
+                    group.len(),
+                    size(downloaded),
+                    size(total)
+                )
+            } else {
+                format!("{completed} of {}  ·  working out the size…", group.len())
+            }));
+        });
+    });
+    if totals_known && group.len() > 1 {
+        ui::progress_bar(ui, fraction(downloaded, total), ui.available_width());
+    }
+    ui.add_space(theme::space::S);
+    for item in group {
+        row(ui, item, actions);
     }
 }
 
 fn row(ui: &mut egui::Ui, item: &DownloadItem, actions: &mut Vec<Action>) {
     egui::Frame::new()
         .fill(theme::card())
-        .corner_radius(egui::CornerRadius::same(6))
+        .corner_radius(egui::CornerRadius::same(theme::radius::SM))
-        .inner_margin(egui::Margin::symmetric(10, 8))
+        .inner_margin(egui::Margin::symmetric(12, 8))
         .show(ui, |ui| {
             ui.set_width(ui.available_width());
             ui.horizontal(|ui| {
@@ -78,85 +128,109 @@ fn row(ui: &mut egui::Ui, item: &DownloadItem, actions: &mut Vec<Action>) {
                     item.target.subtitle.as_str()
                 };
                 ui.add_sized(
-                    [180.0, 18.0],
+                    [72.0, 18.0],
-                    egui::Label::new(egui::RichText::new(caption).strong()).truncate(),
+                    egui::Label::new(egui::RichText::new(caption).monospace()).truncate(),
                 )
                 .on_hover_text(&item.target.name);
 
-                let status = match &item.state {
+                let (status, colour) = status(item);
-                    DownloadState::Queued => "Queued".to_owned(),
-                    DownloadState::Running => "Downloading".to_owned(),
-                    DownloadState::Paused => "Paused".to_owned(),
-                    DownloadState::Completed => "Available offline".to_owned(),
-                    DownloadState::Cancelled => "Cancelled · partial kept".to_owned(),
-                    DownloadState::Failed(error) => format!("Failed: {error}"),
-                };
                 ui.add_sized(
-                    [240.0, 18.0],
+                    [220.0, 18.0],
-                    egui::Label::new(ui::muted(status)).truncate(),
+                    egui::Label::new(theme::Role::Caption.rich(status).color(colour)).truncate(),
                 );
 
-                if item.total > 0 {
+                ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
-                    ui.add(
+                    buttons(ui, item, actions);
-                        egui::ProgressBar::new(item.percent())
+                    if item.total > 0 && item.state != DownloadState::Completed {
-                            .desired_width(140.0)
+                        ui.add_space(theme::space::M);
-                            .show_percentage(),
+                        ui.label(ui::muted(format!(
-                    );
+                            "{} / {}",
-                    ui.label(ui::muted(format!(
+                            size(item.downloaded),
-                        "{} / {}",
+                            size(item.total)
-                        bytes(item.downloaded),
+                        )));
-                        bytes(item.total)
+                        let width = (ui.available_width() - 8.0).clamp(40.0, 320.0);
-                    )));
+                        ui::progress_bar(ui, item.percent(), width);
-                }
+                    }
-
+                });
-                ui.with_layout(
-                    egui::Layout::right_to_left(egui::Align::Center),
-                    |ui| match item.state {
-                        DownloadState::Queued | DownloadState::Running => {
-                            if ui
-                                .button("Cancel")
-                                .on_hover_text("Stop and keep partial")
-                                .clicked()
-                            {
-                                actions.push(Action::CancelDownload(item.key.clone()));
-                            }
-                            if ui.button("Pause").clicked() {
-                                actions.push(Action::PauseDownload(item.key.clone()));
-                            }
-                        }
-                        DownloadState::Paused => {
-                            if ui
-                                .button("Cancel")
-                                .on_hover_text("Stop and keep partial")
-                                .clicked()
-                            {
-                                actions.push(Action::CancelDownload(item.key.clone()));
-                            }
-                            if ui.button("Resume").clicked() {
-                                actions.push(Action::ResumeDownload(item.key.clone()));
-                            }
-                        }
-                        DownloadState::Cancelled | DownloadState::Failed(_) => {
-                            if ui.button("Delete partial…").clicked() {
-                                actions.push(Action::RemoveDownload(item.key.clone(), true));
-                            }
-                            if ui.button("Resume / Retry").clicked() {
-                                actions.push(Action::ResumeDownload(item.key.clone()));
-                            }
-                        }
-                        DownloadState::Completed => {
-                            if ui
-                                .button("Delete")
-                                .on_hover_text("Delete the offline copy; keep the online source")
-                                .clicked()
-                            {
-                                actions.push(Action::RemoveDownload(item.key.clone(), false));
-                            }
-                        }
-                    },
-                );
             });
         });
+    ui.add_space(theme::space::XS);
+}
+
+/// What a row says about itself, and in what colour.
+fn status(item: &DownloadItem) -> (String, egui::Color32) {
+    match &item.state {
+        DownloadState::Queued => ("Waiting".to_owned(), theme::muted()),
+        DownloadState::Running => {
+            let mut text = format!("{}/s", size(item.rate as u64));
+            if let Some(eta) = item.eta() {
+                text.push_str(&format!("  ·  {} left", ui::format_time(eta)));
+            }
+            (text, theme::text())
+        }
+        DownloadState::Paused => ("Paused".to_owned(), theme::muted()),
+        DownloadState::Completed => ("Available offline".to_owned(), theme::muted()),
+        DownloadState::Cancelled => ("Stopped  ·  progress kept".to_owned(), theme::muted()),
+        DownloadState::Failed(error) => (format!("Failed: {error}"), theme::danger()),
+    }
+}
+
+fn buttons(ui: &mut egui::Ui, item: &DownloadItem, actions: &mut Vec<Action>) {
+    let key = || item.key.clone();
+    match item.state {
+        DownloadState::Queued | DownloadState::Running => {
+            if ui
+                .button("Cancel")
+                .on_hover_text("Stop, and keep what has downloaded")
+                .clicked()
+            {
+                actions.push(Action::CancelDownload(key()));
+            }
+            if ui.button("Pause").clicked() {
+                actions.push(Action::PauseDownload(key()));
+            }
+        }
+        DownloadState::Paused => {
+            if ui
+                .button("Cancel")
+                .on_hover_text("Stop, and keep what has downloaded")
+                .clicked()
+            {
+                actions.push(Action::CancelDownload(key()));
+            }
+            if ui.button("Resume").clicked() {
+                actions.push(Action::ResumeDownload(key()));
+            }
+        }
+        DownloadState::Cancelled | DownloadState::Failed(_) => {
+            if ui
+                .button("Delete")
+                .on_hover_text("Discard what has downloaded so far")
+                .clicked()
+            {
+                actions.push(Action::RemoveDownload(key(), true));
+            }
+            if ui
+                .button(if matches!(item.state, DownloadState::Failed(_)) {
+                    "Retry"
+                } else {
+                    "Resume"
+                })
+                .clicked()
+            {
+                actions.push(Action::ResumeDownload(key()));
+            }
+        }
+        DownloadState::Completed => {
+            if ui
+                .button("Delete")
+                .on_hover_text("Delete the offline copy; keep the online source")
+                .clicked()
+            {
+                actions.push(Action::RemoveDownload(key(), false));
+            }
+        }
+    }
 }
 
 fn fraction(downloaded: u64, total: u64) -> f32 {
@@ -167,18 +241,6 @@ fn fraction(downloaded: u64, total: u64) -> f32 {
     }
 }
 
-fn bytes(value: u64) -> String {
+fn size(bytes: u64) -> String {
-    const KIB: f64 = 1024.0;
+    ui::format_size(i64::try_from(bytes).unwrap_or(i64::MAX))
-    const MIB: f64 = 1024.0 * KIB;
-    const GIB: f64 = 1024.0 * MIB;
-    let value = value as f64;
-    if value >= GIB {
-        format!("{:.1} GiB", value / GIB)
-    } else if value >= MIB {
-        format!("{:.1} MiB", value / MIB)
-    } else if value >= KIB {
-        format!("{:.1} KiB", value / KIB)
-    } else {
-        format!("{value:.0} B")
-    }
 }

crates/pstr-app/src/ui/history.rs

@@ -0,0 +1,238 @@
+//! Everything that has been played, newest first, under a heading per day.
+//!
+//! Continue watching answers "what was I in the middle of"; this answers
+//! "what was that episode on Tuesday". It is read straight off the watch
+//! state, so there is nothing to keep in step: an episode is here because it
+//! has a position or is marked watched, and leaves when it has neither.
+
+use chrono::{DateTime, Local, NaiveDate, TimeZone};
+use pstr_core::library::{Episode, Library, Title, TitleKind};
+
+use crate::app::{Action, Page};
+use crate::theme;
+use crate::ui::{self, Art};
+
+const STILL: egui::Vec2 = egui::vec2(128.0, 72.0);
+/// How far back the page goes. Further than anyone scrolls; the cap is there
+/// so a library with years of history does not lay out every row of it.
+const MOST: usize = 400;
+
+/// Where one entry lives in [`Library::titles`]: title, season, episode.
+pub type Entry = (usize, usize, usize);
+
+/// The entries of `library.history()`, as positions, so they can be kept
+/// between frames and only rebuilt when the library changes.
+pub fn entries(library: &Library) -> Vec<Entry> {
+    let mut position = std::collections::HashMap::new();
+    for (t, title) in library.titles.iter().enumerate() {
+        for (s, season) in title.seasons.iter().enumerate() {
+            for (e, episode) in season.episodes.iter().enumerate() {
+                position.insert(std::ptr::from_ref(episode), (t, s, e));
+            }
+        }
+    }
+    library
+        .history()
+        .into_iter()
+        .filter_map(|(_, episode)| position.get(&std::ptr::from_ref(episode)).copied())
+        .collect()
+}
+
+pub fn show(
+    ui: &mut egui::Ui,
+    art: &mut Art<'_>,
+    library: &Library,
+    entries: &[Entry],
+    actions: &mut Vec<Action>,
+) {
+    if entries.is_empty() {
+        ui::empty_state(
+            ui,
+            "Nothing watched yet",
+            "Episodes and films you play show up here, newest first, so the one from \
+             last week is easy to find again.",
+        );
+        return;
+    }
+
+    let today = Local::now().date_naive();
+    egui::ScrollArea::vertical()
+        .auto_shrink([false, false])
+        .show(ui, |ui| {
+            ui.set_max_width(960.0);
+            let mut day = None;
+            for &(t, s, e) in entries.iter().take(MOST) {
+                let Some(title) = library.titles.get(t) else {
+                    continue;
+                };
+                let Some(episode) = title
+                    .seasons
+                    .get(s)
+                    .and_then(|season| season.episodes.get(e))
+                else {
+                    continue;
+                };
+                let Some(at) = Local.timestamp_opt(episode.last_played(), 0).single() else {
+                    continue;
+                };
+                if day != Some(at.date_naive()) {
+                    if day.is_some() {
+                        ui.add_space(theme::space::L);
+                    }
+                    day = Some(at.date_naive());
+                    ui::section(ui, &day_label(at.date_naive(), today));
+                }
+                row(ui, art, title, episode, at, actions);
+            }
+        });
+}
+
+fn row(
+    ui: &mut egui::Ui,
+    art: &mut Art<'_>,
+    title: &Title,
+    episode: &Episode,
+    at: DateTime<Local>,
+    actions: &mut Vec<Action>,
+) {
+    let row_id = ui.id().with(("history", &episode.node.link_id));
+    let frame = egui::Frame::new()
+        .corner_radius(egui::CornerRadius::same(theme::radius::LG))
+        .inner_margin(egui::Margin::same(8));
+    let mut prepared = frame.begin(ui);
+    {
+        let ui = &mut prepared.content_ui;
+        ui.set_width(ui.available_width());
+        ui.horizontal_top(|ui| {
+            ui::title::still(
+                ui,
+                art,
+                title,
+                episode,
+                episode.is_watched(),
+                STILL,
+                actions,
+            );
+            ui.add_space(theme::space::M);
+
+            let remove = 40.0;
+            let text_width = (ui.available_width() - remove).max(120.0);
+            ui.vertical(|ui| {
+                ui.set_width(text_width);
+                ui.spacing_mut().item_spacing.y = theme::space::XXS;
+                ui.add_space(theme::space::XS);
+                let name = ui
+                    .add(
+                        egui::Label::new(theme::Role::Body.rich(&title.name).color(theme::text()))
+                            .sense(egui::Sense::click())
+                            .truncate(),
+                    )
+                    .on_hover_cursor(egui::CursorIcon::PointingHand)
+                    .on_hover_text("Show this title");
+                if name.clicked() {
+                    actions.push(Action::Goto(Page::Title(title.key.clone())));
+                }
+                // A film's only "episode" is its file, and its filename says
+                // nothing the title above it does not.
+                if title.kind != TitleKind::Film {
+                    let episode_name = art
+                        .episode(&title.key, episode)
+                        .and_then(|found| found.name.clone())
+                        .unwrap_or_else(|| episode.detail().to_owned());
+                    let line = match episode.numbering() {
+                        Some(numbering) => format!("{numbering}  ·  {episode_name}"),
+                        None => episode_name,
+                    };
+                    ui.add(egui::Label::new(ui::muted(line)).truncate())
+                        .on_hover_text(&episode.node.name);
+                }
+                ui.label(ui::muted(status(episode, at)));
+            });
+
+            let cluster = egui::vec2(ui.available_width(), STILL.y);
+            let layout = egui::Layout::right_to_left(egui::Align::Center);
+            ui.allocate_ui_with_layout(cluster, layout, |ui| {
+                let remove = ui
+                    .add(
+                        egui::Button::new(
+                            theme::Role::Subhead
+                                .rich(egui_phosphor::regular::X)
+                                .color(theme::muted()),
+                        )
+                        .frame(false),
+                    )
+                    .on_hover_text(if episode.is_watched() {
+                        "Remove from history — marks it unwatched"
+                    } else {
+                        "Remove from history — forgets where you stopped"
+                    });
+                if remove.clicked() {
+                    actions.push(Action::RemoveFromHistory {
+                        share_id: episode.node.share_id.clone(),
+                        link_id: episode.node.link_id.clone(),
+                    });
+                }
+            });
+        });
+    }
+    let response = prepared.allocate_space(ui);
+    let lit =
+        ui.ctx()
+            .animate_bool_with_time(row_id, response.contains_pointer(), theme::motion::HOVER);
+    prepared.frame.fill = theme::card().gamma_multiply(0.35 + 0.65 * lit);
+    prepared.paint(ui);
+    ui.add_space(theme::space::XXS);
+}
+
+/// The grey line under the names: how far it got, and when.
+fn status(episode: &Episode, at: DateTime<Local>) -> String {
+    let when = at.format("%H:%M");
+    if episode.is_watched() {
+        return format!("Watched  ·  {when}");
+    }
+    match (
+        episode.resume_at(),
+        episode.watch.and_then(|watch| watch.duration_secs),
+    ) {
+        (Some(position), Some(duration)) => format!(
+            "Stopped at {} of {}  ·  {when}",
+            ui::format_time(position),
+            ui::format_time(duration)
+        ),
+        (Some(position), None) => format!("Stopped at {}  ·  {when}", ui::format_time(position)),
+        _ => format!("Played  ·  {when}"),
+    }
+}
+
+/// The heading over a day's entries: "Today", "Yesterday", a weekday within
+/// the last week, and a date before that — with the year only when it is not
+/// this one.
+fn day_label(day: NaiveDate, today: NaiveDate) -> String {
+    use chrono::Datelike;
+    match (today - day).num_days() {
+        0 => "Today".into(),
+        1 => "Yesterday".into(),
+        2..=6 => day.format("%A").to_string(),
+        _ if day.year() == today.year() => day.format("%-d %B").to_string(),
+        _ => day.format("%-d %B %Y").to_string(),
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    fn date(year: i32, month: u32, day: u32) -> NaiveDate {
+        NaiveDate::from_ymd_opt(year, month, day).unwrap()
+    }
+
+    #[test]
+    fn a_day_is_named_relative_to_today_for_the_last_week_and_dated_before_that() {
+        let today = date(2026, 10, 2);
+        assert_eq!(day_label(today, today), "Today");
+        assert_eq!(day_label(date(2026, 10, 1), today), "Yesterday");
+        assert_eq!(day_label(date(2026, 9, 28), today), "Monday");
+        assert_eq!(day_label(date(2026, 9, 25), today), "25 September");
+        assert_eq!(day_label(date(2025, 12, 24), today), "24 December 2025");
+    }
+}

crates/pstr-app/src/ui/library.rs

@@ -1,61 +1,387 @@
 //! The library page: what to watch, as a wall of stills.
 
+use pstr_core::appearance::Tiles;
 use pstr_core::library::{Library, Title, TitleKind};
 
-use crate::app::{Action, Page};
+use crate::app::{Action, Filter, LibraryView, Page, Sort};
+use crate::playback::PlaybackTarget;
 use crate::theme;
 use crate::ui::Art;
 use crate::ui::{self, Card};
 
-pub fn show(
+/// What the page lists, and what it was asked for.
-    ui: &mut egui::Ui,
+pub struct Shelves<'a> {
-    art: &mut Art<'_>,
+    pub library: &'a Library,
-    library: &Library,
+    /// The search and the shelf, already worked out — see [`LibraryView`].
-    search: &str,
+    pub view: &'a LibraryView,
-    actions: &mut Vec<Action>,
+    /// Whether the catalog has been read yet.
-) {
+    pub loaded: bool,
+    pub search: &'a str,
+    /// The grid's shape.
+    pub tiles: Tiles,
+}
+
+pub fn show(ui: &mut egui::Ui, art: &mut Art<'_>, shelves: Shelves<'_>, actions: &mut Vec<Action>) {
+    let Shelves {
+        library,
+        view,
+        loaded,
+        search,
+        tiles,
+    } = shelves;
+    if !loaded {
+        return placeholder(ui);
+    }
     if library.is_empty() {
         return empty_state(ui, actions);
     }
 
-    let matches = library.search(search);
+    let pick = |indices: &[usize]| -> Vec<&Title> {
+        indices
+            .iter()
+            .filter_map(|&index| library.titles.get(index))
+            .collect()
+    };
+    let matches = pick(&view.matches);
     let searching = !search.trim().is_empty();
 
     egui::ScrollArea::vertical()
         .auto_shrink([false, false])
         .show(ui, |ui| {
             if !searching {
-                let resumable = library.continue_watching();
+                if let Some(title) = featured(library, view, art.metadata, today()) {
+                    hero(ui, art, title, actions);
+                    ui.add_space(theme::space::XL);
+                }
+                let resumable = pick(&view.resumable);
                 if !resumable.is_empty() {
                     ui::section(ui, "Continue watching");
                     continue_row(ui, art, &resumable, actions);
-                    ui.add_space(16.0);
+                    ui.add_space(theme::space::XL);
+                }
+                // Only over the whole library: under a filter, a shelf of
+                // titles the grid below is hiding reads as the filter not
+                // working.
+                if view.filter == Filter::All {
+                    for (label, indices) in &view.shelves {
+                        ui::section(ui, label);
+                        shelf_row(ui, art, label, &pick(indices), tiles, actions);
+                        ui.add_space(theme::space::XL);
+                    }
                 }
             }
 
-            ui::section(
+            ui.horizontal(|ui| {
-                ui,
+                ui::section(
-                &if searching {
+                    ui,
-                    format!(
+                    &if searching {
-                        "{} matching {:?}",
+                        format!(
-                        plural(matches.len(), "title"),
+                            "{} matching {:?}",
-                        search.trim()
+                            plural(matches.len(), "title"),
-                    )
+                            search.trim()
-                } else {
+                        )
-                    plural(matches.len(), "title")
+                    } else {
-                },
+                        plural(matches.len(), "title")
-            );
+                    },
+                );
+                ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
+                    shelf_controls(ui, view, actions);
+                });
+            });
+            ui.add_space(theme::space::S);
 
             if matches.is_empty() {
-                ui.add_space(8.0);
+                ui.add_space(theme::space::M);
-                ui.label(ui::muted("Nothing here by that name."));
+                ui.label(ui::muted(if searching {
+                    "Nothing here by that name."
+                } else {
+                    "Nothing in the library fits that filter."
+                }));
                 return;
             }
 
-            grid(ui, art, &matches, actions);
+            grid(ui, art, &matches, view, tiles, actions);
         });
 }
 
+/// Days since the epoch: what the featured title turns over on.
+fn today() -> u64 {
+    std::time::SystemTime::now()
+        .duration_since(std::time::UNIX_EPOCH)
+        .map_or(0, |since| since.as_secs() / 86_400)
+}
+
+/// The title the banner shows: whatever was watched last, so the top of the
+/// page is one click from carrying on. With nothing part-watched, one of the
+/// titles a provider has a backdrop for, turning over once a day — the same
+/// one every time the page is opened today, rather than a new one per frame.
+fn featured<'a>(
+    library: &'a Library,
+    view: &LibraryView,
+    metadata: &std::collections::HashMap<String, pstr_core::metadata::MetadataRecord>,
+    day: u64,
+) -> Option<&'a Title> {
+    if let Some(title) = view
+        .resumable
+        .first()
+        .and_then(|&index| library.titles.get(index))
+    {
+        return Some(title);
+    }
+    let pictured: Vec<&Title> = library
+        .titles
+        .iter()
+        .filter(|title| {
+            metadata
+                .get(&title.key)
+                .and_then(|record| record.metadata.as_ref())
+                .is_some_and(|found| found.wide_art().is_some())
+        })
+        .collect();
+    if pictured.is_empty() {
+        return None;
+    }
+    pictured
+        .get((day % pictured.len() as u64) as usize)
+        .copied()
+}
+
+/// The banner across the top of the library: one title, large, with what it
+/// is and a way to play it.
+fn hero(ui: &mut egui::Ui, art: &mut Art<'_>, title: &Title, actions: &mut Vec<Action>) {
+    let height = (ui.ctx().content_rect().height() * 0.42).clamp(220.0, 360.0);
+    let (rect, response) = ui.allocate_exact_size(
+        egui::vec2(ui.available_width(), height),
+        egui::Sense::click(),
+    );
+    if !ui.is_rect_visible(rect) {
+        return;
+    }
+    let radius = egui::CornerRadius::same(theme::radius::LG);
+    let picture = art.wide(title);
+    let found = art
+        .metadata
+        .get(&title.key)
+        .and_then(|record| record.metadata.clone());
+
+    let painter = ui.painter().with_clip_rect(rect);
+    painter.rect_filled(rect, radius, theme::card());
+    let art_in = ui.ctx().animate_bool_with_time(
+        response.id.with("art"),
+        picture.is_some(),
+        theme::motion::ARRIVE,
+    );
+    if art_in < 1.0 {
+        ui::placeholder(&painter, rect, "", 1.0 - art_in);
+    }
+    if let Some((texture, _)) = &picture {
+        painter.add(
+            egui::epaint::RectShape::filled(
+                rect,
+                radius,
+                egui::Color32::WHITE.gamma_multiply(art_in),
+            )
+            .with_texture(texture.id(), ui::cover_uv(texture.size_vec2(), rect.size())),
+        );
+    }
+    // The same two coats as the title page's band, for the same reason: a
+    // still is arbitrary, and the text over it has to read whatever it is.
+    if theme::ramps_on() {
+        painter.rect_filled(rect, radius, theme::background().gamma_multiply(0.25));
+        let text_side = egui::Rect::from_min_max(
+            rect.min,
+            egui::pos2(rect.left() + rect.width() * 0.7, rect.bottom()),
+        );
+        painter.add(theme::fade_shape(
+            ui.ctx(),
+            text_side,
+            theme::background(),
+            theme::Direction::Horizontal,
+            false,
+        ));
+        let bottom =
+            egui::Rect::from_min_max(egui::pos2(rect.left(), rect.bottom() - 90.0), rect.max);
+        painter.add(theme::fade_shape(
+            ui.ctx(),
+            bottom,
+            theme::background(),
+            theme::Direction::Vertical,
+            true,
+        ));
+    } else {
+        painter.rect_filled(rect, radius, theme::background().gamma_multiply(0.82));
+    }
+
+    let inner = egui::Rect::from_min_max(
+        rect.min + egui::vec2(32.0, 0.0),
+        egui::pos2(
+            rect.left() + (rect.width() * 0.55).max(360.0),
+            rect.bottom() - 28.0,
+        ),
+    );
+    ui.scope_builder(
+        egui::UiBuilder::new()
+            .max_rect(inner)
+            .layout(egui::Layout::bottom_up(egui::Align::Min)),
+        |ui| {
+            ui.horizontal(|ui| {
+                if let Some(episode) = title.next_up() {
+                    let label = match (title.resume(), episode.numbering()) {
+                        (Some(_), Some(numbering)) => {
+                            format!("{}  Resume {numbering}", egui_phosphor::regular::PLAY)
+                        }
+                        (Some(_), None) => format!("{}  Resume", egui_phosphor::regular::PLAY),
+                        (None, _) => format!("{}  Play", egui_phosphor::regular::PLAY),
+                    };
+                    if ui::accent_button(ui, &label).clicked() {
+                        actions.push(Action::Play(PlaybackTarget::new(title, episode)));
+                    }
+                    ui.add_space(theme::space::S);
+                }
+                if ui.button("More info").clicked() {
+                    actions.push(Action::Goto(Page::Title(title.key.clone())));
+                }
+            });
+            ui.add_space(theme::space::L);
+            if let Some(overview) = found.as_ref().and_then(|found| found.overview.as_deref()) {
+                let mut job = egui::text::LayoutJob::simple(
+                    overview.to_owned(),
+                    theme::Role::Body.font(),
+                    theme::text(),
+                    ui.available_width(),
+                );
+                job.wrap.max_rows = 3;
+                ui.label(job);
+                ui.add_space(theme::space::M);
+            }
+            let mut facts = vec![subtitle(title)];
+            if let Some(found) = &found {
+                if let Some(rating) = found.rating {
+                    facts.push(format!("{} {rating:.1}", egui_phosphor::regular::STAR));
+                }
+                facts.extend(found.genres.iter().take(3).cloned());
+            }
+            ui.label(ui::muted(facts.join("  ·  ")));
+            ui.add_space(theme::space::XXS);
+            ui.add(
+                egui::Label::new(
+                    theme::Role::Display
+                        .rich(art.name(title))
+                        .strong()
+                        .color(theme::text()),
+                )
+                .truncate(),
+            );
+        },
+    );
+
+    if response.clicked() {
+        actions.push(Action::Goto(Page::Title(title.key.clone())));
+    }
+}
+
+/// The filter pills, the order and the grouping, at the right of the grid's
+/// heading.
+fn shelf_controls(ui: &mut egui::Ui, view: &LibraryView, actions: &mut Vec<Action>) {
+    // Right to left: the order first, so it ends up last.
+    let sort = egui::ComboBox::from_id_salt("library-sort")
+        .selected_text(view.sort.label())
+        .width(150.0)
+        .show_ui(ui, |ui| {
+            let mut picked = None;
+            for sort in Sort::ALL {
+                if ui
+                    .selectable_label(view.sort == sort, sort.label())
+                    .clicked()
+                {
+                    picked = Some(sort);
+                }
+            }
+            picked
+        });
+    if let Some(Some(sort)) = sort.inner {
+        actions.push(Action::SetShelf(view.filter, sort));
+    }
+    ui.add_space(theme::space::S);
+    let mut grouped = view.grouped;
+    if ui
+        .toggle_value(&mut grouped, egui_phosphor::regular::STACK)
+        .on_hover_text(if view.grouped {
+            "One tile per franchise. Click to show every title"
+        } else {
+            "Every title. Click to fold each franchise into one tile"
+        })
+        .changed()
+    {
+        actions.push(Action::SetGrouped(grouped));
+    }
+    ui.add_space(theme::space::L);
+    if let Some(filter) = ui::widgets::segmented(
+        ui,
+        view.filter,
+        &[
+            (Filter::All, "All"),
+            (Filter::Series, "Series"),
+            (Filter::Films, "Films"),
+            (Filter::Watching, "Watching"),
+            (Filter::Unwatched, "Not started"),
+        ],
+    ) {
+        actions.push(Action::SetShelf(filter, view.sort));
+    }
+}
+
+/// One shelf: titles that share something, scrolling sideways, in the grid's
+/// own shape.
+fn shelf_row(
+    ui: &mut egui::Ui,
+    art: &mut Art<'_>,
+    label: &str,
+    titles: &[&Title],
+    tiles: Tiles,
+    actions: &mut Vec<Action>,
+) {
+    let (width, aspect) = tile_shape(tiles);
+    egui::ScrollArea::horizontal()
+        .id_salt(("shelf", label))
+        .auto_shrink([false, true])
+        .show(ui, |ui| {
+            ui.horizontal(|ui| {
+                ui.spacing_mut().item_spacing.x = theme::CARD_GAP;
+                for title in titles {
+                    let picture = match tiles {
+                        Tiles::Posters => art.poster(title),
+                        Tiles::Stills => art.of(title),
+                    };
+                    let response = ui::card(
+                        ui,
+                        Card {
+                            art: picture,
+                            name: art.name(title),
+                            subtitle: subtitle(title),
+                            progress: title.resume().and_then(|e| e.progress()).map(|v| v as f32),
+                            badge: None,
+                            width,
+                            aspect,
+                        },
+                    );
+                    tile_menu(&response, title, false, actions);
+                    if response.clicked() {
+                        actions.push(Action::Goto(Page::Title(title.key.clone())));
+                    }
+                }
+            });
+        });
+}
+
+/// The minimum width and the picture's shape of a tile.
+fn tile_shape(tiles: Tiles) -> (f32, f32) {
+    match tiles {
+        Tiles::Posters => (theme::POSTER_WIDTH, theme::POSTER_ASPECT),
+        Tiles::Stills => (theme::CARD_WIDTH, theme::CARD_ASPECT),
+    }
+}
+
 /// The top shelf: one card per part-watched title, scrolling sideways.
 fn continue_row(
     ui: &mut egui::Ui,
@@ -85,22 +411,25 @@ fn continue_row(
                         })
                         .unwrap_or_else(|| episode.label());
 
-                    let clicked = ui::card(
+                    let picture = art.of(title);
+                    let response = ui::card(
                         ui,
                         Card {
-                            art: art.of(title),
+                            art: picture,
-                            name: &title.name,
+                            name: art.name(title),
                             subtitle: remaining,
                             progress: episode.progress().map(|value| value as f32),
                             badge: episode.numbering(),
                             // A shelf that scrolls sideways has no right edge
-                            // to reach, so nothing to flex to.
+                            // to reach, so nothing to flex to. Always a
+                            // still: it is a frame from where they stopped.
                             width: theme::CARD_WIDTH,
+                            aspect: theme::CARD_ASPECT,
                         },
-                    )
+                    );
-                    .clicked();
+                    tile_menu(&response, title, true, actions);
 
-                    if clicked {
+                    if response.clicked() {
                         actions.push(Action::Goto(Page::Title(title.key.clone())));
                     }
                 }
@@ -109,32 +438,69 @@ fn continue_row(
 }
 
 /// Every title, wrapped to the window.
-fn grid(ui: &mut egui::Ui, art: &mut Art<'_>, titles: &[&Title], actions: &mut Vec<Action>) {
+fn grid(
-    let grid = ui::columns(ui.available_width());
+    ui: &mut egui::Ui,
-    for row in titles.chunks(grid.columns) {
+    art: &mut Art<'_>,
+    titles: &[&Title],
+    view: &LibraryView,
+    tiles: Tiles,
+    actions: &mut Vec<Action>,
+) {
+    let (minimum, aspect) = tile_shape(tiles);
+    let grid = ui::columns_of(ui.available_width(), minimum);
+    let row_height = ui::card_height(grid.width, aspect);
+    for (row, chunk) in titles.chunks(grid.columns).enumerate() {
+        // A row scrolled out of view is only its height. Laying it out anyway
+        // costs a subtitle and an artwork lookup per card per frame, and while
+        // a film plays under the transport bar a frame is every frame.
+        let slot = egui::Rect::from_min_size(
+            ui.cursor().min,
+            egui::vec2(ui.available_width(), row_height),
+        );
+        if !ui.is_rect_visible(slot) {
+            // The spacing `horizontal` would have added after itself, too, or
+            // the page grows and shrinks under the scroll bar as rows come and
+            // go.
+            ui.add_space(row_height + ui.spacing().item_spacing.y + theme::CARD_GAP);
+            continue;
+        }
         ui.horizontal(|ui| {
             // The gap the width was divided around, so what is drawn matches
             // what was measured. egui's default item spacing is narrower, and
             // the difference times the column count is a visible drift towards
             // the left edge.
             ui.spacing_mut().item_spacing.x = theme::CARD_GAP;
-            for title in row {
+            for (column, title) in chunk.iter().enumerate() {
-                let clicked = ui::card(
+                let picture = match tiles {
+                    Tiles::Posters => art.poster(title),
+                    Tiles::Stills => art.of(title),
+                };
+                let folded = view
+                    .matches
+                    .get(row * grid.columns + column)
+                    .and_then(|index| view.folded.get(index))
+                    .copied();
+                let response = ui::card(
                     ui,
                     Card {
-                        art: art.of(title),
+                        art: picture,
-                        name: &title.name,
+                        name: art.name(title),
-                        subtitle: subtitle(title),
+                        subtitle: match folded {
+                            Some(more) => format!("{}  ·  +{more} more", subtitle(title)),
+                            None => subtitle(title),
+                        },
                         progress: title.resume().and_then(|e| e.progress()).map(|v| v as f32),
                         // What a film is says itself in the subtitle below the
-                        // card; a second `Film` over the poster is noise.
+                        // card; a second `Film` over the poster is noise. A
-                        badge: None,
+                        // folded franchise says how much is under it.
+                        badge: folded.map(|more| format!("+{more}")),
                         width: grid.width,
+                        aspect,
                     },
-                )
+                );
-                .clicked();
+                tile_menu(&response, title, false, actions);
 
-                if clicked {
+                if response.clicked() {
                     actions.push(Action::Goto(Page::Title(title.key.clone())));
                 }
             }
@@ -143,6 +509,80 @@ fn grid(ui: &mut egui::Ui, art: &mut Art<'_>, titles: &[&Title], actions: &mut V
     }
 }
 
+/// What a right-click on a tile offers: the things otherwise one page away.
+///
+/// `continuing` is the Continue watching shelf, where the tile can also be
+/// taken off the shelf.
+fn tile_menu(
+    response: &egui::Response,
+    title: &Title,
+    continuing: bool,
+    actions: &mut Vec<Action>,
+) {
+    response.context_menu(|ui| {
+        if let Some(episode) = title.next_up() {
+            let label = match (title.resume(), episode.numbering()) {
+                (Some(_), Some(numbering)) => format!("Resume {numbering}"),
+                (Some(_), None) => "Resume".to_owned(),
+                (None, _) => "Play".to_owned(),
+            };
+            if ui.button(label).clicked() {
+                actions.push(Action::Play(PlaybackTarget::new(title, episode)));
+            }
+        }
+        if ui.button("Open").clicked() {
+            actions.push(Action::Goto(Page::Title(title.key.clone())));
+        }
+        ui.separator();
+
+        let all_watched = title.watched_count() == title.episode_count();
+        if ui
+            .button(if all_watched {
+                "Mark unwatched"
+            } else {
+                "Mark watched"
+            })
+            .clicked()
+        {
+            actions.push(Action::SetTitleWatched {
+                key: title.key.clone(),
+                watched: !all_watched,
+            });
+        }
+        if continuing
+            && let Some(episode) = title.resume()
+            && ui
+                .button("Remove from Continue watching")
+                .on_hover_text("Forget where you stopped in it")
+                .clicked()
+        {
+            actions.push(Action::ForgetPosition {
+                share_id: episode.node.share_id.clone(),
+                link_id: episode.node.link_id.clone(),
+            });
+        }
+
+        let count = title.episode_count();
+        let download = if count == 1 {
+            "Download".to_owned()
+        } else {
+            format!("Download all {count}")
+        };
+        if ui.button(download).clicked() {
+            actions.push(Action::MakeOffline(
+                title
+                    .episodes()
+                    .map(|episode| PlaybackTarget::new(title, episode))
+                    .collect(),
+            ));
+        }
+        ui.separator();
+        if ui.button("Change match…").clicked() {
+            actions.push(Action::OpenMatcher(title.key.clone()));
+        }
+    });
+}
+
 /// The grey line under a card: what it is, how much there is, and how much is
 /// left.
 ///
@@ -168,6 +608,37 @@ fn subtitle(title: &Title) -> String {
     }
 }
 
+/// The page before the catalog has been read: the shape of a grid, with
+/// nothing in it yet.
+///
+/// Not the empty state. The catalog is on disk and is read in a fraction of a
+/// second, and telling every launch "Nothing in the library yet" for that
+/// fraction is a flash of something false.
+fn placeholder(ui: &mut egui::Ui) {
+    let grid = ui::columns(ui.available_width());
+    let height = ui::card_height(grid.width, theme::CARD_ASPECT);
+    ui::section(ui, "Library");
+    for _ in 0..2 {
+        ui.horizontal(|ui| {
+            ui.spacing_mut().item_spacing.x = theme::CARD_GAP;
+            for _ in 0..grid.columns {
+                let (rect, _) =
+                    ui.allocate_exact_size(egui::vec2(grid.width, height), egui::Sense::hover());
+                let image = egui::Rect::from_min_size(
+                    rect.min,
+                    egui::vec2(grid.width, (grid.width * theme::CARD_ASPECT).round()),
+                );
+                ui.painter().rect_filled(
+                    image,
+                    egui::CornerRadius::same(theme::radius::MD),
+                    theme::card(),
+                );
+            }
+        });
+        ui.add_space(theme::CARD_GAP);
+    }
+}
+
 fn empty_state(ui: &mut egui::Ui, actions: &mut Vec<Action>) {
     ui.vertical_centered(|ui| {
         ui.add_space(120.0);
@@ -176,11 +647,11 @@ fn empty_state(ui: &mut egui::Ui, actions: &mut Vec<Action>) {
                 .rich("Nothing in the library yet")
                 .strong(),
         );
-        ui.add_space(6.0);
+        ui.add_space(theme::space::S);
         ui.label(ui::muted(
             "Add a Proton Drive share link, and everything playable behind it shows up here.",
         ));
-        ui.add_space(18.0);
+        ui.add_space(theme::space::XL);
         if ui::accent_button(ui, "Add a share").clicked() {
             actions.push(Action::Goto(Page::Shares));
         }
@@ -225,6 +696,23 @@ mod tests {
         );
     }
 
+    #[test]
+    fn the_banner_features_the_title_watched_last_and_nothing_without_a_picture() {
+        let mut second = title(TitleKind::Film, None);
+        second.key = "second".into();
+        let library = Library {
+            titles: vec![title(TitleKind::Film, None), second],
+        };
+        let metadata = std::collections::HashMap::new();
+        let mut view = LibraryView::default();
+        assert!(featured(&library, &view, &metadata, 0).is_none());
+        view.resumable = vec![1];
+        assert_eq!(
+            featured(&library, &view, &metadata, 0).map(|title| title.key.as_str()),
+            Some("second")
+        );
+    }
+
     #[test]
     fn plurals_read_naturally() {
         assert_eq!(plural(1, "title"), "1 title");

crates/pstr-app/src/ui/matcher.rs

@@ -43,7 +43,7 @@ pub fn show(
             egui::Frame::new()
                 .fill(theme::surface())
                 .inner_margin(egui::Margin::same(18))
-                .corner_radius(egui::CornerRadius::same(10)),
+                .corner_radius(egui::CornerRadius::same(theme::radius::LG)),
         )
         .show(ctx, |ui| {
             ui.set_width(620.0);
@@ -58,21 +58,21 @@ pub fn show(
                 "Everything {} answers with, in its own order — nothing is scored here.",
                 provider.label()
             )));
-            ui.add_space(10.0);
+            ui.add_space(theme::space::L);
 
             search_row(ui, matcher, actions);
-            ui.add_space(6.0);
+            ui.add_space(theme::space::S);
             current_row(ui, matcher, current.as_ref(), actions);
-            ui.add_space(10.0);
+            ui.add_space(theme::space::L);
 
             if let Some(error) = &matcher.error {
                 ui.label(theme::Role::Caption.rich(error).color(theme::danger()));
-                ui.add_space(6.0);
+                ui.add_space(theme::space::S);
             }
 
             results(ui, matcher, art, actions);
 
-            ui.add_space(12.0);
+            ui.add_space(theme::space::L);
             ui.horizontal(|ui| {
                 ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
                     if ui.button("Close").clicked() {
@@ -178,7 +178,7 @@ fn results(ui: &mut egui::Ui, matcher: &Matcher, art: &mut Art<'_>, actions: &mu
                 if row(ui, art, found).clicked() {
                     actions.push(Action::ChooseMatch(Box::new(found.clone())));
                 }
-                ui.add_space(4.0);
+                ui.add_space(theme::space::XS);
             }
         });
 }
@@ -188,7 +188,7 @@ fn results(ui: &mut egui::Ui, matcher: &Matcher, art: &mut Art<'_>, actions: &mu
 fn row(ui: &mut egui::Ui, art: &mut Art<'_>, found: &TitleMetadata) -> egui::Response {
     let response = egui::Frame::new()
         .fill(theme::card())
-        .corner_radius(egui::CornerRadius::same(6))
+        .corner_radius(egui::CornerRadius::same(theme::radius::SM))
         .inner_margin(egui::Margin::same(8))
         .show(ui, |ui| {
             ui.set_width(ui.available_width());
@@ -204,12 +204,12 @@ fn row(ui: &mut egui::Ui, art: &mut Art<'_>, found: &TitleMetadata) -> egui::Res
                 } else {
                     ui.painter().rect_filled(
                         rect,
-                        egui::CornerRadius::same(4),
+                        egui::CornerRadius::same(theme::radius::BADGE),
                         theme::card_hover(),
                     );
                 }
 
-                ui.add_space(10.0);
+                ui.add_space(theme::space::L);
                 ui.vertical(|ui| {
                     ui.label(
                         theme::Role::Body
@@ -241,7 +241,7 @@ fn row(ui: &mut egui::Ui, art: &mut Art<'_>, found: &TitleMetadata) -> egui::Res
     if response.hovered() {
         ui.painter().rect_stroke(
             response.rect,
-            egui::CornerRadius::same(6),
+            egui::CornerRadius::same(theme::radius::SM),
             egui::Stroke::new(1.5, theme::accent()),
             egui::StrokeKind::Inside,
         );
@@ -258,9 +258,8 @@ fn poster(art: &mut Art<'_>, found: &TitleMetadata) -> Option<egui::TextureHandl
         .or_else(|| found.backdrop_url.clone())?;
     let key = format!("option:{}:{}", found.provider.as_str(), found.remote_id);
     let engine = art.engine;
-    let requested = key.clone();
     art.posters
-        .texture(key, || engine.request_poster(requested, url))
+        .texture(&key, || engine.request_poster(key.clone(), url))
 }
 
 /// `Film · 2017 · 26 episodes · ★ 8.2`, with whatever the provider left out
@@ -280,7 +279,7 @@ fn facts(found: &TitleMetadata) -> String {
         parts.push(ui::library::plural(episodes as usize, "episode"));
     }
     if let Some(rating) = found.rating {
-        parts.push(format!("★ {rating:.1}"));
+        parts.push(format!("{} {rating:.1}", egui_phosphor::regular::STAR));
     }
     parts.join("  ·  ")
 }