Implement approved TV loading and bounded motion

app/src/main/java/com/github/damontecres/wholphin/MainActivity.kt

@@ -32,6 +32,7 @@ import androidx.tv.material3.ExperimentalTvMaterial3Api
 import androidx.tv.material3.MaterialTheme
 import androidx.tv.material3.Surface
 import com.github.damontecres.wholphin.data.ServerRepository
+import com.github.damontecres.wholphin.data.RestoredSession
 import com.github.damontecres.wholphin.preferences.AppPreferences
 import com.github.damontecres.wholphin.preferences.PlayerBackend
 import com.github.damontecres.wholphin.services.AppUpgradeHandler
@@ -576,12 +577,22 @@ class MainActivityViewModel
                 val restoredSession =
                     if (signInAutomatically) {
                         Timber.v("Sign in automatically")
-                        serverRepository.restoreLastSession()
+                        serverRepository.restoreSavedSession()
                     } else {
                         serverRepository.getMostRecentServer()
                     }
                 Timber.d("Restore last session result=%s", restoredSession)
                 setupNavigationManager.navigateTo(restoredSession.destination)
+                if (signInAutomatically && restoredSession is RestoredSession.Success) {
+                    viewModelScope.launchDefault {
+                        try {
+                            serverRepository.revalidateSession(restoredSession.currentUser)
+                        } catch (exception: Exception) {
+                            if (exception is kotlinx.coroutines.CancellationException) throw exception
+                            Timber.w(exception, "Saved launch session revalidation failed")
+                        }
+                    }
+                }
             }
         }
     }

app/src/main/java/com/github/damontecres/wholphin/WholphinApplication.kt

@@ -17,6 +17,7 @@ import org.acra.ktx.initAcra
 import org.jellyfin.sdk.Jellyfin
 import org.jellyfin.sdk.model.ServerVersion
 import timber.log.Timber
+import org.justinvisser.wolfskin.tv.NetworkStartup
 import javax.inject.Inject
 
 @OptIn(ExperimentalComposeRuntimeApi::class)
@@ -54,6 +55,7 @@ class WholphinApplication :
 
     override fun onCreate() {
         super.onCreate()
+        networkStartup.start()
         if (BuildConfig.DEBUG) {
             StrictMode.setThreadPolicy(
                 StrictMode.ThreadPolicy
@@ -110,6 +112,9 @@ class WholphinApplication :
     @Inject
     lateinit var workerFactory: HiltWorkerFactory
 
+    @Inject
+    lateinit var networkStartup: NetworkStartup
+
     override val workManagerConfiguration: Configuration
         get() =
             Configuration

app/src/main/java/com/github/damontecres/wholphin/data/JellyfinServerDao.kt

@@ -51,6 +51,10 @@ interface JellyfinServerDao {
         return user.copy(rowId = result.toInt())
     }
 
+    /** Network name refreshes must not overwrite settings or protection changed since launch. */
+    @Query("UPDATE users SET name = :name WHERE serverId = :serverId AND id = :userId")
+    fun updateUserName(serverId: UUID, userId: UUID, name: String?): Int
+
     @Query("SELECT * FROM users WHERE serverId = :serverId AND id = :userId")
     fun getUser(
         serverId: UUID,

app/src/main/java/com/github/damontecres/wholphin/data/ServerRepository.kt

@@ -8,6 +8,8 @@ import com.github.damontecres.wholphin.services.hilt.IoDispatcher
 import com.github.damontecres.wholphin.util.WholphinDispatchers
 import dagger.hilt.android.qualifiers.ApplicationContext
 import kotlinx.coroutines.CoroutineDispatcher
+import kotlinx.coroutines.async
+import kotlinx.coroutines.coroutineScope
 import kotlinx.coroutines.ExperimentalCoroutinesApi
 import kotlinx.coroutines.flow.Flow
 import kotlinx.coroutines.flow.MutableStateFlow
@@ -101,15 +103,7 @@ class ServerRepository
                 }
                 Timber.v("Changing user to ${user.name} on ${server.url}")
                 apiClient.update(baseUrl = server.url, accessToken = user.accessToken)
-                val userDto by apiClient.userApi.getCurrentUser()
-                val updatedServer =
-                    try {
-                        val sysInfo by apiClient.systemApi.getPublicSystemInfo()
-                        server.copy(name = sysInfo.serverName, version = sysInfo.version)
-                    } catch (ex: Exception) {
-                        Timber.w(ex, "Exception fetching public system info")
-                        server
-                    }
+                val (updatedServer, userDto) = readSession(server)
                 var updatedUser =
                     user.copy(
                         id = userDto.id,
@@ -125,6 +119,45 @@ class ServerRepository
                 return@withContext currentUser
             }
 
+        /** Restore only an unprotected saved login; the launch picker must not wait for the network. */
+        suspend fun restoreSavedSession(): RestoredSession = withContext(ioDispatcher) {
+            val recent = mostRecentServerProvider.get()
+            if (recent !is MostRecentServer.ServerAndUser) return@withContext getMostRecentServerInternal(recent)
+            val saved = serverDao.getServer(recent.serverId) ?: return@withContext RestoredSession.None
+            val user = saved.users.firstOrNull { it.id == recent.userId }
+            if (user == null || user.isProtected) return@withContext RestoredSession.ServerOnly(saved.server)
+            apiClient.update(baseUrl = saved.server.url, accessToken = user.accessToken)
+            val current = CurrentUser(saved.server, user)
+            _currentUserDto.value = null
+            _current.value = current
+            RestoredSession.Success(current)
+        }
+
+        /** A late launch refresh must never replace a person selected while it was in flight. */
+        suspend fun revalidateSession(expected: CurrentUser) = withContext(ioDispatcher) {
+            val (server, userDto) = readSession(expected.server)
+            if (_current.value !== expected || userDto.id != expected.user.id) return@withContext
+            serverDao.addOrUpdateServer(server)
+            serverDao.updateUserName(expected.server.id, expected.user.id, userDto.name)
+            val user = serverDao.getUser(expected.server.id, expected.user.id) ?: return@withContext
+            if (_current.compareAndSet(expected, CurrentUser(server, user))) updateUserDto(userDto)
+        }
+
+        private suspend fun readSession(server: JellyfinServer): Pair<JellyfinServer, UserDto> = coroutineScope {
+            val system = async {
+                try {
+                    val info by apiClient.systemApi.getPublicSystemInfo()
+                    server.copy(name = info.serverName, version = info.version)
+                } catch (exception: Exception) {
+                    if (exception is kotlinx.coroutines.CancellationException) throw exception
+                    Timber.w(exception, "Exception fetching public system info")
+                    server
+                }
+            }
+            val user by apiClient.userApi.getCurrentUser()
+            system.await() to user
+        }
+
         /**
          * Try to restore the most recent session
          *

app/src/main/java/com/github/damontecres/wholphin/services/hilt/AppModule.kt

@@ -26,6 +26,9 @@ import org.jellyfin.sdk.api.okhttp.OkHttpFactory
 import org.jellyfin.sdk.createJellyfin
 import org.jellyfin.sdk.model.ClientInfo
 import org.jellyfin.sdk.model.DeviceInfo
+import org.justinvisser.wolfskin.conductarr.PersistentDns
+import org.justinvisser.wolfskin.conductarr.DnsConnectionRetry
+import java.io.File
 import javax.inject.Qualifier
 import javax.inject.Singleton
 
@@ -91,12 +94,14 @@ object AppModule {
     @StandardOkHttpClient
     @Provides
     @Singleton
-    fun okHttpClient() =
-        OkHttpClient
-            .Builder()
-            .apply {
-                // TODO user agent, timeouts, logging, etc
-            }.build()
+    fun okHttpClient(dns: PersistentDns) =
+        DnsConnectionRetry.configure(OkHttpClient.Builder(), dns).build()
+
+    /** Resolve noBackupFilesDir lazily: Android may create it and lookup always runs off main. */
+    @Provides
+    @Singleton
+    fun dns(@ApplicationContext context: Context): PersistentDns =
+        PersistentDns(file = { File(context.noBackupFilesDir, "wolfskin-dns.json") })
 
     @AuthOkHttpClient
     @Provides

app/src/main/java/com/github/damontecres/wholphin/ui/CoilConfig.kt

@@ -15,7 +15,8 @@ import coil3.network.NetworkResponse
 import coil3.network.cachecontrol.CacheControlCacheStrategy
 import coil3.network.okhttp.OkHttpNetworkFetcherFactory
 import coil3.request.Options
-import coil3.request.crossfade
+import coil3.request.transitionFactory
+import org.justinvisser.wolfskin.design.NetworkArtTransition
 import coil3.util.DebugLogger
 import com.github.damontecres.wholphin.preferences.AppPreference
 import com.github.damontecres.wholphin.preferences.AppPreferences
@@ -89,7 +90,7 @@ fun CoilConfig(
                     memoryCache(null)
                     diskCache(null)
                 }
-            }.crossfade(false)
+            }.transitionFactory(NetworkArtTransition)
             .logger(if (debugLogging) DebugLogger() else null)
             .components {
                 add(

app/src/main/java/com/github/damontecres/wholphin/util/CrashReportSenderFactory.kt

@@ -4,6 +4,11 @@ import android.content.Context
 import com.github.damontecres.wholphin.data.MostRecentServer
 import com.github.damontecres.wholphin.services.hilt.AppModule
 import com.github.damontecres.wholphin.services.hilt.DeviceModule
+import com.github.damontecres.wholphin.services.hilt.StandardOkHttpClient
+import dagger.hilt.EntryPoint
+import dagger.hilt.InstallIn
+import dagger.hilt.android.EntryPointAccessors
+import dagger.hilt.components.SingletonComponent
 import com.google.auto.service.AutoService
 import kotlinx.coroutines.runBlocking
 import okhttp3.OkHttpClient
@@ -73,10 +78,7 @@ class CrashReportSender : ReportSender {
 
 private fun MostRecentServer.createApi(context: Context): ApiClient? =
     (this as? MostRecentServer.ServerAndUser)?.let {
-        val okHttpClient =
-            OkHttpClient
-                .Builder()
-                .build()
+        val okHttpClient = EntryPointAccessors.fromApplication(context.applicationContext, CrashNetwork::class.java).client()
         val okHttpFactory = OkHttpFactory(okHttpClient)
         val api =
             createJellyfin {
@@ -89,3 +91,11 @@ private fun MostRecentServer.createApi(context: Context): ApiClient? =
             }.createApi(baseUrl = serverUrl, accessToken = accessToken)
         api
     }
+
+/** Crash reporting shares the application's DNS hints without borrowing authenticated headers. */
+@EntryPoint
+@InstallIn(SingletonComponent::class)
+interface CrashNetwork {
+    @StandardOkHttpClient
+    fun client(): OkHttpClient
+}

app/src/test/java/com/github/damontecres/wholphin/TestMainActivityViewModel.kt

@@ -32,6 +32,8 @@ import io.mockk.mockkStatic
 import io.mockk.slot
 import io.mockk.unmockkStatic
 import io.mockk.verify
+import kotlinx.coroutines.CompletableDeferred
+import kotlinx.coroutines.test.runCurrent
 import kotlinx.coroutines.ExperimentalCoroutinesApi
 import kotlinx.coroutines.flow.MutableStateFlow
 import kotlinx.coroutines.flow.flow
@@ -116,9 +118,6 @@ class TestMainActivityViewModel {
                 signInAutomatically = true
             }
             every { serverRepository.current } returns MutableStateFlow(currentUser)
-//            coEvery { serverRepository.tryRestoreSession(serverId, userId) } returns currentUser
-//            coEvery { serverRepository.restoreLastSession() } returns
-//                RestoredSession.Success(currentUser)
 
             viewModel.handleAppStart()
 
@@ -132,7 +131,7 @@ class TestMainActivityViewModel {
                 destination as SetupDestination.AppContent
                 Assert.assertEquals(currentUser, destination.current)
             }
-            coVerify(exactly = 0) { serverRepository.restoreLastSession() }
+            coVerify(exactly = 0) { serverRepository.restoreSavedSession() }
             coVerify(exactly = 0) { serverRepository.getMostRecentServer() }
         }
 
@@ -150,7 +149,7 @@ class TestMainActivityViewModel {
             viewModel.handleAppStart()
 
             coVerify(exactly = 0) { serverRepository.tryChangeUser(any(), any()) }
-            coVerify(exactly = 0) { serverRepository.restoreLastSession() }
+            coVerify(exactly = 0) { serverRepository.restoreSavedSession() }
             coVerify(exactly = 1) { serverRepository.getMostRecentServer() }
             val args = mutableListOf<SetupDestination>()
             verify { setupNavigationManager.navigateTo(capture(args)) }
@@ -165,6 +164,20 @@ class TestMainActivityViewModel {
             }
         }
 
+    @Test
+    fun savedColdLaunchNavigatesBeforeSessionRevalidationCompletes() = runTest(testDispatcher) {
+        setupPreferences { signInAutomatically = true }
+        every { serverRepository.current } returns MutableStateFlow<CurrentUser?>(null)
+        coEvery { serverRepository.restoreSavedSession() } returns RestoredSession.Success(currentUser)
+        val release = CompletableDeferred<Unit>()
+        coEvery { serverRepository.revalidateSession(currentUser) } coAnswers { release.await() }
+        viewModel.handleAppStart()
+        runCurrent()
+        verify { setupNavigationManager.navigateTo(SetupDestination.AppContent(currentUser)) }
+        assertFalse(release.isCompleted)
+        release.complete(Unit)
+    }
+
     @Test
     fun `Test auto sign in, hot load, with protected profile`() =
         runTest {
@@ -178,7 +191,7 @@ class TestMainActivityViewModel {
             coEvery {
                 serverRepository.tryChangeUser(serverId, userId)
             } returns null
-            coEvery { serverRepository.restoreLastSession() } returns
+            coEvery { serverRepository.restoreSavedSession() } returns
                 RestoredSession.ServerOnly(server)
 
             viewModel.handleAppStart()
@@ -204,7 +217,7 @@ class TestMainActivityViewModel {
                 signInAutomatically = true
             }
             every { serverRepository.current } returns MutableStateFlow<CurrentUser?>(null)
-            coEvery { serverRepository.restoreLastSession() } returns
+            coEvery { serverRepository.restoreSavedSession() } returns
                 RestoredSession.ServerOnly(server)
             coEvery {
                 serverRepository.tryChangeUser(serverId, userId)
@@ -212,7 +225,7 @@ class TestMainActivityViewModel {
 
             viewModel.handleAppStart()
 
-            coVerify(exactly = 1) { serverRepository.restoreLastSession() }
+            coVerify(exactly = 1) { serverRepository.restoreSavedSession() }
             val slot = slot<SetupDestination>()
             verify { setupNavigationManager.navigateTo(capture(slot)) }
             slot.captured.let { destination ->
@@ -232,11 +245,11 @@ class TestMainActivityViewModel {
                 signInAutomatically = true
             }
             every { serverRepository.current } returns MutableStateFlow<CurrentUser?>(null)
-            coEvery { serverRepository.restoreLastSession() } returns RestoredSession.None
+            coEvery { serverRepository.restoreSavedSession() } returns RestoredSession.None
 
             viewModel.handleAppStart()
 
-            coVerify(exactly = 1) { serverRepository.restoreLastSession() }
+            coVerify(exactly = 1) { serverRepository.restoreSavedSession() }
             val slot = slot<SetupDestination>()
             verify { setupNavigationManager.navigateTo(capture(slot)) }
             slot.captured.let { destination ->
@@ -254,7 +267,7 @@ class TestMainActivityViewModel {
                 signInAutomatically = true
             }
             every { serverRepository.current } returns MutableStateFlow(currentUser)
-            coEvery { serverRepository.restoreLastSession() } returns
+            coEvery { serverRepository.restoreSavedSession() } returns
                 RestoredSession.Success(currentUser)
             coEvery { intentService.parseIntent(any()) } returns IntentResult.NoOp
 
@@ -271,7 +284,7 @@ class TestMainActivityViewModel {
 //                destination as SetupDestination.AppContent
 //                Assert.assertEquals(currentUser, destination.current)
 //            }
-            coVerify(exactly = 0) { serverRepository.restoreLastSession() }
+            coVerify(exactly = 0) { serverRepository.restoreSavedSession() }
             coVerify(exactly = 0) { serverRepository.getMostRecentServer() }
         }
 

app/src/test/java/com/github/damontecres/wholphin/services/ServerSavedSessionTest.kt

@@ -0,0 +1,136 @@
+package com.github.damontecres.wholphin.services
+
+import android.app.Application
+import androidx.room.Room
+import androidx.test.core.app.ApplicationProvider
+import android.content.Context
+import com.github.damontecres.wholphin.data.*
+import com.github.damontecres.wholphin.data.model.*
+import com.github.damontecres.wholphin.ui.successResponse
+import io.mockk.*
+import java.util.UUID
+import kotlinx.coroutines.CompletableDeferred
+import kotlinx.coroutines.ExperimentalCoroutinesApi
+import kotlinx.coroutines.async
+import kotlinx.coroutines.test.StandardTestDispatcher
+import kotlinx.coroutines.test.runCurrent
+import kotlinx.coroutines.test.runTest
+import org.jellyfin.sdk.api.client.ApiClient
+import org.jellyfin.sdk.api.client.extensions.systemApi
+import org.jellyfin.sdk.api.client.extensions.userApi
+import org.jellyfin.sdk.api.operations.SystemApi
+import org.jellyfin.sdk.api.operations.UserApi
+import org.jellyfin.sdk.model.api.PublicSystemInfo
+import org.jellyfin.sdk.model.api.UserDto
+import org.junit.Assert.*
+import org.junit.After
+import org.junit.Before
+import org.junit.Test
+import org.junit.runner.RunWith
+import org.robolectric.RobolectricTestRunner
+import org.robolectric.annotation.Config
+
+/** Saved identities can paint offline without unlocking protected logins or accepting a late identity. */
+@OptIn(ExperimentalCoroutinesApi::class)
+@RunWith(RobolectricTestRunner::class)
+@Config(sdk = [34], application = Application::class)
+class ServerSavedSessionTest {
+    private val dispatcher = StandardTestDispatcher()
+    private val server = JellyfinServer(UUID.randomUUID(), "Saved server", "https://jellyfin.test", "12.1.0")
+    private var user = JellyfinUser(id = UUID.randomUUID(), serverId = server.id, name = "Saved name", accessToken = "saved-token")
+    private val users = mockk<UserApi>()
+    private val system = mockk<SystemApi>()
+    private val api = mockk<ApiClient>(relaxed = true)
+    private val recent = mockk<MostRecentServerProvider>()
+    private val database by lazy {
+        Room.inMemoryDatabaseBuilder(ApplicationProvider.getApplicationContext<Application>(), AppDatabase::class.java)
+            .allowMainThreadQueries().build()
+    }
+    private val dao by lazy { database.serverDao() }
+    private val dto = UserDto(id = user.id, name = "Refreshed name",
+        hasPassword = false, hasConfiguredPassword = false, hasConfiguredEasyPassword = false)
+    private val info = PublicSystemInfo(serverName = "Refreshed server", version = "12.1.0")
+    private val repository by lazy { ServerRepository(mockk<Context>(), mockk(), dao, api, dispatcher, recent) }
+
+    @Before fun savedLogin() {
+        every { recent.get() } returns MostRecentServer.from(CurrentUser(server, user))
+        dao.addOrUpdateServer(server)
+        user = dao.addOrUpdateUser(user)
+        every { api.userApi } returns users
+        every { api.systemApi } returns system
+        coEvery { users.getCurrentUser() } returns successResponse(dto)
+        coEvery { system.getPublicSystemInfo() } returns successResponse(info)
+    }
+
+    @After fun closeDatabase() { database.close() }
+
+    @Test fun savedSessionIsUsableWhileUserRevalidationWaitsAndSystemInfoRunsInParallel() = runTest(dispatcher) {
+        val pendingUser = CompletableDeferred<Unit>()
+        val systemStarted = CompletableDeferred<Unit>()
+        coEvery { users.getCurrentUser() } coAnswers { pendingUser.await(); successResponse(dto) }
+        coEvery { system.getPublicSystemInfo() } coAnswers { systemStarted.complete(Unit); successResponse(info) }
+        val restored = repository.restoreSavedSession() as RestoredSession.Success
+        assertEquals(user, restored.currentUser.user)
+        assertEquals(restored.currentUser, repository.current.value)
+        val refresh = async { repository.revalidateSession(restored.currentUser) }
+        runCurrent()
+        systemStarted.await()
+        assertFalse(refresh.isCompleted)
+        pendingUser.complete(Unit)
+        refresh.await()
+        assertEquals("Refreshed name", repository.current.value!!.user.name)
+        assertEquals("Refreshed server", repository.current.value!!.server.name)
+    }
+
+    @Test fun savedProtectedPeopleRemainLocked() = runTest(dispatcher) {
+        for (protected in listOf(user.copy(pin = "1234"), user.copy(requireLogin = true))) {
+            dao.updateUser(protected)
+            assertTrue(repository.restoreSavedSession() is RestoredSession.ServerOnly)
+            assertNull(repository.current.value)
+        }
+    }
+
+    @Test fun lateLaunchRefreshCannotReplaceTheSelectedPerson() = runTest(dispatcher) {
+        val first = (repository.restoreSavedSession() as RestoredSession.Success).currentUser
+        val entered = CompletableDeferred<Unit>()
+        val pending = CompletableDeferred<Unit>()
+        coEvery { users.getCurrentUser() } coAnswers { entered.complete(Unit); pending.await(); successResponse(dto) }
+        val refresh = async { repository.revalidateSession(first) }
+        entered.await()
+        val selected = dao.addOrUpdateUser(user.copy(rowId = 0, id = UUID.randomUUID(), name = "Other person"))
+        every { recent.get() } returns MostRecentServer.from(CurrentUser(server, selected))
+        repository.restoreSavedSession()
+        pending.complete(Unit)
+        refresh.await()
+        assertEquals(selected, repository.current.value!!.user)
+        assertNull(repository.currentUserDto)
+    }
+
+    @Test fun launchNameRefreshPreservesSettingsAndPinChangedWhileTheRequestWaits() = runTest(dispatcher) {
+        val first = (repository.restoreSavedSession() as RestoredSession.Success).currentUser
+        val entered = CompletableDeferred<Unit>()
+        val pending = CompletableDeferred<Unit>()
+        coEvery { users.getCurrentUser() } coAnswers { entered.complete(Unit); pending.await(); successResponse(dto) }
+        val refresh = async { repository.revalidateSession(first) }
+        entered.await()
+        val edited = user.copy(
+            pin = "4567",
+            appPreferences = user.appPreferences.copy(preferredAudioLanguage = "nld"),
+            config = user.config.copy(homeSettingsSource = HomePageSettingsSource.LOCAL),
+        )
+        dao.updateUser(edited)
+        pending.complete(Unit)
+        refresh.await()
+        val expected = edited.copy(name = dto.name)
+        assertEquals(expected, dao.getUser(server.id, user.id))
+        assertEquals(expected, repository.current.value!!.user)
+    }
+
+    @Test fun anotherUsersResponseCannotRenameTheSavedPerson() = runTest(dispatcher) {
+        val first = (repository.restoreSavedSession() as RestoredSession.Success).currentUser
+        coEvery { users.getCurrentUser() } returns successResponse(dto.copy(id = UUID.randomUUID()))
+        repository.revalidateSession(first)
+        assertEquals(user, repository.current.value!!.user)
+        assertNull(repository.currentUserDto)
+    }
+}

app/src/test/java/com/github/damontecres/wholphin/ui/TestModule.kt

@@ -62,6 +62,7 @@ import org.jellyfin.sdk.api.okhttp.OkHttpFactory
 import org.jellyfin.sdk.model.ClientInfo
 import org.jellyfin.sdk.model.DeviceInfo
 import timber.log.Timber
+import org.justinvisser.wolfskin.conductarr.PersistentDns
 import javax.inject.Singleton
 
 @Module
@@ -91,12 +92,11 @@ object TestModule {
     @StandardOkHttpClient
     @Provides
     @Singleton
-    fun okHttpClient() =
-        OkHttpClient
-            .Builder()
-            .apply {
-                // TODO user agent, timeouts, logging, etc
-            }.build()
+    fun okHttpClient(dns: PersistentDns) = AppModule.okHttpClient(dns)
+
+    @Provides
+    @Singleton
+    fun dns(@ApplicationContext context: Context): PersistentDns = AppModule.dns(context)
 
     @AuthOkHttpClient
     @Provides

app/src/test/java/org/justinvisser/wolfskin/tv/DiscoverSkeletonKeysTest.kt

@@ -0,0 +1,51 @@
+package org.justinvisser.wolfskin.tv
+
+import android.app.Application
+import androidx.activity.ComponentActivity
+import androidx.compose.ui.input.key.Key
+import androidx.compose.ui.test.junit4.createAndroidComposeRule
+import androidx.compose.ui.test.onNodeWithTag
+import androidx.compose.ui.test.performKeyInput
+import androidx.compose.ui.test.pressKey
+import io.mockk.mockk
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import org.junit.Assert.*
+import org.junit.Rule
+import org.junit.Test
+import org.junit.runner.RunWith
+import org.justinvisser.wolfskin.design.*
+import org.robolectric.RobolectricTestRunner
+import org.robolectric.annotation.Config
+
+/** A pending shelf cannot capture the D-pad or break the shell's Back ladder. */
+@RunWith(RobolectricTestRunner::class)
+@Config(sdk = [34], application = Application::class, qualifiers = "w960dp-h540dp-xhdpi")
+class DiscoverSkeletonKeysTest {
+    @get:Rule val rule = createAndroidComposeRule<ComponentActivity>()
+
+    @Test fun downAndUpSkipPendingLanesAndBackReturnsToNavWhenOnlySkeletonsRemain() {
+        val shell = ShellState(listOf(ShellPerson("justin", "Justin", "J", false)), "justin").apply {
+            pickerVisible = false; pickerLaunch = false; enterDestination("discover")
+        }
+        val pending = DiscoverLane("pending", "Pending", emptyList(), pending = true)
+        val ready = DiscoverLane("ready", "Available", listOf(DiscoverTitle(1, "movie", "A real title")))
+        val snapshot = DiscoverSnapshot(status = DiscoverStatus.Ready, lanes = listOf(pending, ready))
+        val state = DiscoverState(shell, snapshot, mockk(relaxed = true), CoroutineScope(Dispatchers.Main.immediate), {}, {})
+        state.focus(1)
+        rule.setContent { WolfskinTheme { ShellSurface(shell) { DiscoverScreen(state, it) } } }
+        press(Key.DirectionDown)
+        rule.runOnIdle { assertEquals("ready", state.focusedLane?.id); assertEquals("ready:0", state.cardKey) }
+        press(Key.DirectionUp)
+        rule.runOnIdle {
+            assertEquals(1, state.focusedRow)
+            state.updateSnapshot(snapshot.copy(lanes = listOf(pending)))
+        }
+        press(Key.DirectionDown)
+        rule.runOnIdle { assertEquals(1, state.focusedRow); assertNull(state.cardKey) }
+        press(Key.Back)
+        rule.runOnIdle { assertTrue(shell.navFocused); assertFalse(shell.pickerVisible); assertEquals("discover", shell.route) }
+    }
+
+    private fun press(key: Key) { rule.onNodeWithTag("wolfskin-shell").performKeyInput { pressKey(key) } }
+}

app/src/test/java/org/justinvisser/wolfskin/tv/FirstSignInNavigationTest.kt

@@ -84,7 +84,7 @@ class FirstSignInNavigationTest {
                 coEvery { views.getUserViews(userId = user.id) } returns successQueryResult(listOf(movies, shows))
                 for ((library, kind, count) in listOf(Triple(movies, BaseItemKind.MOVIE, 6), Triple(shows, BaseItemKind.SERIES, 29))) {
                     coEvery { items.getItems(userId = user.id, parentId = library.id, recursive = true,
-                        includeItemTypes = listOf(kind), fields = listOf(ItemFields.PROVIDER_IDS, ItemFields.SORT_NAME, ItemFields.DATE_CREATED),
+                        includeItemTypes = listOf(kind), fields = listOf(ItemFields.PROVIDER_IDS, ItemFields.DATE_CREATED),
                         sortBy = listOf(ItemSortBy.SORT_NAME), startIndex = 0, limit = 200) } returns successQueryResult(
                             List(count) { BaseItemDto(id = UUID.randomUUID(), name = "${library.name} title $it", type = kind) })
                 }

app/src/test/java/org/justinvisser/wolfskin/tv/LibraryReadFacadeTest.kt

@@ -51,7 +51,7 @@ class LibraryReadFacadeTest {
         val offsets = mutableListOf<Int>()
         coEvery { items.getItems(userId = user, parentId = library.id, recursive = true,
             includeItemTypes = listOf(BaseItemKind.MOVIE),
-            fields = listOf(ItemFields.PROVIDER_IDS, ItemFields.SORT_NAME, ItemFields.DATE_CREATED),
+            fields = listOf(ItemFields.PROVIDER_IDS, ItemFields.DATE_CREATED),
             sortBy = listOf(ItemSortBy.SORT_NAME), startIndex = capture(offsets), limit = 200) } coAnswers {
             if (offsets.last() == 0) successQueryResult(firstChunk, 202) else {
                 assertEquals(200, offsets.last())

app/src/test/java/org/justinvisser/wolfskin/tv/SavedPeoplePickerTest.kt

@@ -0,0 +1,92 @@
+// SPDX-License-Identifier: GPL-2.0-only
+package org.justinvisser.wolfskin.tv
+
+import android.app.Application
+import androidx.activity.ComponentActivity
+import androidx.compose.ui.test.assertIsDisplayed
+import androidx.compose.ui.test.junit4.createAndroidComposeRule
+import androidx.compose.ui.test.onNodeWithText
+import androidx.compose.ui.test.onRoot
+import com.github.takahirom.roborazzi.captureRoboImage
+import java.io.File
+import androidx.lifecycle.viewModelScope
+import com.github.damontecres.wholphin.data.ServerRepository
+import com.github.damontecres.wholphin.data.model.JellyfinServer
+import com.github.damontecres.wholphin.data.model.JellyfinServerUsers
+import com.github.damontecres.wholphin.data.model.JellyfinUser
+import com.github.damontecres.wholphin.preferences.AppPreferences
+import com.github.damontecres.wholphin.preferences.UserPreferences
+import com.github.damontecres.wholphin.services.NavigationManager
+import io.mockk.coEvery
+import io.mockk.mockk
+import java.util.UUID
+import java.util.concurrent.CountDownLatch
+import java.util.concurrent.atomic.AtomicBoolean
+import kotlinx.coroutines.cancel
+import org.junit.Assert.*
+import org.junit.Rule
+import org.junit.Test
+import org.junit.runner.RunWith
+import org.justinvisser.wolfskin.conductarr.MemoryCacheStore
+import org.justinvisser.wolfskin.design.PeopleStatus
+import org.justinvisser.wolfskin.tv.read.LibraryReadFacade
+import org.robolectric.RobolectricTestRunner
+import org.robolectric.annotation.Config
+import org.robolectric.annotation.GraphicsMode
+
+/** The actual picker displays every saved login while household revalidation has no response. */
+@RunWith(RobolectricTestRunner::class)
+@Config(sdk = [34], application = Application::class, qualifiers = "w960dp-h540dp-xhdpi")
+@GraphicsMode(GraphicsMode.Mode.NATIVE)
+class SavedPeoplePickerTest {
+    @get:Rule val rule = createAndroidComposeRule<ComponentActivity>()
+
+    @Test fun savedPeopleAreVisibleBeforeTheFirstNetworkResponse() {
+        ConductarrPreference.initialize(rule.activity)
+        val previousUrl = ConductarrPreference.baseUrl
+        val previousFixtures = ConductarrPreference.fixtures
+        val release = CountDownLatch(1)
+        val entered = AtomicBoolean(false)
+        FakeConductarr().use { fake ->
+            fake.beforeResponse = { entered.set(true); release.await() }
+            ConductarrPreference.updateBaseUrl(fake.url)
+            ConductarrPreference.updateFixtures(false)
+            ConductarrSession(MemoryCacheStore()).use { conductarr ->
+                val server = JellyfinServer(UUID.randomUUID(), "Saved server", fake.url, null)
+                val users = listOf("Justin" to JUSTIN_TOKEN, "Mindel" to MINDEL_TOKEN, "Shared" to SHARED_TOKEN).map { (name, token) ->
+                    JellyfinUser(id = UUID.randomUUID(), serverId = server.id, name = name, accessToken = token)
+                }
+                val repository = mockk<ServerRepository>(relaxed = true)
+                coEvery { repository.serverDao.getServer(server.id) } returns JellyfinServerUsers(server, users)
+                val libraries = mockk<LibraryReadFacade>(relaxed = true)
+                coEvery { libraries.readDestinations(any()) } returns emptyMap()
+                val session = WolfskinSession()
+                val navigation = NavigationManager()
+                val model = WolfskinShellViewModel(rule.activity, session, repository, navigation, mockk(relaxed = true),
+                    mockk(relaxed = true), libraries, WolfskinSeeAllLists(), conductarr, mockk(relaxed = true))
+                try {
+                    rule.setContent {
+                        WolfskinApp(server, users.first(), navigation, UserPreferences(AppPreferences.getDefaultInstance(), null),
+                            viewModel = model, homeContent = { _, _, _, _ -> })
+                    }
+                    rule.waitUntil(5_000) { entered.get() && session.state?.people?.size == 3 }
+                    users.forEach { rule.onNodeWithText(it.name!!).assertIsDisplayed() }
+                    rule.runOnIdle {
+                        assertTrue(session.state!!.pickerVisible)
+                        assertEquals(PeopleStatus.Ready, session.state!!.peopleStatus)
+                        assertEquals(users.map { it.id.toString() }, session.state!!.people.map { it.jellyfinUserId })
+                        assertEquals(listOf("justin", "mindel", "shared"), session.state!!.people.map { it.key })
+                        assertEquals(1L, release.count)
+                    }
+                    val captures = File(requireNotNull(System.getProperty("wolfskin.captureDirectory"))).apply { mkdirs() }
+                    rule.onRoot().captureRoboImage(File(captures, "saved-people-before-network.png"))
+                } finally {
+                    release.countDown()
+                    model.viewModelScope.cancel()
+                    ConductarrPreference.updateBaseUrl(previousUrl)
+                    ConductarrPreference.updateFixtures(previousFixtures)
+                }
+            }
+        }
+    }
+}

app/src/test/java/org/justinvisser/wolfskin/tv/TitleReadFacadeTest.kt

@@ -33,6 +33,8 @@ import com.github.damontecres.wholphin.test.TestTracks
 import org.jellyfin.sdk.model.api.MediaStreamType
 import org.jellyfin.sdk.model.api.request.GetEpisodesRequest
 import org.jellyfin.sdk.model.api.request.GetItemsRequest
+import org.jellyfin.sdk.model.api.ItemFields
+import org.jellyfin.sdk.model.api.request.GetNextUpRequest
 import org.junit.Assert.*
 import org.junit.After
 import org.junit.Before
@@ -219,6 +221,43 @@ class TitleReadFacadeTest {
         assertEquals(2, TitleState(data, ShellPerson("justin", "Justin", "J", false)) {}.season)
     }
 
+    @Test fun leanEpisodeListsKeepSingleItemPlaybackTracksEvenWithoutNextUp() = runTest {
+        val series = BaseItemDto(id = seriesId, name = "Series", type = BaseItemKind.SERIES, people = emptyList(), providerIds = mapOf("Tmdb" to "42"))
+        val episode = file(firstId, BaseItemKind.EPISODE).copy(seriesId = seriesId, parentIndexNumber = 3, indexNumber = 1)
+        coEvery { library.getItem(seriesId) } returns successResponse(series)
+        coEvery { library.getItem(firstId) } returns successResponse(episode)
+        coEvery { shows.getNextUp(any<GetNextUpRequest>()) } coAnswers {
+            assertTrue(firstArg<GetNextUpRequest>().fields.orEmpty().isEmpty())
+            successQueryResult(emptyList())
+        }
+        coEvery { items.getItems(any<GetItemsRequest>()) } returns successQueryResult(
+            listOf(BaseItemDto(id = seasonId, type = BaseItemKind.SEASON, indexNumber = 3)))
+        coEvery { shows.getEpisodes(any<GetEpisodesRequest>()) } coAnswers {
+            val fields = firstArg<GetEpisodesRequest>().fields.orEmpty()
+            assertFalse(fields.any { it in listOf(ItemFields.MEDIA_SOURCES, ItemFields.MEDIA_STREAMS, ItemFields.PEOPLE, ItemFields.PARENT_ID) })
+            successQueryResult(listOf(episode.copy(mediaSources = null, overview = "Episode synopsis")))
+        }
+        val page = facade.read(seriesId, 3, preferences)
+        assertEquals(firstId.toString(), page.playTarget?.id)
+        assertEquals("MKV", page.versions.single().container)
+        assertEquals(listOf(3), page.versions.single().audio.map { it.index })
+        val saved = requireNotNull(facade.readSaved(seriesId, preferences))
+        assertEquals(page.versions, saved.versions)
+    }
+
+    @Test fun performerCreditListsOmitStreamsButKeepCharacterRoles() = runTest {
+        coEvery { library.getItem(firstId) } returns successResponse(
+            BaseItemDto(id = firstId, type = BaseItemKind.PERSON, name = "Actor"))
+        coEvery { items.getItems(any<GetItemsRequest>()) } coAnswers {
+            val fields = firstArg<GetItemsRequest>().fields.orEmpty()
+            assertFalse(fields.any { it in listOf(ItemFields.MEDIA_SOURCES, ItemFields.MEDIA_STREAMS, ItemFields.PARENT_ID) })
+            assertTrue(ItemFields.PEOPLE in fields)
+            successQueryResult(listOf(file(secondId).copy(people = listOf(
+                org.jellyfin.sdk.model.api.BaseItemPerson(id = firstId, name = "Actor", role = "Chef")))))
+        }
+        assertEquals("Chef", facade.readPerson(firstId, 0).credits.single().character)
+    }
+
     @Test fun compactJellyfinSourceIdUsesTheSameVersionPersistenceKey() = runTest {
         coEvery { library.getItem(firstId) } returns successResponse(file(firstId))
         coEvery { playback.savePlayVersion(any(), any()) } returns null

app/src/wolfskin/java/org/justinvisser/wolfskin/tv/ConductarrPreference.kt

@@ -21,6 +21,7 @@ import kotlinx.coroutines.CoroutineScope
 import org.justinvisser.wolfskin.conductarr.CacheEntry
 import org.justinvisser.wolfskin.conductarr.CacheStore
 import org.justinvisser.wolfskin.conductarr.FileCacheStore
+import org.justinvisser.wolfskin.conductarr.PersistentDns
 
 /** Advanced-only endpoint and fixture controls contain no credentials. */
 object ConductarrPreference {
@@ -54,8 +55,8 @@ object ConductarrPreference {
 object ConductarrModule {
     @Provides
     @Singleton
-    fun session(@ApplicationContext context: Context, @IoCoroutineScope scope: CoroutineScope): ConductarrSession =
-        ConductarrSession(ConductarrDiskCache(context), scope)
+    fun session(@ApplicationContext context: Context, @IoCoroutineScope scope: CoroutineScope, dns: PersistentDns): ConductarrSession =
+        ConductarrSession(ConductarrDiskCache(context), scope, dns)
 }
 
 /** Android may create noBackupFilesDir, so resolve it only during an IO cache operation. */

app/src/wolfskin/java/org/justinvisser/wolfskin/tv/ConductarrSession.kt

@@ -29,6 +29,7 @@ data class ConductarrIdentity(
 class ConductarrSession(
     private val cache: CacheStore,
     private val disposalScope: CoroutineScope = CoroutineScope(SupervisorJob() + Dispatchers.IO),
+    private val dns: PersistentDns? = null,
 ) : Closeable {
     private val mutableIdentity = MutableStateFlow<ConductarrIdentity?>(null)
     val identity: StateFlow<ConductarrIdentity?> = mutableIdentity.asStateFlow()
@@ -50,7 +51,7 @@ class ConductarrSession(
         }
         try {
             val client = if (token.isNullOrBlank()) null else try {
-                ConductarrClient(baseUrl, token, PersonCacheStore(cache, person), timeouts = ClientTimeouts(3, 5, 8), onEvent = { event ->
+                ConductarrClient(baseUrl, token, PersonCacheStore(cache, person), timeouts = ClientTimeouts(3, 5, 8), dns = dns, onEvent = { event ->
                     if (event == ClientEvent.NEEDS_SIGN_IN) {
                         mutableIdentity.update {
                             if (generation == currentGeneration) it?.copy(operator = null, signedIn = false, error = ClientError.NeedsSignIn) else it

app/src/wolfskin/java/org/justinvisser/wolfskin/tv/NetworkStartup.kt

@@ -0,0 +1,46 @@
+// SPDX-License-Identifier: GPL-2.0-only
+package org.justinvisser.wolfskin.tv
+
+import android.content.Context
+import com.github.damontecres.wholphin.data.MostRecentServer
+import com.github.damontecres.wholphin.data.MostRecentServerProvider
+import com.github.damontecres.wholphin.services.hilt.IoCoroutineScope
+import dagger.hilt.android.qualifiers.ApplicationContext
+import javax.inject.Inject
+import javax.inject.Provider
+import javax.inject.Singleton
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.launch
+import okhttp3.HttpUrl.Companion.toHttpUrlOrNull
+import org.justinvisser.wolfskin.conductarr.PersistentDns
+
+/** Process warm-up never blocks application creation or serializes the two service lookups. */
+@Singleton
+class NetworkStartup @Inject constructor(
+    @param:ApplicationContext private val context: Context,
+    private val recent: Provider<MostRecentServerProvider>,
+    private val dns: PersistentDns,
+    @param:IoCoroutineScope private val scope: CoroutineScope,
+) {
+    fun start() {
+        scope.launch {
+            val url = when (val server = recent.get().get()) {
+                is MostRecentServer.Server -> server.serverUrl
+                is MostRecentServer.ServerAndUser -> server.serverUrl
+                MostRecentServer.None -> null
+            }
+            warm(url)
+        }
+        scope.launch {
+            ConductarrPreference.initialize(context)
+            warm(ConductarrPreference.baseUrl)
+        }
+    }
+
+    private fun warm(url: String?) {
+        val host = url?.toHttpUrlOrNull()?.host ?: return
+        try { dns.lookup(host) } catch (_: Exception) {
+            // An offline launch must still render the saved people.
+        }
+    }
+}

app/src/wolfskin/java/org/justinvisser/wolfskin/tv/read/LibraryReadFacade.kt

@@ -72,7 +72,7 @@ class LibraryReadFacade @Inject constructor(private val api: ApiClient) {
                 val response = api.itemsApi.getItems(
                     userId = userId, parentId = library.id, recursive = true,
                     includeItemTypes = listOf(if (destination == "movies") BaseItemKind.MOVIE else BaseItemKind.SERIES),
-                    fields = listOf(ItemFields.PROVIDER_IDS, ItemFields.SORT_NAME, ItemFields.DATE_CREATED),
+                    fields = listOf(ItemFields.PROVIDER_IDS, ItemFields.DATE_CREATED),
                     sortBy = listOf(ItemSortBy.SORT_NAME), startIndex = offset,
                     limit = WolfskinTokens.Behaviour.libraryChunk.toInt(),
                 ).content

app/src/wolfskin/java/org/justinvisser/wolfskin/tv/read/TitleReadFacade.kt

@@ -53,7 +53,8 @@ class TitleReadFacade @Inject constructor(
     @param:ApplicationContext private val context: Context,
 ) {
     private val json = Json { ignoreUnknownKeys = true }
-    private val fields = listOf(ItemFields.PROVIDER_IDS, ItemFields.MEDIA_SOURCES, ItemFields.MEDIA_STREAMS, ItemFields.OVERVIEW, ItemFields.PEOPLE, ItemFields.PARENT_ID)
+    private val episodeFields = listOf(ItemFields.PROVIDER_IDS, ItemFields.OVERVIEW)
+    private val creditFields = listOf(ItemFields.PROVIDER_IDS, ItemFields.OVERVIEW, ItemFields.PEOPLE)
 
     /** Resolve through this user's Jellyfin permissions before granting a catalogue card playback. */
     suspend fun findHeld(tmdb: Long, media: String): UUID? {
@@ -88,12 +89,12 @@ class TitleReadFacade @Inject constructor(
         val series = if (opened.type == BaseItemKind.EPISODE && opened.seriesId != null) readItem(opened.seriesId!!) else opened
         val seasons = if (series.type == BaseItemKind.SERIES) api.itemsApi.getItems(GetItemsRequest(parentId = series.id, includeItemTypes = listOf(BaseItemKind.SEASON), recursive = false, sortBy = listOf(ItemSortBy.INDEX_NUMBER))).content.items.orEmpty() else emptyList()
         val next = if (opened.type == BaseItemKind.EPISODE || opened.type == BaseItemKind.MOVIE) opened else {
-            api.tvShowsApi.getNextUp(GetNextUpRequest(seriesId = series.id, userId = repository.currentUser?.id, limit = 1, fields = fields, enableResumable = true)).content.items.firstOrNull()?.let { api.userLibraryApi.getItem(it.id).content }
+            api.tvShowsApi.getNextUp(GetNextUpRequest(seriesId = series.id, userId = repository.currentUser?.id, limit = 1, enableResumable = true)).content.items.firstOrNull()?.let { readItem(it.id) }
         }
         val selectedNumber = season ?: next?.parentIndexNumber ?: seasons.firstOrNull()?.indexNumber
         val selected = seasons.firstOrNull { it.indexNumber == selectedNumber } ?: seasons.firstOrNull()
-        val episodes = selected?.let { api.tvShowsApi.getEpisodes(GetEpisodesRequest(seriesId = series.id, seasonId = it.id, fields = fields)).content.items.orEmpty() }.orEmpty()
-        val target = next ?: episodes.firstOrNull { it.type == BaseItemKind.EPISODE }
+        val episodes = selected?.let { api.tvShowsApi.getEpisodes(GetEpisodesRequest(seriesId = series.id, seasonId = it.id, fields = episodeFields)).content.items.orEmpty() }.orEmpty()
+        val target = next ?: episodes.firstOrNull { it.type == BaseItemKind.EPISODE }?.let { readItem(it.id) }
         val rows = (listOf(series, opened) + listOfNotNull(target) + episodes).distinctBy { it.id }
         val numbers = seasons.mapNotNull { it.indexNumber }
         val result = build(rows, numbers, selected?.indexNumber, opened.id.toString(), target?.id?.toString(), preferences)
@@ -165,7 +166,7 @@ class TitleReadFacade @Inject constructor(
         } else emptyList()
         val person = previous.firstOrNull() ?: api.userLibraryApi.getItem(id).content
         val credits = api.itemsApi.getItems(GetItemsRequest(personIds = listOf(id), recursive = true,
-            includeItemTypes = listOf(BaseItemKind.MOVIE, BaseItemKind.SERIES), fields = fields, startIndex = start, limit = 200,
+            includeItemTypes = listOf(BaseItemKind.MOVIE, BaseItemKind.SERIES), fields = creditFields, startIndex = start, limit = 200,
             sortBy = listOf(ItemSortBy.PRODUCTION_YEAR, ItemSortBy.SORT_NAME))).content.items.orEmpty()
         val rows = listOf(person) + (previous.drop(1) + credits).distinctBy { it.id }
         if (personCacheFile(id) != file) throw kotlinx.coroutines.CancellationException("Performer identity changed")

conductarr-client/src/main/kotlin/org/justinvisser/wolfskin/conductarr/ConductarrClient.kt

@@ -67,6 +67,7 @@ class ConductarrClient(
     timeouts: ClientTimeouts = ClientTimeouts(),
     private val nowMillis: () -> Long = System::currentTimeMillis,
     private val onEvent: (ClientEvent) -> Unit = {},
+    dns: PersistentDns? = null,
 ) : Closeable {
     private val base = baseUrl.toHttpUrl()
     private val scope: String
@@ -74,6 +75,7 @@ class ConductarrClient(
     private val cacheIdentityLock = Any()
     private val catalogueReads = Semaphore(2)
     private val http = OkHttpClient.Builder()
+        .apply { if (dns != null) DnsConnectionRetry.configure(this, dns) }
         .connectTimeout(timeouts.connectSeconds, TimeUnit.SECONDS)
         .readTimeout(timeouts.readSeconds, TimeUnit.SECONDS)
         .callTimeout(timeouts.callSeconds, TimeUnit.SECONDS)

conductarr-client/src/main/kotlin/org/justinvisser/wolfskin/conductarr/DnsConnectionRetry.kt

@@ -0,0 +1,60 @@
+// SPDX-License-Identifier: GPL-2.0-only
+package org.justinvisser.wolfskin.conductarr
+
+import java.io.IOException
+import java.net.InetSocketAddress
+import java.net.Proxy
+import java.util.concurrent.ConcurrentHashMap
+import okhttp3.Call
+import okhttp3.EventListener
+import okhttp3.Interceptor
+import okhttp3.OkHttpClient
+import okhttp3.Protocol
+import okhttp3.Response
+
+/** Retry once with fresh DNS only if connection establishment failed before any HTTP headers were sent. */
+class DnsConnectionRetry(private val dns: PersistentDns) : Interceptor, EventListener.Factory {
+    private class Attempt {
+        @Volatile var connectionFailed = false
+        @Volatile var headersSent = false
+    }
+    private val attempts = ConcurrentHashMap<Call, Attempt>()
+
+    override fun create(call: Call): EventListener {
+        val attempt = Attempt()
+        attempts[call] = attempt
+        return object : EventListener() {
+            override fun connectFailed(call: Call, inetSocketAddress: InetSocketAddress, proxy: Proxy, protocol: Protocol?, ioe: IOException) {
+                attempt.connectionFailed = true
+            }
+            override fun requestHeadersStart(call: Call) { attempt.headersSent = true }
+            override fun callEnd(call: Call) { attempts.remove(call) }
+            override fun callFailed(call: Call, ioe: IOException) { attempts.remove(call) }
+        }
+    }
+
+    override fun intercept(chain: Interceptor.Chain): Response {
+        // OkHttp deliberately disables event listeners on its derived WebSocket client.
+        val attempt = attempts[chain.call()] ?: return chain.proceed(chain.request())
+        return try {
+            chain.proceed(chain.request())
+        } catch (failure: IOException) {
+            if (!attempt.connectionFailed || attempt.headersSent || chain.call().isCanceled()) throw failure
+            try {
+                dns.lookupFresh(chain.request().url.host)
+            } catch (lookupFailure: IOException) {
+                lookupFailure.addSuppressed(failure)
+                throw lookupFailure
+            }
+            chain.proceed(chain.request())
+        }
+    }
+
+    companion object {
+        /** Install the same resolver and its pre-request recovery on a separately owned client. */
+        fun configure(builder: OkHttpClient.Builder, dns: PersistentDns): OkHttpClient.Builder {
+            val retry = DnsConnectionRetry(dns)
+            return builder.dns(dns).eventListenerFactory(retry).addInterceptor(retry)
+        }
+    }
+}

conductarr-client/src/main/kotlin/org/justinvisser/wolfskin/conductarr/PersistentDns.kt

@@ -0,0 +1,142 @@
+// SPDX-License-Identifier: GPL-2.0-only
+package org.justinvisser.wolfskin.conductarr
+
+import java.io.File
+import java.io.IOException
+import java.net.InetAddress
+import java.net.UnknownHostException
+import java.util.concurrent.ConcurrentHashMap
+import java.util.concurrent.Executor
+import java.util.concurrent.Executors
+import kotlinx.serialization.Serializable
+import kotlinx.serialization.Transient
+import kotlinx.serialization.encodeToString
+import okhttp3.Dns
+
+/** Last-known system answers stay usable for one day while a single background lookup refreshes them. */
+class PersistentDns(
+    private val file: () -> File,
+    private val resolver: Dns = Dns.SYSTEM,
+    private val executor: Executor = Executors.newFixedThreadPool(2) { task -> Thread(task, "wolfskin-dns").apply { isDaemon = true } },
+    private val nowMillis: () -> Long = System::currentTimeMillis,
+) : Dns {
+    private class Host {
+        @Volatile var answer: Answer? = null
+        @Volatile var refreshAfter = 0L
+        var refreshing = false
+        val resolutionLock = Any()
+    }
+
+    @Serializable
+    private data class Answer(
+        val addresses: List<String>,
+        val savedAtMillis: Long,
+        @Transient val resolvedAddresses: List<InetAddress> = decodeAddresses(addresses),
+    )
+    private val hosts = ConcurrentHashMap<String, Host>()
+    private val diskLock = Any()
+    @Volatile private var loaded = false
+
+    override fun lookup(hostname: String): List<InetAddress> {
+        load()
+        val host = hosts.computeIfAbsent(hostname) { Host() }
+        val saved = host.answer
+        if (saved != null && nowMillis() - saved.savedAtMillis in 0..MAX_STALENESS_MILLIS) {
+            refresh(hostname, host)
+            return saved.resolvedAddresses
+        }
+        return synchronized(host.resolutionLock) {
+            val current = host.answer
+            if (current != null && current !== saved && nowMillis() - current.savedAtMillis in 0..MAX_STALENESS_MILLIS) {
+                current.resolvedAddresses
+            } else resolve(hostname, host)
+        }
+    }
+
+    /** A failed connection bypasses the cached answer and any completed background refresh. */
+    fun lookupFresh(hostname: String): List<InetAddress> {
+        load()
+        val host = hosts.computeIfAbsent(hostname) { Host() }
+        return synchronized(host.resolutionLock) {
+            host.answer = null
+            resolve(hostname, host)
+        }
+    }
+
+    private fun refresh(hostname: String, host: Host) {
+        synchronized(host) {
+            if (host.refreshing || nowMillis() < host.refreshAfter) return
+            host.refreshing = true
+        }
+        executor.execute {
+            try {
+                synchronized(host.resolutionLock) { resolve(hostname, host) }
+            } catch (_: Exception) {
+                // Failed refreshes do not extend the lifetime of the last successful answer.
+                host.refreshAfter = nowMillis() + FAILURE_BACKOFF_MILLIS
+            } finally {
+                synchronized(host) { host.refreshing = false }
+            }
+        }
+    }
+
+    private fun resolve(hostname: String, host: Host): List<InetAddress> {
+        val addresses = resolver.lookup(hostname)
+        if (addresses.isEmpty()) throw UnknownHostException(hostname)
+        host.answer = Answer(addresses.map { it.hostAddress!! }, nowMillis(), addresses)
+        host.refreshAfter = nowMillis() + REFRESH_INTERVAL_MILLIS
+        persist()
+        return addresses
+    }
+
+    private fun load() {
+        if (loaded) return
+        synchronized(diskLock) {
+            if (loaded) return
+            try {
+                val saved = file()
+                if (saved.isFile && saved.length() <= MAX_FILE_BYTES) {
+                    val entries = WireJson.decodeFromString<Map<String, Answer>>(saved.readText())
+                    require(entries.size <= MAX_HOSTS)
+                    entries.forEach { (name, answer) -> hosts[name] = Host().apply { this.answer = answer } }
+                }
+            } catch (_: IOException) {
+                // A missing or damaged hint file cannot prevent normal system resolution.
+            } catch (_: IllegalArgumentException) {
+                // Serialization and literal-validation errors invalidate the entire hint file.
+            }
+            loaded = true
+        }
+    }
+
+    private fun persist() = synchronized(diskLock) {
+        try {
+            val entries = hosts.entries.mapNotNull { (name, host) -> host.answer?.let { name to it } }
+                .sortedByDescending { it.second.savedAtMillis }.take(MAX_HOSTS).toMap()
+            val target = file()
+            target.parentFile?.mkdirs()
+            val temporary = File(target.path + ".tmp")
+            temporary.writeText(WireJson.encodeToString(entries))
+            if (!temporary.renameTo(target)) temporary.delete()
+        } catch (_: IOException) {
+            // The in-memory answer remains usable when private storage is unavailable.
+        }
+    }
+
+    companion object {
+        const val MAX_STALENESS_MILLIS = 24 * 60 * 60 * 1000L
+        private const val REFRESH_INTERVAL_MILLIS = 60_000L
+        private const val FAILURE_BACKOFF_MILLIS = 2_000L
+        private const val MAX_HOSTS = 32
+        private const val MAX_ADDRESSES = 32
+        private const val MAX_FILE_BYTES = 64 * 1024L
+        private fun decodeAddresses(addresses: List<String>): List<InetAddress> {
+            require(addresses.isNotEmpty() && addresses.size <= MAX_ADDRESSES)
+            return addresses.map { address ->
+                // Numeric literals only: decoding the hint file must never perform DNS.
+                require(address.contains(':') || address.matches(Regex("[0-9]+\\.[0-9]+\\.[0-9]+\\.[0-9]+")))
+                InetAddress.getByName(address)
+            }
+        }
+    }
+}

conductarr-client/src/test/kotlin/org/justinvisser/wolfskin/conductarr/ClientSmoke.kt

@@ -2,6 +2,10 @@
 package org.justinvisser.wolfskin.conductarr
 
 import java.nio.file.Files
+import java.io.File
+import java.net.InetAddress
+import java.util.concurrent.Executor
+import okhttp3.Dns
 import kotlinx.coroutines.flow.first
 import kotlinx.coroutines.flow.toList
 import kotlinx.coroutines.runBlocking
@@ -14,13 +18,24 @@ fun main() = runBlocking {
     try {
         MockWebServer().use { server ->
             server.start()
-            val baseUrl = server.url("/").toString()
+            val baseUrl = server.url("/").newBuilder().host("localhost").build().toString()
+            var resolutions = 0
+            val dead = InetAddress.getByName("127.0.0.2")
+            val live = InetAddress.getByName("127.0.0.1")
+            val dns = PersistentDns({ File(directory, "dns.json") }, Dns {
+                resolutions++
+                if (resolutions == 1) listOf(dead) else listOf(live)
+            }, Executor { it.run() })
+            check(dns.lookup("localhost") == listOf(dead))
             server.enqueue(MockResponse.Builder().body(PROFILES_JSON).addHeader("ETag", "\"smoke\"").build())
-            ConductarrClient(baseUrl, TEST_TOKEN, FileCacheStore(directory)).use { client ->
+            ConductarrClient(baseUrl, TEST_TOKEN, FileCacheStore(directory), dns = dns).use { client ->
                 val live = client.read(TvRoutes.profiles()).toList().single() as ReadResult.Value
                 check(live.saved.value!!.profiles!!.single().name == "Justin")
+                check(resolutions == 2)
+                println("DNS SMOKE: cached 127.0.0.2 refused -> fresh 127.0.0.1 -> profile Justin; requests=${server.requestCount}, resolutions=$resolutions")
             }
-            ConductarrClient(baseUrl, TEST_TOKEN, FileCacheStore(directory)).use { client ->
+            val reopened = PersistentDns({ File(directory, "dns.json") }, Dns { listOf(live) }, Executor { it.run() })
+            ConductarrClient(baseUrl, TEST_TOKEN, FileCacheStore(directory), dns = reopened).use { client ->
                 val saved = client.read(TvRoutes.profiles(), ReadTrigger.CACHE_ONLY).first() as ReadResult.Value
                 check(saved.saved.fromDisk)
                 server.enqueue(MockResponse.Builder().code(304).build())

conductarr-client/src/test/kotlin/org/justinvisser/wolfskin/conductarr/DnsConnectionRetryTest.kt

@@ -0,0 +1,68 @@
+// SPDX-License-Identifier: GPL-2.0-only
+package org.justinvisser.wolfskin.conductarr
+
+import java.net.InetAddress
+import java.util.concurrent.CompletableFuture
+import java.util.concurrent.Executors
+import java.util.concurrent.TimeUnit
+import java.util.concurrent.atomic.AtomicReference
+import mockwebserver3.MockResponse
+import mockwebserver3.MockWebServer
+import okhttp3.Dispatcher
+import okhttp3.Dns
+import okhttp3.OkHttpClient
+import okhttp3.Request
+import okhttp3.Response
+import okhttp3.WebSocket
+import okhttp3.WebSocketListener
+import org.junit.Assert.*
+import org.junit.Rule
+import org.junit.Test
+import org.junit.rules.TemporaryFolder
+
+/** OkHttp's listener-free WebSocket client must retain a working upgrade and message path. */
+class DnsConnectionRetryTest {
+    @get:Rule val directory = TemporaryFolder()
+
+    @Test fun derivedClientOpensWebSocketWithoutAnUncaughtDispatcherException() {
+        val opened = CompletableFuture<Int>()
+        val message = CompletableFuture<String>()
+        val uncaught = AtomicReference<Throwable?>()
+        val executor = Executors.newCachedThreadPool { task ->
+            Thread(task, "dns-websocket-test").apply {
+                uncaughtExceptionHandler = Thread.UncaughtExceptionHandler { _, failure ->
+                    uncaught.set(failure)
+                    opened.completeExceptionally(failure)
+                    message.completeExceptionally(failure)
+                }
+            }
+        }
+        MockWebServer().use { server ->
+            server.enqueue(MockResponse.Builder().webSocketUpgrade(object : WebSocketListener() {
+                override fun onOpen(webSocket: WebSocket, response: Response) { webSocket.send("ready") }
+            }).build())
+            server.start()
+            val dns = PersistentDns({ directory.root.resolve("dns.json") }, Dns { listOf(InetAddress.getByName("127.0.0.1")) })
+            val client = DnsConnectionRetry.configure(OkHttpClient.Builder(), dns)
+                .dispatcher(Dispatcher(executor)).build().newBuilder().build()
+            val socket = client.newWebSocket(Request.Builder().url(server.url("/events")).build(), object : WebSocketListener() {
+                override fun onOpen(webSocket: WebSocket, response: Response) { opened.complete(response.code) }
+                override fun onMessage(webSocket: WebSocket, text: String) { message.complete(text) }
+                override fun onFailure(webSocket: WebSocket, t: Throwable, response: Response?) {
+                    opened.completeExceptionally(t)
+                    message.completeExceptionally(t)
+                }
+            })
+            try {
+                assertEquals(101, opened.get(5, TimeUnit.SECONDS).toInt())
+                assertEquals("ready", message.get(5, TimeUnit.SECONDS))
+                assertNull(uncaught.get())
+                println("WEBSOCKET SMOKE: derived cached-DNS client opened HTTP 101, received ready, no uncaught dispatcher exception")
+            } finally {
+                socket.cancel()
+                client.connectionPool.evictAll()
+                executor.shutdownNow()
+            }
+        }
+    }
+}

conductarr-client/src/test/kotlin/org/justinvisser/wolfskin/conductarr/PersistentDnsTest.kt

@@ -0,0 +1,160 @@
+// SPDX-License-Identifier: GPL-2.0-only
+package org.justinvisser.wolfskin.conductarr
+
+import java.io.File
+import java.net.InetAddress
+import java.net.Proxy
+import java.net.UnknownHostException
+import java.util.concurrent.Executor
+import java.util.concurrent.TimeUnit
+import mockwebserver3.MockResponse
+import mockwebserver3.MockWebServer
+import okhttp3.ConnectionPool
+import okhttp3.Dns
+import okhttp3.OkHttpClient
+import okhttp3.Request
+import okhttp3.RequestBody.Companion.toRequestBody
+import org.junit.Assert.*
+import org.junit.Rule
+import org.junit.Test
+import org.junit.rules.TemporaryFolder
+
+/** Fake time and queued refreshes prove stale answers, disk hints and dead-address recovery. */
+class PersistentDnsTest {
+    @get:Rule val directory = TemporaryFolder()
+    private var now = 1_000_000L
+    private val queued = ArrayDeque<Runnable>()
+    private val background = Executor { queued.add(it) }
+    private val old = InetAddress.getByName("127.0.0.2")
+    private val fresh = InetAddress.getByName("127.0.0.1")
+    private var answer = listOf(old)
+    private var lookups = 0
+    private val resolver = Dns { lookups++; answer }
+    private val file get() = File(directory.root, "dns.json")
+    private fun cache(resolve: Dns = resolver) = PersistentDns({ file }, resolve, background, { now })
+
+    @Test fun staleAnswerReturnsBeforeBackgroundRefreshAndNextLookupUsesChangedIp() {
+        val dns = cache()
+        assertEquals(listOf(old), dns.lookup("jellyfin.test"))
+        now += 120_000
+        answer = listOf(fresh)
+        assertEquals(listOf(old), dns.lookup("jellyfin.test"))
+        assertEquals(1, lookups)
+        assertEquals(listOf(old), dns.lookup("jellyfin.test"))
+        assertEquals(1, queued.size)
+        queued.removeFirst().run()
+        assertEquals(listOf(fresh), dns.lookup("jellyfin.test"))
+        assertEquals(2, lookups)
+    }
+
+    @Test fun answersOlderThanOneDayCannotBeServedEvenWhenRefreshFails() {
+        val dns = cache()
+        dns.lookup("jellyfin.test")
+        now += PersistentDns.MAX_STALENESS_MILLIS + 1
+        val expired = cache(Dns { throw UnknownHostException() })
+        assertThrows(UnknownHostException::class.java) { expired.lookup("jellyfin.test") }
+    }
+
+    @Test fun persistedAnswersRetainTimestampAndSystemAddressOrdering() {
+        answer = listOf(InetAddress.getByName("::1"), fresh)
+        cache().lookup("jellyfin.test")
+        now += 120_000
+        val reopened = cache(Dns { error("Disk answer must return before resolving") })
+        assertEquals(answer, reopened.lookup("jellyfin.test"))
+        assertEquals(1, queued.size)
+        now += PersistentDns.MAX_STALENESS_MILLIS
+        assertThrows(UnknownHostException::class.java) {
+            cache(Dns { throw UnknownHostException() }).lookup("jellyfin.test")
+        }
+    }
+
+    @Test fun corruptOrNonnumericDiskAnswersAreIgnored() {
+        for (contents in listOf("not json", "{\"jellyfin.test\":{\"addresses\":[\"not-an-ip.test\"],\"savedAtMillis\":1000000}}")) {
+            file.writeText(contents)
+            answer = listOf(fresh)
+            assertEquals(listOf(fresh), cache().lookup("jellyfin.test"))
+        }
+        assertEquals(2, lookups)
+    }
+
+    @Test fun negativeAnswersDoNotDelayRecoveryAndFailedRefreshDoesNotExtendStaleness() {
+        var offline = true
+        val dns = cache(Dns { if (offline) throw UnknownHostException(); listOf(fresh) })
+        assertThrows(UnknownHostException::class.java) { dns.lookup("jellyfin.test") }
+        offline = false
+        assertEquals(listOf(fresh), dns.lookup("jellyfin.test"))
+        offline = true
+        now += 120_000
+        assertEquals(listOf(fresh), dns.lookup("jellyfin.test"))
+        queued.removeFirst().run()
+        assertEquals(listOf(fresh), dns.lookup("jellyfin.test"))
+        assertTrue(queued.isEmpty())
+        now += 2_001
+        dns.lookup("jellyfin.test")
+        assertEquals(1, queued.size)
+    }
+
+    @Test fun unexpectedRefreshExceptionKeepsTheLastAnswerAndAllowsAnotherRefresh() {
+        var failing = false
+        val dns = cache(Dns { if (failing) throw IllegalStateException("resolver unavailable"); answer })
+        dns.lookup("jellyfin.test")
+        now += 120_000
+        failing = true
+        assertEquals(listOf(old), dns.lookup("jellyfin.test"))
+        queued.removeFirst().run()
+        now += 2_001
+        failing = false
+        answer = listOf(fresh)
+        assertEquals(listOf(old), dns.lookup("jellyfin.test"))
+        queued.removeFirst().run()
+        assertEquals(listOf(fresh), dns.lookup("jellyfin.test"))
+    }
+
+    @Test fun failedCachedAddressForcesFreshResolutionAndRetriesBeforeSendingPost() {
+        MockWebServer().use { server ->
+            server.start()
+            val dns = cache()
+            dns.lookup("jellyfin.test")
+            answer = listOf(fresh)
+            server.enqueue(MockResponse.Builder().body("new address").build())
+            val client = DnsConnectionRetry.configure(OkHttpClient.Builder(), dns)
+                .proxy(Proxy.NO_PROXY).retryOnConnectionFailure(false).connectTimeout(1, TimeUnit.SECONDS)
+                .connectionPool(ConnectionPool(0, 1, TimeUnit.MILLISECONDS)).build()
+            try {
+                val url = server.url("/").newBuilder().host("jellyfin.test").build()
+                client.newCall(Request.Builder().url(url).post("body".toRequestBody()).build()).execute().use {
+                    assertEquals("new address", it.body.string())
+                }
+                assertEquals(2, lookups)
+                assertEquals(1, server.requestCount)
+                assertEquals(listOf(fresh), dns.lookup("jellyfin.test"))
+            } finally {
+                client.connectionPool.evictAll()
+                client.dispatcher.executorService.shutdown()
+            }
+        }
+    }
+
+    @Test fun backgroundIpChangeIsUsedByTheNextHttpCall() {
+        MockWebServer().use { server ->
+            server.start()
+            val dns = cache()
+            dns.lookup("jellyfin.test")
+            now += 120_000
+            answer = listOf(fresh)
+            assertEquals(listOf(old), dns.lookup("jellyfin.test"))
+            queued.removeFirst().run()
+            server.enqueue(MockResponse.Builder().body("refreshed").build())
+            val client = DnsConnectionRetry.configure(OkHttpClient.Builder(), dns).proxy(Proxy.NO_PROXY).build()
+            try {
+                val url = server.url("/").newBuilder().host("jellyfin.test").build()
+                client.newCall(Request.Builder().url(url).build()).execute().use { assertEquals("refreshed", it.body.string()) }
+                assertEquals(2, lookups)
+                assertEquals(1, server.requestCount)
+            } finally {
+                client.connectionPool.evictAll()
+                client.dispatcher.executorService.shutdown()
+            }
+        }
+    }
+}

data/tv-spec/spec.md

@@ -1,6 +1,6 @@
-# Wolfskin TV specification — revision 5
+# Wolfskin TV specification — revision 6
 
-2026-11-06. This feedback amendment applies to the approved revision-4 specification and frozen frames at `data/tv-v2/focus-2026-11-06/` (prototype SHA-256 `1bb7f4097a5303a58e45ec5e61cf867fa6cfdcbfe12fc7a196f00acacae5e48d`). Unchanged geometry, navigation, typography, colours and motion remain governed by those frames and the [written specification](https://pages.justinvisser.org/wolfskin/tv-spec). The amendment's prototype delta is `data/tv-v2/feedback-2026-11-06/`.
+2026-11-06. Revision 6 adds the approved direction-A motion and loading states from [the motion reference](https://pages.justinvisser.org/wolfskin/tv-motion-speed.html), frozen with SHA-256 checksums at `data/tv-v2/motion-2026-11-06/`. Revision-5 feedback below still applies. Unchanged static geometry, navigation, typography and colours remain governed by the approved frames and the [written specification](https://pages.justinvisser.org/wolfskin/tv-spec). The revision-5 prototype delta remains `data/tv-v2/feedback-2026-11-06/`.
 
 ## Who’s watching
 
@@ -54,8 +54,39 @@ Read-only source measurement: Desperate Housewives has a 2732×1536 Backdrop. Wi
 
 Every Discover lane, including Movies for you, Series for you, service entries, service-specific lanes and Hidden picks, uses a **104 px heading band**: heading line plus **60 px heading-to-card gap**, up from 40 px. This is a consistent Level 2 extension, not a Series-only exception. Poster shelves become 652 px high and service-entry shelves 316 px. Captions and frame scroll offsets use the same heading band. Home headings remain unchanged.
 
+## Motion and loading — revision 6
+
+Home heroes and shelves, Library rows, Discover hero/lanes, title headers, episodes and cast, and person headers/filmography use shaped placeholders without loading sentences. The placeholder fill is `surface2` (`#1b1b25`). A complete shelf shares **one** alpha layer: **0.55 → 1 → 0.55 over 1400 ms**, CSS ease-in-out (`.42,0,.58,1`), 700 ms each way. No per-card clocks, staggered pulse phases, shimmer, moving gradient, or animated blur.
+
+| Transition | Duration and curve | Transform |
+|---|---|---|
+| Focus scale/ring | 180 ms, ease-out (`.33,1,.68,1`) | Existing locked focus scale; no geometry change |
+| Poster caption in / out | 60 ms delay + 180 ms ease-out / 100 ms ease-out | 10 px rise on entry |
+| Network artwork only | 160 ms, Coil painter alpha | None; memory, disk and local hits are instant |
+| Row/tab content reveal | 180 ms, ease-out | One layer per row, 24 px rise |
+| Initial hero/title copy | 180 ms, ease-out | 16 px rise |
+| Hero backdrop hand-off | 320 ms, ease-in-out (`.65,0,.35,1`) | Alpha only; retain previous art until incoming art or its final fallback is ready |
+| Hero copy hand-off | Old copy out 120 ms ease (`.25,.1,.25,1`); new copy starts at 140 ms and enters over 200 ms ease-out | 14 px rise on entry |
+| Late readiness line | 200 ms, ease | Alpha only, in its reserved slot |
+| Horizontal / vertical focus-follow scroll | 160 ms ease / 180 ms ease-out | Existing scroll geometry |
+
+Row reveals are grouped rather than the browser prototype's per-card staging: the armv7 frame budget permits one animated layer per shelf, not one per card. Tabs have no full-screen transition layer. The upper Home hero blend is bounded to **1920×820 px**, Discover to **1920×740 px**; the lower backdrop changes without an animated screen-sized layer. Hero copy is a separate bounded block. Image reveal uses Coil's painter, not a new full-screen compositing layer. Existing poster-only blur is static.
+
+The title page's scroll dim is a draw-only colour overlay, not an alpha-animated full-screen layer. Discover scrolls its backdrop through placement offsets rather than a full-screen translation layer. Initial loading animation owners are Home **2**, Library **up to 3** lazy rows, Discover **2**, title header **1**, person **2**; pending title episode/cast shelves add **1 each**, and each pending Discover lane owns **1**. Deep Home loading is bounded to **4** visible shelf layers. These are active animation owners, not every static display-list node. A hero hand-off adds at most **2** bounded owners (outgoing art and copy). Focus changes can animate **2** card transforms, **1** caption and at most **2** rating plates; artwork fades are painter draws without additional compositing layers. No animated owner is full-screen.
+
+The series readiness band reserves **56 px (28 dp)** from its first content paint, including when empty or when readiness later disappears. Ratings remain inside the fixed-height facts band. The series header's measured height therefore cannot change when late ratings/readiness arrive; overview, actions, season and episode anchors retain their coordinates. Skeletons have no click/hover focus targets; pending episode/cast rows remain absent from the key-navigation state until real cards exist. Initial loading keeps nav focus and Back still pops the title/person route.
+
+Discover key traversal skips pending lanes in both directions. If every remaining lane is pending, Down stays on the real filter chips and Back returns to nav; a skeleton must never create an empty-column focus range.
+
+`Settings.Global.ANIMATOR_DURATION_SCALE == 0`, exposed by Compose's window `MotionDurationScale`, or the host's `LocalReducedMotion` flag disables pulse and translation/scroll motion. Focus scale and nav geometry snap; permitted fades are capped at **80 ms**. The window context supplies live scale state without settings or disk reads on the main thread. Fetch/decode dispatchers and image URL logic are unchanged.
+
+Native **1920×1080** before/after frames and the frame-budget inventory are published at [the motion build proof](https://pages.justinvisser.org/wolfskin/tv-motion-build/). Before frames use the pre-change surface sources in this same isolated worktree; after frames use the shipped Compose surfaces. No device access, installation or optimized APK is part of this lane. On-box acceptance remains: no series layout change after first content, Home scrolling no worse than **39.6% janky / p90 65 ms**. Native JVM rendering does not measure that GPU/frame-timing target.
+
+
 ## Sources and verification
 
 Authoritative changed values live in `wolfskin-design/tokens.json`, `title-tokens.json` and `discover-tokens.json`; regenerate Kotlin, CSS and the drift manifest with `python3 wolfskin-design/generate_tokens.py`.
 
+`MotionSurfaceTest`, `HeroMotionTest`, `NetworkArtTransitionTest` and `DiscoverSkeletonKeysTest` cover late-line geometry, loading/ready row eligibility, Back/nav ownership, rendered pulse suppression under both motion controls, strict main-thread I/O policy, network-versus-cache reveal, bounded hero blending, delayed art and interrupted hand-offs. Manually clocked captures explicitly deliver snapshot changes before advancing animation time. The frozen prototype includes `index.html`, its local media, the original CSS/JS/builder and a complete SHA-256 manifest; replay the HTML, not the preserved builder's live-publishing entry point.
+
 The feedback prototype delta links the native 1920×1080 before/after frames. `HomeViewportTest` exercises short and long poster/tile/wide rows, first focus, both row directions and native Back from the shipped title surface. The real-Bear capture harness reads recorded Jellyfin metadata through `TitleReadFacade`; it is a throwaway proof and is not shipped. The final gates are `make test` and `make apk-debug`. No TV access or optimized-APK build is part of this worker's validation.

data/tv-v2/motion-2026-11-06/SHA256SUMS

@@ -0,0 +1,47 @@
+8cca2384b2ed67b28626a316fb5b9c421c3fe0b48de4438d8c1683f6061db81d  build_page.py
+924b013c685c8eefe98ba985ec61d45d14a38ddc2c3e4269895ed148cee2e9e5  delta.json
+e480b84afed8fbae72df846cc980b309ef3ca9342b89df74eeff8cf031050813  index.html
+64ec89bd409e79737e615344ffb19eea2e358c5f61b571b2e8ad989a349cab5c  proto.css
+bba2e150d5ca24a0a7765cc684a7e39bb5742756e19ff855f1743e3a62950684  proto.js
+7cf975a048ca1b9c2f8b2627ee034012c325246d4b6e56048c864f1ced7de09f  tv-motion-speed/b1t.webp
+c53fd37b2946bf54386883b321925a4d006a5e79d4e07bcb0a02755e0b2f19ec  tv-motion-speed/b1.webp
+6dd4a715be2361ecaee06b825559fec32432363d302d3b06b1a4d95b1dedf757  tv-motion-speed/b2t.webp
+8ec6be1c5d143b5786ed4b811e42585ac92a456cf0e88795f6a2ebcaa734e75d  tv-motion-speed/b2.webp
+674cb1302d66e930504fcc4dff0f8c9d267c43d5a26f97ace8517dd776100cc9  tv-motion-speed/b3t.webp
+261dd7de5e6a204e5b4a0433a9210a3883720be09bab890afbde37d51acf3e06  tv-motion-speed/b3.webp
+3a6128506526ce54eb7c9e018880be57a1f2fbe7198f2d0fc47efa9ef82fc700  tv-motion-speed/b4t.webp
+71427d171d31b499d406410b51a61a683e5fb1f664e8b483d2a95acd0f69b88c  tv-motion-speed/b4.webp
+825ef8387d3d035d69dcfdf618b6030dabf560e7bdb4b9f3b473990f3d5eaa48  tv-motion-speed/before-discover-tab.webm
+c82bf1e41fa2866ff94369173ffd5af83efe6a6fa8499d0498f6be25682451bf  tv-motion-speed/before-home-enter.webm
+15d166f0741ae7b5422f466fc8e2001de167deecb81c8b9eff33e9e7ac139ff8  tv-motion-speed/before-launch-fast.webm
+bacdbb57858f7f28e7af9f50d70bb3cfeac878f0204ee02b8c94e2abb686a011  tv-motion-speed/before-launch-spinner.webm
+d492f500ce464b0a529dce81ed0be09d53c868d554973d61a69097b0a1f6fef5  tv-motion-speed/before-movies-grid.webm
+1cfc443f8f67bbdf5acfa1341e2616fd5e0895035c390709b3e11600ea7a37e6  tv-motion-speed/before-person.webm
+7d9b7acf81981f2058ef85aaff18aa6f1668dfdceca0991da1480099757baa1a  tv-motion-speed/before-title-discover.webm
+1a934ff576601de973103145fb00db3059b5bf114b8d36aa49fe2f2a421b324f  tv-motion-speed/before-title-movie.webm
+6366d9b410b5460eba7348bc9e6356f906fa2b8771931232f9a55ea4e4272c46  tv-motion-speed/before-title-series.webm
+65577079db9f4a40e62bd5c676d1c4d51a1ca0c9802e364b314a5b162b9dc90b  tv-motion-speed/c1.webp
+91a325404fa9e6f925bab3a4370f80065f24efbb314fa75252307cf3c642af1f  tv-motion-speed/c2.webp
+ff018c6db960483f8a2eb73242b087a41b866e05a5bde3f6f4c76eeb1abec21b  tv-motion-speed/c3.webp
+75ab6defe098a403999a7a267061346afb29748bd2651791d62eb9ca9cdb1acb  tv-motion-speed/c4.webp
+b01e96165bc33ff5cf47da086ea966b24d58ef2e995cb16ef4af00375a54efca  tv-motion-speed/c5.webp
+faa1e271643dc3585c70382988fd609f6522d622887a8595658e96831226837d  tv-motion-speed/c6.webp
+92c1e9bea498f957e5eda418c9c74698cf693f7e7ca406b8e90cd55357a46499  tv-motion-speed/c7.webp
+2a62c58b79b0592ba74498f8b7a0a996cb12b7430d5fe00bf8e8550400c3f619  tv-motion-speed/c8.webp
+0366fa40daa0328bca55183b656ffc94dfb7fb1b7433732a2effce093e8e4ab0  tv-motion-speed/e1.webp
+9a84c464aa98dba31e1aa0d97665e273305d08fbe33fd579136c8964073f42bb  tv-motion-speed/home-before-tab.webp
+8903c80b69479a5d8ffc6361628f8117a601fe5b88897f3dcc0a62f9b8a533b7  tv-motion-speed/launcher.webp
+1026e09bdbd9a6a7570ebd041c098d04b2bb2e738e7047217dae479efd944120  tv-motion-speed/p10.webp
+d862e8a85b49b5128837a58bad4051f460c736702d0ce2befb057ad29448b63e  tv-motion-speed/p11.webp
+b6f7a0c96949d690124413e7e9df249730d0b5f95cebdb1345e0f91f784577c1  tv-motion-speed/p12.webp
+eebb8bec042819923bddedd2abee4841b62c0e1c10f05dc0af4569c98d5a3a54  tv-motion-speed/p1.webp
+e5f6079132aa33e0a1741a335cfa00d1a476d7da38a556ac1cbadb0f410df407  tv-motion-speed/p2.webp
+af3c62f1acb37a7675594179ae285b3092ca6fd3e40216bbcc442190d87c216f  tv-motion-speed/p3.webp
+7b303cc200c7f3932b077fcae3908a3c6ec0b75922d2bf048d876177d6c4bf4d  tv-motion-speed/p4.webp
+8650904e68d4085f1ef1c58a8312ed501bddcca5f5565180861339efa6cf4a92  tv-motion-speed/p5.webp
+4c102e76ef046c979f728990cb9ed96a87a67ca570cafd2ead8cc3c3c7fb7900  tv-motion-speed/p6.webp
+3a30007a21825461d99732063ce3e9a6dc256cb46937bfd1f29236f95480fb5b  tv-motion-speed/p7.webp
+9fa546b84609ef91ca43ff943b245eda53ff06715cf75f800d556fd3ba2abb12  tv-motion-speed/p8.webp
+6e859f5ce40cfa21702b9458586913affafda1454a295dd6099ebc3b462f7aa4  tv-motion-speed/p9.webp
+3ab8a7da1d0c2532933eb1803a3408d23e42cbed5923575deb1db62d7cbbb477  tv-motion-speed/s1t.webp
+40fb5827a46bcd9d6c9e2f10190c58e0670e29e0ba908ae28600a2f8cae297cc  tv-motion-speed/s1.webp

data/tv-v2/motion-2026-11-06/build_page.py

@@ -0,0 +1,298 @@
+#!/usr/bin/env python3
+"""Build the Wolfskin TV load-states / motion / speed spike page (dark only).
+
+Inputs : page/proto.css, page/proto.js, page/tv-motion-speed/* (webm clips from the box, fixture art), numbers below
+         (all from data/tv-spike-motion-speed/raw/ and report.md).
+Output : /opt/stacks/pages/store/wolfskin/tv-motion-speed.html + tv-motion-speed/ assets (mode 660).
+"""
+import os, shutil
+
+HERE = os.path.dirname(os.path.abspath(__file__))
+STORE = '/opt/stacks/pages/store/wolfskin/'
+OUT = STORE + 'tv-motion-speed.html'
+ASSETS = STORE + 'tv-motion-speed/'
+
+CSS = open(os.path.join(HERE, 'proto.css')).read()
+JS = open(os.path.join(HERE, 'proto.js')).read()
+
+
+def table(head, rows, cls=''):
+    h = ''.join(f'<th>{c}</th>' for c in head)
+    b = ''.join('<tr>' + ''.join(f'<td>{c}</td>' for c in r) + '</tr>' for r in rows)
+    return f'<div class="tw"><table class="{cls}"><thead><tr>{h}</tr></thead><tbody>{b}</tbody></table></div>'
+
+
+def pair(pid, scene, before, after_title, lead, note='', variants=False, before2=None):
+    vids = ''.join(f'<div class="pane"><p class="lab">{lab}</p><div class="sbox"><video src="tv-motion-speed/{src}.webm" muted loop playsinline autoplay preload="auto"></video></div></div>'
+                   for src, lab in ([before] + ([before2] if before2 else [])))
+    var = f'<div class="tabs" data-variants="{pid}"></div>' if variants else ''
+    return f'''<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button>{f'<span class="muted small">{note}</span>' if note else ''}</div>
+<div class="panes">{vids}<div class="pane"><p class="lab">{after_title}</p>{var}<div class="sbox" id="{pid}" data-scene="{scene}" data-lead="{lead}"></div></div></div></div>'''
+
+
+def opt(title, gain, effort, risk, see, where='TV'):
+    return [title, gain, effort, risk, see, where]
+
+
+OPT_HEAD = ['Option', 'Expected gain (measured basis)', 'Effort', 'Risk', 'What you would see', 'Ships in']
+
+page = f'''<!doctype html><html lang="en" data-lavish-annotate="off"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="color-scheme" content="dark"><title>Wolfskin TV: faster, quieter, smoother</title><style>
+:root{{color-scheme:dark;--bg:#07070a;--panel:#13131a;--line:rgba(255,255,255,.1);--fg:#f4f4f6;--muted:rgba(244,244,246,.74);--acc:oklch(78% 0.14 305);--ok:#7ed6a0;--warn:#ffc46b;--bad:#ff8a7a}}
+*{{box-sizing:border-box}}html{{-webkit-text-size-adjust:100%}}body{{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}}
+main{{max-width:1400px;margin:0 auto;padding:16px 14px 120px}}h1{{font-size:28px;line-height:1.2;margin:6px 0 6px}}h2{{font-size:21px;margin:34px 0 8px;color:var(--acc);border-bottom:1px solid var(--line);padding-bottom:4px}}
+h3{{font-size:17px;margin:20px 0 6px}}a{{color:var(--acc)}}.muted{{color:var(--muted)}}.small{{font-size:13px}}p{{margin:6px 0}}li{{margin:3px 0}}
+.lead{{font-size:17px}}.k{{color:var(--ok)}}.w{{color:var(--warn)}}.b{{color:var(--bad)}}
+.tw{{overflow-x:auto;margin:8px 0;border:1px solid var(--line);border-radius:10px}}table{{border-collapse:collapse;width:100%;font-size:14px}}
+th,td{{padding:6px 9px;border-top:1px solid var(--line);text-align:left;vertical-align:top}}thead th{{border-top:0;background:#1b1a22;white-space:nowrap}}
+td:first-child{{font-weight:600}}table.num td:not(:first-child){{white-space:nowrap}}
+.card2{{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:10px 0}}
+.pair{{margin:14px 0 26px}}.ph{{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:0 0 6px}}
+.panes{{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(380px,100%),1fr));gap:12px}}.pane{{min-width:0}}.lab{{font-size:13px;color:var(--muted);margin:0 0 4px}}
+.decision{{padding:18px 22px;background:#13131a;border:1px solid var(--line);border-radius:14px;margin:14px 0}}.decision h3{{margin-top:0}}
+.opt{{display:block;border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin:7px 0;cursor:pointer;background:#100e16}}.opt:has(input:checked){{background:oklch(26% 0.07 305);border-color:var(--acc)}}
+.opt .t{{display:block;color:var(--muted);font-size:14px;margin-left:24px}}.rec{{font-size:12px;color:var(--ok);margin-left:6px}}
+textarea{{width:100%;min-height:70px;background:#0c0b10;color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:8px;font:inherit;margin-top:6px}}
+.tabs{{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 6px}}
+.tab,button.replay{{font:inherit;font-size:13px;border-radius:999px;padding:4px 11px;border:1px solid var(--line);background:#1b1a22;color:var(--fg);cursor:pointer}}.tab.on{{background:oklch(26% 0.07 305);border-color:var(--acc)}}
+button.replay{{background:oklch(26% 0.07 305);border-color:var(--acc)}}
+form.decision button[type=submit]{{font:inherit;font-size:15px;font-weight:600;border-radius:999px;padding:8px 18px;border:1px solid var(--acc);background:oklch(26% 0.07 305);color:var(--fg);cursor:pointer;margin-top:8px}}
+form.decision [role=status]{{font-size:13px;margin-left:10px;opacity:.8}}
+.ctl{{position:sticky;top:0;z-index:8;background:#07070aee;backdrop-filter:blur(6px);border-bottom:1px solid var(--line);padding:8px 0;margin:0 0 8px;display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:14px}}
+.ctl label{{display:inline-flex;gap:6px;align-items:center;cursor:pointer}}
+ol.plan>li{{margin:10px 0}}code{{font-size:13px;color:oklch(88% 0.08 305)}}
+{CSS}
+</style></head><body><main>
+<h1>Wolfskin TV: faster, quieter, smoother</h1>
+<p class="lead">Measured on your Xiaomi box with <b>Wolfskin (Opt)</b> 1.1.0-133 and from tank, on 2026-11-06. This page has the options, the plan, and live prototypes of the loading and motion. Each prototype sits next to a recording of the real app doing the same thing today.</p>
+
+<div class="card2"><b>The short version</b><ul>
+<li><b>The biggest wait isn't the app.</b> Two of four cold launches showed a spinner for <b>1.5 s</b>, and the other two showed none. The box looks up <code>jelly.justinvisser.org</code> through AdGuard Private DNS, and an uncached lookup takes <b>0.45–1.35 s</b>. The address only stays cached for 60 s, so the first launch after a minute's pause pays it, and so does the first title page that fetches TMDB art. A small TV-side DNS cache (or one box setting) removes it.</li>
+<li><b>The second biggest is Conductarr.</b> On a title page, the detail, season and "Ready for you" reads take <b>1.1 s, 1.1 s and 2.9 s</b> at the median. Each one re-lists the whole Radarr/Sonarr library on every request, with no cache. A title page can't settle until the slowest arrives (3.4 s on a series). This needs a Conductarr release.</li>
+<li><b>Screens are already quick, but they pop.</b> Home, the grids, Discover and Settings settle in <b>0.2–0.75 s</b>. What makes the wait visible is art and fields arriving in steps, and the layout jumping when a late line lands. That's fixable on the TV alone: fade art in, reserve space for late lines, keep last-known screens, and prefetch.</li>
+<li><b>Frames are slow for two reasons.</b> At the median a frame takes 30–46 ms during moves, where 60 fps needs 16.7 ms. On grid and row scrolls, <b>30–44 %</b> of frames miss. The GPU alone takes 14–21 ms per frame, so motion here has to be cheap: fades, small rises and scale on one layer. No full-screen blur or shimmer sweeps.</li>
+</ul></div>
+
+<div class="ctl"><label><input type="checkbox" id="boxrate"> Play prototypes at the box's frame rate (40 ms per frame, measured)</label><label><input type="checkbox" id="rm"> Reduced motion (fades only, ≤100 ms)</label><span class="muted small">Prototypes loop. "Replay together" restarts the recording and the prototype in step. Counters are ms after the screen first reacts to the key.</span></div>
+
+<h2>1. Where the time goes today</h2>
+<h3>Per screen, from the first frame that reacts to the key until the screen stops changing</h3>
+<p class="muted small">Method: on-device <code>screenrecord</code> (it only emits frames on change), scene-change detection with ffmpeg, logcat (OkHttp and ActivityManager) and Conductarr's own request log for the same seconds. "Settled" is the last visible change. Raw clips and sheets are in <code>data/tv-spike-motion-speed/</code>.</p>
+{table(['Screen', 'First content', 'Settled', 'What arrives late', 'Repeat visit'], [
+ ['Cold start (am start -W TotalTime, 4 runs)', '583 / 538 / 438 / 453 ms to first frame', 'picker at +0.3–0.4 s (DNS warm) or <b class="b">+1.65 s</b> (DNS cold)', 'Spinner while <code>Users/Me</code> then <code>System/Info/Public</code> run one after the other (ServerRepository.kt:104,107)', 'same, bimodal on the 60 s DNS cache'],
+ ['Who\'s watching → Home', 'hero text 135 ms', '430 ms', 'shelf tiles flat grey until 400 ms, then all images pop', '370 ms'],
+ ['Home → Discover tab', 'content 270 ms (dims first)', '700 ms', 'posters pop in over 0.4 s', '600 ms'],
+ ['Movies grid', '230 ms (blank tiles)', '750 ms', 'posters fill row by row', '500 ms'],
+ ['Shows grid', '280 ms', '640 ms', 'posters', '—'],
+ ['Title, movie in library (American Gangster)', '430 ms (text)', '<b class="w">2.69 s</b>', 'backdrop 470 ms; cast portraits 2.7 s (initials until then)', '450 ms total'],
+ ['Title, Discover pick (Donnie Brasco)', '980 ms (blank skeleton until then)', '1.53 s', 'backdrop 1.37 s, cast 1.5 s', '—'],
+ ['Title, series (Adults)', '620 ms', '<b class="b">3.42 s</b>', 'ratings and "Ready for you · by Mindel" land at 3.4 s and push the overview down', '—'],
+ ['Person page (Martin Sheen)', '620 ms', '720 ms', 'filmography posters', '—'],
+ ['Back from title / series / person', '260 / 300 / 450 ms', '', '', ''],
+ ['Settings', '220 ms', '220 ms', '—', ''],
+ ['Coming in sheet', '74 ms', '74 ms (from cache)', 'posters refresh silently', ''],
+], 'num')}
+
+<h3>Frame timing per interaction (dumpsys gfxinfo, ART status <code>speed</code>)</h3>
+{table(['Interaction', 'Frames', 'Janky', 'p50', 'p90', 'p99', 'Main thread slow / GPU slow'], [
+ ['Home rows scroll (down 7, up 6, right 5), run 1 / 2', '149 / 115', '38.9 % / 34.8 %', '44 / 46 ms', '69 / 65', '89 / 101', '43 / 52 · 27 / 35'],
+ ['Movies grid scroll (down 8, up 8), run 1 / 2', '180 / 159', '43.9 % / 32.1 %', '30 / 30 ms', '53 / 46', '93 / 73', '30 / 69 · 20 / 48'],
+ ['Discover scroll', '146', '30.1 %', '34 ms', '57', '73', '34 / 35'],
+ ['Tab switch ×4', '158', '18.4 %', '28 ms', '65', '150', '15 / 29'],
+ ['Title open + back ×3', '103', '33.0 %', '48 ms', '113', '150', '29 / 34'],
+ ['Who\'s watching → Home', '15', '53.3 %', '61 ms', '117', '133', '7 / 8'],
+ ['Open title (movie, first time)', '20', '60.0 %', '57 ms', '150', '200', '9 / 12'],
+ ['Back from person', '12', '75.0 %', '93 ms', '150', '150', '8 / 9'],
+], 'num')}
+<p class="muted small">Frame phases on the Shows grid (framestats, 68 frames): record p50 0.5 / p90 10.3 ms, GPU issue p50 4.3 / p90 8.9 ms, GPU complete p50 <b>14.3</b> / p90 <b>21.2</b> ms, total p50 25.6 / p90 41.4 ms. The app renders at 1920×1080 and the box outputs 3840×2160 at 59.94 Hz. Today's grid is worse than the earlier Opt measurement (17.7 % janky), which was taken before the spacing and focus-ring builds.</p>
+
+<h3>Network, from tank (10 runs each; cold = new connection, warm = kept-alive)</h3>
+{table(['Call', 'Bytes', 'Cold p50 / p95', 'Warm p50 / p95', 'Cache headers'], [
+ ['Jellyfin UserViews (called 4–5× per launch)', '2.3 KB', '65 / 166 ms', '46 / 51 ms', 'none'],
+ ['Home Resume (20)', '1.4 KB', '58 / 66', '30 / 41', 'none'],
+ ['Home NextUp (20)', '6.2 KB', '71 / 91', '47 / 52', 'none'],
+ ['Home Items/{{id}} per series (sequential)', '4.0 KB', '43 / 60', '24 / 28', 'none'],
+ ['Home library shelf (20)', '18.7 KB', '85 / 116', '74 / 84', 'none'],
+ ['Movies grid page (200)', '51 KB', '68 / 148', '61 / 64', 'none'],
+ ['Title episodes with MediaSources + People', '<b class="w">96.8 KB</b>', '142 / 185', '122 / 169', 'none'],
+ ['Title episodes, lean fields', '6.5 KB', '26 / 65', '11 / 12', 'none'],
+ ['Grid poster, no size (today, LibraryReadFacade.kt:86)', '<b class="b">626 KB</b>', '26 / 30', '8 / 9', 'max-age 1 y, immutable, ETag'],
+ ['Grid poster fillWidth 256×384 q96', '31.6 KB', '19 / 131', '2 / 4', 'same'],
+ ['Grid poster 256×384 q80 WebP', '11.2 KB', '19 / 118', '1 / 2', 'same'],
+ ['Backdrop 1280 q96 / q80 WebP', '91 / 31 KB', '19 / 25', '2 / 2', 'same'],
+ ['TMDB poster w780 (today, ConductarrProjection.kt:9)', '131 KB', '128 / 144', '49 / 70', 'max-age 1 y'],
+ ['TMDB poster w342 / w185', '41 / 15 KB', '100 / 76', '31 / 30', 'max-age 1 y'],
+], 'num')}
+<p class="muted small">Box-side DNS (ping timing, 6 samples 70 s apart): uncached <code>jelly.justinvisser.org</code> 490–1390 ms, <code>wolfskin-tv</code> 460–490 ms, <code>image.tmdb.org</code> 60–1170 ms; cached 40–50 ms. The box uses Private DNS <code>dns.adguard.com</code>. The LAN resolver 192.168.1.2 answers uncached names in 136–160 ms and cached in 0 ms. The A record behind both hosts has a 60 s TTL. Cold launches 1 and 3 were more than 60 s after the previous lookup, and 2 and 4 were within it.</p>
+<h3>Conductarr TV routes, server-side (Conductarr request log, 22 h, 200/304)</h3>
+{table(['Route', 'n', 'p50', 'p95', 'Body p50', 'Why'], [
+ ['activity/titles/{{tmdb}}/{{type}} (Ready for you)', '45', '<b class="b">2856 ms</b>', '5002 ms', '1.7 KB', 'Re-reads the held title twice, the Seerr requests and a Jellyfin GET per episode; no cache (activity/detail.go:21, request_evidence.go:45, users.go:262). The 5002 ms p95 is most likely the TV giving up: its read timeout is 5 s (ConductarrSession.kt:53), so on the slowest titles the line never appears'],
+ ['catalogue/titles/{{tmdb}}/{{type}} (detail)', '51', '<b class="b">1198 ms</b>', '3217 ms', '11.9 KB', 'Held-title read lists every Arr library unpaged, then Seerr details, then ratings; sequential (catalogue/detail.go:14-17, library_detail.go:81)'],
+ ['catalogue/tv/{{tmdb}}/seasons/{{n}}', '76 / 17 (304)', '1084 / 2282 ms', '2664 ms', '1 KB', 'Same held-title read; a 304 still renders and hashes the full body first (read_validators.go)'],
+ ['…/ratings', '265', '147 ms', '449 ms', '0.5 KB', '6 h server cache, 300 titles'],
+ ['…/enrichment · …/related · …/cast', '46 · 42 · 26', '103 · 124 · 33 ms', '465 · 261 · 78', '3 · 14 · 12.5 KB', 'enrichment uncached'],
+ ['recommendations feed', '42', '16 ms', '40 ms', '<b class="w">204 KB, uncompressed</b>', 'no gzip/br on the TV door (Caddyfile.base:316-333, serve.go:140)'],
+ ['activity (polled every 30 s)', '713 × 304', '52 ms', '83 ms', '62.5 KB when 200', ''],
+ ['operator · profiles · dismissals · options · display', '', '12–25 ms', '30–93 ms', '', 'cheap; display is called ≈1 400×/day, once per poster'],
+], 'num')}
+<p class="muted small">Every TV request also costs Conductarr an uncached Jellyfin <code>/Users/Me</code> to check the token (clients/jellyfin/token.go:42). Every authenticated response is <code>Cache-Control: no-store</code> (authority.go:32). The TV client revalidates with its own ETag store instead.</p>
+
+<h3>Caches the app has today</h3>
+{table(['Cache', 'Where', 'Behaviour', 'Observed'], [
+ ['Wolfskin image loader (Coil 3)', 'WolfskinImages.kt:46-61', '64 MiB memory, 128 MiB disk, 4 parallel reads, crossfade off', 'repeat visits paint art from memory; first grid visit downloads 626 KB per poster (no size)'],
+ ['Upstream Wholphin image loader', 'CoilConfig.kt:80-101', 'separate memory + 200 MB disk', 'a second copy of the same art in memory'],
+ ['Conductarr JSON', 'FileCacheStore, noBackupFilesDir/conductarr', 'saved copy shown first, then revalidated with ETag; no memory layer', 'title re-open: every ON_OPEN route re-fetched (cast 304, detail 875 ms again)'],
+ ['Home, library, title, person snapshots', 'filesDir/wolfskin-home, -library-cache, -title', 'disk JSON, painted first', 'repeat visits 370–500 ms instead of 430–750'],
+ ['HTTP cache (OkHttp)', 'none', '—', 'Jellyfin JSON never cached; images rely on Coil only'],
+ ['DNS', 'system only', '60 s TTL through Private DNS', '1.5 s launch spinner when expired'],
+])}
+
+<h2>2. Load states</h2>
+<p>Today: a spinner on launch, flat grey blocks on Home, the grids and title pages, and a blank title page until Conductarr answers on Discover picks. Images snap in because crossfade is off in both loaders. Nothing shows a "loading" sentence; that rule already holds.</p>
+{table(OPT_HEAD, [
+ opt('Picker from the saved people list, verify in the background', 'Removes the 1.5 s spinner on every DNS-cold launch (2 of 4 measured)', 'S', 'Low. A revoked session must still land on the recovery picker', 'The launcher fades straight into Who\'s watching'),
+ opt('Shaped skeletons that breathe (opacity only, staggered)', 'No speed change; replaces the flat grey and spinner states', 'S', 'Low. One alpha layer per row', 'Card-shaped tiles gently pulsing until the art lands'),
+ opt('Art fades in (120–160 ms) instead of popping', 'Removes the pop on every first visit', 'XS', 'Low. Keep it off for memory-cache hits so repeat visits stay instant', 'Posters settle instead of flickering in'),
+ opt('Reserve space for late fields (ratings, Ready for you, genres, overview)', 'No layout jump at 3.4 s on series pages', 'S', 'Low', 'The line fades into a gap that was already there'),
+ opt('Title page paints what the card already knew', 'First content 430–980 ms → about 60 ms', 'M', 'Medium. Card data must match detail (year, runtime, ratings)', 'Title, year, ratings and Play at once, over a colour wash of the poster'),
+ opt('Shimmer sweep skeletons', 'None', 'S', '<b class="w">High on this GPU</b>: a moving gradient over every card, every frame', 'Light sweeps across the tiles. Not recommended'),
+])}
+<h3>See it: launch</h3>
+{pair('p-launch', 'launch', ('before-launch-spinner', 'Today, DNS cold (2 of 4 launches): 1.5 s spinner'), 'After: no spinner, people from the saved list', 180, '', False, ('before-launch-fast', 'Today, DNS warm'))}
+<h3>See it: skeleton styles</h3>
+<p class="muted small">Pick a style. Content lands at 900 ms in each, about the Movies grid's first visit.</p>
+{pair('p-skel', 'skeleton', ('before-movies-grid', 'Today: Movies grid, first visit'), 'Options', 140, '', True)}
+
+<h2>3. Motion and transitions</h2>
+<p>Today's motion tokens: focus scale 1.08 over 140 ms, ring and caption fades of 140 ms, a nav blob spring, and 160–180 ms row scrolls. There are no screen transitions or hero cross-fades, and reduced motion is defined but nothing reads it (WolfskinTokens.kt:218). At 30–46 ms per frame, a 140 ms tween is drawn in 3–4 frames. Tick <b>box frame rate</b> at the top to see that.</p>
+{table(OPT_HEAD, [
+ opt('Staged reveal on screen entry (hero copy rises 16 px, rows rise 24 px, staggered 30–40 ms, 180 ms ease-out)', 'Perceived: art arrives into motion instead of popping. Cost: translate + alpha on one layer per row', 'S', 'Low. Stagger must not delay focus', 'Home and Discover settle like a curtain rather than tiles snapping'),
+ opt('Hero cross-fade (backdrop 320 ms, copy hands off)', 'Removes the hard cut when the hero changes', 'S', 'Medium. Two 1080p bitmaps for 320 ms; the GPU is already at 14–21 ms/frame, so fade the backdrop only and keep the scrim static', 'The next pick dissolves in'),
+ opt('Focus: 180 ms ease-out, caption rises 10 px', 'Same frame cost as today; the curve hides dropped frames better', 'XS', 'Low', 'Focus glides rather than ticks'),
+ opt('Title entry: grid fades 160 ms, page builds from the poster colour', 'Hides the 470 ms backdrop fetch', 'M', 'Medium (see load states)', 'No black gap between grid and title'),
+ opt('Shared-element poster → title sheet', 'None measurable', 'L', '<b class="w">High</b>. Compose shared elements across NavHost destinations on this GPU; the movie page has no poster sheet when a backdrop exists', 'The card flies into place. Not recommended now'),
+ opt('Honour reduced motion (system animator scale 0 or a Wolfskin toggle)', 'Accessibility', 'S', 'Low', 'Fades only, ≤100 ms; the toggle at the top shows it'),
+])}
+<h3>See it: Who's watching → Home</h3>
+{pair('p-home', 'home', ('before-home-enter', 'Today: grey tiles, then art pops at 400 ms'), 'After', 200)}
+<h3>See it: tab switch and row reveal (Home → Discover)</h3>
+{pair('p-tab', 'tab', ('before-discover-tab', 'Today'), 'After', 150)}
+<h3>See it: title page entry</h3>
+{pair('p-title', 'title', ('before-title-movie', 'Today: American Gangster, first open (cast at 2.7 s)'), 'After: Apocalypse Now from the same grid', 170, '', False, ('before-title-discover', 'Today: Donnie Brasco from Discover, blank until 980 ms'))}
+<h3>See it: a late line on a series page</h3>
+{pair('p-series', 'series', ('before-title-series', 'Today: Adults, the readiness line lands at 3.4 s and pushes the text down'), 'After', 150, '', True)}
+<h3>See it: focus move</h3>
+{pair('p-focus', 'focus', ('before-movies-grid', 'Today, real grid'), 'Focus along a row', 0, 'Tick box frame rate to compare at 25 fps.', True)}
+<h3>See it: hero cross-fade</h3>
+{pair('p-hero', 'hero', ('before-discover-tab', 'Today (Discover hero)'), 'Hero advances', 0, '', True)}
+
+<h2>4. Caching</h2>
+{table(OPT_HEAD, [
+ opt('Persisted DNS answers (OkHttp Dns: serve the last address at once, refresh behind)', 'Removes 0.45–1.35 s on launch and on the first TMDB image after any 60 s pause', 'S', 'Low. Fall back to the system lookup if the cached address fails', 'No spinner on launch; first cast photos in ≈0.6 s instead of 2.7 s [inference: DNS is the cast delay]'),
+ opt('Warm the connections at process start (Jellyfin, Conductarr door, TMDB) in parallel', 'Overlaps DNS + TLS with the 450 ms first frame', 'XS', 'Low', 'Same as above, smaller'),
+ opt('Memory layer over the Conductarr disk cache', 'Skips disk read and JSON decode on back and re-open (title re-open settles at 450 ms today; ~250 expected) [inference]', 'S', 'Low', 'Back and re-open feel instant'),
+ opt('Stale-while-revalidate for ON_OPEN title routes (skip refetch if validated in the last 5 min)', 'Re-opening a title stops costing the server 875–2 900 ms', 'S', 'Low. Requests and readiness may be 5 min old; keep requests on FORCE', 'Nothing visible; less churn'),
+ opt('Prefetch the focused card\'s title page (detail JSON + backdrop) after 350 ms of dwell', 'Title first content 430 ms → about 60 ms; backdrop already decoded', 'M', 'Medium. Bandwidth: at most one title per dwell; cancel on move', 'Opening a title is instant'),
+ opt('Pre-decode last-known Home art while Who\'s watching is up', 'Home settles at 430 ms → about 250 ms with no pops', 'S', 'Low. Memory: 6 backdrops ≈ 21 MiB of the 64 MiB', 'Home appears whole'),
+ opt('One image loader instead of two', 'Frees a second memory cache (Coil default ≈ 25 % of the heap) [inference]', 'M', 'Medium. Upstream screens use their own', 'Fewer re-downloads after big screens'),
+ opt('OkHttp HTTP cache for Jellyfin JSON', 'Small. Jellyfin sends no cache headers, so only conditional revalidation is possible', 'S', 'Low', 'Nothing visible'),
+])}
+
+<h2>5. Backend retrieval</h2>
+{table(OPT_HEAD, [
+ opt('Cache the held-title read in Conductarr (Arr library list, queue, history) for 30–60 s, shared across routes', 'Title detail 1.2 s → ≈0.1 s, season 1.1 s → ≈0.1 s, readiness 2.9 s → <1 s [inference from the code path]', 'M', 'Medium. Freshness of "Ready" after an import; invalidate on Arr webhook (already received)', 'Series pages settle in under a second; no late line', 'Conductarr release'),
+ opt('Readiness: drop the duplicate held-title read and the per-episode Jellyfin GETs', 'The 5 s tail on readiness', 'M', 'Medium', '"Ready for you" appears with the page', 'Conductarr release'),
+ opt('Compress the TV door (Caddy <code>encode zstd gzip</code>)', 'Feed 204 KB → ~25–35 KB [inference: JSON typically 6–8×], activity 62 KB → ~8 KB', 'XS', 'Low', 'Discover opens a little faster on Wi-Fi', 'Caddy change (server-docs)'),
+ opt('304 before rendering (keep a per-route version, not a hash of the full body)', 'Season 304 2.3 s → ms', 'M', 'Medium', 'Nothing visible except speed', 'Conductarr release'),
+ opt('Cache the token check (<code>/Users/Me</code>) for 60 s per token', 'Removes a Jellyfin round trip from every TV request (~10–40 ms each, 6–10 per title page)', 'S', 'Low. Revocation lag 60 s', 'Nothing visible', 'Conductarr release'),
+ opt('Batch display reads (one call for a row of posters)', '≈1 400 display calls/day → a few dozen', 'M', 'Low', 'Coming in and Discover rows fill together', 'Conductarr release + TV'),
+ opt('Size the grid posters (<code>fillWidth=256&fillHeight=384&quality=80&format=Webp</code>)', '626 KB → 11 KB per poster (57×); 85 films 53 MB → 1 MB', 'XS', 'Low', 'Movies and Shows fill at once on first visit', 'TV'),
+ opt('Ask TMDB for w342 posters, not w780', '131 KB → 41 KB per Discover poster', 'XS', 'Low. 342 px for a 256 px card', 'Discover rows fill sooner', 'TV'),
+ opt('Lean episode fields (drop MediaSources/MediaStreams/People from the list; fetch them on Play)', '96.8 KB → 6.5 KB per season, 142 → 26 ms', 'S', 'Medium. The episode row shows file chips', 'Series pages settle sooner', 'TV'),
+ opt('Fewer launch calls: UserViews 4–5× and LiveTv/Recordings/Folders 2× per launch', '≈250 ms of serial calls', 'S', 'Low', 'Nothing visible', 'TV'),
+])}
+
+<h2>6. Kotlin and Compose</h2>
+{table(OPT_HEAD, [
+ opt('Library load re-emits the full list per 200-item page and re-sorts each time (LibraryReadFacade.kt:96, LibraryGridState.kt:99)', 'Grid first visit; matters more as the library grows', 'S', 'Low', 'Grid appears in one step', 'TV'),
+ opt('Hoist the Regex in titleFallbackBackground / titleAmbientBackground (TitleArtwork.kt:152,167)', 'Draw-time cost per card', 'XS', 'Low', '—', 'TV'),
+ opt('Discover reads firstVisibleItemIndex in composition (DiscoverScreen.kt:107) → derivedStateOf', 'Fewer recompositions while scrolling Discover (34 of 44 janky frames were UI-thread)', 'XS', 'Low', 'Smoother Discover scroll', 'TV'),
+ opt('NavBar label colour read in composition (NavBar.kt:86) → draw-phase', 'Tab switch frames', 'XS', 'Low', '—', 'TV'),
+ opt('WolfskinImages.loader() is @Synchronized and called in composition', 'Lock on every poster recomposition', 'XS', 'Low', '—', 'TV'),
+ opt('Cut full-screen layers: hero blur (RenderEffect) + two full-screen gradient scrims + ambient', 'GPU 14–21 ms/frame is the floor today; pre-blurred tiny art and one combined scrim drawn once', 'M', 'Medium. Must match the approved frames', 'Smoother scroll on Home and Discover', 'TV'),
+ opt('Keys and contentType', 'Already done everywhere', '—', '—', '—', ''),
+])}
+
+<h2>7. Baseline profile</h2>
+<p>Today: a hand seed of 6 lines (<code>app/src/optimized/baselineProfiles/baseline-prof.txt</code>), no generator and no Macrobenchmark. The box is at <code>speed</code> only because it was forced with <code>cmd package compile</code>. Every new install starts at <code>verify</code> (interpreted/JIT) until background dexopt runs.</p>
+{table(['State (same box, earlier tv-perf run)', 'Cold start', 'Home scroll janky / p50 / p90', 'Movies grid'], [
+ ['Opt just installed (verify)', '0.5–1.0 s', '51.4 % / 65 / 117 ms', '—'],
+ ['Opt after forced AOT (speed)', '0.39–0.44 s', '29.2 % / 38 / 61 ms', '17.7 % / 19 / 36 ms'],
+], 'num')}
+<p><b>Expected from a recorded profile</b> (Baseline Profile Gradle plugin plus one UiAutomator journey through picker, Home, Discover, the grids, a title and a person page): a fresh install behaves like the AOT row from the first launch. That is roughly −40 % janky frames on Home scroll and up to half a second off cold start, for every build the second mate installs. It does <b>not</b> change steady state on a box already at <code>speed</code>. Effort M: the journey can run on an emulator in the build container; the box itself isn't needed. Risk low.</p>
+
+<h2>8. Recommended plan</h2>
+<ol class="plan">
+<li><b>DNS and launch (TV, S, ~1 day).</b> Persisted DNS answers plus parallel connection warm-up at process start. Show the picker from saved people and check the session in the background. <i>Prove it:</i> 6 cold launches spaced &gt;60 s apart, picker at ≤0.5 s every time (today 1.65 s in half); first cast photos on a new title ≤1 s.</li>
+<li><b>Image sizes (TV, XS, hours).</b> Sized WebP grid posters, TMDB w342, lean episode fields. <i>Prove it:</i> first Movies visit settles ≤400 ms (today 750); tank payload table.</li>
+<li><b>Load states and motion (TV, M, 2–3 days, against your pick on this page).</b> Breathing shaped skeletons, art fade-in for network loads only, reserved late-line slots, staged reveal, hero cross-fade, reduced motion. <i>Prove it:</i> recordings like the ones above, no layout change after first content, gfxinfo janky no worse than today.</li>
+<li><b>Prefetch and memory cache (TV, M, 2 days).</b> Dwell prefetch of title pages, a memory layer over the Conductarr cache, pre-decoded Home art behind the picker. <i>Prove it:</i> title first content ≤100 ms and Home settled ≤250 ms.</li>
+<li><b>Conductarr release (M–L, 2–4 days):</b> held-title cache with webhook invalidation, readiness without duplicate reads or per-episode GETs, 304 before render, token-check cache. <b>Caddy</b>: compress the TV door. <i>Prove it:</i> the route table above for 24 h, with detail, season and readiness p50 ≤200 ms and p95 ≤600 ms, and the feed on the wire ≤40 KB.</li>
+<li><b>Baseline profile (TV build, M, 1–2 days).</b> Recorded journey profile. <i>Prove it:</i> fresh install without a forced compile, Home scroll janky ≤30 %, cold start ≤0.5 s.</li>
+<li><b>Frame cost (TV, M, 2–3 days).</b> The Compose fixes in section 6 and fewer full-screen layers. <i>Prove it:</i> Home and grid scroll janky ≤20 %, GPU p90 ≤16 ms in framestats.</li>
+</ol>
+<p><b>Total:</b> about 2 weeks of TV work and 3–4 days for a Conductarr release. Steps 1–2 alone remove the two waits you can feel today (the launch spinner and grids filling slowly), in about a day and a half.</p>
+<p class="muted small">A box-side alternative to step 1's DNS part: switch the box's Private DNS from <code>dns.adguard.com</code> to Automatic, so it uses the LAN resolver (136–160 ms uncached, 0 ms cached). That changes the whole box, not just Wolfskin, so it's your call; the TV-side fix works either way.</p>
+<h2>9. Your picks (all of them on one page)</h2>
+<p class="muted">Six decisions. Each locks the moment you send it and the build lanes start on it. Nothing here touches the TV while you are playing.</p>
+<form class="decision" data-decision-key="tv-motion-speed-direction" data-lavish-question="tv-motion-speed-direction"><h3>1. Load-state and motion direction</h3>
+<p class="muted">Decides plan step 3 (skeletons and motion). The prototypes above show each part.</p>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="recommended" data-choice-key="tv-motion-speed-direction"> <b>A · As recommended</b> <span class="rec">recommended</span><span class="t">Breathing shaped skeletons, art fades in only when it came from the network, reserved space for late lines, hero cross-fade, reduced-motion safe.</span></label>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="flat" data-choice-key="tv-motion-speed-direction"> <b>B · Same, but flat skeletons</b><span class="t">Still card-shaped, no pulse. The calmest option.</span></label>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="shimmer" data-choice-key="tv-motion-speed-direction"> <b>C · Same, but shimmer skeletons</b><span class="t">A light sweep across the tiles. Costs GPU on this box every frame while loading.</span></label>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="changes" data-choice-key="tv-motion-speed-direction"> <b>D · Different</b><span class="t">Say what in the note: a prototype to change, a speed, an option to drop.</span></label>
+<textarea aria-label="Notes for 1. Load-state and motion direction" name="tv-motion-speed-direction-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-speed-quick-fixes" data-lavish-question="tv-speed-quick-fixes"><h3>2. The two quick speed fixes (about a day and a half, TV only)</h3>
+<p class="muted">(a) DNS cache with stale-serve plus a picker painted from saved people, so the launch spinner goes away; (b) sized WebP grid posters, smaller TMDB art, lean episode fields, so grids fill fast. Both ship in the next TV build.</p>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="go" data-choice-key="tv-speed-quick-fixes"> <b>Go, start now</b> <span class="rec">recommended</span><span class="t">Two small lanes, merged and staged for the next install.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="a-only" data-choice-key="tv-speed-quick-fixes"> <b>Only (a), the launch spinner</b><span class="t">Leave the image sizing for later.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="b-only" data-choice-key="tv-speed-quick-fixes"> <b>Only (b), the image sizes</b><span class="t">Leave the DNS cache for later.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="later" data-choice-key="tv-speed-quick-fixes"> <b>Not now</b><span class="t">Skip until after the motion work.</span></label>
+<textarea aria-label="Notes for 2. The two quick speed fixes (about a day and a half, TV only)" name="tv-speed-quick-fixes-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-box-dns" data-lavish-question="tv-box-dns"><h3>3. Change the box Private DNS (your call, system setting)</h3>
+<p class="muted">Today the box uses dns.adguard.com: an uncached lookup costs 450 to 1350 ms. Automatic uses the LAN resolver (136 to 160 ms uncached, 0 ms cached). It changes DNS for the whole box, not just Wolfskin. I do it with ADB only when the TV is free and you say so; the TV-side fix in 2(a) works either way.</p>
+<label class="opt"><input required type="radio" name="tv-box-dns" value="leave" data-choice-key="tv-box-dns"> <b>Leave it as it is</b> <span class="rec">recommended</span><span class="t">The TV-side cache covers the launch spinner.</span></label>
+<label class="opt"><input required type="radio" name="tv-box-dns" value="automatic" data-choice-key="tv-box-dns"> <b>Switch to Automatic</b><span class="t">I change it when you free the TV and show before and after timings.</span></label>
+<label class="opt"><input required type="radio" name="tv-box-dns" value="ask" data-choice-key="tv-box-dns"> <b>Ask me when the TV is free</b><span class="t">Decide then.</span></label>
+<textarea aria-label="Notes for 3. Change the box Private DNS (your call, system setting)" name="tv-box-dns-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-speed-later-steps" data-lavish-question="tv-speed-later-steps"><h3>4. Later plan steps to queue (TV, after the build above)</h3>
+<p class="muted">Prefetch and memory cache (title pages, 2 days); recorded Baseline Profile (1 to 2 days); frame cost and Compose fixes (2 to 3 days). Each has its own proof target in section 8.</p>
+<label class="opt"><input required type="radio" name="tv-speed-later-steps" value="all" data-choice-key="tv-speed-later-steps"> <b>Queue all three in that order</b> <span class="rec">recommended</span><span class="t">They follow the motion work, one lane at a time.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-later-steps" value="prefetch" data-choice-key="tv-speed-later-steps"> <b>Only prefetch and memory cache</b><span class="t">Skip the profile and frame work for now.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-later-steps" value="none" data-choice-key="tv-speed-later-steps"> <b>None yet</b><span class="t">Revisit after you have seen the motion build on the TV.</span></label>
+<textarea aria-label="Notes for 4. Later plan steps to queue (TV, after the build above)" name="tv-speed-later-steps-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-conductarr-retrieval" data-lavish-question="tv-conductarr-retrieval"><h3>5. Conductarr title-read speed-up (needs a Conductarr release)</h3>
+<p class="muted">Held-title cache with Arr webhook invalidation, readiness without duplicate reads or per-episode calls, 304 before render, token-check cache, compression on the TV door. 3 to 4 days, plus a release and a server-docs update. Title pages are slow because of this (readiness p50 2.9 s).</p>
+<label class="opt"><input required type="radio" name="tv-conductarr-retrieval" value="scope" data-choice-key="tv-conductarr-retrieval"> <b>Scope it first, then I decide</b> <span class="rec">recommended</span><span class="t">A short scout writes the exact change list and risks for a release; nothing ships.</span></label>
+<label class="opt"><input required type="radio" name="tv-conductarr-retrieval" value="go" data-choice-key="tv-conductarr-retrieval"> <b>Go: build it and release it</b><span class="t">You are giving the word to build and release Conductarr when it is green.</span></label>
+<label class="opt"><input required type="radio" name="tv-conductarr-retrieval" value="later" data-choice-key="tv-conductarr-retrieval"> <b>Not now</b><span class="t">Skip until after the TV-side wins.</span></label>
+<textarea aria-label="Notes for 5. Conductarr title-read speed-up (needs a Conductarr release)" name="tv-conductarr-retrieval-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-build-order" data-lavish-question="tv-build-order"><h3>6. When should these land on the TV?</h3>
+<p class="muted">You said you will not be using the TV during this session.</p>
+<label class="opt"><input required type="radio" name="tv-build-order" value="as-ready" data-choice-key="tv-build-order"> <b>Bundle with the next install</b> <span class="rec">recommended</span><span class="t">The speed fixes and any approved motion work join the staged build; I install when you say the TV is free.</span></label>
+<label class="opt"><input required type="radio" name="tv-build-order" value="separate" data-choice-key="tv-build-order"> <b>Install the speed fixes on their own first</b><span class="t">A quick build for steps 2(a) and 2(b) only, installed as soon as it is ready if you free the TV.</span></label>
+<textarea aria-label="Notes for 6. When should these land on the TV?" name="tv-build-order-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<p class="muted small">Method, raw numbers and files: <code>data/tv-spike-motion-speed/report.md</code>. Nothing was changed in the app or on the server. The box was left on the Movies tab.</p>
+<script>
+{JS}
+document.querySelectorAll('form.decision').forEach(form=>{{form.addEventListener('submit',event=>{{event.preventDefault();const key=form.dataset.lavishQuestion;const answer=new FormData(form).get(key);const status=form.querySelector('[role=status]');if(!answer){{status.textContent='Pick an option first.';return;}}if(!window.lavish||!window.lavish.queuePrompt){{status.textContent='Open this page in the live review board to queue an answer.';return;}}const note=form.querySelector('textarea').value.trim();const label=form.querySelector('h3').textContent;window.lavish.queuePrompt(label+': '+answer+(note?'\\n'+note:''),{{tag:'choice',text:label+': '+answer,element:form,queueKey:key,data:{{question:key,answer:answer,note:note}}}});status.textContent='Queued. Press Send to Agent in the review toolbar.';}});}});
+</script></main></body></html>'''
+
+os.makedirs(ASSETS, exist_ok=True)
+src = os.path.join(HERE, 'tv-motion-speed')
+for f in os.listdir(src):
+    shutil.copyfile(os.path.join(src, f), ASSETS + f)
+    os.chmod(ASSETS + f, 0o660)
+with open(OUT, 'w') as fh:
+    fh.write(page)
+os.chmod(OUT, 0o660)
+print(OUT, len(page))

data/tv-v2/motion-2026-11-06/delta.json

@@ -0,0 +1,56 @@
+{
+  "specRevision": 6,
+  "direction": "A — As recommended",
+  "approvedReference": "https://pages.justinvisser.org/wolfskin/tv-motion-speed.html",
+  "frozenInputs": ["index.html", "proto.css", "proto.js", "build_page.py", "tv-motion-speed/"],
+  "checksums": "SHA256SUMS",
+  "stagePx": [1920, 1080],
+  "density": 2,
+  "skeleton": {
+    "fill": "#1b1b25",
+    "alpha": [0.55, 1, 0.55],
+    "cycleMs": 1400,
+    "halfCycleEasing": [0.42, 0, 0.58, 1],
+    "layerScope": "one layer per shelf or bounded header block; no per-card stagger",
+    "shimmer": false,
+    "focusable": false
+  },
+  "art": {
+    "networkRevealMs": 160,
+    "memoryDiskLocalRevealMs": 0,
+    "loaders": ["WolfskinImages", "upstream CoilConfig"],
+    "requestUrlChanges": false
+  },
+  "hero": {
+    "backdropFadeMs": 320,
+    "backdropEasing": [0.65, 0, 0.35, 1],
+    "homeBlendBoundsPx": [1920, 820],
+    "discoverBlendBoundsPx": [1920, 740],
+    "holdPreviousUntilIncomingArtOrFallback": true,
+    "copyOutMs": 120,
+    "copyEntryAtMs": 140,
+    "copyInMs": 200,
+    "copyRisePx": 14
+  },
+  "focus": {
+    "durationMs": 180,
+    "easing": [0.33, 1, 0.68, 1],
+    "captionDelayMs": 60,
+    "captionRisePx": 10,
+    "captionOutMs": 100,
+    "geometry": "unchanged"
+  },
+  "rowEntry": {"durationMs": 180, "risePx": 24, "scope": "one row, never full screen"},
+  "lateSeriesReadiness": {"reservedHeightPx": 56, "fadeMs": 200, "translationPx": 0},
+  "reducedMotion": {
+    "sources": ["Compose window MotionDurationScale == 0", "LocalReducedMotion host flag"],
+    "maximumFadeMs": 80,
+    "pulse": false,
+    "translation": false,
+    "scrollAnimation": false
+  },
+  "nativeFrames": "https://pages.justinvisser.org/wolfskin/tv-motion-build/",
+  "onDeviceAcceptance": {"homeJankyPercentMaximum": 39.6, "homeP90MsMaximum": 65, "lateSeriesLayoutShiftPx": 0},
+  "deviceAccess": "not performed by this worker",
+  "specification": "../../tv-spec/spec.md"
+}

data/tv-v2/motion-2026-11-06/index.html

@@ -0,0 +1,483 @@
+<!doctype html><html lang="en" data-lavish-annotate="off"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="color-scheme" content="dark"><title>Wolfskin TV: faster, quieter, smoother</title><style>
+:root{color-scheme:dark;--bg:#07070a;--panel:#13131a;--line:rgba(255,255,255,.1);--fg:#f4f4f6;--muted:rgba(244,244,246,.74);--acc:oklch(78% 0.14 305);--ok:#7ed6a0;--warn:#ffc46b;--bad:#ff8a7a}
+*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}
+main{max-width:1400px;margin:0 auto;padding:16px 14px 120px}h1{font-size:28px;line-height:1.2;margin:6px 0 6px}h2{font-size:21px;margin:34px 0 8px;color:var(--acc);border-bottom:1px solid var(--line);padding-bottom:4px}
+h3{font-size:17px;margin:20px 0 6px}a{color:var(--acc)}.muted{color:var(--muted)}.small{font-size:13px}p{margin:6px 0}li{margin:3px 0}
+.lead{font-size:17px}.k{color:var(--ok)}.w{color:var(--warn)}.b{color:var(--bad)}
+.tw{overflow-x:auto;margin:8px 0;border:1px solid var(--line);border-radius:10px}table{border-collapse:collapse;width:100%;font-size:14px}
+th,td{padding:6px 9px;border-top:1px solid var(--line);text-align:left;vertical-align:top}thead th{border-top:0;background:#1b1a22;white-space:nowrap}
+td:first-child{font-weight:600}table.num td:not(:first-child){white-space:nowrap}
+.card2{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:10px 0}
+.pair{margin:14px 0 26px}.ph{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:0 0 6px}
+.panes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(380px,100%),1fr));gap:12px}.pane{min-width:0}.lab{font-size:13px;color:var(--muted);margin:0 0 4px}
+.decision{padding:18px 22px;background:#13131a;border:1px solid var(--line);border-radius:14px;margin:14px 0}.decision h3{margin-top:0}
+.opt{display:block;border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin:7px 0;cursor:pointer;background:#100e16}.opt:has(input:checked){background:oklch(26% 0.07 305);border-color:var(--acc)}
+.opt .t{display:block;color:var(--muted);font-size:14px;margin-left:24px}.rec{font-size:12px;color:var(--ok);margin-left:6px}
+textarea{width:100%;min-height:70px;background:#0c0b10;color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:8px;font:inherit;margin-top:6px}
+.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 6px}
+.tab,button.replay{font:inherit;font-size:13px;border-radius:999px;padding:4px 11px;border:1px solid var(--line);background:#1b1a22;color:var(--fg);cursor:pointer}.tab.on{background:oklch(26% 0.07 305);border-color:var(--acc)}
+button.replay{background:oklch(26% 0.07 305);border-color:var(--acc)}
+form.decision button[type=submit]{font:inherit;font-size:15px;font-weight:600;border-radius:999px;padding:8px 18px;border:1px solid var(--acc);background:oklch(26% 0.07 305);color:var(--fg);cursor:pointer;margin-top:8px}
+form.decision [role=status]{font-size:13px;margin-left:10px;opacity:.8}
+.ctl{position:sticky;top:0;z-index:8;background:#07070aee;backdrop-filter:blur(6px);border-bottom:1px solid var(--line);padding:8px 0;margin:0 0 8px;display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:14px}
+.ctl label{display:inline-flex;gap:6px;align-items:center;cursor:pointer}
+ol.plan>li{margin:10px 0}code{font-size:13px;color:oklch(88% 0.08 305)}
+/* Prototype stages: 1920x1080 CSS px, approved tokens from data/tv-v2/focus-2026-11-06 (colors, type, ring, card sizes at Level 2 spacing). */
+.sbox{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:8px;border:1px solid var(--line);background:#000}
+.sbox video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
+.stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;overflow:hidden;background:#07070a;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;color:#f4f4f6;font-size:28px;line-height:1.3;
+ --bg:#07070a;--surface:#13131a;--surface2:#1b1b25;--surface3:#252532;--muted:rgb(244 244 246/.74);--dim:rgb(244 244 246/.56);--accent:oklch(78% 0.14 305);--accent-text:oklch(88% 0.08 305)}
+.stage *{box-sizing:border-box}
+.stage .abs{position:absolute}
+/* nav */
+.stage .nav{position:absolute;left:0;top:0;width:1920px;height:150px;z-index:5;display:flex;align-items:center;gap:12px;padding:44px 96px 0}
+.stage .wm{font-size:36px;font-weight:800;letter-spacing:-.02em;margin-right:40px}.stage .wm b{color:var(--accent)}
+.stage .ni{height:64px;padding:0 26px;border-radius:32px;display:inline-flex;align-items:center;font-size:30px;font-weight:600;color:var(--muted);position:relative}
+.stage .ni.cur{color:#f4f4f6}.stage .ni.cur::after{content:"";position:absolute;left:26px;right:26px;bottom:4px;height:4px;border-radius:2px;background:var(--accent)}
+.stage .ni.f{background:#f4f4f6;color:#0b0b10}.stage .ni.f::after{display:none}
+.stage .nsp{flex:1}.stage .av{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#0b0b10;font-size:30px;background:#9be38f}
+/* hero */
+.stage .amb{position:absolute;inset:0;background-size:cover;background-position:center;image-rendering:auto}
+.stage .bd{position:absolute;inset:0;background-size:cover;background-position:center}
+.stage .scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgb(7 7 10/.92) 0%,rgb(7 7 10/.55) 42%,rgb(7 7 10/0) 70%),linear-gradient(0deg,#07070a 0%,rgb(7 7 10/.6) 26%,rgb(7 7 10/0) 48%)}
+.stage .copy{position:absolute;left:96px;width:1000px}
+.stage .kicker{font-size:26px;font-weight:650;color:var(--accent-text);margin-bottom:10px}
+.stage .ht{font-size:84px;line-height:1.02;font-weight:800;letter-spacing:-.02em;margin:0 0 16px}
+.stage .hm{font-size:28px;color:var(--muted);margin-bottom:14px;min-height:38px;display:flex;gap:22px;align-items:center}
+.stage .ho{font-size:28px;color:var(--muted);margin:0 0 30px;max-width:960px}
+.stage .btns{display:flex;gap:20px}
+.stage .btn{height:76px;padding:0 38px;border-radius:38px;font-size:28px;font-weight:700;display:inline-flex;align-items:center;background:rgb(255 255 255/.14)}
+.stage .btn.pri{background:#f4f4f6;color:#0b0b10}
+.stage .btn.f{box-shadow:0 0 0 2px var(--accent),inset 0 0 0 2px var(--accent);transform:scale(1.05)}
+.stage .rate{display:inline-flex;gap:10px;align-items:center;font-weight:700;color:#f4f4f6}.stage .rate i{width:24px;height:24px;border-radius:50%;background:#e2483a;display:inline-block}
+.stage .rate i.pc{background:#f5c518;border-radius:4px}
+.stage .slot{display:inline-block;height:30px;border-radius:15px;background:rgb(255 255 255/.10)}
+/* rows + cards */
+.stage .sh{position:absolute;left:96px;font-size:34px;font-weight:700}
+.stage .card{position:absolute;border-radius:16px;overflow:hidden;background:var(--surface);background-size:cover;background-position:center}
+.stage .card.poster{width:256px;height:384px}.stage .card.tile{width:400px;height:225px}
+.stage .card .img{position:absolute;inset:0;background-size:cover;background-position:center}
+.stage .card .cap{position:absolute;left:0;right:0;bottom:0;padding:14px 18px;background:linear-gradient(rgb(7 7 10/0),rgb(7 7 10/.92));font-size:26px;font-weight:700}
+.stage .ring{box-shadow:0 0 0 2px var(--accent),inset 0 0 0 2px var(--accent),0 18px 40px rgb(0 0 0/.55)}
+.stage .circle{position:absolute;width:200px;height:200px;border-radius:50%;overflow:hidden;background:var(--surface2);display:grid;place-items:center;font-size:44px;font-weight:800;color:var(--dim)}
+.stage .circle .img{position:absolute;inset:0;background-size:cover;background-position:center}
+.stage .bar{position:absolute;height:28px;border-radius:14px;background:var(--surface2)}
+.stage .spin{position:absolute;left:940px;top:520px;width:40px;height:40px;border-radius:50%;border:4px solid rgb(155 120 255/.25);border-top-color:oklch(65% 0.2 300);animation:spin .8s linear infinite}
+/* picker */
+.stage .pk{position:absolute;top:290px;left:0;width:1920px;text-align:center;font-size:72px;font-weight:800;letter-spacing:-.02em}
+.stage .person{position:absolute;top:426px;width:220px;height:220px;border-radius:50%;display:grid;place-items:center;font-size:110px;font-weight:800;color:#0b0b10}
+.stage .pname{position:absolute;top:670px;width:220px;text-align:center;font-size:34px;font-weight:700;color:var(--muted)}
+/* replay label */
+.stage .tl{position:absolute;right:14px;bottom:10px;font:22px/1 ui-monospace,Menlo,monospace;background:rgb(0 0 0/.6);padding:6px 8px;border-radius:6px;color:#fff;z-index:20}
+
+/* keyframes */
+@keyframes spin{to{transform:rotate(360deg)}}
+@keyframes fade{from{opacity:0}to{opacity:1}}
+@keyframes fadeout{from{opacity:1}to{opacity:0}}
+@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
+@keyframes breathe{0%,100%{opacity:.55}50%{opacity:1}}
+@keyframes shimmer{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
+@keyframes hide{to{opacity:0;visibility:hidden}}
+@keyframes show{from{opacity:0}to{opacity:1}}
+
+/* anything with .an waits for .play */
+.stage .an{opacity:0}
+.stage.play .an{animation-fill-mode:both}
+.stage .gone{animation-fill-mode:both}
+/* skeleton styles */
+.stage .sk{background:var(--surface2)}
+.stage .sk.breathe{animation:breathe 1.4s ease-in-out infinite}
+.stage .sk.shim{position:relative;overflow:hidden}
+.stage .sk.shim::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgb(255 255 255/.07),transparent);animation:shimmer 1.3s linear infinite}
+
+/* reduced motion: no movement, short fades only */
+body.rm .stage.play .an{animation-name:fade!important;animation-duration:.08s!important}
+body.rm .stage .sk.breathe,body.rm .stage .sk.shim::after{animation:none}
+body.rm .stage .mv{transition:none!important}
+
+</style></head><body><main>
+<h1>Wolfskin TV: faster, quieter, smoother</h1>
+<p class="lead">Measured on your Xiaomi box with <b>Wolfskin (Opt)</b> 1.1.0-133 and from tank, on 2026-11-06. This page has the options, the plan, and live prototypes of the loading and motion. Each prototype sits next to a recording of the real app doing the same thing today.</p>
+
+<div class="card2"><b>The short version</b><ul>
+<li><b>The biggest wait isn't the app.</b> Two of four cold launches showed a spinner for <b>1.5 s</b>, and the other two showed none. The box looks up <code>jelly.justinvisser.org</code> through AdGuard Private DNS, and an uncached lookup takes <b>0.45–1.35 s</b>. The address only stays cached for 60 s, so the first launch after a minute's pause pays it, and so does the first title page that fetches TMDB art. A small TV-side DNS cache (or one box setting) removes it.</li>
+<li><b>The second biggest is Conductarr.</b> On a title page, the detail, season and "Ready for you" reads take <b>1.1 s, 1.1 s and 2.9 s</b> at the median. Each one re-lists the whole Radarr/Sonarr library on every request, with no cache. A title page can't settle until the slowest arrives (3.4 s on a series). This needs a Conductarr release.</li>
+<li><b>Screens are already quick, but they pop.</b> Home, the grids, Discover and Settings settle in <b>0.2–0.75 s</b>. What makes the wait visible is art and fields arriving in steps, and the layout jumping when a late line lands. That's fixable on the TV alone: fade art in, reserve space for late lines, keep last-known screens, and prefetch.</li>
+<li><b>Frames are slow for two reasons.</b> At the median a frame takes 30–46 ms during moves, where 60 fps needs 16.7 ms. On grid and row scrolls, <b>30–44 %</b> of frames miss. The GPU alone takes 14–21 ms per frame, so motion here has to be cheap: fades, small rises and scale on one layer. No full-screen blur or shimmer sweeps.</li>
+</ul></div>
+
+<div class="ctl"><label><input type="checkbox" id="boxrate"> Play prototypes at the box's frame rate (40 ms per frame, measured)</label><label><input type="checkbox" id="rm"> Reduced motion (fades only, ≤100 ms)</label><span class="muted small">Prototypes loop. "Replay together" restarts the recording and the prototype in step. Counters are ms after the screen first reacts to the key.</span></div>
+
+<h2>1. Where the time goes today</h2>
+<h3>Per screen, from the first frame that reacts to the key until the screen stops changing</h3>
+<p class="muted small">Method: on-device <code>screenrecord</code> (it only emits frames on change), scene-change detection with ffmpeg, logcat (OkHttp and ActivityManager) and Conductarr's own request log for the same seconds. "Settled" is the last visible change. Raw clips and sheets are in <code>data/tv-spike-motion-speed/</code>.</p>
+<div class="tw"><table class="num"><thead><tr><th>Screen</th><th>First content</th><th>Settled</th><th>What arrives late</th><th>Repeat visit</th></tr></thead><tbody><tr><td>Cold start (am start -W TotalTime, 4 runs)</td><td>583 / 538 / 438 / 453 ms to first frame</td><td>picker at +0.3–0.4 s (DNS warm) or <b class="b">+1.65 s</b> (DNS cold)</td><td>Spinner while <code>Users/Me</code> then <code>System/Info/Public</code> run one after the other (ServerRepository.kt:104,107)</td><td>same, bimodal on the 60 s DNS cache</td></tr><tr><td>Who's watching → Home</td><td>hero text 135 ms</td><td>430 ms</td><td>shelf tiles flat grey until 400 ms, then all images pop</td><td>370 ms</td></tr><tr><td>Home → Discover tab</td><td>content 270 ms (dims first)</td><td>700 ms</td><td>posters pop in over 0.4 s</td><td>600 ms</td></tr><tr><td>Movies grid</td><td>230 ms (blank tiles)</td><td>750 ms</td><td>posters fill row by row</td><td>500 ms</td></tr><tr><td>Shows grid</td><td>280 ms</td><td>640 ms</td><td>posters</td><td>—</td></tr><tr><td>Title, movie in library (American Gangster)</td><td>430 ms (text)</td><td><b class="w">2.69 s</b></td><td>backdrop 470 ms; cast portraits 2.7 s (initials until then)</td><td>450 ms total</td></tr><tr><td>Title, Discover pick (Donnie Brasco)</td><td>980 ms (blank skeleton until then)</td><td>1.53 s</td><td>backdrop 1.37 s, cast 1.5 s</td><td>—</td></tr><tr><td>Title, series (Adults)</td><td>620 ms</td><td><b class="b">3.42 s</b></td><td>ratings and "Ready for you · by Mindel" land at 3.4 s and push the overview down</td><td>—</td></tr><tr><td>Person page (Martin Sheen)</td><td>620 ms</td><td>720 ms</td><td>filmography posters</td><td>—</td></tr><tr><td>Back from title / series / person</td><td>260 / 300 / 450 ms</td><td></td><td></td><td></td></tr><tr><td>Settings</td><td>220 ms</td><td>220 ms</td><td>—</td><td></td></tr><tr><td>Coming in sheet</td><td>74 ms</td><td>74 ms (from cache)</td><td>posters refresh silently</td><td></td></tr></tbody></table></div>
+
+<h3>Frame timing per interaction (dumpsys gfxinfo, ART status <code>speed</code>)</h3>
+<div class="tw"><table class="num"><thead><tr><th>Interaction</th><th>Frames</th><th>Janky</th><th>p50</th><th>p90</th><th>p99</th><th>Main thread slow / GPU slow</th></tr></thead><tbody><tr><td>Home rows scroll (down 7, up 6, right 5), run 1 / 2</td><td>149 / 115</td><td>38.9 % / 34.8 %</td><td>44 / 46 ms</td><td>69 / 65</td><td>89 / 101</td><td>43 / 52 · 27 / 35</td></tr><tr><td>Movies grid scroll (down 8, up 8), run 1 / 2</td><td>180 / 159</td><td>43.9 % / 32.1 %</td><td>30 / 30 ms</td><td>53 / 46</td><td>93 / 73</td><td>30 / 69 · 20 / 48</td></tr><tr><td>Discover scroll</td><td>146</td><td>30.1 %</td><td>34 ms</td><td>57</td><td>73</td><td>34 / 35</td></tr><tr><td>Tab switch ×4</td><td>158</td><td>18.4 %</td><td>28 ms</td><td>65</td><td>150</td><td>15 / 29</td></tr><tr><td>Title open + back ×3</td><td>103</td><td>33.0 %</td><td>48 ms</td><td>113</td><td>150</td><td>29 / 34</td></tr><tr><td>Who's watching → Home</td><td>15</td><td>53.3 %</td><td>61 ms</td><td>117</td><td>133</td><td>7 / 8</td></tr><tr><td>Open title (movie, first time)</td><td>20</td><td>60.0 %</td><td>57 ms</td><td>150</td><td>200</td><td>9 / 12</td></tr><tr><td>Back from person</td><td>12</td><td>75.0 %</td><td>93 ms</td><td>150</td><td>150</td><td>8 / 9</td></tr></tbody></table></div>
+<p class="muted small">Frame phases on the Shows grid (framestats, 68 frames): record p50 0.5 / p90 10.3 ms, GPU issue p50 4.3 / p90 8.9 ms, GPU complete p50 <b>14.3</b> / p90 <b>21.2</b> ms, total p50 25.6 / p90 41.4 ms. The app renders at 1920×1080 and the box outputs 3840×2160 at 59.94 Hz. Today's grid is worse than the earlier Opt measurement (17.7 % janky), which was taken before the spacing and focus-ring builds.</p>
+
+<h3>Network, from tank (10 runs each; cold = new connection, warm = kept-alive)</h3>
+<div class="tw"><table class="num"><thead><tr><th>Call</th><th>Bytes</th><th>Cold p50 / p95</th><th>Warm p50 / p95</th><th>Cache headers</th></tr></thead><tbody><tr><td>Jellyfin UserViews (called 4–5× per launch)</td><td>2.3 KB</td><td>65 / 166 ms</td><td>46 / 51 ms</td><td>none</td></tr><tr><td>Home Resume (20)</td><td>1.4 KB</td><td>58 / 66</td><td>30 / 41</td><td>none</td></tr><tr><td>Home NextUp (20)</td><td>6.2 KB</td><td>71 / 91</td><td>47 / 52</td><td>none</td></tr><tr><td>Home Items/{{id}} per series (sequential)</td><td>4.0 KB</td><td>43 / 60</td><td>24 / 28</td><td>none</td></tr><tr><td>Home library shelf (20)</td><td>18.7 KB</td><td>85 / 116</td><td>74 / 84</td><td>none</td></tr><tr><td>Movies grid page (200)</td><td>51 KB</td><td>68 / 148</td><td>61 / 64</td><td>none</td></tr><tr><td>Title episodes with MediaSources + People</td><td><b class="w">96.8 KB</b></td><td>142 / 185</td><td>122 / 169</td><td>none</td></tr><tr><td>Title episodes, lean fields</td><td>6.5 KB</td><td>26 / 65</td><td>11 / 12</td><td>none</td></tr><tr><td>Grid poster, no size (today, LibraryReadFacade.kt:86)</td><td><b class="b">626 KB</b></td><td>26 / 30</td><td>8 / 9</td><td>max-age 1 y, immutable, ETag</td></tr><tr><td>Grid poster fillWidth 256×384 q96</td><td>31.6 KB</td><td>19 / 131</td><td>2 / 4</td><td>same</td></tr><tr><td>Grid poster 256×384 q80 WebP</td><td>11.2 KB</td><td>19 / 118</td><td>1 / 2</td><td>same</td></tr><tr><td>Backdrop 1280 q96 / q80 WebP</td><td>91 / 31 KB</td><td>19 / 25</td><td>2 / 2</td><td>same</td></tr><tr><td>TMDB poster w780 (today, ConductarrProjection.kt:9)</td><td>131 KB</td><td>128 / 144</td><td>49 / 70</td><td>max-age 1 y</td></tr><tr><td>TMDB poster w342 / w185</td><td>41 / 15 KB</td><td>100 / 76</td><td>31 / 30</td><td>max-age 1 y</td></tr></tbody></table></div>
+<p class="muted small">Box-side DNS (ping timing, 6 samples 70 s apart): uncached <code>jelly.justinvisser.org</code> 490–1390 ms, <code>wolfskin-tv</code> 460–490 ms, <code>image.tmdb.org</code> 60–1170 ms; cached 40–50 ms. The box uses Private DNS <code>dns.adguard.com</code>. The LAN resolver 192.168.1.2 answers uncached names in 136–160 ms and cached in 0 ms. The A record behind both hosts has a 60 s TTL. Cold launches 1 and 3 were more than 60 s after the previous lookup, and 2 and 4 were within it.</p>
+<h3>Conductarr TV routes, server-side (Conductarr request log, 22 h, 200/304)</h3>
+<div class="tw"><table class="num"><thead><tr><th>Route</th><th>n</th><th>p50</th><th>p95</th><th>Body p50</th><th>Why</th></tr></thead><tbody><tr><td>activity/titles/{{tmdb}}/{{type}} (Ready for you)</td><td>45</td><td><b class="b">2856 ms</b></td><td>5002 ms</td><td>1.7 KB</td><td>Re-reads the held title twice, the Seerr requests and a Jellyfin GET per episode; no cache (activity/detail.go:21, request_evidence.go:45, users.go:262). The 5002 ms p95 is most likely the TV giving up: its read timeout is 5 s (ConductarrSession.kt:53), so on the slowest titles the line never appears</td></tr><tr><td>catalogue/titles/{{tmdb}}/{{type}} (detail)</td><td>51</td><td><b class="b">1198 ms</b></td><td>3217 ms</td><td>11.9 KB</td><td>Held-title read lists every Arr library unpaged, then Seerr details, then ratings; sequential (catalogue/detail.go:14-17, library_detail.go:81)</td></tr><tr><td>catalogue/tv/{{tmdb}}/seasons/{{n}}</td><td>76 / 17 (304)</td><td>1084 / 2282 ms</td><td>2664 ms</td><td>1 KB</td><td>Same held-title read; a 304 still renders and hashes the full body first (read_validators.go)</td></tr><tr><td>…/ratings</td><td>265</td><td>147 ms</td><td>449 ms</td><td>0.5 KB</td><td>6 h server cache, 300 titles</td></tr><tr><td>…/enrichment · …/related · …/cast</td><td>46 · 42 · 26</td><td>103 · 124 · 33 ms</td><td>465 · 261 · 78</td><td>3 · 14 · 12.5 KB</td><td>enrichment uncached</td></tr><tr><td>recommendations feed</td><td>42</td><td>16 ms</td><td>40 ms</td><td><b class="w">204 KB, uncompressed</b></td><td>no gzip/br on the TV door (Caddyfile.base:316-333, serve.go:140)</td></tr><tr><td>activity (polled every 30 s)</td><td>713 × 304</td><td>52 ms</td><td>83 ms</td><td>62.5 KB when 200</td><td></td></tr><tr><td>operator · profiles · dismissals · options · display</td><td></td><td>12–25 ms</td><td>30–93 ms</td><td></td><td>cheap; display is called ≈1 400×/day, once per poster</td></tr></tbody></table></div>
+<p class="muted small">Every TV request also costs Conductarr an uncached Jellyfin <code>/Users/Me</code> to check the token (clients/jellyfin/token.go:42). Every authenticated response is <code>Cache-Control: no-store</code> (authority.go:32). The TV client revalidates with its own ETag store instead.</p>
+
+<h3>Caches the app has today</h3>
+<div class="tw"><table class=""><thead><tr><th>Cache</th><th>Where</th><th>Behaviour</th><th>Observed</th></tr></thead><tbody><tr><td>Wolfskin image loader (Coil 3)</td><td>WolfskinImages.kt:46-61</td><td>64 MiB memory, 128 MiB disk, 4 parallel reads, crossfade off</td><td>repeat visits paint art from memory; first grid visit downloads 626 KB per poster (no size)</td></tr><tr><td>Upstream Wholphin image loader</td><td>CoilConfig.kt:80-101</td><td>separate memory + 200 MB disk</td><td>a second copy of the same art in memory</td></tr><tr><td>Conductarr JSON</td><td>FileCacheStore, noBackupFilesDir/conductarr</td><td>saved copy shown first, then revalidated with ETag; no memory layer</td><td>title re-open: every ON_OPEN route re-fetched (cast 304, detail 875 ms again)</td></tr><tr><td>Home, library, title, person snapshots</td><td>filesDir/wolfskin-home, -library-cache, -title</td><td>disk JSON, painted first</td><td>repeat visits 370–500 ms instead of 430–750</td></tr><tr><td>HTTP cache (OkHttp)</td><td>none</td><td>—</td><td>Jellyfin JSON never cached; images rely on Coil only</td></tr><tr><td>DNS</td><td>system only</td><td>60 s TTL through Private DNS</td><td>1.5 s launch spinner when expired</td></tr></tbody></table></div>
+
+<h2>2. Load states</h2>
+<p>Today: a spinner on launch, flat grey blocks on Home, the grids and title pages, and a blank title page until Conductarr answers on Discover picks. Images snap in because crossfade is off in both loaders. Nothing shows a "loading" sentence; that rule already holds.</p>
+<div class="tw"><table class=""><thead><tr><th>Option</th><th>Expected gain (measured basis)</th><th>Effort</th><th>Risk</th><th>What you would see</th><th>Ships in</th></tr></thead><tbody><tr><td>Picker from the saved people list, verify in the background</td><td>Removes the 1.5 s spinner on every DNS-cold launch (2 of 4 measured)</td><td>S</td><td>Low. A revoked session must still land on the recovery picker</td><td>The launcher fades straight into Who's watching</td><td>TV</td></tr><tr><td>Shaped skeletons that breathe (opacity only, staggered)</td><td>No speed change; replaces the flat grey and spinner states</td><td>S</td><td>Low. One alpha layer per row</td><td>Card-shaped tiles gently pulsing until the art lands</td><td>TV</td></tr><tr><td>Art fades in (120–160 ms) instead of popping</td><td>Removes the pop on every first visit</td><td>XS</td><td>Low. Keep it off for memory-cache hits so repeat visits stay instant</td><td>Posters settle instead of flickering in</td><td>TV</td></tr><tr><td>Reserve space for late fields (ratings, Ready for you, genres, overview)</td><td>No layout jump at 3.4 s on series pages</td><td>S</td><td>Low</td><td>The line fades into a gap that was already there</td><td>TV</td></tr><tr><td>Title page paints what the card already knew</td><td>First content 430–980 ms → about 60 ms</td><td>M</td><td>Medium. Card data must match detail (year, runtime, ratings)</td><td>Title, year, ratings and Play at once, over a colour wash of the poster</td><td>TV</td></tr><tr><td>Shimmer sweep skeletons</td><td>None</td><td>S</td><td><b class="w">High on this GPU</b>: a moving gradient over every card, every frame</td><td>Light sweeps across the tiles. Not recommended</td><td>TV</td></tr></tbody></table></div>
+<h3>See it: launch</h3>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button></div>
+<div class="panes"><div class="pane"><p class="lab">Today, DNS cold (2 of 4 launches): 1.5 s spinner</p><div class="sbox"><video src="tv-motion-speed/before-launch-spinner.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">Today, DNS warm</p><div class="sbox"><video src="tv-motion-speed/before-launch-fast.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">After: no spinner, people from the saved list</p><div class="sbox" id="p-launch" data-scene="launch" data-lead="180"></div></div></div></div>
+<h3>See it: skeleton styles</h3>
+<p class="muted small">Pick a style. Content lands at 900 ms in each, about the Movies grid's first visit.</p>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button></div>
+<div class="panes"><div class="pane"><p class="lab">Today: Movies grid, first visit</p><div class="sbox"><video src="tv-motion-speed/before-movies-grid.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">Options</p><div class="tabs" data-variants="p-skel"></div><div class="sbox" id="p-skel" data-scene="skeleton" data-lead="140"></div></div></div></div>
+
+<h2>3. Motion and transitions</h2>
+<p>Today's motion tokens: focus scale 1.08 over 140 ms, ring and caption fades of 140 ms, a nav blob spring, and 160–180 ms row scrolls. There are no screen transitions or hero cross-fades, and reduced motion is defined but nothing reads it (WolfskinTokens.kt:218). At 30–46 ms per frame, a 140 ms tween is drawn in 3–4 frames. Tick <b>box frame rate</b> at the top to see that.</p>
+<div class="tw"><table class=""><thead><tr><th>Option</th><th>Expected gain (measured basis)</th><th>Effort</th><th>Risk</th><th>What you would see</th><th>Ships in</th></tr></thead><tbody><tr><td>Staged reveal on screen entry (hero copy rises 16 px, rows rise 24 px, staggered 30–40 ms, 180 ms ease-out)</td><td>Perceived: art arrives into motion instead of popping. Cost: translate + alpha on one layer per row</td><td>S</td><td>Low. Stagger must not delay focus</td><td>Home and Discover settle like a curtain rather than tiles snapping</td><td>TV</td></tr><tr><td>Hero cross-fade (backdrop 320 ms, copy hands off)</td><td>Removes the hard cut when the hero changes</td><td>S</td><td>Medium. Two 1080p bitmaps for 320 ms; the GPU is already at 14–21 ms/frame, so fade the backdrop only and keep the scrim static</td><td>The next pick dissolves in</td><td>TV</td></tr><tr><td>Focus: 180 ms ease-out, caption rises 10 px</td><td>Same frame cost as today; the curve hides dropped frames better</td><td>XS</td><td>Low</td><td>Focus glides rather than ticks</td><td>TV</td></tr><tr><td>Title entry: grid fades 160 ms, page builds from the poster colour</td><td>Hides the 470 ms backdrop fetch</td><td>M</td><td>Medium (see load states)</td><td>No black gap between grid and title</td><td>TV</td></tr><tr><td>Shared-element poster → title sheet</td><td>None measurable</td><td>L</td><td><b class="w">High</b>. Compose shared elements across NavHost destinations on this GPU; the movie page has no poster sheet when a backdrop exists</td><td>The card flies into place. Not recommended now</td><td>TV</td></tr><tr><td>Honour reduced motion (system animator scale 0 or a Wolfskin toggle)</td><td>Accessibility</td><td>S</td><td>Low</td><td>Fades only, ≤100 ms; the toggle at the top shows it</td><td>TV</td></tr></tbody></table></div>
+<h3>See it: Who's watching → Home</h3>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button></div>
+<div class="panes"><div class="pane"><p class="lab">Today: grey tiles, then art pops at 400 ms</p><div class="sbox"><video src="tv-motion-speed/before-home-enter.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">After</p><div class="sbox" id="p-home" data-scene="home" data-lead="200"></div></div></div></div>
+<h3>See it: tab switch and row reveal (Home → Discover)</h3>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button></div>
+<div class="panes"><div class="pane"><p class="lab">Today</p><div class="sbox"><video src="tv-motion-speed/before-discover-tab.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">After</p><div class="sbox" id="p-tab" data-scene="tab" data-lead="150"></div></div></div></div>
+<h3>See it: title page entry</h3>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button></div>
+<div class="panes"><div class="pane"><p class="lab">Today: American Gangster, first open (cast at 2.7 s)</p><div class="sbox"><video src="tv-motion-speed/before-title-movie.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">Today: Donnie Brasco from Discover, blank until 980 ms</p><div class="sbox"><video src="tv-motion-speed/before-title-discover.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">After: Apocalypse Now from the same grid</p><div class="sbox" id="p-title" data-scene="title" data-lead="170"></div></div></div></div>
+<h3>See it: a late line on a series page</h3>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button></div>
+<div class="panes"><div class="pane"><p class="lab">Today: Adults, the readiness line lands at 3.4 s and pushes the text down</p><div class="sbox"><video src="tv-motion-speed/before-title-series.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">After</p><div class="tabs" data-variants="p-series"></div><div class="sbox" id="p-series" data-scene="series" data-lead="150"></div></div></div></div>
+<h3>See it: focus move</h3>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button><span class="muted small">Tick box frame rate to compare at 25 fps.</span></div>
+<div class="panes"><div class="pane"><p class="lab">Today, real grid</p><div class="sbox"><video src="tv-motion-speed/before-movies-grid.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">Focus along a row</p><div class="tabs" data-variants="p-focus"></div><div class="sbox" id="p-focus" data-scene="focus" data-lead="0"></div></div></div></div>
+<h3>See it: hero cross-fade</h3>
+<div class="pair"><div class="ph"><button type="button" class="replay">Replay together</button></div>
+<div class="panes"><div class="pane"><p class="lab">Today (Discover hero)</p><div class="sbox"><video src="tv-motion-speed/before-discover-tab.webm" muted loop playsinline autoplay preload="auto"></video></div></div><div class="pane"><p class="lab">Hero advances</p><div class="tabs" data-variants="p-hero"></div><div class="sbox" id="p-hero" data-scene="hero" data-lead="0"></div></div></div></div>
+
+<h2>4. Caching</h2>
+<div class="tw"><table class=""><thead><tr><th>Option</th><th>Expected gain (measured basis)</th><th>Effort</th><th>Risk</th><th>What you would see</th><th>Ships in</th></tr></thead><tbody><tr><td>Persisted DNS answers (OkHttp Dns: serve the last address at once, refresh behind)</td><td>Removes 0.45–1.35 s on launch and on the first TMDB image after any 60 s pause</td><td>S</td><td>Low. Fall back to the system lookup if the cached address fails</td><td>No spinner on launch; first cast photos in ≈0.6 s instead of 2.7 s [inference: DNS is the cast delay]</td><td>TV</td></tr><tr><td>Warm the connections at process start (Jellyfin, Conductarr door, TMDB) in parallel</td><td>Overlaps DNS + TLS with the 450 ms first frame</td><td>XS</td><td>Low</td><td>Same as above, smaller</td><td>TV</td></tr><tr><td>Memory layer over the Conductarr disk cache</td><td>Skips disk read and JSON decode on back and re-open (title re-open settles at 450 ms today; ~250 expected) [inference]</td><td>S</td><td>Low</td><td>Back and re-open feel instant</td><td>TV</td></tr><tr><td>Stale-while-revalidate for ON_OPEN title routes (skip refetch if validated in the last 5 min)</td><td>Re-opening a title stops costing the server 875–2 900 ms</td><td>S</td><td>Low. Requests and readiness may be 5 min old; keep requests on FORCE</td><td>Nothing visible; less churn</td><td>TV</td></tr><tr><td>Prefetch the focused card's title page (detail JSON + backdrop) after 350 ms of dwell</td><td>Title first content 430 ms → about 60 ms; backdrop already decoded</td><td>M</td><td>Medium. Bandwidth: at most one title per dwell; cancel on move</td><td>Opening a title is instant</td><td>TV</td></tr><tr><td>Pre-decode last-known Home art while Who's watching is up</td><td>Home settles at 430 ms → about 250 ms with no pops</td><td>S</td><td>Low. Memory: 6 backdrops ≈ 21 MiB of the 64 MiB</td><td>Home appears whole</td><td>TV</td></tr><tr><td>One image loader instead of two</td><td>Frees a second memory cache (Coil default ≈ 25 % of the heap) [inference]</td><td>M</td><td>Medium. Upstream screens use their own</td><td>Fewer re-downloads after big screens</td><td>TV</td></tr><tr><td>OkHttp HTTP cache for Jellyfin JSON</td><td>Small. Jellyfin sends no cache headers, so only conditional revalidation is possible</td><td>S</td><td>Low</td><td>Nothing visible</td><td>TV</td></tr></tbody></table></div>
+
+<h2>5. Backend retrieval</h2>
+<div class="tw"><table class=""><thead><tr><th>Option</th><th>Expected gain (measured basis)</th><th>Effort</th><th>Risk</th><th>What you would see</th><th>Ships in</th></tr></thead><tbody><tr><td>Cache the held-title read in Conductarr (Arr library list, queue, history) for 30–60 s, shared across routes</td><td>Title detail 1.2 s → ≈0.1 s, season 1.1 s → ≈0.1 s, readiness 2.9 s → <1 s [inference from the code path]</td><td>M</td><td>Medium. Freshness of "Ready" after an import; invalidate on Arr webhook (already received)</td><td>Series pages settle in under a second; no late line</td><td>Conductarr release</td></tr><tr><td>Readiness: drop the duplicate held-title read and the per-episode Jellyfin GETs</td><td>The 5 s tail on readiness</td><td>M</td><td>Medium</td><td>"Ready for you" appears with the page</td><td>Conductarr release</td></tr><tr><td>Compress the TV door (Caddy <code>encode zstd gzip</code>)</td><td>Feed 204 KB → ~25–35 KB [inference: JSON typically 6–8×], activity 62 KB → ~8 KB</td><td>XS</td><td>Low</td><td>Discover opens a little faster on Wi-Fi</td><td>Caddy change (server-docs)</td></tr><tr><td>304 before rendering (keep a per-route version, not a hash of the full body)</td><td>Season 304 2.3 s → ms</td><td>M</td><td>Medium</td><td>Nothing visible except speed</td><td>Conductarr release</td></tr><tr><td>Cache the token check (<code>/Users/Me</code>) for 60 s per token</td><td>Removes a Jellyfin round trip from every TV request (~10–40 ms each, 6–10 per title page)</td><td>S</td><td>Low. Revocation lag 60 s</td><td>Nothing visible</td><td>Conductarr release</td></tr><tr><td>Batch display reads (one call for a row of posters)</td><td>≈1 400 display calls/day → a few dozen</td><td>M</td><td>Low</td><td>Coming in and Discover rows fill together</td><td>Conductarr release + TV</td></tr><tr><td>Size the grid posters (<code>fillWidth=256&fillHeight=384&quality=80&format=Webp</code>)</td><td>626 KB → 11 KB per poster (57×); 85 films 53 MB → 1 MB</td><td>XS</td><td>Low</td><td>Movies and Shows fill at once on first visit</td><td>TV</td></tr><tr><td>Ask TMDB for w342 posters, not w780</td><td>131 KB → 41 KB per Discover poster</td><td>XS</td><td>Low. 342 px for a 256 px card</td><td>Discover rows fill sooner</td><td>TV</td></tr><tr><td>Lean episode fields (drop MediaSources/MediaStreams/People from the list; fetch them on Play)</td><td>96.8 KB → 6.5 KB per season, 142 → 26 ms</td><td>S</td><td>Medium. The episode row shows file chips</td><td>Series pages settle sooner</td><td>TV</td></tr><tr><td>Fewer launch calls: UserViews 4–5× and LiveTv/Recordings/Folders 2× per launch</td><td>≈250 ms of serial calls</td><td>S</td><td>Low</td><td>Nothing visible</td><td>TV</td></tr></tbody></table></div>
+
+<h2>6. Kotlin and Compose</h2>
+<div class="tw"><table class=""><thead><tr><th>Option</th><th>Expected gain (measured basis)</th><th>Effort</th><th>Risk</th><th>What you would see</th><th>Ships in</th></tr></thead><tbody><tr><td>Library load re-emits the full list per 200-item page and re-sorts each time (LibraryReadFacade.kt:96, LibraryGridState.kt:99)</td><td>Grid first visit; matters more as the library grows</td><td>S</td><td>Low</td><td>Grid appears in one step</td><td>TV</td></tr><tr><td>Hoist the Regex in titleFallbackBackground / titleAmbientBackground (TitleArtwork.kt:152,167)</td><td>Draw-time cost per card</td><td>XS</td><td>Low</td><td>—</td><td>TV</td></tr><tr><td>Discover reads firstVisibleItemIndex in composition (DiscoverScreen.kt:107) → derivedStateOf</td><td>Fewer recompositions while scrolling Discover (34 of 44 janky frames were UI-thread)</td><td>XS</td><td>Low</td><td>Smoother Discover scroll</td><td>TV</td></tr><tr><td>NavBar label colour read in composition (NavBar.kt:86) → draw-phase</td><td>Tab switch frames</td><td>XS</td><td>Low</td><td>—</td><td>TV</td></tr><tr><td>WolfskinImages.loader() is @Synchronized and called in composition</td><td>Lock on every poster recomposition</td><td>XS</td><td>Low</td><td>—</td><td>TV</td></tr><tr><td>Cut full-screen layers: hero blur (RenderEffect) + two full-screen gradient scrims + ambient</td><td>GPU 14–21 ms/frame is the floor today; pre-blurred tiny art and one combined scrim drawn once</td><td>M</td><td>Medium. Must match the approved frames</td><td>Smoother scroll on Home and Discover</td><td>TV</td></tr><tr><td>Keys and contentType</td><td>Already done everywhere</td><td>—</td><td>—</td><td>—</td><td></td></tr></tbody></table></div>
+
+<h2>7. Baseline profile</h2>
+<p>Today: a hand seed of 6 lines (<code>app/src/optimized/baselineProfiles/baseline-prof.txt</code>), no generator and no Macrobenchmark. The box is at <code>speed</code> only because it was forced with <code>cmd package compile</code>. Every new install starts at <code>verify</code> (interpreted/JIT) until background dexopt runs.</p>
+<div class="tw"><table class="num"><thead><tr><th>State (same box, earlier tv-perf run)</th><th>Cold start</th><th>Home scroll janky / p50 / p90</th><th>Movies grid</th></tr></thead><tbody><tr><td>Opt just installed (verify)</td><td>0.5–1.0 s</td><td>51.4 % / 65 / 117 ms</td><td>—</td></tr><tr><td>Opt after forced AOT (speed)</td><td>0.39–0.44 s</td><td>29.2 % / 38 / 61 ms</td><td>17.7 % / 19 / 36 ms</td></tr></tbody></table></div>
+<p><b>Expected from a recorded profile</b> (Baseline Profile Gradle plugin plus one UiAutomator journey through picker, Home, Discover, the grids, a title and a person page): a fresh install behaves like the AOT row from the first launch. That is roughly −40 % janky frames on Home scroll and up to half a second off cold start, for every build the second mate installs. It does <b>not</b> change steady state on a box already at <code>speed</code>. Effort M: the journey can run on an emulator in the build container; the box itself isn't needed. Risk low.</p>
+
+<h2>8. Recommended plan</h2>
+<ol class="plan">
+<li><b>DNS and launch (TV, S, ~1 day).</b> Persisted DNS answers plus parallel connection warm-up at process start. Show the picker from saved people and check the session in the background. <i>Prove it:</i> 6 cold launches spaced &gt;60 s apart, picker at ≤0.5 s every time (today 1.65 s in half); first cast photos on a new title ≤1 s.</li>
+<li><b>Image sizes (TV, XS, hours).</b> Sized WebP grid posters, TMDB w342, lean episode fields. <i>Prove it:</i> first Movies visit settles ≤400 ms (today 750); tank payload table.</li>
+<li><b>Load states and motion (TV, M, 2–3 days, against your pick on this page).</b> Breathing shaped skeletons, art fade-in for network loads only, reserved late-line slots, staged reveal, hero cross-fade, reduced motion. <i>Prove it:</i> recordings like the ones above, no layout change after first content, gfxinfo janky no worse than today.</li>
+<li><b>Prefetch and memory cache (TV, M, 2 days).</b> Dwell prefetch of title pages, a memory layer over the Conductarr cache, pre-decoded Home art behind the picker. <i>Prove it:</i> title first content ≤100 ms and Home settled ≤250 ms.</li>
+<li><b>Conductarr release (M–L, 2–4 days):</b> held-title cache with webhook invalidation, readiness without duplicate reads or per-episode GETs, 304 before render, token-check cache. <b>Caddy</b>: compress the TV door. <i>Prove it:</i> the route table above for 24 h, with detail, season and readiness p50 ≤200 ms and p95 ≤600 ms, and the feed on the wire ≤40 KB.</li>
+<li><b>Baseline profile (TV build, M, 1–2 days).</b> Recorded journey profile. <i>Prove it:</i> fresh install without a forced compile, Home scroll janky ≤30 %, cold start ≤0.5 s.</li>
+<li><b>Frame cost (TV, M, 2–3 days).</b> The Compose fixes in section 6 and fewer full-screen layers. <i>Prove it:</i> Home and grid scroll janky ≤20 %, GPU p90 ≤16 ms in framestats.</li>
+</ol>
+<p><b>Total:</b> about 2 weeks of TV work and 3–4 days for a Conductarr release. Steps 1–2 alone remove the two waits you can feel today (the launch spinner and grids filling slowly), in about a day and a half.</p>
+<p class="muted small">A box-side alternative to step 1's DNS part: switch the box's Private DNS from <code>dns.adguard.com</code> to Automatic, so it uses the LAN resolver (136–160 ms uncached, 0 ms cached). That changes the whole box, not just Wolfskin, so it's your call; the TV-side fix works either way.</p>
+<h2>9. Your picks (all of them on one page)</h2>
+<p class="muted">Six decisions. Each locks the moment you send it and the build lanes start on it. Nothing here touches the TV while you are playing.</p>
+<form class="decision" data-decision-key="tv-motion-speed-direction" data-lavish-question="tv-motion-speed-direction"><h3>1. Load-state and motion direction</h3>
+<p class="muted">Decides plan step 3 (skeletons and motion). The prototypes above show each part.</p>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="recommended" data-choice-key="tv-motion-speed-direction"> <b>A · As recommended</b> <span class="rec">recommended</span><span class="t">Breathing shaped skeletons, art fades in only when it came from the network, reserved space for late lines, hero cross-fade, reduced-motion safe.</span></label>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="flat" data-choice-key="tv-motion-speed-direction"> <b>B · Same, but flat skeletons</b><span class="t">Still card-shaped, no pulse. The calmest option.</span></label>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="shimmer" data-choice-key="tv-motion-speed-direction"> <b>C · Same, but shimmer skeletons</b><span class="t">A light sweep across the tiles. Costs GPU on this box every frame while loading.</span></label>
+<label class="opt"><input required type="radio" name="tv-motion-speed-direction" value="changes" data-choice-key="tv-motion-speed-direction"> <b>D · Different</b><span class="t">Say what in the note: a prototype to change, a speed, an option to drop.</span></label>
+<textarea aria-label="Notes for 1. Load-state and motion direction" name="tv-motion-speed-direction-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-speed-quick-fixes" data-lavish-question="tv-speed-quick-fixes"><h3>2. The two quick speed fixes (about a day and a half, TV only)</h3>
+<p class="muted">(a) DNS cache with stale-serve plus a picker painted from saved people, so the launch spinner goes away; (b) sized WebP grid posters, smaller TMDB art, lean episode fields, so grids fill fast. Both ship in the next TV build.</p>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="go" data-choice-key="tv-speed-quick-fixes"> <b>Go, start now</b> <span class="rec">recommended</span><span class="t">Two small lanes, merged and staged for the next install.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="a-only" data-choice-key="tv-speed-quick-fixes"> <b>Only (a), the launch spinner</b><span class="t">Leave the image sizing for later.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="b-only" data-choice-key="tv-speed-quick-fixes"> <b>Only (b), the image sizes</b><span class="t">Leave the DNS cache for later.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-quick-fixes" value="later" data-choice-key="tv-speed-quick-fixes"> <b>Not now</b><span class="t">Skip until after the motion work.</span></label>
+<textarea aria-label="Notes for 2. The two quick speed fixes (about a day and a half, TV only)" name="tv-speed-quick-fixes-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-box-dns" data-lavish-question="tv-box-dns"><h3>3. Change the box Private DNS (your call, system setting)</h3>
+<p class="muted">Today the box uses dns.adguard.com: an uncached lookup costs 450 to 1350 ms. Automatic uses the LAN resolver (136 to 160 ms uncached, 0 ms cached). It changes DNS for the whole box, not just Wolfskin. I do it with ADB only when the TV is free and you say so; the TV-side fix in 2(a) works either way.</p>
+<label class="opt"><input required type="radio" name="tv-box-dns" value="leave" data-choice-key="tv-box-dns"> <b>Leave it as it is</b> <span class="rec">recommended</span><span class="t">The TV-side cache covers the launch spinner.</span></label>
+<label class="opt"><input required type="radio" name="tv-box-dns" value="automatic" data-choice-key="tv-box-dns"> <b>Switch to Automatic</b><span class="t">I change it when you free the TV and show before and after timings.</span></label>
+<label class="opt"><input required type="radio" name="tv-box-dns" value="ask" data-choice-key="tv-box-dns"> <b>Ask me when the TV is free</b><span class="t">Decide then.</span></label>
+<textarea aria-label="Notes for 3. Change the box Private DNS (your call, system setting)" name="tv-box-dns-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-speed-later-steps" data-lavish-question="tv-speed-later-steps"><h3>4. Later plan steps to queue (TV, after the build above)</h3>
+<p class="muted">Prefetch and memory cache (title pages, 2 days); recorded Baseline Profile (1 to 2 days); frame cost and Compose fixes (2 to 3 days). Each has its own proof target in section 8.</p>
+<label class="opt"><input required type="radio" name="tv-speed-later-steps" value="all" data-choice-key="tv-speed-later-steps"> <b>Queue all three in that order</b> <span class="rec">recommended</span><span class="t">They follow the motion work, one lane at a time.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-later-steps" value="prefetch" data-choice-key="tv-speed-later-steps"> <b>Only prefetch and memory cache</b><span class="t">Skip the profile and frame work for now.</span></label>
+<label class="opt"><input required type="radio" name="tv-speed-later-steps" value="none" data-choice-key="tv-speed-later-steps"> <b>None yet</b><span class="t">Revisit after you have seen the motion build on the TV.</span></label>
+<textarea aria-label="Notes for 4. Later plan steps to queue (TV, after the build above)" name="tv-speed-later-steps-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-conductarr-retrieval" data-lavish-question="tv-conductarr-retrieval"><h3>5. Conductarr title-read speed-up (needs a Conductarr release)</h3>
+<p class="muted">Held-title cache with Arr webhook invalidation, readiness without duplicate reads or per-episode calls, 304 before render, token-check cache, compression on the TV door. 3 to 4 days, plus a release and a server-docs update. Title pages are slow because of this (readiness p50 2.9 s).</p>
+<label class="opt"><input required type="radio" name="tv-conductarr-retrieval" value="scope" data-choice-key="tv-conductarr-retrieval"> <b>Scope it first, then I decide</b> <span class="rec">recommended</span><span class="t">A short scout writes the exact change list and risks for a release; nothing ships.</span></label>
+<label class="opt"><input required type="radio" name="tv-conductarr-retrieval" value="go" data-choice-key="tv-conductarr-retrieval"> <b>Go: build it and release it</b><span class="t">You are giving the word to build and release Conductarr when it is green.</span></label>
+<label class="opt"><input required type="radio" name="tv-conductarr-retrieval" value="later" data-choice-key="tv-conductarr-retrieval"> <b>Not now</b><span class="t">Skip until after the TV-side wins.</span></label>
+<textarea aria-label="Notes for 5. Conductarr title-read speed-up (needs a Conductarr release)" name="tv-conductarr-retrieval-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<form class="decision" data-decision-key="tv-build-order" data-lavish-question="tv-build-order"><h3>6. When should these land on the TV?</h3>
+<p class="muted">You said you will not be using the TV during this session.</p>
+<label class="opt"><input required type="radio" name="tv-build-order" value="as-ready" data-choice-key="tv-build-order"> <b>Bundle with the next install</b> <span class="rec">recommended</span><span class="t">The speed fixes and any approved motion work join the staged build; I install when you say the TV is free.</span></label>
+<label class="opt"><input required type="radio" name="tv-build-order" value="separate" data-choice-key="tv-build-order"> <b>Install the speed fixes on their own first</b><span class="t">A quick build for steps 2(a) and 2(b) only, installed as soon as it is ready if you free the TV.</span></label>
+<textarea aria-label="Notes for 6. When should these land on the TV?" name="tv-build-order-note" placeholder="Optional note"></textarea><p><button type="submit">Queue this answer</button> <span role="status" aria-live="polite"></span></p></form>
+<p class="muted small">Method, raw numbers and files: <code>data/tv-spike-motion-speed/report.md</code>. Nothing was changed in the app or on the server. The box was left on the Movies tab.</p>
+<script>
+// Wolfskin TV motion prototypes. One clock per stage drives Web Animations; "box rate" quantises the clock
+// to the measured frame time on the Xiaomi box (p50 40 ms while moving, data/tv-spike-motion-speed/raw/gfx-*),
+// so the same motion can be watched at 60 fps and at the rate the box actually draws today.
+(() => {
+const A = 'tv-motion-speed/';
+const BOX_MS = 40;
+const EASE = 'cubic-bezier(.25,.1,.25,1)', OUT = 'cubic-bezier(.33,1,.68,1)', INOUT = 'cubic-bezier(.65,0,.35,1)';
+const POSTERS = [
+  ['American Gangster', '2007 · 2h 36m'], ['Annie Hall', '1977 · 1h 33m'], ['Apocalypse Now', '1979 · 2h 27m'],
+  ['Arrival', '2016 · 1h 56m'], ['Avatar: The Last Airbender', '2026 · 1h 52m'], ['Bohemian Rhapsody', '2018 · 2h 15m'],
+  ['Braveheart', '1995 · 2h 58m'], ['Citizen Kane', '1941 · 1h 59m'], ['Spirited Away', '2001 · 2h 5m'],
+  ['12 Years a Slave', '2013 · 2h 14m'], ['A Bronx Tale', '1993 · 2h 1m'], ['All the Money in the World', '2017 · 2h 13m'],
+];
+const poster = i => `${A}p${i + 1}.webp`;
+const html = (s) => { const t = document.createElement('template'); t.innerHTML = s.trim(); return t.content.firstChild; };
+
+function nav(cur, focus) {
+  const items = ['Home', 'Discover', 'Movies', 'Shows'];
+  return `<div class="nav"><span class="wm">Wolf<b>skin</b></span>${items.map((n, i) => `<span class="ni ${i === cur ? 'cur' : ''} ${i === focus ? 'f' : ''}">${n}</span>`).join('')}<span class="nsp"></span><span class="av">S</span></div>`;
+}
+function rate(rt, pc) { return `<span class="rate"><i></i>${rt}</span><span class="rate"><i class="pc"></i>${pc}</span>`; }
+function heroCopy(o) {
+  return `<div class="copy" style="bottom:${o.bottom || 330}px"><div class="kicker">${o.kicker}</div><div class="ht">${o.title}</div><div class="hm">${o.meta}</div>${o.ov ? `<div class="ho">${o.ov}</div>` : ''}<div class="btns">${o.btns}</div></div>`;
+}
+
+// ---------- scenes: build(stage, T, v) where v is the selected variant ----------
+const SCENES = {
+  // 1. launch -> Who's watching
+  launch: { len: 1400, variants: { after: 'After: people from the saved list' }, build(s, T) {
+    s.append(html(`<div class="abs" style="inset:0;background:url(${A}launcher.webp) center/cover"></div>`));
+    const bg = s.appendChild(html(`<div class="abs" style="inset:0;background:#07070a"></div>`));
+    T.a(bg, [{ opacity: 0 }, { opacity: 1 }], 0, 160);
+    const pk = s.appendChild(html(`<div class="abs" style="inset:0"><div class="abs" style="left:96px;top:60px;font-size:36px;font-weight:800">Wolf<b style="color:var(--accent)">skin</b></div><div class="pk">Who’s watching?</div>
+      ${[['J', '#64c3ff', 'justin', 540], ['M', '#ffa47a', 'mindel', 850], ['S', '#9be38f', 'shared', 1160]].map(([l, c, n, x]) => `<div class="person ${n === 'shared' ? 'ring' : ''}" style="left:${x}px;background:${c}">${l}</div><div class="pname" style="left:${x}px">${n}</div>`).join('')}</div>`));
+    T.a(pk, [{ opacity: 0 }, { opacity: 1 }], 450, 160);
+  } },
+
+  // 2. picker -> Home
+  home: { len: 1100, variants: { after: 'After: last Home painted from disk, art pre-decoded' }, build(s, T) {
+    const home = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="amb" style="background-image:url(${A}b2t.webp);filter:blur(30px);transform:scale(1.1)"></div>
+      <div class="bd" style="background-image:url(${A}b2.webp)"></div><div class="scrim"></div>
+      ${heroCopy({ kicker: '▸ Continue watching', title: 'Arrival', meta: '2016 · 1h 56m · 38 min left ' + rate('94%', '82%'), ov: 'Taking place after alien crafts land around the world, an expert linguist is recruited by the military to determine whether they come in peace or are a threat.', btns: '<span class="btn pri f">▶ Resume</span><span class="btn">ⓘ Details</span>', bottom: 340 })}
+      <div class="sh" style="top:780px">Next up</div>
+      ${[3, 4, 1, 2].map((b, i) => `<div class="card tile" style="left:${96 + i * 440}px;top:850px"><div class="img" style="background-image:url(${A}b${b}.webp)"></div><div class="cap">${['American Gangster', 'Bohemian Rhapsody', 'Apocalypse Now', 'Arrival'][i]}</div></div>`).join('')}
+      ${nav(0)}</div>`));
+    const picker = s.appendChild(html(`<div class="abs" style="inset:0;background:#07070a;z-index:10"><div class="pk">Who’s watching?</div>
+      ${[['J', '#64c3ff', 'justin', 540], ['M', '#ffa47a', 'mindel', 850], ['S', '#9be38f', 'shared', 1160]].map(([l, c, n, x]) => `<div class="person ${n === 'shared' ? 'ring' : ''}" style="left:${x}px;background:${c}">${l}</div><div class="pname" style="left:${x}px">${n}</div>`).join('')}</div>`));
+    T.a(picker, [{ opacity: 1 }, { opacity: 0 }], 0, 140);
+    T.a(home.querySelector('.amb'), [{ opacity: 0 }, { opacity: 1 }], 40, 120);
+    T.a(home.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 120, 220, INOUT);
+    T.a(home.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 60, 180, OUT);
+    T.a(home.querySelector('.sh'), [{ opacity: 0 }, { opacity: 1 }], 120, 160);
+    home.querySelectorAll('.card').forEach((c, i) => {
+      T.a(c, [{ opacity: 0, transform: 'translateY(24px)' }, { opacity: 1, transform: 'none' }], 140 + i * 40, 180, OUT);
+    });
+  } },
+
+  // 3. skeleton styles on a poster grid
+  skeleton: { len: 2200, variants: { breathe: 'Breathe (pick)', flat: 'Flat blocks (today)', shimmer: 'Shimmer sweep', spinner: 'Spinner (today, launch)' }, build(s, T, v) {
+    s.append(html(nav(2)));
+    s.append(html(`<div class="abs" style="left:96px;top:150px;font-size:72px;font-weight:800;letter-spacing:-.02em">Movies <span style="font-size:30px;font-weight:500;color:var(--muted)">85 films</span></div>`));
+    const cells = [];
+    for (let r = 0; r < 2; r++) for (let c = 0; c < 6; c++) cells.push([96 + c * 296, 330 + r * 460, r * 6 + c]);
+    if (v === 'spinner') { const sp = s.appendChild(html('<div class="spin"></div>')); T.a(sp, [{ opacity: 1 }, { opacity: 0 }], 900, 120); }
+    cells.forEach(([x, y, i]) => {
+      if (v !== 'spinner') {
+        const sk = s.appendChild(html(`<div class="card poster sk ${v === 'breathe' ? 'breathe' : v === 'shimmer' ? 'shim' : ''}" style="left:${x}px;top:${y}px;${v === 'breathe' ? `animation-delay:${(i % 6) * 90}ms` : ''}"></div>`));
+        T.a(sk, [{ opacity: 1 }, { opacity: 0 }], 900 + i * 25, 160);
+      }
+      const c = s.appendChild(html(`<div class="card poster" style="left:${x}px;top:${y}px;background-image:url(${poster(i)})"></div>`));
+      T.a(c, [{ opacity: 0 }, { opacity: 1 }], 900 + i * 25, 160);
+    });
+  } },
+
+  // 4. tab switch: Home -> Discover, rows reveal
+  tab: { len: 1100, variants: { after: 'After: last Discover painted, rows rise, art fades' }, build(s, T) {
+    const disc = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="bd" style="background-image:url(${A}b4.webp)"></div><div class="scrim"></div>
+      ${heroCopy({ kicker: '✦ For you', title: 'Bohemian Rhapsody', meta: 'Movie · 2018 · Drama, Music ' + rate('60%', '85%'), ov: 'Singer Freddie Mercury, guitarist Brian May, drummer Roger Taylor and bass guitarist John Deacon take the music world by storm.', btns: '<span class="btn">ⓘ Details</span>', bottom: 520 })}
+      <div class="sh" style="top:600px">Movies for you</div>
+      ${[6, 7, 8, 9, 10, 11].map((p, i) => `<div class="card poster" style="left:${96 + i * 296}px;top:670px"><div class="img" style="background-image:url(${poster(p)})"></div></div>`).join('')}
+      </div>`));
+    const home = s.appendChild(html(`<div class="abs" style="inset:0"><div class="bd" style="background-image:url(${A}b2.webp)"></div><div class="scrim"></div>
+      ${heroCopy({ kicker: '▸ Continue watching', title: 'Arrival', meta: '2016 · 1h 56m · 38 min left', ov: 'Taking place after alien crafts land around the world, an expert linguist is recruited by the military.', btns: '<span class="btn pri">▶ Resume</span><span class="btn">ⓘ Details</span>', bottom: 340 })}</div>`));
+    const n = s.appendChild(html(nav(1, 1)));
+    T.a(home, [{ opacity: 1 }, { opacity: 0 }], 0, 200, EASE);
+    T.a(disc.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 0, 240, INOUT);
+    T.a(disc.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 80, 180, OUT);
+    T.a(disc.querySelector('.sh'), [{ opacity: 0 }, { opacity: 1 }], 140, 160);
+    disc.querySelectorAll('.card').forEach((c, i) => T.a(c, [{ opacity: 0, transform: 'translateY(24px)' }, { opacity: 1, transform: 'none' }], 160 + i * 30, 180, OUT));
+  } },
+
+  // 5. title page entry from the Movies grid
+  title: { len: 1600, variants: { after: 'After: what the card knew, at once' }, build(s, T) {
+    const page = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="amb" style="background-image:url(${poster(2)});filter:blur(60px) saturate(1.2) brightness(.55);transform:scale(1.2)"></div>
+      <div class="bd" style="background-image:url(${A}b1.webp)"></div><div class="scrim"></div>
+      <div class="copy" style="bottom:360px"><div class="kicker">✓ Movie · In your library</div><div class="ht">Apocalypse Now</div>
+        <div class="hm">1979 · 2h 27m ${rate('91%', '94%')} <span class="late" style="color:var(--muted)">Drama, War</span></div>
+        <div class="ho late2" style="min-height:76px">At the height of the Vietnam war, Captain Benjamin Willard is sent on a dangerous mission that, officially, “does not exist, nor will it ever exist.”</div>
+        <div class="btns"><span class="btn pri f">▶ Play</span><span class="btn">⋯</span><span class="btn">Add for someone</span></div></div>
+      <div class="sh" style="top:830px">Cast</div>
+      ${[0, 1, 2, 3, 4, 5, 6].map(i => `<div class="circle" style="left:${96 + i * 244}px;top:900px"><span class="sk breathe abs" style="inset:0;border-radius:50%;animation-delay:${i * 90}ms"></span><div class="img" style="background-image:url(${A}c${i + 1}.webp)"></div></div>`).join('')}
+      ${nav(2)}</div>`));
+    const grid = s.appendChild(html(`<div class="abs" style="inset:0;background:#07070a">${nav(2)}
+      <div class="abs" style="left:96px;top:150px;font-size:72px;font-weight:800;letter-spacing:-.02em">Movies <span style="font-size:30px;font-weight:500;color:var(--muted)">85 films</span></div>
+      ${[0, 1, 2, 3, 4, 5].map(i => `<div class="card poster ${i === 2 ? 'ring' : ''}" style="left:${96 + i * 296}px;top:330px;background-image:url(${poster(i)});${i === 2 ? 'transform:scale(1.08)' : ''}"></div>`).join('')}
+      ${[6, 7, 8, 9, 10, 11].map((p, i) => `<div class="card poster" style="left:${96 + i * 296}px;top:790px;background-image:url(${poster(p)})"></div>`).join('')}</div>`));
+    T.a(grid, [{ opacity: 1 }, { opacity: 0 }], 0, 160);
+    T.a(page.querySelector('.amb'), [{ opacity: 0 }, { opacity: 1 }], 0, 160);
+    T.a(page.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 40, 180, OUT);
+    T.a(page.querySelector('.late'), [{ opacity: 0 }, { opacity: 1 }], 430, 160);
+    T.a(page.querySelector('.late2'), [{ opacity: 0 }, { opacity: 1 }], 430, 160);
+    T.a(page.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 470, 280, INOUT);
+    T.a(page.querySelector('.sh'), [{ opacity: 0 }, { opacity: 1 }], 120, 160);
+    page.querySelectorAll('.circle').forEach((c, i) => {
+      T.a(c, [{ opacity: 0, transform: 'translateY(20px)' }, { opacity: 1, transform: 'none' }], 140 + i * 30, 180, OUT);
+      T.a(c.querySelector('.img'), [{ opacity: 0 }, { opacity: 1 }], 620 + i * 40, 160);
+    });
+  } },
+
+  // 6. series title: late readiness line
+  series: { len: 4000, variants: { tv: 'TV-only: slot reserved, fades in at 3.4 s', conductarr: 'With the Conductarr cache: arrives ≈0.4 s' }, build(s, T, v) {
+    const late = v === 'conductarr' ? 380 : 3400;
+    const page = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="amb" style="background-image:url(${A}s1t.webp);filter:blur(30px);transform:scale(1.1)"></div>
+      <div class="bd" style="background-image:url(${A}s1.webp)"></div><div class="scrim"></div>
+      <div class="copy" style="bottom:430px"><div class="kicker">✓ Series · In your library · Watched</div><div class="ht">Adults</div>
+        <div class="hm">2025 · 2 seasons · Comedy <span class="lr">${rate('88%', '93%')}</span></div>
+        <div class="hm lr2" style="color:var(--ok,#9be38f);font-size:26px">✓ Ready for you · by Mindel</div>
+        <div class="ho" style="min-height:76px">A group of twenty-somethings in New York trying to be good people, despite being neither “good” nor “people” yet.</div>
+        <div class="btns"><span class="btn pri f">▶ Play S1 E1</span><span class="btn">⋯</span><span class="btn">Seasons</span></div></div>
+      <div class="abs" style="left:96px;top:790px;display:flex;gap:16px"><span class="btn" style="height:56px;font-size:24px;background:var(--accent-soft,#2a1f3d)">Season 1</span><span class="btn" style="height:56px;font-size:24px">Season 2</span></div>
+      ${[0, 1, 2, 3].map(i => `<div class="card tile sk breathe" style="left:${96 + i * 440}px;top:880px;animation-delay:${i * 90}ms"><div class="img" style="background-image:url(${A}${i % 2 ? 's1' : 'e1'}.webp)"></div></div>`).join('')}
+      ${nav(3)}</div>`));
+    T.a(page.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 0, 180, OUT);
+    T.a(page.querySelector('.amb'), [{ opacity: 0 }, { opacity: 1 }], 0, 160);
+    T.a(page.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 620, 280, INOUT);
+    T.a(page.querySelector('.lr'), [{ opacity: 0 }, { opacity: 1 }], late, 200);
+    T.a(page.querySelector('.lr2'), [{ opacity: 0 }, { opacity: 1 }], late, 200);
+    page.querySelectorAll('.card .img').forEach((c, i) => T.a(c, [{ opacity: 0 }, { opacity: 1 }], 700 + i * 40, 160));
+  } },
+
+  // 7. focus move along a row
+  focus: { len: 3000, variants: { after: 'Proposed: 180 ms ease-out, caption rises', today: 'Today: 140 ms, caption cross-fade' }, build(s, T, v) {
+    s.append(html(nav(2)));
+    s.append(html(`<div class="sh" style="top:250px">Movies for you</div>`));
+    const dur = v === 'today' ? 140 : 180, ease = v === 'today' ? EASE : OUT;
+    const cards = [0, 1, 2, 3, 4, 5].map(i => s.appendChild(html(`<div class="card poster" style="left:${96 + i * 296}px;top:330px;background-image:url(${poster(i + 6)})"></div>`)));
+    const caps = [0, 1, 2, 3, 4, 5].map(i => s.appendChild(html(`<div class="abs" style="left:${96 + i * 296}px;top:740px;width:520px"><div style="font-size:30px;font-weight:700">${POSTERS[i + 6][0]}</div><div style="font-size:26px;color:var(--muted)">${POSTERS[i + 6][1]}</div></div>`)));
+    const step = 600;
+    cards.forEach((c, i) => {
+      const on = i * step, off = (i + 1) * step;
+      const up = [{ transform: 'scale(1)', boxShadow: '0 0 0 0 transparent' }, { transform: 'scale(1.08)', boxShadow: '0 0 0 2px oklch(78% 0.14 305), inset 0 0 0 2px oklch(78% 0.14 305), 0 18px 40px rgb(0 0 0/.55)' }];
+      if (i > 0) T.a(c, up, on, dur, ease); else T.a(c, [up[1], up[1]], 0, 1);
+      if (i < 4) T.a(c, [up[1], up[0]], off, dur, ease);
+      const capIn = v === 'today' ? [{ opacity: 0 }, { opacity: 1 }] : [{ opacity: 0, transform: 'translateY(10px)' }, { opacity: 1, transform: 'none' }];
+      if (i > 0) T.a(caps[i], capIn, on + (v === 'today' ? 0 : 60), dur, ease); else T.a(caps[i], [{ opacity: 1 }, { opacity: 1 }], 0, 1);
+      if (i < 4) T.a(caps[i], [{ opacity: 1 }, { opacity: 0 }], off, v === 'today' ? dur : 100, ease);
+      if (i > 4) caps[i].style.opacity = 0;
+    });
+  } },
+
+  // 8. hero crossfade (Discover hero advances)
+  hero: { len: 2600, variants: { after: 'Proposed: 320 ms backdrop cross-fade, copy hand-off', today: 'Today: cut' }, build(s, T, v) {
+    const mk = (b, t, meta, ov) => s.appendChild(html(`<div class="abs hero" style="inset:0"><div class="bd" style="background-image:url(${A}b${b}.webp)"></div><div class="scrim"></div>${heroCopy({ kicker: '✦ For you', title: t, meta, ov, btns: '<span class="btn">ⓘ Details</span>', bottom: 520 })}</div>`));
+    const b = mk(2, 'Arrival', 'Movie · 2016 · Drama, Sci-Fi ' + rate('94%', '82%'), 'Taking place after alien crafts land around the world, an expert linguist is recruited by the military to determine whether they come in peace or are a threat.');
+    const a = mk(1, 'Apocalypse Now', 'Movie · 1979 · Drama, War ' + rate('91%', '94%'), 'At the height of the Vietnam war, Captain Benjamin Willard is sent on a dangerous mission that, officially, does not exist.');
+    s.append(html(nav(1)));
+    s.append(html(`<div class="abs" style="left:96px;top:600px;font-size:34px;font-weight:700">Movies for you</div>`));
+    [0, 1, 2, 3, 4, 5].map(i => s.append(html(`<div class="card poster" style="left:${96 + i * 296}px;top:670px;background-image:url(${poster(i)})"></div>`)));
+    const at = 900;
+    if (v === 'today') { T.a(a, [{ opacity: 1 }, { opacity: 0 }], at, 1); return; }
+    T.a(a.querySelector('.copy'), [{ opacity: 1 }, { opacity: 0 }], at, 120, EASE);
+    T.a(a.querySelector('.bd'), [{ opacity: 1 }, { opacity: 0 }], at, 320, INOUT);
+    T.a(a.querySelector('.scrim'), [{ opacity: 1 }, { opacity: 1 }], at, 320);
+    T.a(a, [{ opacity: 1 }, { opacity: 0 }], at + 300, 20);
+    T.a(b.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(14px)' }, { opacity: 1, transform: 'none' }], at + 140, 200, OUT);
+  } },
+};
+
+// ---------- player ----------
+const players = [];
+let boxRate = false;
+function makePlayer(box) {
+  const name = box.dataset.scene, sc = SCENES[name];
+  const lead = +(box.dataset.lead || 300);
+  let variant = box.dataset.variant || Object.keys(sc.variants)[0];
+  let anims = [], t0 = 0, raf = 0, stage, label;
+  const total = () => lead + sc.len + 1400;
+  function build() {
+    box.querySelectorAll('.stage').forEach(e => e.remove());
+    stage = html('<div class="stage"></div>'); box.appendChild(stage);
+    label = stage.appendChild(html('<div class="tl">0 ms</div>'));
+    anims = [];
+    const rm = document.body.classList.contains('rm');
+    const seen = new WeakSet();
+    const T = { a(el, kf, start, dur, easing = EASE, opt = {}) {
+      let k = kf, d = dur;
+      if (rm) { k = kf.map(f => { const g = { ...f }; delete g.transform; return g; }); d = Math.min(dur, 100); }
+      // only an element's first animation fills backwards; later ones on the same element must not override it while waiting
+      const fill = seen.has(el) ? 'forwards' : 'both'; seen.add(el);
+      const an = el.animate(k, { delay: lead + start, duration: Math.max(1, d), easing, fill, ...opt });
+      an.pause(); anims.push(an);
+    } };
+    sc.build(stage, T, variant);
+    fit();
+  }
+  function fit() { if (stage) stage.style.transform = `scale(${box.clientWidth / 1920})`; }
+  function tick(now) {
+    let t = now - t0;
+    if (t > total()) { t0 = now; t = 0; }
+    const q = boxRate ? Math.floor(t / BOX_MS) * BOX_MS : t;
+    for (const an of anims) an.currentTime = q;
+    label.textContent = `${Math.max(0, Math.round(q - lead))} ms`;
+    raf = requestAnimationFrame(tick);
+  }
+  function start() { cancelAnimationFrame(raf); build(); t0 = performance.now(); raf = requestAnimationFrame(tick); }
+  function stop() { cancelAnimationFrame(raf); raf = 0; }
+  new ResizeObserver(fit).observe(box);
+  new IntersectionObserver(es => es.forEach(e => { if (e.isIntersecting) { if (!raf) start(); } else stop(); }), { rootMargin: '100px' }).observe(box);
+  const p = { box, start, setVariant(v) { variant = v; start(); }, rebuild: start };
+  players.push(p);
+  return p;
+}
+
+document.querySelectorAll('.sbox[data-scene]').forEach(makePlayer);
+document.querySelectorAll('[data-variants]').forEach(bar => {
+  const p = players.find(x => x.box.id === bar.dataset.variants);
+  const sc = SCENES[p.box.dataset.scene];
+  Object.entries(sc.variants).forEach(([k, label], i) => {
+    const b = document.createElement('button'); b.type = 'button'; b.className = 'tab' + (i === 0 ? ' on' : ''); b.textContent = label;
+    b.onclick = () => { bar.querySelectorAll('.tab').forEach(x => x.classList.toggle('on', x === b)); p.setVariant(k); };
+    bar.appendChild(b);
+  });
+});
+document.querySelectorAll('button.replay').forEach(b => b.addEventListener('click', () => {
+  const pair = b.closest('.pair');
+  pair.querySelectorAll('video').forEach(v => { v.currentTime = 0; v.play().catch(() => {}); });
+  players.filter(p => pair.contains(p.box)).forEach(p => p.start());
+}));
+const rate_ = document.getElementById('boxrate');
+if (rate_) rate_.addEventListener('change', () => { boxRate = rate_.checked; });
+const rm = document.getElementById('rm');
+if (rm) {
+  if (matchMedia('(prefers-reduced-motion: reduce)').matches) { rm.checked = true; document.body.classList.add('rm'); }
+  rm.addEventListener('change', () => { document.body.classList.toggle('rm', rm.checked); players.forEach(p => p.rebuild()); });
+}
+document.body.dataset.ready = '1';
+})();
+
+document.querySelectorAll('form.decision').forEach(form=>{form.addEventListener('submit',event=>{event.preventDefault();const key=form.dataset.lavishQuestion;const answer=new FormData(form).get(key);const status=form.querySelector('[role=status]');if(!answer){status.textContent='Pick an option first.';return;}if(!window.lavish||!window.lavish.queuePrompt){status.textContent='Open this page in the live review board to queue an answer.';return;}const note=form.querySelector('textarea').value.trim();const label=form.querySelector('h3').textContent;window.lavish.queuePrompt(label+': '+answer+(note?'\n'+note:''),{tag:'choice',text:label+': '+answer,element:form,queueKey:key,data:{question:key,answer:answer,note:note}});status.textContent='Queued. Press Send to Agent in the review toolbar.';});});
+</script></main></body></html>

data/tv-v2/motion-2026-11-06/proto.css

@@ -0,0 +1,72 @@
+/* Prototype stages: 1920x1080 CSS px, approved tokens from data/tv-v2/focus-2026-11-06 (colors, type, ring, card sizes at Level 2 spacing). */
+.sbox{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:8px;border:1px solid var(--line);background:#000}
+.sbox video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
+.stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;overflow:hidden;background:#07070a;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;color:#f4f4f6;font-size:28px;line-height:1.3;
+ --bg:#07070a;--surface:#13131a;--surface2:#1b1b25;--surface3:#252532;--muted:rgb(244 244 246/.74);--dim:rgb(244 244 246/.56);--accent:oklch(78% 0.14 305);--accent-text:oklch(88% 0.08 305)}
+.stage *{box-sizing:border-box}
+.stage .abs{position:absolute}
+/* nav */
+.stage .nav{position:absolute;left:0;top:0;width:1920px;height:150px;z-index:5;display:flex;align-items:center;gap:12px;padding:44px 96px 0}
+.stage .wm{font-size:36px;font-weight:800;letter-spacing:-.02em;margin-right:40px}.stage .wm b{color:var(--accent)}
+.stage .ni{height:64px;padding:0 26px;border-radius:32px;display:inline-flex;align-items:center;font-size:30px;font-weight:600;color:var(--muted);position:relative}
+.stage .ni.cur{color:#f4f4f6}.stage .ni.cur::after{content:"";position:absolute;left:26px;right:26px;bottom:4px;height:4px;border-radius:2px;background:var(--accent)}
+.stage .ni.f{background:#f4f4f6;color:#0b0b10}.stage .ni.f::after{display:none}
+.stage .nsp{flex:1}.stage .av{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#0b0b10;font-size:30px;background:#9be38f}
+/* hero */
+.stage .amb{position:absolute;inset:0;background-size:cover;background-position:center;image-rendering:auto}
+.stage .bd{position:absolute;inset:0;background-size:cover;background-position:center}
+.stage .scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgb(7 7 10/.92) 0%,rgb(7 7 10/.55) 42%,rgb(7 7 10/0) 70%),linear-gradient(0deg,#07070a 0%,rgb(7 7 10/.6) 26%,rgb(7 7 10/0) 48%)}
+.stage .copy{position:absolute;left:96px;width:1000px}
+.stage .kicker{font-size:26px;font-weight:650;color:var(--accent-text);margin-bottom:10px}
+.stage .ht{font-size:84px;line-height:1.02;font-weight:800;letter-spacing:-.02em;margin:0 0 16px}
+.stage .hm{font-size:28px;color:var(--muted);margin-bottom:14px;min-height:38px;display:flex;gap:22px;align-items:center}
+.stage .ho{font-size:28px;color:var(--muted);margin:0 0 30px;max-width:960px}
+.stage .btns{display:flex;gap:20px}
+.stage .btn{height:76px;padding:0 38px;border-radius:38px;font-size:28px;font-weight:700;display:inline-flex;align-items:center;background:rgb(255 255 255/.14)}
+.stage .btn.pri{background:#f4f4f6;color:#0b0b10}
+.stage .btn.f{box-shadow:0 0 0 2px var(--accent),inset 0 0 0 2px var(--accent);transform:scale(1.05)}
+.stage .rate{display:inline-flex;gap:10px;align-items:center;font-weight:700;color:#f4f4f6}.stage .rate i{width:24px;height:24px;border-radius:50%;background:#e2483a;display:inline-block}
+.stage .rate i.pc{background:#f5c518;border-radius:4px}
+.stage .slot{display:inline-block;height:30px;border-radius:15px;background:rgb(255 255 255/.10)}
+/* rows + cards */
+.stage .sh{position:absolute;left:96px;font-size:34px;font-weight:700}
+.stage .card{position:absolute;border-radius:16px;overflow:hidden;background:var(--surface);background-size:cover;background-position:center}
+.stage .card.poster{width:256px;height:384px}.stage .card.tile{width:400px;height:225px}
+.stage .card .img{position:absolute;inset:0;background-size:cover;background-position:center}
+.stage .card .cap{position:absolute;left:0;right:0;bottom:0;padding:14px 18px;background:linear-gradient(rgb(7 7 10/0),rgb(7 7 10/.92));font-size:26px;font-weight:700}
+.stage .ring{box-shadow:0 0 0 2px var(--accent),inset 0 0 0 2px var(--accent),0 18px 40px rgb(0 0 0/.55)}
+.stage .circle{position:absolute;width:200px;height:200px;border-radius:50%;overflow:hidden;background:var(--surface2);display:grid;place-items:center;font-size:44px;font-weight:800;color:var(--dim)}
+.stage .circle .img{position:absolute;inset:0;background-size:cover;background-position:center}
+.stage .bar{position:absolute;height:28px;border-radius:14px;background:var(--surface2)}
+.stage .spin{position:absolute;left:940px;top:520px;width:40px;height:40px;border-radius:50%;border:4px solid rgb(155 120 255/.25);border-top-color:oklch(65% 0.2 300);animation:spin .8s linear infinite}
+/* picker */
+.stage .pk{position:absolute;top:290px;left:0;width:1920px;text-align:center;font-size:72px;font-weight:800;letter-spacing:-.02em}
+.stage .person{position:absolute;top:426px;width:220px;height:220px;border-radius:50%;display:grid;place-items:center;font-size:110px;font-weight:800;color:#0b0b10}
+.stage .pname{position:absolute;top:670px;width:220px;text-align:center;font-size:34px;font-weight:700;color:var(--muted)}
+/* replay label */
+.stage .tl{position:absolute;right:14px;bottom:10px;font:22px/1 ui-monospace,Menlo,monospace;background:rgb(0 0 0/.6);padding:6px 8px;border-radius:6px;color:#fff;z-index:20}
+
+/* keyframes */
+@keyframes spin{to{transform:rotate(360deg)}}
+@keyframes fade{from{opacity:0}to{opacity:1}}
+@keyframes fadeout{from{opacity:1}to{opacity:0}}
+@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
+@keyframes breathe{0%,100%{opacity:.55}50%{opacity:1}}
+@keyframes shimmer{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
+@keyframes hide{to{opacity:0;visibility:hidden}}
+@keyframes show{from{opacity:0}to{opacity:1}}
+
+/* anything with .an waits for .play */
+.stage .an{opacity:0}
+.stage.play .an{animation-fill-mode:both}
+.stage .gone{animation-fill-mode:both}
+/* skeleton styles */
+.stage .sk{background:var(--surface2)}
+.stage .sk.breathe{animation:breathe 1.4s ease-in-out infinite}
+.stage .sk.shim{position:relative;overflow:hidden}
+.stage .sk.shim::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgb(255 255 255/.07),transparent);animation:shimmer 1.3s linear infinite}
+
+/* reduced motion: no movement, short fades only */
+body.rm .stage.play .an{animation-name:fade!important;animation-duration:.08s!important}
+body.rm .stage .sk.breathe,body.rm .stage .sk.shim::after{animation:none}
+body.rm .stage .mv{transition:none!important}

data/tv-v2/motion-2026-11-06/proto.js

@@ -0,0 +1,251 @@
+// Wolfskin TV motion prototypes. One clock per stage drives Web Animations; "box rate" quantises the clock
+// to the measured frame time on the Xiaomi box (p50 40 ms while moving, data/tv-spike-motion-speed/raw/gfx-*),
+// so the same motion can be watched at 60 fps and at the rate the box actually draws today.
+(() => {
+const A = 'tv-motion-speed/';
+const BOX_MS = 40;
+const EASE = 'cubic-bezier(.25,.1,.25,1)', OUT = 'cubic-bezier(.33,1,.68,1)', INOUT = 'cubic-bezier(.65,0,.35,1)';
+const POSTERS = [
+  ['American Gangster', '2007 · 2h 36m'], ['Annie Hall', '1977 · 1h 33m'], ['Apocalypse Now', '1979 · 2h 27m'],
+  ['Arrival', '2016 · 1h 56m'], ['Avatar: The Last Airbender', '2026 · 1h 52m'], ['Bohemian Rhapsody', '2018 · 2h 15m'],
+  ['Braveheart', '1995 · 2h 58m'], ['Citizen Kane', '1941 · 1h 59m'], ['Spirited Away', '2001 · 2h 5m'],
+  ['12 Years a Slave', '2013 · 2h 14m'], ['A Bronx Tale', '1993 · 2h 1m'], ['All the Money in the World', '2017 · 2h 13m'],
+];
+const poster = i => `${A}p${i + 1}.webp`;
+const html = (s) => { const t = document.createElement('template'); t.innerHTML = s.trim(); return t.content.firstChild; };
+
+function nav(cur, focus) {
+  const items = ['Home', 'Discover', 'Movies', 'Shows'];
+  return `<div class="nav"><span class="wm">Wolf<b>skin</b></span>${items.map((n, i) => `<span class="ni ${i === cur ? 'cur' : ''} ${i === focus ? 'f' : ''}">${n}</span>`).join('')}<span class="nsp"></span><span class="av">S</span></div>`;
+}
+function rate(rt, pc) { return `<span class="rate"><i></i>${rt}</span><span class="rate"><i class="pc"></i>${pc}</span>`; }
+function heroCopy(o) {
+  return `<div class="copy" style="bottom:${o.bottom || 330}px"><div class="kicker">${o.kicker}</div><div class="ht">${o.title}</div><div class="hm">${o.meta}</div>${o.ov ? `<div class="ho">${o.ov}</div>` : ''}<div class="btns">${o.btns}</div></div>`;
+}
+
+// ---------- scenes: build(stage, T, v) where v is the selected variant ----------
+const SCENES = {
+  // 1. launch -> Who's watching
+  launch: { len: 1400, variants: { after: 'After: people from the saved list' }, build(s, T) {
+    s.append(html(`<div class="abs" style="inset:0;background:url(${A}launcher.webp) center/cover"></div>`));
+    const bg = s.appendChild(html(`<div class="abs" style="inset:0;background:#07070a"></div>`));
+    T.a(bg, [{ opacity: 0 }, { opacity: 1 }], 0, 160);
+    const pk = s.appendChild(html(`<div class="abs" style="inset:0"><div class="abs" style="left:96px;top:60px;font-size:36px;font-weight:800">Wolf<b style="color:var(--accent)">skin</b></div><div class="pk">Who’s watching?</div>
+      ${[['J', '#64c3ff', 'justin', 540], ['M', '#ffa47a', 'mindel', 850], ['S', '#9be38f', 'shared', 1160]].map(([l, c, n, x]) => `<div class="person ${n === 'shared' ? 'ring' : ''}" style="left:${x}px;background:${c}">${l}</div><div class="pname" style="left:${x}px">${n}</div>`).join('')}</div>`));
+    T.a(pk, [{ opacity: 0 }, { opacity: 1 }], 450, 160);
+  } },
+
+  // 2. picker -> Home
+  home: { len: 1100, variants: { after: 'After: last Home painted from disk, art pre-decoded' }, build(s, T) {
+    const home = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="amb" style="background-image:url(${A}b2t.webp);filter:blur(30px);transform:scale(1.1)"></div>
+      <div class="bd" style="background-image:url(${A}b2.webp)"></div><div class="scrim"></div>
+      ${heroCopy({ kicker: '▸ Continue watching', title: 'Arrival', meta: '2016 · 1h 56m · 38 min left ' + rate('94%', '82%'), ov: 'Taking place after alien crafts land around the world, an expert linguist is recruited by the military to determine whether they come in peace or are a threat.', btns: '<span class="btn pri f">▶ Resume</span><span class="btn">ⓘ Details</span>', bottom: 340 })}
+      <div class="sh" style="top:780px">Next up</div>
+      ${[3, 4, 1, 2].map((b, i) => `<div class="card tile" style="left:${96 + i * 440}px;top:850px"><div class="img" style="background-image:url(${A}b${b}.webp)"></div><div class="cap">${['American Gangster', 'Bohemian Rhapsody', 'Apocalypse Now', 'Arrival'][i]}</div></div>`).join('')}
+      ${nav(0)}</div>`));
+    const picker = s.appendChild(html(`<div class="abs" style="inset:0;background:#07070a;z-index:10"><div class="pk">Who’s watching?</div>
+      ${[['J', '#64c3ff', 'justin', 540], ['M', '#ffa47a', 'mindel', 850], ['S', '#9be38f', 'shared', 1160]].map(([l, c, n, x]) => `<div class="person ${n === 'shared' ? 'ring' : ''}" style="left:${x}px;background:${c}">${l}</div><div class="pname" style="left:${x}px">${n}</div>`).join('')}</div>`));
+    T.a(picker, [{ opacity: 1 }, { opacity: 0 }], 0, 140);
+    T.a(home.querySelector('.amb'), [{ opacity: 0 }, { opacity: 1 }], 40, 120);
+    T.a(home.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 120, 220, INOUT);
+    T.a(home.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 60, 180, OUT);
+    T.a(home.querySelector('.sh'), [{ opacity: 0 }, { opacity: 1 }], 120, 160);
+    home.querySelectorAll('.card').forEach((c, i) => {
+      T.a(c, [{ opacity: 0, transform: 'translateY(24px)' }, { opacity: 1, transform: 'none' }], 140 + i * 40, 180, OUT);
+    });
+  } },
+
+  // 3. skeleton styles on a poster grid
+  skeleton: { len: 2200, variants: { breathe: 'Breathe (pick)', flat: 'Flat blocks (today)', shimmer: 'Shimmer sweep', spinner: 'Spinner (today, launch)' }, build(s, T, v) {
+    s.append(html(nav(2)));
+    s.append(html(`<div class="abs" style="left:96px;top:150px;font-size:72px;font-weight:800;letter-spacing:-.02em">Movies <span style="font-size:30px;font-weight:500;color:var(--muted)">85 films</span></div>`));
+    const cells = [];
+    for (let r = 0; r < 2; r++) for (let c = 0; c < 6; c++) cells.push([96 + c * 296, 330 + r * 460, r * 6 + c]);
+    if (v === 'spinner') { const sp = s.appendChild(html('<div class="spin"></div>')); T.a(sp, [{ opacity: 1 }, { opacity: 0 }], 900, 120); }
+    cells.forEach(([x, y, i]) => {
+      if (v !== 'spinner') {
+        const sk = s.appendChild(html(`<div class="card poster sk ${v === 'breathe' ? 'breathe' : v === 'shimmer' ? 'shim' : ''}" style="left:${x}px;top:${y}px;${v === 'breathe' ? `animation-delay:${(i % 6) * 90}ms` : ''}"></div>`));
+        T.a(sk, [{ opacity: 1 }, { opacity: 0 }], 900 + i * 25, 160);
+      }
+      const c = s.appendChild(html(`<div class="card poster" style="left:${x}px;top:${y}px;background-image:url(${poster(i)})"></div>`));
+      T.a(c, [{ opacity: 0 }, { opacity: 1 }], 900 + i * 25, 160);
+    });
+  } },
+
+  // 4. tab switch: Home -> Discover, rows reveal
+  tab: { len: 1100, variants: { after: 'After: last Discover painted, rows rise, art fades' }, build(s, T) {
+    const disc = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="bd" style="background-image:url(${A}b4.webp)"></div><div class="scrim"></div>
+      ${heroCopy({ kicker: '✦ For you', title: 'Bohemian Rhapsody', meta: 'Movie · 2018 · Drama, Music ' + rate('60%', '85%'), ov: 'Singer Freddie Mercury, guitarist Brian May, drummer Roger Taylor and bass guitarist John Deacon take the music world by storm.', btns: '<span class="btn">ⓘ Details</span>', bottom: 520 })}
+      <div class="sh" style="top:600px">Movies for you</div>
+      ${[6, 7, 8, 9, 10, 11].map((p, i) => `<div class="card poster" style="left:${96 + i * 296}px;top:670px"><div class="img" style="background-image:url(${poster(p)})"></div></div>`).join('')}
+      </div>`));
+    const home = s.appendChild(html(`<div class="abs" style="inset:0"><div class="bd" style="background-image:url(${A}b2.webp)"></div><div class="scrim"></div>
+      ${heroCopy({ kicker: '▸ Continue watching', title: 'Arrival', meta: '2016 · 1h 56m · 38 min left', ov: 'Taking place after alien crafts land around the world, an expert linguist is recruited by the military.', btns: '<span class="btn pri">▶ Resume</span><span class="btn">ⓘ Details</span>', bottom: 340 })}</div>`));
+    const n = s.appendChild(html(nav(1, 1)));
+    T.a(home, [{ opacity: 1 }, { opacity: 0 }], 0, 200, EASE);
+    T.a(disc.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 0, 240, INOUT);
+    T.a(disc.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 80, 180, OUT);
+    T.a(disc.querySelector('.sh'), [{ opacity: 0 }, { opacity: 1 }], 140, 160);
+    disc.querySelectorAll('.card').forEach((c, i) => T.a(c, [{ opacity: 0, transform: 'translateY(24px)' }, { opacity: 1, transform: 'none' }], 160 + i * 30, 180, OUT));
+  } },
+
+  // 5. title page entry from the Movies grid
+  title: { len: 1600, variants: { after: 'After: what the card knew, at once' }, build(s, T) {
+    const page = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="amb" style="background-image:url(${poster(2)});filter:blur(60px) saturate(1.2) brightness(.55);transform:scale(1.2)"></div>
+      <div class="bd" style="background-image:url(${A}b1.webp)"></div><div class="scrim"></div>
+      <div class="copy" style="bottom:360px"><div class="kicker">✓ Movie · In your library</div><div class="ht">Apocalypse Now</div>
+        <div class="hm">1979 · 2h 27m ${rate('91%', '94%')} <span class="late" style="color:var(--muted)">Drama, War</span></div>
+        <div class="ho late2" style="min-height:76px">At the height of the Vietnam war, Captain Benjamin Willard is sent on a dangerous mission that, officially, “does not exist, nor will it ever exist.”</div>
+        <div class="btns"><span class="btn pri f">▶ Play</span><span class="btn">⋯</span><span class="btn">Add for someone</span></div></div>
+      <div class="sh" style="top:830px">Cast</div>
+      ${[0, 1, 2, 3, 4, 5, 6].map(i => `<div class="circle" style="left:${96 + i * 244}px;top:900px"><span class="sk breathe abs" style="inset:0;border-radius:50%;animation-delay:${i * 90}ms"></span><div class="img" style="background-image:url(${A}c${i + 1}.webp)"></div></div>`).join('')}
+      ${nav(2)}</div>`));
+    const grid = s.appendChild(html(`<div class="abs" style="inset:0;background:#07070a">${nav(2)}
+      <div class="abs" style="left:96px;top:150px;font-size:72px;font-weight:800;letter-spacing:-.02em">Movies <span style="font-size:30px;font-weight:500;color:var(--muted)">85 films</span></div>
+      ${[0, 1, 2, 3, 4, 5].map(i => `<div class="card poster ${i === 2 ? 'ring' : ''}" style="left:${96 + i * 296}px;top:330px;background-image:url(${poster(i)});${i === 2 ? 'transform:scale(1.08)' : ''}"></div>`).join('')}
+      ${[6, 7, 8, 9, 10, 11].map((p, i) => `<div class="card poster" style="left:${96 + i * 296}px;top:790px;background-image:url(${poster(p)})"></div>`).join('')}</div>`));
+    T.a(grid, [{ opacity: 1 }, { opacity: 0 }], 0, 160);
+    T.a(page.querySelector('.amb'), [{ opacity: 0 }, { opacity: 1 }], 0, 160);
+    T.a(page.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 40, 180, OUT);
+    T.a(page.querySelector('.late'), [{ opacity: 0 }, { opacity: 1 }], 430, 160);
+    T.a(page.querySelector('.late2'), [{ opacity: 0 }, { opacity: 1 }], 430, 160);
+    T.a(page.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 470, 280, INOUT);
+    T.a(page.querySelector('.sh'), [{ opacity: 0 }, { opacity: 1 }], 120, 160);
+    page.querySelectorAll('.circle').forEach((c, i) => {
+      T.a(c, [{ opacity: 0, transform: 'translateY(20px)' }, { opacity: 1, transform: 'none' }], 140 + i * 30, 180, OUT);
+      T.a(c.querySelector('.img'), [{ opacity: 0 }, { opacity: 1 }], 620 + i * 40, 160);
+    });
+  } },
+
+  // 6. series title: late readiness line
+  series: { len: 4000, variants: { tv: 'TV-only: slot reserved, fades in at 3.4 s', conductarr: 'With the Conductarr cache: arrives ≈0.4 s' }, build(s, T, v) {
+    const late = v === 'conductarr' ? 380 : 3400;
+    const page = s.appendChild(html(`<div class="abs" style="inset:0">
+      <div class="amb" style="background-image:url(${A}s1t.webp);filter:blur(30px);transform:scale(1.1)"></div>
+      <div class="bd" style="background-image:url(${A}s1.webp)"></div><div class="scrim"></div>
+      <div class="copy" style="bottom:430px"><div class="kicker">✓ Series · In your library · Watched</div><div class="ht">Adults</div>
+        <div class="hm">2025 · 2 seasons · Comedy <span class="lr">${rate('88%', '93%')}</span></div>
+        <div class="hm lr2" style="color:var(--ok,#9be38f);font-size:26px">✓ Ready for you · by Mindel</div>
+        <div class="ho" style="min-height:76px">A group of twenty-somethings in New York trying to be good people, despite being neither “good” nor “people” yet.</div>
+        <div class="btns"><span class="btn pri f">▶ Play S1 E1</span><span class="btn">⋯</span><span class="btn">Seasons</span></div></div>
+      <div class="abs" style="left:96px;top:790px;display:flex;gap:16px"><span class="btn" style="height:56px;font-size:24px;background:var(--accent-soft,#2a1f3d)">Season 1</span><span class="btn" style="height:56px;font-size:24px">Season 2</span></div>
+      ${[0, 1, 2, 3].map(i => `<div class="card tile sk breathe" style="left:${96 + i * 440}px;top:880px;animation-delay:${i * 90}ms"><div class="img" style="background-image:url(${A}${i % 2 ? 's1' : 'e1'}.webp)"></div></div>`).join('')}
+      ${nav(3)}</div>`));
+    T.a(page.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(16px)' }, { opacity: 1, transform: 'none' }], 0, 180, OUT);
+    T.a(page.querySelector('.amb'), [{ opacity: 0 }, { opacity: 1 }], 0, 160);
+    T.a(page.querySelector('.bd'), [{ opacity: 0 }, { opacity: 1 }], 620, 280, INOUT);
+    T.a(page.querySelector('.lr'), [{ opacity: 0 }, { opacity: 1 }], late, 200);
+    T.a(page.querySelector('.lr2'), [{ opacity: 0 }, { opacity: 1 }], late, 200);
+    page.querySelectorAll('.card .img').forEach((c, i) => T.a(c, [{ opacity: 0 }, { opacity: 1 }], 700 + i * 40, 160));
+  } },
+
+  // 7. focus move along a row
+  focus: { len: 3000, variants: { after: 'Proposed: 180 ms ease-out, caption rises', today: 'Today: 140 ms, caption cross-fade' }, build(s, T, v) {
+    s.append(html(nav(2)));
+    s.append(html(`<div class="sh" style="top:250px">Movies for you</div>`));
+    const dur = v === 'today' ? 140 : 180, ease = v === 'today' ? EASE : OUT;
+    const cards = [0, 1, 2, 3, 4, 5].map(i => s.appendChild(html(`<div class="card poster" style="left:${96 + i * 296}px;top:330px;background-image:url(${poster(i + 6)})"></div>`)));
+    const caps = [0, 1, 2, 3, 4, 5].map(i => s.appendChild(html(`<div class="abs" style="left:${96 + i * 296}px;top:740px;width:520px"><div style="font-size:30px;font-weight:700">${POSTERS[i + 6][0]}</div><div style="font-size:26px;color:var(--muted)">${POSTERS[i + 6][1]}</div></div>`)));
+    const step = 600;
+    cards.forEach((c, i) => {
+      const on = i * step, off = (i + 1) * step;
+      const up = [{ transform: 'scale(1)', boxShadow: '0 0 0 0 transparent' }, { transform: 'scale(1.08)', boxShadow: '0 0 0 2px oklch(78% 0.14 305), inset 0 0 0 2px oklch(78% 0.14 305), 0 18px 40px rgb(0 0 0/.55)' }];
+      if (i > 0) T.a(c, up, on, dur, ease); else T.a(c, [up[1], up[1]], 0, 1);
+      if (i < 4) T.a(c, [up[1], up[0]], off, dur, ease);
+      const capIn = v === 'today' ? [{ opacity: 0 }, { opacity: 1 }] : [{ opacity: 0, transform: 'translateY(10px)' }, { opacity: 1, transform: 'none' }];
+      if (i > 0) T.a(caps[i], capIn, on + (v === 'today' ? 0 : 60), dur, ease); else T.a(caps[i], [{ opacity: 1 }, { opacity: 1 }], 0, 1);
+      if (i < 4) T.a(caps[i], [{ opacity: 1 }, { opacity: 0 }], off, v === 'today' ? dur : 100, ease);
+      if (i > 4) caps[i].style.opacity = 0;
+    });
+  } },
+
+  // 8. hero crossfade (Discover hero advances)
+  hero: { len: 2600, variants: { after: 'Proposed: 320 ms backdrop cross-fade, copy hand-off', today: 'Today: cut' }, build(s, T, v) {
+    const mk = (b, t, meta, ov) => s.appendChild(html(`<div class="abs hero" style="inset:0"><div class="bd" style="background-image:url(${A}b${b}.webp)"></div><div class="scrim"></div>${heroCopy({ kicker: '✦ For you', title: t, meta, ov, btns: '<span class="btn">ⓘ Details</span>', bottom: 520 })}</div>`));
+    const b = mk(2, 'Arrival', 'Movie · 2016 · Drama, Sci-Fi ' + rate('94%', '82%'), 'Taking place after alien crafts land around the world, an expert linguist is recruited by the military to determine whether they come in peace or are a threat.');
+    const a = mk(1, 'Apocalypse Now', 'Movie · 1979 · Drama, War ' + rate('91%', '94%'), 'At the height of the Vietnam war, Captain Benjamin Willard is sent on a dangerous mission that, officially, does not exist.');
+    s.append(html(nav(1)));
+    s.append(html(`<div class="abs" style="left:96px;top:600px;font-size:34px;font-weight:700">Movies for you</div>`));
+    [0, 1, 2, 3, 4, 5].map(i => s.append(html(`<div class="card poster" style="left:${96 + i * 296}px;top:670px;background-image:url(${poster(i)})"></div>`)));
+    const at = 900;
+    if (v === 'today') { T.a(a, [{ opacity: 1 }, { opacity: 0 }], at, 1); return; }
+    T.a(a.querySelector('.copy'), [{ opacity: 1 }, { opacity: 0 }], at, 120, EASE);
+    T.a(a.querySelector('.bd'), [{ opacity: 1 }, { opacity: 0 }], at, 320, INOUT);
+    T.a(a.querySelector('.scrim'), [{ opacity: 1 }, { opacity: 1 }], at, 320);
+    T.a(a, [{ opacity: 1 }, { opacity: 0 }], at + 300, 20);
+    T.a(b.querySelector('.copy'), [{ opacity: 0, transform: 'translateY(14px)' }, { opacity: 1, transform: 'none' }], at + 140, 200, OUT);
+  } },
+};
+
+// ---------- player ----------
+const players = [];
+let boxRate = false;
+function makePlayer(box) {
+  const name = box.dataset.scene, sc = SCENES[name];
+  const lead = +(box.dataset.lead || 300);
+  let variant = box.dataset.variant || Object.keys(sc.variants)[0];
+  let anims = [], t0 = 0, raf = 0, stage, label;
+  const total = () => lead + sc.len + 1400;
+  function build() {
+    box.querySelectorAll('.stage').forEach(e => e.remove());
+    stage = html('<div class="stage"></div>'); box.appendChild(stage);
+    label = stage.appendChild(html('<div class="tl">0 ms</div>'));
+    anims = [];
+    const rm = document.body.classList.contains('rm');
+    const seen = new WeakSet();
+    const T = { a(el, kf, start, dur, easing = EASE, opt = {}) {
+      let k = kf, d = dur;
+      if (rm) { k = kf.map(f => { const g = { ...f }; delete g.transform; return g; }); d = Math.min(dur, 100); }
+      // only an element's first animation fills backwards; later ones on the same element must not override it while waiting
+      const fill = seen.has(el) ? 'forwards' : 'both'; seen.add(el);
+      const an = el.animate(k, { delay: lead + start, duration: Math.max(1, d), easing, fill, ...opt });
+      an.pause(); anims.push(an);
+    } };
+    sc.build(stage, T, variant);
+    fit();
+  }
+  function fit() { if (stage) stage.style.transform = `scale(${box.clientWidth / 1920})`; }
+  function tick(now) {
+    let t = now - t0;
+    if (t > total()) { t0 = now; t = 0; }
+    const q = boxRate ? Math.floor(t / BOX_MS) * BOX_MS : t;
+    for (const an of anims) an.currentTime = q;
+    label.textContent = `${Math.max(0, Math.round(q - lead))} ms`;
+    raf = requestAnimationFrame(tick);
+  }
+  function start() { cancelAnimationFrame(raf); build(); t0 = performance.now(); raf = requestAnimationFrame(tick); }
+  function stop() { cancelAnimationFrame(raf); raf = 0; }
+  new ResizeObserver(fit).observe(box);
+  new IntersectionObserver(es => es.forEach(e => { if (e.isIntersecting) { if (!raf) start(); } else stop(); }), { rootMargin: '100px' }).observe(box);
+  const p = { box, start, setVariant(v) { variant = v; start(); }, rebuild: start };
+  players.push(p);
+  return p;
+}
+
+document.querySelectorAll('.sbox[data-scene]').forEach(makePlayer);
+document.querySelectorAll('[data-variants]').forEach(bar => {
+  const p = players.find(x => x.box.id === bar.dataset.variants);
+  const sc = SCENES[p.box.dataset.scene];
+  Object.entries(sc.variants).forEach(([k, label], i) => {
+    const b = document.createElement('button'); b.type = 'button'; b.className = 'tab' + (i === 0 ? ' on' : ''); b.textContent = label;
+    b.onclick = () => { bar.querySelectorAll('.tab').forEach(x => x.classList.toggle('on', x === b)); p.setVariant(k); };
+    bar.appendChild(b);
+  });
+});
+document.querySelectorAll('button.replay').forEach(b => b.addEventListener('click', () => {
+  const pair = b.closest('.pair');
+  pair.querySelectorAll('video').forEach(v => { v.currentTime = 0; v.play().catch(() => {}); });
+  players.filter(p => pair.contains(p.box)).forEach(p => p.start());
+}));
+const rate_ = document.getElementById('boxrate');
+if (rate_) rate_.addEventListener('change', () => { boxRate = rate_.checked; });
+const rm = document.getElementById('rm');
+if (rm) {
+  if (matchMedia('(prefers-reduced-motion: reduce)').matches) { rm.checked = true; document.body.classList.add('rm'); }
+  rm.addEventListener('change', () => { document.body.classList.toggle('rm', rm.checked); players.forEach(p => p.rebuild()); });
+}
+document.body.dataset.ready = '1';
+})();

docker/README.md

@@ -27,6 +27,48 @@ Upstream enables JVM unit tests only for debug variants; there is no
 `testDefaultReleaseUnitTest` task. `make test` uses the closest default-flavor
 task without changing upstream's test configuration.
 
+## Saved-person launch and DNS
+
+Launch restores an unprotected saved Jellyfin login from local storage before
+network validation. The existing Wolfskin picker paints the saved names and
+identity-derived colors, then refreshes the household in the background. PIN and
+require-login profiles still go through the existing protected sign-in flow.
+`Users/Me` and `System/Info/Public` now start concurrently; a late launch response
+cannot replace a different selected person. Name revalidation updates only the
+name column and reloads the saved user, preserving newer settings and PINs.
+
+Jellyfin, Conductarr, artwork, playback and crash-report clients share one
+`PersistentDns` instance through the application graph. It keeps system-ordered
+IPv6/IPv4 answers in memory and `noBackupFilesDir/wolfskin-dns.json` (at most 32 hosts).
+Saved answers return immediately for up to 24 hours and refresh off main after
+60 seconds; failed background lookups back off for 2 seconds without extending
+the last successful timestamp. Unexpected resolver exceptions are contained at
+the background refresh and warm-up boundaries. Negative answers are not persisted or cached.
+Missing, oversized or corrupt hint files fall back to system resolution.
+Application creation warms the saved Jellyfin host and configured Conductarr
+host on parallel IO jobs; it does not change Android Private DNS.
+
+A connection-establishment failure before any HTTP request headers were sent
+gets one fresh system lookup and one retry. Responses, read failures and
+uncertain mutation outcomes are not replayed. Conductarr retains its existing
+no-automatic-replay policy after a request starts. A DNS refresh changes the next
+new connection; already-working pooled connections are not forcibly closed.
+OkHttp's derived WebSocket clients disable event listeners; those calls bypass
+the HTTP retry bookkeeping while retaining the shared DNS resolver.
+
+Device acceptance (not established by JVM tests): with saved people present,
+cold-launch six times more than 60 seconds apart and require the picker within
+0.5 seconds on every launch. Press Left/Right then one OK; the selected Home must
+open without a second picker. Open the avatar picker, change person with one OK,
+and repeat after an offline launch to confirm saved people still paint.
+
+Compare timestamps of the launch pair of SDK log lines
+`GET https://jelly.justinvisser.org/Users/Me` and
+`GET https://jelly.justinvisser.org/System/Info/Public` (ignore later foreground
+`Users/Me` refreshes). The spike's two slow launch gaps were 1.508 and 1.509
+seconds. The requests now overlap, so either may log first; the picker must not
+wait for either response. The minified SDK log tag is not stable across builds.
+
 ## Optimized side-by-side comparison
 
 The `optimized` build type inherits `release`: R8 optimization/minification,
@@ -570,15 +612,29 @@ retain the approved frames except for the requested feedback changes:
 - Every Discover heading uses a 104 px band, including a 60 px title-to-card
   gap. Home heading geometry is unchanged.
 - Hero/backdrop decoding is bounded to 1920×1080; upright hero sheets request
-  420×630. The shared request builder removes conflicting Jellyfin size caps,
-  preserves tags and quality 96, and selects a suitable TMDB tier. The 64 MiB
-  memory cache, 128 MiB disk cache and four image-read limit remain unchanged.
+  420×630. The shared request builder replaces conflicting Jellyfin size/encoding
+  parameters: cards use WebP quality 80, while hero backdrops/sheets retain JPEG
+  quality 96. Poster/tile/wide/episode requests are 256×384, 400×225, 544×306 and
+  400×280; Jellyfin fill preserves aspect ratio before the UI crops. Tags and
+  authentication query parameters remain intact. TMDB uses w342 for posters and
+  portraits, w780 for landscape cards and w1280 for hero backdrops, never original.
+  Lossy WebP decoding is guaranteed below minSdk 23; API 28+ additionally checks
+  decoder support and requests JPEG if WebP is unavailable. The 64 MiB memory
+  cache, 128 MiB disk cache and four image-read limit remain unchanged.
 
 `HomeViewportTest` covers short/long poster, tile and wide rows, both row
 directions, first focus and native Back from the actual title surface. Native
 proof records real Bear season-three metadata through the title read facade;
 the proof-only harness is not part of the shipped tests or APK.
 
+Episode lists request only ProviderIds and Overview. Next up reads only identity,
+then hydrates the selected playback target through the existing single-item read,
+including when Next up is empty. Media sources/streams and cast remain on detail
+reads for header track/version controls. Performer credits omit media sources,
+streams and ParentId but retain People because their cards show character roles.
+Movies/Shows grids retain ProviderIds and DateCreated; server-side SortName
+ordering does not require returning SortName on every item.
+
 
 ## Title pages and people
 

wolfskin-design/generate_tokens.py

@@ -32,6 +32,7 @@ def render_tokens(tokens: dict) -> tuple[str, str]:
         "// Generated by generate_tokens.py; edit the JSON sources instead.",
         "package org.justinvisser.wolfskin.design",
         "",
+        "import androidx.compose.animation.core.CubicBezierEasing",
         "import androidx.compose.ui.graphics.Color as ComposeColor",
         "import androidx.compose.ui.text.TextStyle",
         "import androidx.compose.ui.text.font.FontWeight",
@@ -71,6 +72,10 @@ def render_tokens(tokens: dict) -> tuple[str, str]:
             elif kind == "duration":
                 lines.append(f"        const val {name} = {int(value.removesuffix('ms'))}")
                 css.append(f"  --{group_name}-{name}: {value};")
+            elif kind == "cubicBezier":
+                points = ", ".join(f"{number(point)}f" for point in value)
+                lines.append(f"        val {name} = CubicBezierEasing({points})")
+                css.append(f"  --{group_name}-{name}: cubic-bezier({', '.join(map(str, value))});")
             elif kind == "transition" and value.get("type") == "spring":
                 lines.append(f"        const val {name}DampingRatio = {number(value['dampingRatio'])}f")
                 lines.append(f"        const val {name}Stiffness = {number(value['stiffness'])}f")

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/Caption.kt

@@ -1,7 +1,6 @@
 package org.justinvisser.wolfskin.design
 
 import androidx.compose.animation.core.Animatable
-import androidx.compose.animation.core.CubicBezierEasing
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.layout.Column
 import androidx.compose.runtime.Composable
@@ -17,16 +16,19 @@ import androidx.compose.ui.draw.clipToBounds
 import androidx.compose.ui.layout.Layout
 import androidx.compose.ui.unit.constrainHeight
 
-/** Captions fade without moving the reserved band under the focused poster. */
+/** Captions rise inside the reserved band without changing measured geometry. */
 @Composable
 fun Caption(title: String, facts: String, visible: Boolean, modifier: Modifier = Modifier, accentLastFact: Boolean = false, accentFirstFact: Boolean = false,
     titleStyle: TextStyle = WolfskinTokens.Type.button, factsStyle: TextStyle = WolfskinTokens.Type.caption,
     titleOverflow: TextOverflow = TextOverflow.Ellipsis) {
     val alpha = remember(title, facts) { Animatable(0f) }
-    LaunchedEffect(alpha, visible) {
-        alpha.animateTo(if (visible) 1f else 0f, tween(WolfskinTokens.Motion.fast, easing = CubicBezierEasing(.25f, .1f, .25f, 1f)))
+    val reduced = reducedMotion()
+    val rise = with(androidx.compose.ui.platform.LocalDensity.current) { WolfskinTokens.Motion.captionRise.toPx() }
+    LaunchedEffect(alpha, visible, reduced) {
+        if (visible && !reduced) kotlinx.coroutines.delay(WolfskinTokens.Motion.captionDelay.toLong())
+        alpha.animateTo(if (visible) 1f else 0f, tween(motionDuration(if (visible) WolfskinTokens.Motion.focusMove else WolfskinTokens.Motion.captionOut, reduced), easing = WolfskinTokens.Motion.easeOut))
     }
-    Column(modifier.graphicsLayer { this.alpha = alpha.value }) {
+    Column(modifier.graphicsLayer { this.alpha = alpha.value; translationY = if (reduced) 0f else rise * (1f - alpha.value) }) {
         Text(title, color = WolfskinTokens.Color.fg, style = titleStyle, modifier = Modifier.exactLineBox(titleStyle), maxLines = 1, overflow = titleOverflow)
         CaptionFacts(facts, accentFirstFact, accentLastFact, factsStyle)
     }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/DiscoverArtwork.kt

@@ -56,12 +56,17 @@ fun DiscoverArtwork(path: String?, modifier: Modifier, poster: Boolean = false,
             if (upright) WolfskinTokens.Image.heroPosterRequestWidth else WolfskinTokens.Image.heroRequestWidth,
             if (upright) WolfskinTokens.Image.heroPosterRequestHeight else WolfskinTokens.Image.heroRequestHeight, upright)
     }
-    if (painter != null) Image(painter, null, modifier, contentScale = ContentScale.Crop, colorFilter = filter)
+    val heroReady = LocalHeroArtReady.current
+    if (painter != null) {
+        androidx.compose.runtime.SideEffect { heroReady?.invoke() }
+        Image(painter, null, modifier, contentScale = ContentScale.Crop, colorFilter = filter)
+    }
     else AsyncImage(
         model = request,
         imageLoader = WolfskinImages.loader(context),
         contentDescription = null, modifier = modifier, contentScale = ContentScale.Crop, colorFilter = filter,
         onError = { onError() },
+        onSuccess = { heroReady?.invoke() },
     )
 }
 
@@ -70,7 +75,11 @@ fun DiscoverArtwork(path: String?, modifier: Modifier, poster: Boolean = false,
 fun DiscoverBackdrop(title: DiscoverTitle, detail: Boolean = false, modifier: Modifier = Modifier) {
     val failed = remember(title.poster, title.backdrop) { androidx.compose.runtime.mutableStateOf(false) }
     Box(modifier.size(WolfskinTokens.Shell.stageWidth, WolfskinTokens.Shell.stageHeight).clipToBounds().background(C.surface3)) {
-        if (failed.value || (title.poster == null && title.backdrop == null)) HomeAmbient(Modifier.fillMaxSize().testTag("discover-missing-art"))
+        if (failed.value || (title.poster == null && title.backdrop == null)) {
+            val heroReady = LocalHeroArtReady.current
+            androidx.compose.runtime.SideEffect { heroReady?.invoke() }
+            HomeAmbient(Modifier.fillMaxSize().testTag("discover-missing-art"))
+        }
         else if (title.posterOnly) {
             DiscoverArtwork(title.poster, Modifier.offset(-D.ambientInset, -D.ambientInset)
                 .wrapContentSize(Alignment.TopStart, unbounded = true)

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/DiscoverScreen.kt

@@ -32,7 +32,7 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalDensity
-import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.tv.material3.Text
@@ -73,8 +73,8 @@ fun DiscoverScreen(state: DiscoverState, modifier: Modifier = Modifier) {
         return
     }
     if (state.snapshot.status == DiscoverStatus.Loading) {
-        val loading = remember(state) { LibraryGridState("Discover", emptyList(), catalogue = true).apply { status = LibraryStatus.Loading } }
-        LibraryScreen(shell, loading, modifier, offlineArt = LocalDiscoverArt.current, registerFocus = false)
+        LaunchedEffect(state) { if (!shell.navFocused) shell.focusNav(shell.currentTab) }
+        DiscoverLoading(modifier)
         return
     }
     val density = LocalDensity.current
@@ -104,7 +104,9 @@ fun DiscoverScreen(state: DiscoverState, modifier: Modifier = Modifier) {
         }
     }
     Box(modifier.fillMaxSize().testTag("discover-screen")) {
-        if (state.hasHero && state.service == null && list.firstVisibleItemIndex == 0) state.hero?.let { DiscoverBackdrop(it, modifier = Modifier.graphicsLayer { translationY = -list.firstVisibleItemScrollOffset.toFloat() }) }
+        if (state.hasHero && state.service == null && list.firstVisibleItemIndex == 0) state.hero?.let { title ->
+            HeroArtCrossfade(title.key, title, L.row_phero, Modifier.offset { IntOffset(0, -list.firstVisibleItemScrollOffset) }) { DiscoverBackdrop(it) }
+        }
         LazyColumn(state = list, contentPadding = PaddingValues(bottom = (WolfskinTokens.Shell.stageHeight - L.pinnedLine - heights.last()).coerceAtLeast(D.frameBottomMin)), modifier = Modifier.fillMaxSize()) {
             item(key = "discover-header", contentType = if (state.hasHero && state.service == null) "hero" else "header") {
                 if (state.hasHero && state.service == null) DiscoverHero(state) else LibraryHeader(state.shell.person, state.service?.name ?: "Discover", if (state.service != null) "General interest" else "")
@@ -132,22 +134,23 @@ fun DiscoverScreen(state: DiscoverState, modifier: Modifier = Modifier) {
 @Composable
 private fun DiscoverHero(state: DiscoverState) {
     val title = state.hero ?: return
-    Column(Modifier.fillMaxWidth().height(L.row_phero).padding(start = L.safeSide, bottom = L.heroCopyBottom), verticalArrangement = Arrangement.Bottom) {
+    HeroCopyHandoff(title.key, title) { copy ->
+      Column(Modifier.fillMaxWidth().height(L.row_phero).padding(start = L.safeSide, bottom = L.heroCopyBottom), verticalArrangement = Arrangement.Bottom) {
         Row(horizontalArrangement = Arrangement.spacedBy(WolfskinTokens.Card.posterGap), verticalAlignment = Alignment.CenterVertically) {
             Glyph("seerr", C.accentText, Modifier.size(L.buttonIcon))
             Text(if (state.snapshot.status == DiscoverStatus.Ready) "For you" else "Trending", color = C.accentText, style = DiscoverType.label)
         }
         Spacer(Modifier.height(D.heroKickerGap))
-        Text(title.title, Modifier.width(L.heroCopyWidth).testTag("discover-hero-title-box").discoverLineBox(DiscoverType.hero), color = C.fg, style = DiscoverType.hero, maxLines = 2, overflow = TextOverflow.Ellipsis)
+        Text(copy.title, Modifier.width(L.heroCopyWidth).testTag("discover-hero-title-box").discoverLineBox(DiscoverType.hero), color = C.fg, style = DiscoverType.hero, maxLines = 2, overflow = TextOverflow.Ellipsis)
         Spacer(Modifier.height(D.heroTitleGap))
         Row(Modifier.height(D.heroFactsHeight), horizontalArrangement = Arrangement.spacedBy(D.heroFactsGap), verticalAlignment = Alignment.CenterVertically) {
-            Text("${title.typeWord}${title.year?.let { " · $it" }.orEmpty()}", color = C.muted, style = DiscoverType.body)
-            if (title.genres.isNotEmpty()) Text(title.genres.take(2).joinToString(", "), color = C.muted, style = DiscoverType.body)
-            if (state.isSignedIn) DiscoverRatings(title.ratings)
-            if (state.shell.person.key in title.heldBy) Text("In your library", color = C.accentText, style = DiscoverType.body)
+            Text("${copy.typeWord}${copy.year?.let { " · $it" }.orEmpty()}", color = C.muted, style = DiscoverType.body)
+            if (copy.genres.isNotEmpty()) Text(copy.genres.take(2).joinToString(", "), color = C.muted, style = DiscoverType.body)
+            if (state.isSignedIn) DiscoverRatings(copy.ratings)
+            if (state.shell.person.key in copy.heldBy) Text("In your library", color = C.accentText, style = DiscoverType.body)
         }
         Spacer(Modifier.height(D.heroMetaGap))
-        Text(title.overview, Modifier.width(L.heroOverviewMax), color = C.muted, style = DiscoverType.body, maxLines = 2, overflow = TextOverflow.Ellipsis)
+        Text(copy.overview, Modifier.width(L.heroOverviewMax), color = C.muted, style = DiscoverType.body, maxLines = 2, overflow = TextOverflow.Ellipsis)
         Spacer(Modifier.height(D.heroOverviewGap))
         Row(verticalAlignment = Alignment.CenterVertically) {
             DiscoverButton("Details", state.contentFocused && state.focusedRow == 0, "about") { state.openTitle(title) }
@@ -158,6 +161,7 @@ private fun DiscoverHero(state: DiscoverState) {
             }
         }
     }
+    }
 }
 
 @Composable

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/DiscoverShelf.kt

@@ -55,7 +55,7 @@ fun DiscoverShelf(state: DiscoverState, lane: DiscoverLane, row: Int) {
         LazyRow(state = cards, userScrollEnabled = false,
             contentPadding = PaddingValues(start = L.safeSide, end = WolfskinTokens.Shell.stageWidth - L.safeSide - (K.posterW * slots + K.posterGap * (slots - 1)), top = K.posterGap, bottom = K.posterGap),
             horizontalArrangement = Arrangement.spacedBy(K.posterGap),
-            modifier = Modifier.offset(y = D.shelfHeadingBand - K.posterGap).height(height + K.posterGap * 2)) {
+            modifier = Modifier.offset(y = D.shelfHeadingBand - K.posterGap).height(height + K.posterGap * 2).skeletonPulse(lane.pending).rowReveal(lane.id, !lane.pending)) {
             if (services) itemsIndexed(state.snapshot.services, key = { _, service -> "service:${service.id}" }, contentType = { _, _ -> "entry" }) { index, service ->
                 Box(Modifier.size(K.entryW, K.entryH).focusScale(active && index == column, WolfskinTokens.Focus.scaleCard)
                     .focusRing(active && index == column, WolfskinTokens.Radius.card, WolfskinTokens.Focus.ringCardRing, FocusLift.Card)
@@ -66,7 +66,7 @@ fun DiscoverShelf(state: DiscoverState, lane: DiscoverLane, row: Int) {
                 }
             } else if (lane.pending) {
                 items(slots, key = { "pending:$it" }) {
-                    Box(Modifier.size(K.posterW, K.posterH).background(C.surface3, RoundedCornerShape(WolfskinTokens.Radius.card)))
+                    Box(Modifier.size(K.posterW, K.posterH).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.card)))
                 }
             } else {
                 itemsIndexed(lane.titles, key = { _, item -> item.key }, contentType = { _, _ -> "poster" }) { index, item ->

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/DiscoverState.kt

@@ -156,7 +156,8 @@ class DiscoverState(
     }
 
     private fun moveRow(direction: Int) {
-        val target = focusedRow + direction
+        var target = focusedRow + direction
+        while (target in firstShelf until rowCount && lanes[target - firstShelf].pending) target += direction
         if (target < if (hasHero) 0 else 1) { shell.focusNav(shell.currentTab); return }
         if (target >= rowCount) return
         val key = when (target) { 0 -> "phero"; 1 -> "dchips"; else -> lanes[target - firstShelf].id }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/Focus.kt

@@ -1,6 +1,5 @@
 package org.justinvisser.wolfskin.design
 
-import androidx.compose.animation.core.CubicBezierEasing
 import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.animation.core.tween
 import androidx.compose.runtime.Composable
@@ -26,9 +25,10 @@ import androidx.compose.ui.unit.Dp
 /** Only transforms animate: focus never changes measured geometry. */
 @Composable
 fun Modifier.focusScale(focused: Boolean, scale: Float): Modifier {
+    val reduced = reducedMotion()
     val animated by animateFloatAsState(
         if (focused) scale else 1f,
-        tween(WolfskinTokens.Motion.fast, easing = CubicBezierEasing(.25f, .1f, .25f, 1f)),
+        tween(if (reduced) 0 else WolfskinTokens.Motion.focusMove, easing = WolfskinTokens.Motion.easeOut),
         label = "focus-scale",
     )
     return graphicsLayer { scaleX = animated; scaleY = animated }
@@ -40,8 +40,9 @@ enum class FocusLift { None, Card, Button }
 /** Every focus ring straddles the surface edge above content, without a background gap. */
 @Composable
 fun Modifier.focusRing(focused: Boolean, radius: Dp, width: Dp, lift: FocusLift = FocusLift.None): Modifier {
+    val reduced = reducedMotion()
     val ringAlpha by animateFloatAsState(if (focused) 1f else 0f,
-        tween(WolfskinTokens.Motion.fast, easing = CubicBezierEasing(.25f, .1f, .25f, 1f)), label = "focus-ring")
+        tween(motionDuration(WolfskinTokens.Motion.focusMove, reduced), easing = WolfskinTokens.Motion.easeOut), label = "focus-ring")
     val shadow = if (lift == FocusLift.None) this else {
         val shape = remember(radius) { RoundedCornerShape(radius) }
         val density = LocalDensity.current

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/FrameScroll.kt

@@ -1,7 +1,6 @@
 // SPDX-License-Identifier: GPL-2.0-only
 package org.justinvisser.wolfskin.design
 
-import androidx.compose.animation.core.CubicBezierEasing
 import androidx.compose.animation.core.animate
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.lazy.LazyListState
@@ -11,8 +10,8 @@ internal suspend fun animateFrameScroll(list: LazyListState, distance: Float) {
     if (distance == 0f) return
     list.scroll {
         var previous = 0f
-        animate(0f, distance, animationSpec = tween(WolfskinTokens.Motion.scroll,
-            easing = CubicBezierEasing(.33f, 1f, .68f, 1f))) { value, _ ->
+        animate(0f, distance, animationSpec = tween(if (NetworkArtTransition.reduced) 0 else WolfskinTokens.Motion.scroll,
+            easing = WolfskinTokens.Motion.easeOut)) { value, _ ->
             scrollBy(value - previous)
             previous = value
         }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/HeroMotion.kt

@@ -0,0 +1,100 @@
+package org.justinvisser.wolfskin.design
+
+import androidx.compose.animation.core.Animatable
+import androidx.compose.animation.core.tween
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.requiredSize
+import androidx.compose.foundation.layout.wrapContentSize
+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.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.platform.testTag
+import org.justinvisser.wolfskin.design.WolfskinTokens.Motion as M
+import kotlinx.coroutines.launch
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.compositionLocalOf
+import androidx.compose.runtime.rememberUpdatedState
+import androidx.compose.runtime.snapshotFlow
+import kotlinx.coroutines.flow.first
+
+/** Artwork success or its final fallback releases a pending hero hand-off. */
+internal val LocalHeroArtReady = compositionLocalOf<(() -> Unit)?> { null }
+
+/** Only the upper hero region blends; the lower backdrop changes without an animated screen layer. */
+@Composable
+fun <T> HeroArtCrossfade(identity: Any, target: T, height: Dp, modifier: Modifier = Modifier, content: @Composable (T) -> Unit) {
+    var displayed by remember { mutableStateOf(target) }
+    var displayedIdentity by remember { mutableStateOf(identity) }
+    var outgoing by remember { mutableStateOf<T?>(null) }
+    val alpha = remember { Animatable(0f) }
+    val reduced = reducedMotion()
+    var readyIdentity by remember { mutableStateOf(identity) }
+    val latestIdentity by rememberUpdatedState(identity)
+    val onReady = remember(identity) { { if (latestIdentity == identity) readyIdentity = identity } }
+    LaunchedEffect(identity, reduced) {
+        if (displayedIdentity != identity) {
+            outgoing = displayed
+            alpha.snapTo(1f)
+            snapshotFlow { readyIdentity == identity }.first { it }
+            displayed = target
+            displayedIdentity = identity
+        }
+        if (outgoing != null) {
+            alpha.animateTo(0f, tween(motionDuration(M.heroFade, reduced), easing = M.easeInOut))
+            outgoing = null
+        }
+    }
+    Box(modifier) {
+        CompositionLocalProvider(LocalHeroArtReady provides onReady) { content(target) }
+        outgoing?.let { old ->
+            Box(Modifier.requiredSize(WolfskinTokens.Shell.stageWidth, height).graphicsLayer { this.alpha = alpha.value; clip = true }.testTag("hero-outgoing")) {
+                Box(Modifier.wrapContentSize(Alignment.TopStart, unbounded = true).requiredSize(WolfskinTokens.Shell.stageWidth, WolfskinTokens.Shell.stageHeight)) { content(old) }
+            }
+        }
+    }
+}
+
+/** One bounded copy layer fades out, hands off, then rises; controls keep their logical owner. */
+@Composable
+fun <T> HeroCopyHandoff(identity: Any, target: T, modifier: Modifier = Modifier, content: @Composable (T) -> Unit) {
+    val reduced = reducedMotion()
+    val alpha = remember { Animatable(0f) }
+    val progress = remember { Animatable(0f) }
+    var displayed by remember { mutableStateOf(target) }
+    var previous by remember { mutableStateOf(identity) }
+    var handingOff by remember { mutableStateOf(false) }
+    var entered by remember { mutableStateOf(false) }
+    val rise = with(androidx.compose.ui.platform.LocalDensity.current) { (if (entered) M.copyRise else M.copyEntryRise).toPx() }
+    LaunchedEffect(identity, reduced) {
+        if (previous != identity || handingOff) {
+            handingOff = true
+            alpha.animateTo(0f, tween(motionDuration(M.heroCopyOut, reduced), easing = M.ease))
+            displayed = target
+            previous = identity
+            progress.snapTo(0f)
+            if (!reduced) kotlinx.coroutines.delay((M.heroCopyDelay - M.heroCopyOut).toLong())
+            kotlinx.coroutines.coroutineScope {
+                launch { alpha.animateTo(1f, tween(motionDuration(M.heroCopyIn, reduced), easing = M.easeOut)) }
+                launch { progress.animateTo(1f, tween(motionDuration(M.heroCopyIn, reduced), easing = M.easeOut)) }
+            }
+            handingOff = false
+        } else if (!entered) {
+            kotlinx.coroutines.coroutineScope {
+                launch { alpha.animateTo(1f, tween(motionDuration(M.rowEnter, reduced), easing = M.easeOut)) }
+                launch { progress.animateTo(1f, tween(motionDuration(M.rowEnter, reduced), easing = M.easeOut)) }
+            }
+        }
+        entered = true
+        displayed = target
+    }
+    Box(modifier.graphicsLayer { this.alpha = alpha.value; translationY = if (reduced) 0f else rise * (1f - progress.value) }) {
+        content(if (handingOff || previous != identity) displayed else target)
+    }
+}

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/HomeHeader.kt

@@ -23,24 +23,27 @@ fun HomeHero(row: HomeRow, focused: Boolean, column: Int, ratings: List<HomeRati
         if (!row.skeleton) {
             val title = row.cards.first()
             val artModifier = Modifier.wrapContentSize(Alignment.TopStart, unbounded = true).requiredSize(WolfskinTokens.Shell.stageWidth, WolfskinTokens.Shell.stageHeight)
-            TitleArtwork(title.title, title.type, title.poster, WolfskinTokens.Shell.stageWidth, WolfskinTokens.Shell.stageHeight, artModifier, backdrop = title.backdrop, posterOnly = title.posterOnly, landscape = true, hero = true)
+            HeroArtCrossfade(title.id, title, L.row_hero, artModifier) { art ->
+                TitleArtwork(art.title, art.type, art.poster, WolfskinTokens.Shell.stageWidth, WolfskinTokens.Shell.stageHeight, artModifier, backdrop = art.backdrop, posterOnly = art.posterOnly, landscape = true, hero = true)
+            }
             Box(artModifier.background(Brush.verticalGradient(0f to C.bg.copy(alpha = 0f), .52f to C.bg.copy(alpha = 0f), .74f to C.bg.copy(alpha = .6f), 1f to C.bg)))
             Box(artModifier.background(Brush.horizontalGradient(0f to C.bg.copy(alpha = .92f), .42f to C.bg.copy(alpha = .55f), .70f to C.bg.copy(alpha = 0f))))
-            Column(Modifier.align(Alignment.BottomStart).padding(start = L.safeSide, bottom = L.heroCopyBottom).width(L.heroCopyWidth)) {
+            HeroCopyHandoff(title.id, title, Modifier.align(Alignment.BottomStart).padding(start = L.safeSide, bottom = L.heroCopyBottom).width(L.heroCopyWidth)) { copy ->
+              Column {
                 Row(verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.spacedBy(H.kickerGap)) {
                     Glyph(if (row.heroKind == "pick") "seerr" else "playback", C.accentText, Modifier.size(L.buttonIcon * (28f / 30f)))
                     Text(when (row.heroKind) { "resume" -> "Continue watching"; "next" -> "Up next"; "new" -> "New in your library"; else -> "For you" }, modifier = Modifier.exactLineBox(T.label), color = C.accentText, style = T.label)
                 }
                 Spacer(Modifier.height(H.kickerBottom))
-                Text(title.displayTitle, modifier = Modifier.exactLineBox(T.displayHero), color = C.fg, style = T.displayHero, maxLines = 2, overflow = TextOverflow.Ellipsis)
+                Text(copy.displayTitle, modifier = Modifier.exactLineBox(T.displayHero), color = C.fg, style = T.displayHero, maxLines = 2, overflow = TextOverflow.Ellipsis)
                 Spacer(Modifier.height(H.titleBottom))
                 Row(Modifier.heightIn(min = H.factsHeight), verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.spacedBy(H.factsGap)) {
-                    Text(if (title.isEpisode) title.subtitle else title.year?.toString().orEmpty(), modifier = Modifier.exactLineBox(T.body), color = C.muted, style = T.body, maxLines = 1)
-                    if (row.heroKind == "resume" || title.runtimeSeconds != null) Text(if (row.heroKind == "resume") title.remaining else title.runtime, modifier = Modifier.exactLineBox(T.body), color = C.muted, style = T.body, maxLines = 1)
+                    Text(if (copy.isEpisode) copy.subtitle else copy.year?.toString().orEmpty(), modifier = Modifier.exactLineBox(T.body), color = C.muted, style = T.body, maxLines = 1)
+                    if (row.heroKind == "resume" || copy.runtimeSeconds != null) Text(if (row.heroKind == "resume") copy.remaining else copy.runtime, modifier = Modifier.exactLineBox(T.body), color = C.muted, style = T.body, maxLines = 1)
                     HomeRatingsRow(ratings)
                 }
                 Spacer(Modifier.height(H.factsBottom))
-                Text(title.overview, color = C.muted, style = T.body, maxLines = 2, overflow = TextOverflow.Ellipsis, modifier = Modifier.width(L.heroOverviewMax).exactLineBox(T.body))
+                Text(copy.overview, color = C.muted, style = T.body, maxLines = 2, overflow = TextOverflow.Ellipsis, modifier = Modifier.width(L.heroOverviewMax).exactLineBox(T.body))
                 Spacer(Modifier.height(H.overviewBottom))
                 Row(horizontalArrangement = Arrangement.spacedBy(L.buttonGap)) {
                     val detailsOnly = row.heroKind == "pick" || !row.watchReady
@@ -49,14 +52,15 @@ fun HomeHero(row: HomeRow, focused: Boolean, column: Int, ratings: List<HomeRati
                     if (!detailsOnly) PickerButton("Details", focused && column == 1, false, "about", onFocus = { onHover(1) }, textStyle = T.button) { onButton(1) }
                 }
             }
+            }
         } else {
             HomeAmbient(Modifier.wrapContentSize(Alignment.TopStart, unbounded = true).requiredSize(WolfskinTokens.Shell.stageWidth, WolfskinTokens.Shell.stageHeight))
-            Column(Modifier.align(Alignment.BottomStart).padding(start = L.safeSide, bottom = L.heroCopyBottom)) {
-                Box(Modifier.size(H.heroSkeletonWidth, H.heroSkeletonHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.card)))
+            Column(Modifier.align(Alignment.BottomStart).padding(start = L.safeSide, bottom = L.heroCopyBottom).skeletonPulse()) {
+                Box(Modifier.size(H.heroSkeletonWidth, H.heroSkeletonHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.card)))
                 Spacer(Modifier.height(H.heroSkeletonGap))
-                Box(Modifier.size(H.heroSkeletonFactsWidth, H.heroSkeletonFactsHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.cardSheet)))
+                Box(Modifier.size(H.heroSkeletonFactsWidth, H.heroSkeletonFactsHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.cardSheet)))
                 Spacer(Modifier.height(H.heroSkeletonButtonGap))
-                Box(Modifier.size(H.heroSkeletonButtonWidth, L.buttonHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.button)))
+                Box(Modifier.size(H.heroSkeletonButtonWidth, L.buttonHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.button)))
             }
         }
     }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/HomeRatings.kt

@@ -59,7 +59,7 @@ fun HomeRatingsRow(ratings: List<HomeRating>, modifier: Modifier = Modifier, fon
 /** The plate is a prefix of the full ratings set; its first entry is never discarded. */
 @Composable
 fun HomeRatingPlate(ratings: List<HomeRating>, visible: Boolean, modifier: Modifier = Modifier) {
-    val alpha by animateFloatAsState(if (visible && ratings.isNotEmpty()) 1f else 0f, tween(WolfskinTokens.Motion.base), label = "rating-plate")
+    val alpha by animateFloatAsState(if (visible && ratings.isNotEmpty()) 1f else 0f, tween(motionDuration(WolfskinTokens.Motion.base, reducedMotion())), label = "rating-plate")
     if (ratings.isEmpty()) return
     val measurer = rememberTextMeasurer()
     val density = LocalDensity.current

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/HomeScreen.kt

@@ -1,6 +1,5 @@
 package org.justinvisser.wolfskin.design
 
-import androidx.compose.animation.core.CubicBezierEasing
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.gestures.animateScrollBy
 import androidx.compose.foundation.layout.*
@@ -69,7 +68,7 @@ fun HomeScreen(
             (heights.take(view.row).fold(topInset) { total, height -> total + height } - if (snapshot.rows.getOrNull(view.row)?.kind == HomeRowKind.Hero) WolfskinTokens.Shell.zero else L.pinnedLine).toPx()
         }.coerceAtLeast(0f)
         val current = with(density) { heights.take(view.listState.firstVisibleItemIndex).fold(WolfskinTokens.Shell.zero) { total, height -> total + height }.toPx() } + view.listState.firstVisibleItemScrollOffset
-        view.listState.animateScrollBy(target - current, tween(WolfskinTokens.Motion.scroll, easing = CubicBezierEasing(.33f, 1f, .68f, 1f)))
+        view.listState.animateScrollBy(target - current, tween(if (NetworkArtTransition.reduced) 0 else WolfskinTokens.Motion.scroll, easing = WolfskinTokens.Motion.easeOut))
         view.home.positionedKey = key
         view.home.positionedReset = view.home.resetScroll
     }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/HomeShelf.kt

@@ -50,15 +50,15 @@ fun HomeShelf(row: HomeRow, memory: HomeViewMemory, focused: Boolean, column: In
     Box(Modifier.fillMaxWidth().height(L.rowHeadingBand + height + caption + L.rowGapAfter)) {
         if (!row.skeleton) Text(row.title, color = C.fg, style = T.rowHeading, maxLines = 1, modifier = Modifier.offset(x = L.safeSide))
         val cards = if (row.skeleton) List(if (row.cardKind == HomeCardKind.Poster) 8 else 5) { null } else row.cards + if (row.hasSeeAll) listOf(null) else emptyList()
-        LazyRow(state = track, modifier = Modifier.fillMaxWidth().offset(y = L.rowHeadingBand - L.rowGapAfter).height(height + L.rowGapAfter * 2), contentPadding = PaddingValues(horizontal = L.safeSide, vertical = L.rowGapAfter), horizontalArrangement = Arrangement.spacedBy(K.posterGap), userScrollEnabled = !row.skeleton) {
+        LazyRow(state = track, modifier = Modifier.fillMaxWidth().offset(y = L.rowHeadingBand - L.rowGapAfter).height(height + L.rowGapAfter * 2).skeletonPulse(row.skeleton).rowReveal(row.id, !row.skeleton), contentPadding = PaddingValues(horizontal = L.safeSide, vertical = L.rowGapAfter), horizontalArrangement = Arrangement.spacedBy(K.posterGap), userScrollEnabled = !row.skeleton) {
             itemsIndexed(cards, key = { index, title -> title?.id ?: "${row.id}:tail:$index" }, contentType = { _, title -> if (row.skeleton) "skeleton" else if (title == null) "seeAll" else row.cardKind.name.lowercase() }) { index, title ->
-                val selected = focused && column == index
+                val selected = !row.skeleton && focused && column == index
                 val cardModifier = Modifier.zIndex(if (selected) 2f else 0f).testTag("home-card:${row.id}:$index")
                     .then(if (!row.skeleton) Modifier.focusOnPointerEnter { onHover(index) } else Modifier)
                 if (title == null && !row.skeleton) {
                     LibrarySeeAllCard(row.total, selected, { onCard(index) }, cardModifier, width, height, T.listTitle, T.label)
                 } else TitleCard(selected, cardModifier.then(if (!row.skeleton) Modifier.clickable { onCard(index) } else Modifier), width, height) {
-                    if (title == null) Box(Modifier.fillMaxSize().background(C.surface)) else {
+                    if (title == null) Box(Modifier.fillMaxSize().background(C.surface2)) else {
                         TitleArtwork(title.title, title.type, title.poster, width, height, Modifier.fillMaxSize(), backdrop = title.backdrop, posterOnly = title.posterOnly, landscape = row.cardKind != HomeCardKind.Poster)
                         if (row.cardKind != HomeCardKind.Poster) TileOverlay(title)
                         if (row.catalogue && title.held) Box(Modifier.align(Alignment.BottomEnd).padding(L.badgeInset).size(L.badge).background(C.ok, CircleShape), contentAlignment = Alignment.Center) { Text("✓", color = C.onFocus, style = T.button) }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/LibraryScreen.kt

@@ -120,8 +120,8 @@ fun LibraryScreen(
             when (grid.status) {
                 LibraryStatus.Loading -> items(3, key = { "skeleton-$it" }, contentType = { "grid" }) {
                     Box(Modifier.fillMaxWidth().height(rowHeight)) {
-                        Row(Modifier.padding(start = L.safeSide), horizontalArrangement = Arrangement.spacedBy(K.posterGap)) {
-                            repeat(grid.columns) { Box(Modifier.size(K.posterW, K.posterH).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.card))) }
+                        Row(Modifier.padding(start = L.safeSide).skeletonPulse(), horizontalArrangement = Arrangement.spacedBy(K.posterGap)) {
+                            repeat(grid.columns) { Box(Modifier.size(K.posterW, K.posterH).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.card))) }
                         }
                     }
                 }
@@ -133,7 +133,7 @@ fun LibraryScreen(
                         "grid-${if (grid.catalogue) title.catalogueKey else title.id}"
                     }, contentType = { "grid" }) { row ->
                         Box(Modifier.fillMaxWidth().height(rowHeight)) {
-                            Row(Modifier.padding(start = L.safeSide), horizontalArrangement = Arrangement.spacedBy(K.posterGap)) {
+                            Row(Modifier.padding(start = L.safeSide).rowReveal("grid-$row"), horizontalArrangement = Arrangement.spacedBy(K.posterGap)) {
                                 for (column in 0 until grid.columns) {
                                     val index = row * grid.columns + column
                                     val title = items.getOrNull(index) ?: break

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/LoadingSurface.kt

@@ -0,0 +1,57 @@
+package org.justinvisser.wolfskin.design
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.testTag
+import org.justinvisser.wolfskin.design.WolfskinTokens.Card as K
+import org.justinvisser.wolfskin.design.WolfskinTokens.Color as C
+import org.justinvisser.wolfskin.design.WolfskinTokens.Layout as L
+import org.justinvisser.wolfskin.design.WolfskinTokens.Title as D
+
+/** Discover loads in its actual hero-and-lanes silhouette, not a library grid. */
+@Composable
+internal fun DiscoverLoading(modifier: Modifier = Modifier) {
+    Column(modifier.fillMaxSize().testTag("discover-loading")) {
+        Box(Modifier.fillMaxWidth().height(L.row_phero)) { TitleHeaderSkeleton() }
+        Spacer(Modifier.height(L.row_chips))
+        PosterSkeletonRow(WolfskinTokens.Discover.shelfHeadingBand)
+    }
+}
+
+/** A person read reserves its portrait/header and the six-column filmography grid. */
+@Composable
+internal fun PersonLoading(modifier: Modifier = Modifier) {
+    Column(modifier.fillMaxSize().testTag("person-loading")) {
+        Box(Modifier.fillMaxWidth().height(L.row_phead)) {
+            Row(Modifier.offset(L.safeSide, D.personTop).skeletonPulse(), horizontalArrangement = Arrangement.spacedBy(D.personGap)) {
+                Box(Modifier.size(L.personPortrait).background(C.surface2, CircleShape))
+                Column(verticalArrangement = Arrangement.spacedBy(D.skeletonTitleGap)) {
+                    SkeletonBlock(D.skeletonTitleWidth, D.skeletonTitleHeight)
+                    SkeletonBlock(D.skeletonFactsWidth, D.skeletonKickerHeight)
+                    SkeletonBlock(D.skeletonOverviewWidth, D.skeletonOverviewHeight)
+                }
+            }
+        }
+        PosterSkeletonRow(L.row_gh)
+    }
+}
+
+/** All posters in a visible row share a single pulse layer. */
+@Composable
+private fun PosterSkeletonRow(heading: androidx.compose.ui.unit.Dp) {
+    Column {
+        Spacer(Modifier.height(heading))
+        Row(Modifier.padding(start = L.safeSide).skeletonPulse(), horizontalArrangement = Arrangement.spacedBy(K.posterGap)) {
+            repeat(K.posterSlots) { SkeletonBlock(K.posterW, K.posterH) }
+        }
+    }
+}
+
+@Composable
+private fun SkeletonBlock(width: androidx.compose.ui.unit.Dp, height: androidx.compose.ui.unit.Dp) {
+    Box(Modifier.size(width, height).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.card)))
+}

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/Motion.kt

@@ -0,0 +1,71 @@
+package org.justinvisser.wolfskin.design
+
+import androidx.compose.animation.core.Animatable
+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.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.compositionLocalOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.MotionDurationScale
+import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.platform.LocalDensity
+import org.justinvisser.wolfskin.design.WolfskinTokens.Motion as M
+
+/** A host may force reduced motion independently of the platform animator scale. */
+val LocalReducedMotion = compositionLocalOf { false }
+
+/** Compose's window duration-scale state follows system settings without UI-thread settings reads. */
+@Composable
+fun reducedMotion(): Boolean = LocalReducedMotion.current ||
+    (rememberCoroutineScope().coroutineContext[MotionDurationScale]?.scaleFactor == 0f)
+
+/** Short fades remain available when movement and continuous animation are disabled. */
+fun motionDuration(duration: Int, reduced: Boolean): Int = if (reduced) minOf(duration, M.reducedFade) else duration
+
+/** One alpha layer owns all shapes in a shelf; individual placeholders never animate. */
+@Composable
+fun Modifier.skeletonPulse(loading: Boolean = true): Modifier {
+    if (!loading || reducedMotion()) return this
+    val clock = rememberInfiniteTransition(label = "skeleton-shelf")
+    val alpha = clock.animateFloat(M.skeletonLowAlpha, 1f,
+        infiniteRepeatable(tween(M.skeletonCycle / 2, easing = M.breatheEase), RepeatMode.Reverse), label = "breathe")
+    return graphicsLayer { this.alpha = alpha.value }
+}
+
+/** Content enters on its row layer, never one animation per card or a full-screen transition. */
+@Composable
+fun Modifier.rowReveal(identity: Any, enabled: Boolean = true): Modifier {
+    val reduced = reducedMotion()
+    val progress = remember(identity, enabled) { Animatable(if (enabled) 0f else 1f) }
+    LaunchedEffect(progress, reduced) { if (enabled) progress.animateTo(1f, tween(motionDuration(M.rowEnter, reduced), easing = M.easeOut)) }
+    val rise = with(LocalDensity.current) { M.rowRise.toPx() }
+    return if (!enabled) this else graphicsLayer {
+        alpha = progress.value
+        translationY = if (reduced) 0f else rise * (1f - progress.value)
+    }
+}
+
+/** Late facts occupy an existing slot and fade without a translation. */
+@Composable
+internal fun Modifier.lateLineFade(identity: Any): Modifier {
+    val reduced = reducedMotion()
+    val alpha = remember(identity) { Animatable(0f) }
+    LaunchedEffect(alpha, reduced) { alpha.animateTo(1f, tween(motionDuration(M.lateLineFade, reduced), easing = M.ease)) }
+    return graphicsLayer { this.alpha = alpha.value }
+}
+
+/** Title copy enters as one bounded block, leaving measured layout unchanged. */
+@Composable
+internal fun Modifier.copyEntry(identity: Any): Modifier {
+    val reduced = reducedMotion()
+    val progress = remember(identity) { Animatable(0f) }
+    val rise = with(LocalDensity.current) { M.copyEntryRise.toPx() }
+    LaunchedEffect(progress, reduced) { progress.animateTo(1f, tween(motionDuration(M.rowEnter, reduced), easing = M.easeOut)) }
+    return graphicsLayer { alpha = progress.value; translationY = if (reduced) 0f else rise * (1f - progress.value) }
+}

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/NavBar.kt

@@ -58,18 +58,20 @@ fun navBoxes(tabs: List<String>): List<NavBox> {
 @Composable
 fun NavBar(state: ShellState, scrolled: Boolean, modifier: Modifier = Modifier) {
     val boxes = remember(state.person.hasAnime) { navBoxes(state.tabs) }
-    val labelFade = remember { tween<Color>(S.navLabelFade, easing = CubicBezierEasing(0f, 0f, .58f, 1f)) }
+    val reduced = reducedMotion()
+    val labelFade = tween<Color>(motionDuration(S.navLabelFade, reduced), easing = CubicBezierEasing(0f, 0f, .58f, 1f))
     val index = if (state.navFocused) state.navIndex else state.currentTab
     val box = boxes[index]
     val avatarFocused = state.navFocused && index == state.tabs.size
     val pad = if (avatarFocused) L.navBlobAvatarPad else S.zero
     val damping = WolfskinTokens.Motion.navBlobDampingRatio
     val stiffness = WolfskinTokens.Motion.navBlobStiffness
-    val x by animateFloatAsState((box.left - pad).value, spring(damping, stiffness), label = "blob-x")
-    val y by animateFloatAsState((box.top - pad).value, spring(damping, stiffness), label = "blob-y")
-    val width by animateFloatAsState((box.width + pad * 2).value, spring(damping, stiffness), label = "blob-width")
-    val height by animateFloatAsState((box.height + pad * 2).value, spring(damping, stiffness), label = "blob-height")
-    val color by animateColorAsState(if (state.navFocused) C.fg else C.navBlobRest, spring(damping, stiffness), label = "blob-color")
+    val geometry = if (reduced) tween<Float>(0) else spring<Float>(damping, stiffness)
+    val x by animateFloatAsState((box.left - pad).value, geometry, label = "blob-x")
+    val y by animateFloatAsState((box.top - pad).value, geometry, label = "blob-y")
+    val width by animateFloatAsState((box.width + pad * 2).value, geometry, label = "blob-width")
+    val height by animateFloatAsState((box.height + pad * 2).value, geometry, label = "blob-height")
+    val color by animateColorAsState(if (state.navFocused) C.fg else C.navBlobRest, if (reduced) tween(motionDuration(WolfskinTokens.Motion.base, true)) else spring(damping, stiffness), label = "blob-color")
     val density = LocalDensity.current.density
     val band = remember {
         Brush.verticalGradient(listOf(C.bg.copy(alpha = S.navBandOpacity), C.bg.copy(alpha = 0f)))

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/NetworkArtTransition.kt

@@ -0,0 +1,23 @@
+package org.justinvisser.wolfskin.design
+
+import coil3.decode.DataSource
+import coil3.request.ImageResult
+import coil3.request.SuccessResult
+import coil3.transition.CrossfadeTransition
+import coil3.transition.Transition
+import coil3.transition.TransitionTarget
+
+/** Both Coil loaders share the same source-aware reveal; cache and local reads never fade. */
+object NetworkArtTransition : Transition.Factory {
+    @Volatile var reduced = false
+
+    /** The result source, not its URL, decides whether art needs a reveal. */
+    fun duration(source: DataSource, reduced: Boolean): Int = if (source == DataSource.NETWORK)
+        motionDuration(WolfskinTokens.Motion.artReveal, reduced) else 0
+
+    override fun create(target: TransitionTarget, result: ImageResult): Transition {
+        val duration = if (result is SuccessResult) duration(result.dataSource, reduced) else 0
+        return if (duration == 0) Transition.Factory.NONE.create(target, result)
+        else CrossfadeTransition(target, result, duration)
+    }
+}

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/SettingsList.kt

@@ -1,6 +1,5 @@
 package org.justinvisser.wolfskin.design
 
-import androidx.compose.animation.core.CubicBezierEasing
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.gestures.animateScrollBy
 import androidx.compose.foundation.background
@@ -63,7 +62,7 @@ fun SettingsList(state: ShellState, modifier: Modifier = Modifier, requestCount:
         val target = if (y >= L.windowAhead) y - L.pinnedLine else S.zero
         val current = if (list.firstVisibleItemIndex == 0) S.zero else L.row_lhead + L.row_srow * (list.firstVisibleItemIndex - 1)
         val distance = with(density) { (target - current).toPx() } - list.firstVisibleItemScrollOffset
-        list.animateScrollBy(distance, tween(WolfskinTokens.Motion.scroll, easing = CubicBezierEasing(.33f, 1f, .68f, 1f)))
+        list.animateScrollBy(distance, tween(if (NetworkArtTransition.reduced) 0 else WolfskinTokens.Motion.scroll, easing = WolfskinTokens.Motion.easeOut))
     }
     LazyColumn(modifier.fillMaxSize(), state = list,
         contentPadding = PaddingValues(bottom = S.stageHeight - L.pinnedLine - L.row_srow)) {

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/ShelfScroll.kt

@@ -1,6 +1,5 @@
 package org.justinvisser.wolfskin.design
 
-import androidx.compose.animation.core.CubicBezierEasing
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.gestures.animateScrollBy
 import androidx.compose.foundation.lazy.LazyListState
@@ -16,7 +15,7 @@ internal fun shelfFirst(column: Int, previous: Int, slots: Int, count: Int): Int
 /** Reconcile the actual track on every focus transition, including interrupted or restored offsets. */
 internal suspend fun LazyListState.scrollShelfTo(first: Int, pitch: Float) {
     val distance = (first - firstVisibleItemIndex) * pitch - firstVisibleItemScrollOffset
-    if (distance != 0f) animateScrollBy(distance, tween(WolfskinTokens.Motion.base,
-        easing = CubicBezierEasing(.25f, .1f, .25f, 1f)))
+    if (distance != 0f) animateScrollBy(distance, tween(if (NetworkArtTransition.reduced) 0 else WolfskinTokens.Motion.base,
+        easing = WolfskinTokens.Motion.ease))
     if (firstVisibleItemIndex != first || firstVisibleItemScrollOffset != 0) scrollToItem(first)
 }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/SourceRatings.kt

@@ -70,7 +70,7 @@ fun LibraryRatingPlate(ratings: List<LibraryRating>, modifier: Modifier = Modifi
     if (ratings.isEmpty()) return
     val measurer = rememberTextMeasurer()
     val density = LocalDensity.current
-    val alpha by animateFloatAsState(if (visible) 1f else 0f, tween(WolfskinTokens.Motion.base), label = "rating-plate")
+    val alpha by animateFloatAsState(if (visible) 1f else 0f, tween(motionDuration(WolfskinTokens.Motion.base, reducedMotion())), label = "rating-plate")
     BoxWithConstraints(modifier.fillMaxWidth().graphicsLayer { this.alpha = alpha }
         .background(Brush.verticalGradient(0f to C.bg.copy(alpha = P.plateOpacity), P.plateMidStop to C.bg.copy(alpha = P.plateMidOpacity), 1f to C.bg.copy(alpha = 0f)))
         .testTag("rating-plate").padding(horizontal = P.plateSide)) {

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/TitleArtwork.kt

@@ -43,18 +43,23 @@ import org.justinvisser.wolfskin.design.WolfskinTokens.Title as D
 /** Local decoded fixture art keeps screenshot tests deterministic and completely offline. */
 val LocalTitleBitmaps = compositionLocalOf<Map<String, ImageBitmap>> { emptyMap() }
 
-/** Decode at the slot size, with no crossfade or oversized poster allocations. */
+/** Decode at the slot size; network results reveal through Coil's painter without a new layer. */
 @Composable
 fun TitleArtwork(path: String?, width: Int, height: Int, modifier: Modifier = Modifier, poster: Boolean = false, colorFilter: ColorFilter? = null, onError: () -> Unit = {}) {
     val bitmap = LocalTitleBitmaps.current[path]
-    if (bitmap != null) Image(bitmap, null, modifier, contentScale = ContentScale.Crop, colorFilter = colorFilter)
+    val heroReady = LocalHeroArtReady.current
+    if (bitmap != null) {
+        androidx.compose.runtime.SideEffect { heroReady?.invoke() }
+        Image(bitmap, null, modifier, contentScale = ContentScale.Crop, colorFilter = colorFilter)
+    }
     else if (path != null) {
         val context = LocalContext.current
         val request = remember(context, path, width, height, poster) {
             WolfskinImages.request(context, path, width, height, poster)
         }
         AsyncImage(model = request, imageLoader = WolfskinImages.loader(context),
-            contentDescription = null, modifier = modifier, contentScale = ContentScale.Crop, colorFilter = colorFilter, onError = { onError() })
+            contentDescription = null, modifier = modifier, contentScale = ContentScale.Crop, colorFilter = colorFilter,
+            onSuccess = { heroReady?.invoke() }, onError = { onError() })
     }
 }
 

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/TitleHeader.kt

@@ -12,7 +12,6 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -42,7 +41,7 @@ fun TitleHeader(state: TitleState, active: Boolean, modifier: Modifier = Modifie
         else -> state.data.playTarget?.takeIf { it.kind == "episode" }
     }
     val type = if (item.kind == "movie") "Movie" else "Series"
-    CssColumn(modifier.offset(L.safeSide, L.detailCopyTop + D.lineLift).width(L.detailCopyWidth)) {
+    CssColumn(modifier.offset(L.safeSide, L.detailCopyTop + D.lineLift).width(L.detailCopyWidth).copyEntry(item.id)) {
         Row(Modifier.exactLineBox(TitleTextStyles.dLine, bottom = D.lineGap), horizontalArrangement = Arrangement.spacedBy(L.navItemGap), verticalAlignment = Alignment.CenterVertically) {
             Glyph(if (item.held) "check" else "sparkle", C.accentText, Modifier.size(D.lineIcon))
             Text(buildString {
@@ -60,12 +59,14 @@ fun TitleHeader(state: TitleState, active: Boolean, modifier: Modifier = Modifie
             if (state.data.connection != TitleConnection.SignedOut) TitleRatings(item.ratings)
             if (item.genres.isNotEmpty()) Text(item.genres.take(3).joinToString(", "), color = C.muted, style = TitleTextStyles.body, modifier = Modifier.exactLineBox(TitleTextStyles.body))
         }
-        state.data.requestedStage?.let { stage ->
-            val color = when (stage) { "Ready" -> C.ok; "Failed" -> C.fail; "Downloading", "Almost ready" -> C.accent; else -> C.muted }
-            Row(Modifier.exactLineBox(TitleTextStyles.dLine, bottom = D.lineGap), horizontalArrangement = Arrangement.spacedBy(L.navItemGap), verticalAlignment = Alignment.CenterVertically) {
-                Glyph(titleStageGlyph(stage), color, Modifier.size(D.lineIcon))
-                Text(stage, color = color, style = TitleTextStyles.label)
-                Text("for ${state.data.requestFor ?: "you"}" + state.data.requestActor?.let { " · by $it" }.orEmpty(), color = C.muted, style = TitleTextStyles.dLine)
+        Box(Modifier.fillMaxWidth().height(if (item.kind == "tv" || state.data.requestedStage != null) WolfskinTokens.Motion.readinessSlot else WolfskinTokens.Shell.zero).testTag("title-readiness-slot")) {
+            state.data.requestedStage?.let { stage ->
+                val color = when (stage) { "Ready" -> C.ok; "Failed" -> C.fail; "Downloading", "Almost ready" -> C.accent; else -> C.muted }
+                Row(Modifier.exactLineBox(TitleTextStyles.dLine, bottom = D.lineGap).lateLineFade(stage), horizontalArrangement = Arrangement.spacedBy(L.navItemGap), verticalAlignment = Alignment.CenterVertically) {
+                    Glyph(titleStageGlyph(stage), color, Modifier.size(D.lineIcon))
+                    Text(stage, color = color, style = TitleTextStyles.label)
+                    Text("for ${state.data.requestFor ?: "you"}" + state.data.requestActor?.let { " · by $it" }.orEmpty(), color = C.muted, style = TitleTextStyles.dLine)
+                }
             }
         }
         Text((episode ?: item).overview, color = C.muted, style = TitleTextStyles.body, maxLines = 3, overflow = TextOverflow.Ellipsis, modifier = Modifier.exactLineBox(TitleTextStyles.body, bottom = D.overviewGap).testTag("title-overview"))
@@ -105,18 +106,18 @@ fun TitleHeader(state: TitleState, active: Boolean, modifier: Modifier = Modifie
 /** A no-copy load has no focusable content and never draws a spinner. */
 @Composable
 fun TitleHeaderSkeleton(modifier: Modifier = Modifier) {
-    Column(modifier.offset(L.safeSide, L.detailCopyTop)) {
-        Box(Modifier.size(D.skeletonKickerWidth, D.skeletonKickerHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.cardSheet)))
+    Column(modifier.offset(L.safeSide, L.detailCopyTop).skeletonPulse()) {
+        Box(Modifier.size(D.skeletonKickerWidth, D.skeletonKickerHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.cardSheet)))
         Spacer(Modifier.height(D.skeletonTitleGap))
-        Box(Modifier.size(D.skeletonTitleWidth, D.skeletonTitleHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.card)))
+        Box(Modifier.size(D.skeletonTitleWidth, D.skeletonTitleHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.card)))
         Spacer(Modifier.height(D.skeletonFactsGap))
-        Box(Modifier.size(D.skeletonFactsWidth, D.skeletonKickerHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.cardSheet)))
+        Box(Modifier.size(D.skeletonFactsWidth, D.skeletonKickerHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.cardSheet)))
         Spacer(Modifier.height(D.skeletonOverviewGap))
-        Box(Modifier.size(D.skeletonOverviewWidth, D.skeletonOverviewHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.card)))
+        Box(Modifier.size(D.skeletonOverviewWidth, D.skeletonOverviewHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.card)))
         Spacer(Modifier.height(D.overviewGap))
         Row(horizontalArrangement = Arrangement.spacedBy(L.buttonGap)) {
-            Box(Modifier.size(D.skeletonPlayWidth, L.buttonHeight).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.button)))
-            repeat(2) { Box(Modifier.size(L.iconButton).background(C.surface, RoundedCornerShape(WolfskinTokens.Radius.button))) }
+            Box(Modifier.size(D.skeletonPlayWidth, L.buttonHeight).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.button)))
+            repeat(2) { Box(Modifier.size(L.iconButton).background(C.surface2, RoundedCornerShape(WolfskinTokens.Radius.button))) }
         }
     }
 }

wolfskin-design/src/main/java/org/justinvisser/wolfskin/design/TitlePage.kt

@@ -30,8 +30,7 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.setValue
 import androidx.compose.foundation.gestures.animateScrollBy
 import androidx.compose.animation.core.tween
-import androidx.compose.animation.core.CubicBezierEasing
-import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.draw.drawBehind
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.focus.FocusRequester
@@ -147,8 +146,9 @@ fun TitlePage(state: TitleState, shell: ShellState, modifier: Modifier = Modifie
         }.focusable()) {
         // This remains visible behind the scrolled rows; it is not an off-screen header image.
         TitleBackdrop(state.data.item, Modifier.fillMaxSize())
-        Box(Modifier.fillMaxSize().graphicsLayer { alpha = dim }.background(C.bg))
+        Box(Modifier.fillMaxSize().drawBehind { drawRect(C.bg.copy(alpha = dim)) })
         if (state.data.status == TitleReadStatus.Unavailable) TitleReadError(state)
+        else if (state.data.status == TitleReadStatus.Loading && state.data.item.kind == "person") PersonLoading()
         else LazyColumn(state = list, modifier = Modifier.fillMaxSize()) {
             displayedRows.forEach { id -> item(key = id, contentType = if (id == "header") "header" else if (id == "seasons") "chips" else "shelf") {
                 val active = state.row == id && !shell.navFocused && state.sheet == null
@@ -185,7 +185,9 @@ private fun TitleSeasons(state: TitleState, active: Boolean) {
     val list = androidx.compose.foundation.lazy.rememberLazyListState()
     val visibleChip = if (active) state.column else state.data.seasonNumbers.indexOf(state.season)
     LaunchedEffect(visibleChip, state.data.seasonNumbers) {
-        if (visibleChip >= 0) list.animateScrollToItem(visibleChip)
+        if (visibleChip >= 0) {
+            if (NetworkArtTransition.reduced) list.scrollToItem(visibleChip) else list.animateScrollToItem(visibleChip)
+        }
     }
     androidx.compose.foundation.lazy.LazyRow(Modifier.height(L.row_chips).padding(top = D.chipTop), state = list, contentPadding = androidx.compose.foundation.layout.PaddingValues(horizontal = L.safeSide), horizontalArrangement = Arrangement.spacedBy(D.chipGap)) {
         items(state.data.seasonNumbers.size, key = { "season-${state.data.seasonNumbers[it]}" }, contentType = { "chip" }) { index ->
@@ -220,4 +222,4 @@ private fun TitleReadError(state: TitleState) {
     }
 }
 
-internal val titleFrameScrollSpec = tween<Float>(WolfskinTokens.Motion.scroll, easing = CubicBezierEasing(.33f, 1f, .68f, 1f))
+internal val titleFrameScrollSpec get() = tween<Float>(if (NetworkArtTransition.reduced) 0 else WolfskinTokens.Motion.scroll, easing = WolfskinTokens.Motion.easeOut)