Add manual block start and fix timer display labels

Blocks are now selected without auto-starting the timer. Clicking a block
makes it current (highlighted) but leaves it in a ready state. A "Start"
button (indigo) triggers timing for a fresh block; "Resume" appears for
previously-worked blocks; "Pause" remains while running.

Also fixes the sidebar duration label to show "Done!" when elapsed ≥ total
and "< 1 min" for sub-minute remaining time instead of "0 min".

Backend adds a "select" event type that records an implicit pause for the
previous block, updates current_block_id, and broadcasts is_paused=true
with prev_block_elapsed_seconds so the TV sidebar stays accurate.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/stores/schedule.js

@@ -94,9 +94,26 @@ export const useScheduleStore = defineStore('schedule', () => {
       const elapsed = event.block_elapsed_seconds ?? blockElapsedCache.value[event.block_id] ?? 0
       blockElapsedOffset.value = elapsed
       if (event.block_id) blockElapsedCache.value[event.block_id] = elapsed
+      // Sync the previous block's cache so TV sidebar doesn't reset to full duration
+      if (event.prev_block_id != null) {
+        blockElapsedCache.value[event.prev_block_id] = event.prev_block_elapsed_seconds ?? blockElapsedCache.value[event.prev_block_id] ?? 0
+      }
       blockStartedAt.value = Date.now()
       isPaused.value = false
     }
+    // Select — switch current block but keep timer stopped (manual start required)
+    if (event.event === 'select') {
+      // Sync the previous block's cache
+      if (event.prev_block_id != null) {
+        blockElapsedCache.value[event.prev_block_id] = event.prev_block_elapsed_seconds ?? blockElapsedCache.value[event.prev_block_id] ?? 0
+      }
+      // Restore new block's accumulated elapsed but don't start counting
+      const elapsed = event.block_elapsed_seconds ?? blockElapsedCache.value[event.block_id] ?? 0
+      blockElapsedOffset.value = elapsed
+      if (event.block_id) blockElapsedCache.value[event.block_id] = elapsed
+      blockStartedAt.value = null
+      isPaused.value = true
+    }
     // Resume — continue from where we left off
     if (event.event === 'resume') {
       blockStartedAt.value = Date.now()
@@ -156,6 +173,37 @@ export const useScheduleStore = defineStore('schedule', () => {
     sendTimerAction(sessionId, 'start', newBlockId)
   }
 
+  // Select a block without starting its timer (requires explicit Start/Resume).
+  // The backend records an implicit pause for the previous block if it was running.
+  function selectBlock(sessionId, newBlockId) {
+    if (!session.value) return
+    const prevBlockId = session.value.current_block_id
+    if (prevBlockId === newBlockId) return
+
+    // Save elapsed seconds for the block we're leaving (if timer was running)
+    if (prevBlockId && blockStartedAt.value) {
+      blockElapsedCache.value[prevBlockId] =
+        blockElapsedOffset.value + Math.floor((Date.now() - blockStartedAt.value) / 1000)
+    }
+
+    // Optimistic update — switch block, stay paused, stop counting
+    session.value.current_block_id = newBlockId
+    isPaused.value = true
+    blockElapsedOffset.value = blockElapsedCache.value[newBlockId] ?? 0
+    blockStartedAt.value = null
+
+    // Single HTTP call; WS select event will confirm with authoritative elapsed
+    sendTimerAction(sessionId, 'select', newBlockId)
+  }
+
+  // Start the timer for the currently selected block (optimistic).
+  function startCurrentBlock(sessionId) {
+    if (!session.value?.current_block_id) return
+    isPaused.value = false
+    blockStartedAt.value = Date.now()
+    sendTimerAction(sessionId, 'start', session.value.current_block_id)
+  }
+
   return {
     session,
     blocks,
@@ -176,5 +224,7 @@ export const useScheduleStore = defineStore('schedule', () => {
     startSession,
     sendTimerAction,
     switchBlock,
+    selectBlock,
+    startCurrentBlock,
   }
 })