Merge pull request #53 from AmanTahiliani/feat/issue-52-fix-stale-live-tab-sessions-and-add-last

Fix stale Live tab sessions and add last-session archive view (#52)

.agents/README.md

@@ -24,7 +24,7 @@ bin/dev          CLI: `dev implement <issue#> --harness <name> [--dry-run]`
 - **Groom** (interactive, Claude): `/groom <issue#>` runs a seeded grill-me → writes a
   Ready spec into the issue body → sets Effort/Priority → leaves Stage at `Research`.
   You review and flip to `Ready`.
-- **Implement** (any harness): `.agents/bin/dev implement <issue#> --harness <name>`
+- **Implement** (recommended harnesses: `codex` or `cursor`): `.agents/bin/dev implement <issue#> --harness <name>`
   (or `/implement …` in Claude to supervise) → isolated worktree → runs the harness
   headless on the spec → build gate → opens a PR → sets Stage `In Review`.
 - **Review + merge**: use the `review` skill from a harness different from the
@@ -42,8 +42,17 @@ local adapter state.
 ## Adding / fixing a harness
 
 Edit one function in `harnesses.sh`: `harness_<name> <workdir> <promptfile>`, running the
-tool non-interactively in `<workdir>` on the prompt. `claude`/`codex`/`opencode` are
-wired; `pi`/`cursor` are stubs — confirm their headless flags before trusting.
+tool non-interactively in `<workdir>` on the prompt. For current implementation
+dispatch, prefer `codex` or `cursor`; `claude` and `opencode` remain available, and
+`pi` still needs flag verification before trusting.
+
+`agy` / Antigravity is deliberately disabled for non-dry-run dispatch as of
+2026-07-04. Phase 1 testing found the headless path unreliable: with
+`--new-project` it ignored the prompt and tried to scaffold, while without it the CLI
+could resume a stale conversation and hang past the print timeout. Keep using
+`.agents/bin/dev implement <issue#> --harness agy --dry-run` for prompt inspection
+only; real dispatch should use `codex` or `cursor` until a fresh Antigravity
+headless invocation is verified and documented.
 
 Always `--dry-run` a new harness first: it renders the exact prompt and plan, touching
 nothing (no worktree, PR, or state change).

.agents/bin/dev

@@ -1,7 +1,7 @@
 #!/usr/bin/env bash
 # .agents/bin/dev — box-box agentic dev CLI. Works from any harness's shell.
 #
-#   dev implement <issue#> --harness <claude|codex|opencode|pi|cursor> [--dry-run] [--base <branch>]
+#   dev implement <issue#> --harness <codex|cursor|claude|opencode|pi|agy> [--dry-run] [--base <branch>]
 #
 # Grooming is driven interactively via the Claude Code /groom skill; this CLI covers
 # the implement lane (dispatch a Ready issue to a harness → worktree → gate → PR).
@@ -15,7 +15,7 @@ box-box dev CLI
 
   dev implement <issue#> --harness <name> [--dry-run] [--base <branch>]
 
-harnesses: claude, codex, opencode (supported) · pi, cursor (verify flags in .agents/harnesses.sh)
+harnesses: codex, cursor (recommended) · claude, opencode (available) · agy (dry-run only, disabled for dispatch) · pi (verify flags)
   --dry-run   render the prompt + plan, touch nothing (no worktree/PR/state change)
   --base      base branch for the worktree/PR (default: main)
 EOF

.agents/harnesses.sh

@@ -11,6 +11,18 @@
 
 # ---- MUST-HAVE ----
 
+harness_disabled_reason() {              # <name> -> reason on stdout; 0 means disabled
+  case "$1" in
+    agy)
+      cat <<'EOF'
+agy is disabled for implementation dispatch as of 2026-07-04: Antigravity headless mode was observed to ignore prompts with --new-project, resume stale conversations without it, and hang past print timeouts. Use codex or cursor until a fresh headless invocation is verified.
+EOF
+      return 0
+      ;;
+    *) return 1 ;;
+  esac
+}
+
 harness_claude() {                      # Claude Code — print mode, auto-accept edits
   local dir="$1" prompt="$2"
   ( cd "$dir" && claude -p "$(cat "$prompt")" --permission-mode acceptEdits )
@@ -31,14 +43,11 @@ harness_cursor() {                      # Cursor CLI agent — composer-2.5, hea
   ( cd "$dir" && cursor-agent -p "$(cat "$prompt")" --model composer-2.5 --force --trust )
 }
 
-harness_agy() {                         # Antigravity CLI — UNRELIABLE headless (2026-07): with
-  # --new-project it ignores the prompt and asks to scaffold a project; without it, it
-  # resumes the previous conversation (silently keeping its old model — --model only
-  # applies to new conversations) and can hang past the print timeout. Do not trust for
-  # dispatch until fixed upstream; verify with a trivial prompt first.
-  local dir="$1" prompt="$2"
-  ( cd "$dir" && agy --print --print-timeout 60m \
-      --model="Gemini 3.1 Pro (High)" --dangerously-skip-permissions "$(cat "$prompt")" )
+harness_agy() {                         # Antigravity CLI — disabled until headless is verified
+  local reason
+  reason="$(harness_disabled_reason agy)"
+  echo "harness_agy: $reason" >&2
+  return 2
 }
 
 # ---- NICE-TO-HAVE (verify the exact invocation for your version before trusting) ----

.agents/lib/dispatch.sh

@@ -52,6 +52,15 @@ dispatch() { # <issue#> <harness> [--dry-run] [--base <branch>]
   if ! declare -f "harness_$harness" >/dev/null 2>&1; then
     echo "no adapter for harness '$harness' — add harness_$harness() to .agents/harnesses.sh" >&2; return 2
   fi
+  if [ "$dry" != 1 ] && declare -f harness_disabled_reason >/dev/null 2>&1; then
+    local disabled_reason
+    if disabled_reason="$(harness_disabled_reason "$harness")"; then
+      echo "harness '$harness' is disabled for non-dry-run dispatch." >&2
+      echo "  $disabled_reason" >&2
+      echo "  Use --dry-run for prompt inspection, or dispatch with --harness codex/cursor." >&2
+      return 2
+    fi
+  fi
 
   local repo_root title body slug branch wt prompt
   repo_root="$(git rev-parse --show-toplevel)" || return 1

.agents/test/dispatch_disabled_harness_test.sh

@@ -0,0 +1,59 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+ROOT="$(cd "$(dirname "${BASH_SOURCE[0]}")/../.." && pwd)"
+cd "$ROOT"
+
+# shellcheck source=/dev/null
+source "$ROOT/.agents/lib/dispatch.sh"
+
+issue_title() { echo "Disable agy harness smoke"; }
+issue_body() { echo "## Spec"; echo; echo "Smoke prompt body"; }
+get_field() { echo "Ready"; }
+set_stage() { echo "unexpected set_stage $*" >&2; return 99; }
+run_gate() { echo "unexpected run_gate $*" >&2; return 99; }
+
+unexpected_git_file="$(mktemp "${TMPDIR:-/tmp}/boxbox-agy-git.XXXX")"
+rm -f "$unexpected_git_file"
+git() {
+  if [ "${1:-}" = "rev-parse" ]; then
+    command git "$@"
+    return
+  fi
+  echo "unexpected git $*" >&2
+  touch "$unexpected_git_file"
+  return 99
+}
+
+set +e
+non_dry_output="$(dispatch 47 agy 2>&1)"
+non_dry_status=$?
+set -e
+
+[ "$non_dry_status" -eq 2 ] || {
+  echo "expected agy non-dry-run to exit 2, got $non_dry_status" >&2
+  echo "$non_dry_output" >&2
+  exit 1
+}
+[[ "$non_dry_output" == *"harness 'agy' is disabled"* ]] || {
+  echo "expected disabled-harness message" >&2
+  echo "$non_dry_output" >&2
+  exit 1
+}
+[ ! -e "$unexpected_git_file" ] || {
+  echo "agy non-dry-run reached git before failing" >&2
+  echo "$non_dry_output" >&2
+  exit 1
+}
+
+dry_output="$(dispatch 47 agy --dry-run 2>&1)"
+[[ "$dry_output" == *"[dry-run] no worktree / harness / PR / state change"* ]] || {
+  echo "expected agy dry-run to render dispatch preview" >&2
+  echo "$dry_output" >&2
+  exit 1
+}
+[[ "$dry_output" == *"Smoke prompt body"* ]] || {
+  echo "expected agy dry-run prompt body" >&2
+  echo "$dry_output" >&2
+  exit 1
+}

cmd/main.go

@@ -27,6 +27,7 @@ func main() {
 	ingestMeeting := flag.Int("ingest-meeting", 0, "Ingest meeting metadata and Race Hub datasets for all sessions")
 	ingestSession := flag.Int("ingest-session", 0, "Ingest Race Hub datasets for a session key")
 	ingestNews := flag.Bool("ingest-news", false, "Refresh RSS/Atom paddock briefing feeds")
+	prefetchTrackOutlines := flag.Int("prefetch-track-outlines", 0, "Warm the web track-outline cache for a season year (for web-only hosts, run before --web so /api/v1/track-outline can serve live maps)")
 	dryRun := flag.Bool("dry-run", false, "Preview ingestion without writing domain rows")
 	force := flag.Bool("force", false, "Re-ingest datasets even if already tracked in the session_coverage table as completed")
 	coverageYear := flag.Int("coverage", 0, "Show season coverage report for the given year")
@@ -76,11 +77,21 @@ func main() {
 	if *ingestNews {
 		ingestFlags++
 	}
+	if *prefetchTrackOutlines != 0 {
+		ingestFlags++
+	}
 	if ingestFlags > 0 {
 		if ingestFlags > 1 {
-			fmt.Fprintln(os.Stderr, "box-box: only one of --ingest-year, --backfill-season, --ingest-meeting, --ingest-session, or --ingest-news may be set")
+			fmt.Fprintln(os.Stderr, "box-box: only one of --ingest-year, --backfill-season, --ingest-meeting, --ingest-session, --ingest-news, or --prefetch-track-outlines may be set")
 			os.Exit(1)
 		}
+		if *prefetchTrackOutlines != 0 {
+			if err := runTrackOutlinePrefetch(client, *prefetchTrackOutlines); err != nil {
+				fmt.Fprintf(os.Stderr, "box-box track outline prefetch error: %v\n", err)
+				os.Exit(1)
+			}
+			return
+		}
 		if *ingestNews {
 			if err := runNewsIngestion(*dryRun, *dbPath); err != nil {
 				fmt.Fprintf(os.Stderr, "box-box ingest error: %v\n", err)
@@ -174,6 +185,35 @@ func runIngestion(client *api.OpenF1Client, year, meetingKey, sessionKey int, fo
 	return err
 }
 
+func runTrackOutlinePrefetch(client *api.OpenF1Client, year int) error {
+	log.SetOutput(os.Stderr)
+
+	fmt.Fprintf(os.Stderr, "track outlines: warming HTTP cache %s for %d\n", api.DefaultCacheDBPath(), year)
+
+	meetings, err := client.GetMeetingsForYear(year)
+	if err != nil {
+		return fmt.Errorf("fetch meetings for %d: %w", year, err)
+	}
+
+	result := client.PrefetchTrackOutlinesForYear(year, meetings)
+	fmt.Printf(
+		"track outlines %d: cached %d/%d unique circuit(s) before, %d/%d after; %d skipped, %d fetched, %d failed\n",
+		result.Year,
+		result.CachedBefore,
+		result.UniqueCircuits,
+		result.CachedAfter,
+		result.UniqueCircuits,
+		result.Skipped,
+		result.Fetched,
+		result.Failed,
+	)
+
+	if result.CachedAfter == 0 {
+		return fmt.Errorf("cached zero track outlines for %d", year)
+	}
+	return nil
+}
+
 func runNewsIngestion(dryRun bool, dbPath string) error {
 	log.SetOutput(os.Stderr)
 

frontend/src/components/CompareView.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react'
+import { useEffect, useMemo, useRef, useState } from 'react'
 import { useQuery } from '@tanstack/react-query'
 import { fetchLapsComparison, fetchTelemetry } from '../api'
 import {
@@ -57,16 +57,23 @@ export function CompareView({ sessionKey, results, drivers }: Props) {
     [results, drivers],
   )
 
+  const previousSessionKey = useRef(sessionKey)
   const [driverA, setDriverA] = useState<number | null>(initialPair?.[0] ?? null)
   const [driverB, setDriverB] = useState<number | null>(initialPair?.[1] ?? null)
 
   useEffect(() => {
+    if (previousSessionKey.current !== sessionKey) {
+      previousSessionKey.current = sessionKey
+      setDriverA(initialPair?.[0] ?? null)
+      setDriverB(initialPair?.[1] ?? null)
+      return
+    }
+
     if (driverA != null && driverB != null) return
-    const pair = defaultCompareDriverNumbers(results, drivers)
-    if (!pair) return
-    setDriverA(pair[0])
-    setDriverB(pair[1])
-  }, [results, drivers, driverA, driverB])
+    if (!initialPair) return
+    setDriverA(initialPair[0])
+    setDriverB(initialPair[1])
+  }, [sessionKey, initialPair, driverA, driverB])
 
   const pair = useMemo((): [number, number] | null => {
     if (driverA == null || driverB == null || driverA === driverB) return null
@@ -222,7 +229,9 @@ export function CompareView({ sessionKey, results, drivers }: Props) {
         <div>
           <div className="compare-section-title">Race pace</div>
           <div className="compare-section-meta">
-            Cumulative lap-time delta vs {referenceLabel ?? 'reference'}
+            Cumulative lap-time delta vs {referenceLabel ?? 'reference'}. Deltas are plotted
+            only where the reference lap is valid; gaps appear when the reference has no lap
+            time.
           </div>
         </div>
         <SectionState

frontend/src/components/Meaning.tsx

@@ -0,0 +1,26 @@
+import type { ReactNode } from 'react'
+import '../styles/meaning.css'
+
+export interface MeaningProps {
+  value: ReactNode
+  meaning?: string | null
+  /** Long-form explanation for the native tooltip; falls back to meaning. */
+  title?: string | null
+  tone?: 'good' | 'bad' | 'neutral' | 'warn'
+}
+
+export function Meaning({ value, meaning, title, tone }: MeaningProps) {
+  if (!meaning) {
+    return <>{value}</>
+  }
+
+  const tooltip = title ?? meaning
+  const toneClass = tone ? `meaning-caption--${tone}` : ''
+
+  return (
+    <span className="meaning" title={tooltip}>
+      <span className="meaning-value">{value}</span>
+      <span className={`meaning-caption ${toneClass}`.trim()}>{meaning}</span>
+    </span>
+  )
+}

frontend/src/components/StrategyView.tsx

@@ -12,7 +12,7 @@ interface Props {
   hasStints: boolean
 }
 
-export function StrategyView({ results, stints, pit_stops: _pitStops, hasStints }: Props) {
+export function StrategyView({ results, stints, pit_stops, hasStints }: Props) {
   if (!hasStints) {
     return (
       <div>
@@ -88,6 +88,10 @@ export function StrategyView({ results, stints, pit_stops: _pitStops, hasStints
         lapEnd: s.lap_end,
         isNew: s.tyre_age_at_start === 0,
       })),
+    pitStops: pit_stops
+      .filter((p) => p.driver_number === driver.driver_number)
+      .map((p) => p.lap_number)
+      .sort((a, b) => a - b),
   }))
 
   return (

frontend/src/components/charts/TyreStintTimeline.tsx

@@ -12,6 +12,8 @@ export interface StintTimelineRow {
   label: string
   color: string
   stints: StintTimelineStint[]
+  /** Lap numbers where the driver pitted; optional — rows without stops render normally. */
+  pitStops?: number[]
 }
 
 interface TyreStintTimelineProps {
@@ -57,6 +59,14 @@ function stintBarW(stint: StintTimelineStint, totalLaps: number): number {
   return Math.max(2, (stintLength(stint) / totalLaps) * BAR_W)
 }
 
+function pitMarkerX(lapNumber: number, totalLaps: number): number {
+  return LEFT + ((lapNumber - 1) / totalLaps) * BAR_W
+}
+
+function pitMarkerTitle(driverLabel: string, lapNumber: number): string {
+  return `${driverLabel} pit stop · L${lapNumber}`
+}
+
 function axisTicks(totalLaps: number): number[] {
   const ticks: number[] = []
   for (let lap = 0; lap <= totalLaps; lap += 10) {
@@ -130,6 +140,21 @@ export function TyreStintTimeline({ rows, totalLaps }: TyreStintTimelineProps) {
                     <title>{stintTitle(stint)}</title>
                   </rect>
                 ))}
+
+                {(row.pitStops ?? []).map((lapNumber, pi) => (
+                  <line
+                    key={`pit-${pi}`}
+                    x1={pitMarkerX(lapNumber, safeTotal)}
+                    x2={pitMarkerX(lapNumber, safeTotal)}
+                    y1={BAR_Y - 3}
+                    y2={BAR_Y + BAR_H + 3}
+                    className="stint-timeline__pit-marker"
+                    data-testid="pit-marker"
+                    data-lap={lapNumber}
+                  >
+                    <title>{pitMarkerTitle(row.label, lapNumber)}</title>
+                  </line>
+                ))}
               </g>
             )
           })}

frontend/src/components/live/SessionBanner.tsx

@@ -5,18 +5,20 @@ import { WeatherStrip } from './WeatherStrip'
 
 interface Props {
   isLive: boolean
+  isArchive?: boolean
   snapshot: LiveStreamData
   rows: LiveTimingRow[]
   connection: 'connected' | 'connecting' | 'disconnected' | 'error'
   now: number
 }
 
-export function SessionBanner({ isLive, snapshot, rows, connection, now }: Props) {
+export function SessionBanner({ isLive, isArchive = false, snapshot, rows, connection, now }: Props) {
   const session = snapshot.Session
   const clock = extrapolateClock(snapshot.Clock, snapshot.ClockRefTime, snapshot.ClockExtrapolating, now)
   const display = liveSessionDisplay(session, rows)
   const atRiskLabel =
     display.atRiskStart && display.atRiskEnd ? `P${display.atRiskStart}-P${display.atRiskEnd} at risk` : ''
+  const stateLabel = isLive ? 'live' : isArchive ? 'archive' : 'stale'
 
   return (
     <section className="live-banner">
@@ -39,7 +41,7 @@ export function SessionBanner({ isLive, snapshot, rows, connection, now }: Props
             <span>
               L<strong>{snapshot.CurrentLap || '-'}</strong>/<strong>{snapshot.TotalLaps || '-'}</strong>
             </span>
-            <span className={isLive ? 'live-state live-state-on' : 'live-state'}>{isLive ? 'live' : 'stale'}</span>
+            <span className={isLive ? 'live-state live-state-on' : 'live-state'}>{stateLabel}</span>
           </div>
         </div>
       </div>

frontend/src/components/live/TimingTower.tsx

@@ -12,6 +12,9 @@ import {
   tyreLabel,
 } from '../../lib/live'
 import type { GapHistoryMap } from '../../lib/gapHistory'
+import { parseIntervalSeconds } from '../../lib/gapHistory'
+import { intervalMeaning } from '../../lib/meaning'
+import { Meaning } from '../Meaning'
 import { GapSparkline } from './GapSparkline'
 import { StintHistory } from './StintHistory'
 import { Pin } from 'lucide-react'
@@ -100,6 +103,10 @@ export function TimingTower({
             const showCutoffAfter = row.Position === sessionDisplay.cutoffPosition
 
             const gapText = gapMode === 'interval' && isRace ? (driver.Interval || driver.GapToLeader) : driver.GapToLeader
+            const intervalAnnotation =
+              gapMode === 'interval' && isRace && row.Position > 1
+                ? intervalMeaning(parseIntervalSeconds(gapText))
+                : null
 
             const renderSector = (idx: number) => {
               const sec = driver.Sectors?.[idx]
@@ -149,7 +156,14 @@ export function TimingTower({
                   <td className={driver.LastLapOB ? 'mono lap-ob' : driver.LastLapPB ? 'mono lap-pb' : 'mono'}>
                     {driver.LastLapTime || '-'}
                   </td>
-                  <td className="mono">{gapText || '-'}</td>
+                  <td className="mono">
+                    <Meaning
+                      value={gapText || '-'}
+                      meaning={intervalAnnotation?.caption}
+                      title={intervalAnnotation?.title}
+                      tone={intervalAnnotation?.tone}
+                    />
+                  </td>
                   
                   {isRace && (
                     <td className="spark-cell">

frontend/src/components/live/TyreDegPanel.tsx

@@ -13,6 +13,8 @@ import {
   recordStintSamples,
   stintInputFromRow,
 } from '../../lib/tyredeg'
+import { tyreAgeMeaning } from '../../lib/meaning'
+import { Meaning } from '../Meaning'
 import '../../styles/tyredeg.css'
 
 const TOP_DRIVER_COUNT = 10
@@ -92,12 +94,20 @@ export function TyreDegPanel({ rows, sessionType, pinned }: Props) {
           {visible.map((row) => {
             const model = degradationModel(stints[row.RacingNumber]?.samples ?? [])
             const rejoin = isRace ? estimatePitRejoin(rows, row.RacingNumber) : null
+            const ageAnnotation = tyreAgeMeaning(row.Tyre?.Compound, row.Tyre?.Age)
             return (
               <div className="tyredeg-row" key={row.RacingNumber} data-testid="tyredeg-row">
                 <span className="tyredeg-pos mono">P{row.Position}</span>
                 <span className="drv-bar" style={{ background: teamColor(row.Info?.TeamColour) }} />
                 <span className="drv-code">{driverCode(row)}</span>
-                <span className={`tyre-badge ${compoundClass(row.Tyre?.Compound)}`}>{tyreLabel(row.Tyre)}</span>
+                <span className={`tyre-badge ${compoundClass(row.Tyre?.Compound)}`}>
+                  <Meaning
+                    value={tyreLabel(row.Tyre)}
+                    meaning={ageAnnotation?.caption}
+                    title={ageAnnotation?.title}
+                    tone={ageAnnotation?.tone}
+                  />
+                </span>
                 {model ? (
                   <>
                     <span className={`tyredeg-trend tyredeg-trend-${model.trend}`}>

frontend/src/lib/delta.ts

@@ -21,15 +21,31 @@ export function formatDeltaSeconds(delta: number): string {
   return `${sign}${delta.toFixed(1)}s`
 }
 
-function buildCumulative(lapTimes: ReadonlyArray<number | null>): number[] {
+/**
+ * Cumulative lap time aligned to reference-valid laps only.
+ * Laps where the reference is null are skipped for every series so later deltas
+ * do not compare against a frozen baseline while challengers keep accumulating.
+ */
+function buildAlignedCumulative(
+  lapTimes: ReadonlyArray<number | null>,
+  referenceLapTimes: ReadonlyArray<number | null>,
+): number[] {
   const cumulative: number[] = []
   let running = 0
-  for (const lap of lapTimes) {
-    if (lap !== null) {
+  const length = Math.max(lapTimes.length, referenceLapTimes.length)
+
+  for (let i = 0; i < length; i++) {
+    if (referenceLapTimes[i] == null) {
+      cumulative.push(running)
+      continue
+    }
+    const lap = lapTimes[i]
+    if (lap != null) {
       running += lap
     }
     cumulative.push(running)
   }
+
   return cumulative
 }
 
@@ -47,7 +63,8 @@ function resolveReference(
 /**
  * Compute per-lap cumulative time delta for each non-reference driver.
  * Positive = behind reference; negative = ahead.
- * Null laps carry cumulative forward but emit null in deltas (skip when plotting).
+ * Deltas are only emitted where the reference lap is valid; reference-null laps
+ * gap every series. Challenger-null laps gap only that driver's line.
  */
 export function computeCumulativeDeltas(
   series: ReadonlyArray<DeltaSeries>,
@@ -56,24 +73,22 @@ export function computeCumulativeDeltas(
   const reference = resolveReference(series, referenceLabel)
   if (!reference) return []
 
-  const refCumulative = buildCumulative(reference.lapTimes)
+  const refLapTimes = reference.lapTimes
+  const refCumulative = buildAlignedCumulative(refLapTimes, refLapTimes)
 
   return series
     .filter((s) => s.label !== reference.label)
     .map((driver) => {
-      const driverCumulative = buildCumulative(driver.lapTimes)
+      const driverCumulative = buildAlignedCumulative(driver.lapTimes, refLapTimes)
       const lapCount = Math.max(driver.lapTimes.length, refCumulative.length)
       const deltas: (number | null)[] = []
 
       for (let i = 0; i < lapCount; i++) {
-        if (driver.lapTimes[i] === null) {
+        if (refLapTimes[i] == null || driver.lapTimes[i] == null) {
           deltas.push(null)
           continue
         }
-        const refValue = refCumulative[i] ?? refCumulative[refCumulative.length - 1] ?? 0
-        const driverValue =
-          driverCumulative[i] ?? driverCumulative[driverCumulative.length - 1] ?? 0
-        deltas.push(driverValue - refValue)
+        deltas.push(driverCumulative[i] - refCumulative[i])
       }
 
       return {

frontend/src/lib/meaning.ts

@@ -0,0 +1,146 @@
+// Pure interpretation helpers for pairing numbers with their "so-what".
+// Thresholds are exported consts so they are cheap to tune in one place.
+
+import { PIT_LOSS_SECONDS } from './tyredeg'
+
+/** Gaps under this (seconds) are DRS attack range. */
+export const INTERVAL_DRS_MAX_SECONDS = 1.0
+
+/** Lower bound of the undercut window (seconds); contiguous with DRS range. */
+export const INTERVAL_UNDERCUT_MIN_SECONDS = INTERVAL_DRS_MAX_SECONDS
+
+/**
+ * Upper bound of the undercut window (seconds). Kept well below typical pit
+ * loss ({@link PIT_LOSS_SECONDS}s) — only a few seconds matter for strategy.
+ */
+export const INTERVAL_UNDERCUT_MAX_SECONDS = Math.min(3.0, PIT_LOSS_SECONDS / 7)
+
+/**
+ * Rough per-compound cliff lap estimates (dry compounds). Wet/intermediate
+ * values are conservative — deg varies wildly with conditions.
+ */
+export const TYRE_CLIFF_LAPS: Readonly<Record<string, number>> = {
+  SOFT: 18,
+  MEDIUM: 28,
+  HARD: 38,
+  INTERMEDIATE: 20,
+  WET: 15,
+}
+
+/** Default cliff when compound is unknown. */
+export const TYRE_CLIFF_DEFAULT_LAPS = 25
+
+/** Championship max points per race (winner). */
+export const MAX_POINTS_PER_ROUND = 25
+
+export interface MeaningAnnotation {
+  caption: string
+  title: string
+  tone?: 'good' | 'bad' | 'neutral' | 'warn'
+}
+
+function cliffLaps(compound: string | null | undefined): number {
+  if (!compound) return TYRE_CLIFF_DEFAULT_LAPS
+  return TYRE_CLIFF_LAPS[compound.toUpperCase()] ?? TYRE_CLIFF_DEFAULT_LAPS
+}
+
+/**
+ * Interval / gap-to-ahead meaning for the live timing tower.
+ * Returns null for leader gaps, out-of-range values, or unparsable input.
+ */
+export function intervalMeaning(seconds: number | null | undefined): MeaningAnnotation | null {
+  if (seconds == null || !Number.isFinite(seconds) || seconds < 0) return null
+
+  if (seconds < INTERVAL_DRS_MAX_SECONDS) {
+    return {
+      caption: 'DRS range',
+      title: `Within ${INTERVAL_DRS_MAX_SECONDS}s — DRS enabled next straight`,
+      tone: 'good',
+    }
+  }
+
+  if (seconds >= INTERVAL_UNDERCUT_MIN_SECONDS && seconds <= INTERVAL_UNDERCUT_MAX_SECONDS) {
+    return {
+      caption: 'undercut window',
+      title: `${INTERVAL_UNDERCUT_MIN_SECONDS}–${INTERVAL_UNDERCUT_MAX_SECONDS}s — pit now could gain a position (vs ~${PIT_LOSS_SECONDS}s stop)`,
+      tone: 'warn',
+    }
+  }
+
+  return null
+}
+
+/**
+ * Tyre-age meaning for deg / stint panels.
+ */
+export function tyreAgeMeaning(
+  compound: string | null | undefined,
+  age: number | null | undefined,
+): MeaningAnnotation | null {
+  if (age == null || !Number.isFinite(age) || age < 0) return null
+
+  const cliff = cliffLaps(compound)
+  const freshEnd = Math.ceil(cliff * 0.25)
+  const midEnd = Math.ceil(cliff * 0.65)
+
+  if (age <= freshEnd) {
+    return {
+      caption: 'fresh',
+      title: `${age} lap${age === 1 ? '' : 's'} on ${compound ?? 'tyre'} — early stint grip`,
+      tone: 'good',
+    }
+  }
+
+  if (age <= midEnd) {
+    return {
+      caption: 'mid-life',
+      title: `${age} laps — tyre in its working window before cliff (~${cliff} laps)`,
+      tone: 'neutral',
+    }
+  }
+
+  const lapsToCliff = cliff - age
+  if (lapsToCliff <= 0) {
+    return {
+      caption: 'past cliff',
+      title: `${age} laps — beyond typical ${compound ?? 'tyre'} cliff (~${cliff} laps)`,
+      tone: 'bad',
+    }
+  }
+
+  return {
+    caption: `~${lapsToCliff} laps to cliff`,
+    title: `${age} of ~${cliff} laps before deg cliff on ${compound ?? 'tyre'}`,
+    tone: 'warn',
+  }
+}
+
+/**
+ * Points gap to the driver directly ahead — catchable-or-not v1.
+ */
+export function pointsGapMeaning(
+  gapToAhead: number | null | undefined,
+  roundsLeft: number,
+  driverAhead?: string | null,
+): MeaningAnnotation | null {
+  if (gapToAhead == null || !Number.isFinite(gapToAhead) || gapToAhead <= 0) return null
+  if (!Number.isFinite(roundsLeft) || roundsLeft <= 0) return null
+
+  const maxCatchable = roundsLeft * MAX_POINTS_PER_ROUND
+  const ahead = driverAhead?.trim() || 'ahead'
+
+  if (gapToAhead > maxCatchable) {
+    return {
+      caption: 'out of reach',
+      title: `+${gapToAhead} pts with ${roundsLeft} round${roundsLeft === 1 ? '' : 's'} left (max ${maxCatchable} available)`,
+      tone: 'bad',
+    }
+  }
+
+  const perRound = Math.ceil(gapToAhead / roundsLeft)
+  return {
+    caption: `~${perRound} pts/round`,
+    title: `Needs ~${perRound} pts per round on ${ahead} to catch (${gapToAhead} pts in ${roundsLeft} round${roundsLeft === 1 ? '' : 's'})`,
+    tone: perRound <= 10 ? 'good' : 'warn',
+  }
+}

frontend/src/pages/ChampionshipPage.tsx

@@ -4,6 +4,8 @@ import { fetchChampionshipHub, fetchSeasons } from '../api'
 import { teamColor } from '../utils'
 import type { ChampHubDriver, ChampionshipHub } from '../types'
 import { ChampionshipSimulator } from '../components/ChampionshipSimulator'
+import { Meaning } from '../components/Meaning'
+import { pointsGapMeaning } from '../lib/meaning'
 
 type View = 'drivers' | 'constructors' | 'progression' | 'simulator'
 
@@ -138,6 +140,8 @@ function ChampionshipBody({ hub, view, setView }: BodyProps) {
           color: teamColor(d.team_colour),
           gapLeader: i === 0 ? 'LEADER' : `+${fmtPts(gapLeaderNum)}`,
           gapAhead: gapAheadNum == null ? '—' : `+${fmtPts(gapAheadNum)}`,
+          gapAheadNum,
+          driverAhead: i === 0 ? null : drivers[i - 1].name_acronym,
           spark: sparkPoints(d.form),
           h2h: `${d.teammate_wins}–${d.teammate_losses}`,
           h2hWin: d.teammate_wins >= d.teammate_losses,
@@ -233,7 +237,12 @@ function ChampionshipBody({ hub, view, setView }: BodyProps) {
       </div>
 
       {view === 'drivers' && (
-        <DriversView enriched={enriched} leaderPoints={leader.points} titleMath={titleMath} />
+        <DriversView
+          enriched={enriched}
+          leaderPoints={leader.points}
+          titleMath={titleMath}
+          roundsLeft={hub.rounds_left}
+        />
       )}
       {view === 'constructors' && <ConstructorsView hub={hub} />}
       {view === 'progression' && <ProgressionView hub={hub} />}
@@ -248,6 +257,8 @@ interface EnrichedDriver {
   color: string
   gapLeader: string
   gapAhead: string
+  gapAheadNum: number | null
+  driverAhead: string | null
   spark: string
   h2h: string
   h2hWin: boolean
@@ -259,10 +270,12 @@ function DriversView({
   enriched,
   leaderPoints,
   titleMath,
+  roundsLeft,
 }: {
   enriched: EnrichedDriver[]
   leaderPoints: number
   titleMath: string
+  roundsLeft: number
 }) {
   const podium = enriched.slice(0, 3)
   return (
@@ -357,7 +370,19 @@ function DriversView({
                 <td className="champ-td-team">{e.d.team_name}</td>
                 <td className="r mono champ-td-pts">{fmtPts(e.d.points)}</td>
                 <td className="r mono champ-td-muted">{e.gapLeader}</td>
-                <td className="r mono champ-td-dim">{e.gapAhead}</td>
+                <td className="r mono champ-td-dim">
+                  {(() => {
+                    const gapAnnotation = pointsGapMeaning(e.gapAheadNum, roundsLeft, e.driverAhead)
+                    return (
+                      <Meaning
+                        value={e.gapAhead}
+                        meaning={gapAnnotation?.caption}
+                        title={gapAnnotation?.title}
+                        tone={gapAnnotation?.tone}
+                      />
+                    )
+                  })()}
+                </td>
                 <td className="c mono" style={{ color: e.d.wins > 0 ? 'var(--text)' : 'var(--text-3)' }}>
                   {e.d.wins}
                 </td>

frontend/src/pages/LiveTimingPage.tsx

@@ -27,12 +27,16 @@ import { EventRail } from '../components/live/EventRail'
 import { TeamRadioTicker } from '../components/live/TeamRadioTicker'
 import { TrackMap } from '../components/live/TrackMap'
 import { TyreDegPanel } from '../components/live/TyreDegPanel'
-import { Radio } from 'lucide-react'
+import { Archive, Radio } from 'lucide-react'
 
 type StreamStatus = 'connecting' | 'connected' | 'disconnected' | 'error'
 
 export function LiveTimingPage() {
-  const [snapshot, setSnapshot] = useState<LiveStreamData | null>(null)
+  const [activeSnapshot, setActiveSnapshot] = useState<LiveStreamData | null>(null)
+  const [archiveSnapshot, setArchiveSnapshot] = useState<LiveStreamData | null>(null)
+  const [archivePositions, setArchivePositions] = useState<Record<string, LivePosition>>({})
+  const [archiveSnapshotAt, setArchiveSnapshotAt] = useState<string | null>(null)
+  const [archiveMode, setArchiveMode] = useState(false)
   const [isLive, setIsLive] = useState(false)
   const [streamStatus, setStreamStatus] = useState<StreamStatus>('connecting')
   const [now, setNow] = useState(Date.now())
@@ -43,6 +47,10 @@ export function LiveTimingPage() {
   const [events, setEvents] = useState<LiveEvent[]>([])
   const prevSnapshotRef = useRef<LiveStreamData | null>(null)
   const sessionSigRef = useRef('')
+  const isLiveRef = useRef(false)
+  const archiveModeRef = useRef(false)
+  const snapshot = isLive ? activeSnapshot : archiveMode ? archiveSnapshot : null
+  const hasArchive = Boolean(archiveSnapshot)
 
   const { data, isLoading, isError, error } = useQuery({
     queryKey: ['live-state'],
@@ -64,10 +72,29 @@ export function LiveTimingPage() {
 
   useEffect(() => {
     if (!data) return
-    setIsLive(data.is_live)
-    setSnapshot(data.data)
+    const nextLive = data.is_live && Boolean(data.data)
+    setIsLive(nextLive)
+    isLiveRef.current = nextLive
+    if (nextLive && data.data) {
+      setActiveSnapshot(data.data)
+      setArchiveMode(false)
+      return
+    }
+
+    setActiveSnapshot(null)
+    setArchiveSnapshot(data.last_snapshot ?? null)
+    setArchivePositions(data.last_positions ?? {})
+    setArchiveSnapshotAt(data.last_snapshot_at ?? null)
+    setArchiveMode((current) => current && Boolean(data.last_snapshot))
   }, [data])
 
+  useEffect(() => {
+    archiveModeRef.current = archiveMode
+    if (archiveMode) {
+      setPositions(archivePositions)
+    }
+  }, [archiveMode, archivePositions])
+
   useEffect(() => {
     const timer = window.setInterval(() => setNow(Date.now()), 1000)
     return () => window.clearInterval(timer)
@@ -90,8 +117,23 @@ export function LiveTimingPage() {
     events.addEventListener('snapshot', (event) => {
       const state = parseLiveStateEvent(event.data)
       if (!state || cancelled) return
-      setIsLive(state.is_live)
-      setSnapshot(state.data)
+      const nextLive = state.is_live && Boolean(state.data)
+      setIsLive(nextLive)
+      if (nextLive && state.data) {
+        if (!isLiveRef.current || archiveModeRef.current) {
+          setPositions({})
+        }
+        isLiveRef.current = true
+        setActiveSnapshot(state.data)
+        setArchiveMode(false)
+      } else {
+        isLiveRef.current = false
+        setActiveSnapshot(null)
+        setArchiveSnapshot(state.last_snapshot ?? null)
+        setArchivePositions(state.last_positions ?? {})
+        setArchiveSnapshotAt(state.last_snapshot_at ?? null)
+        setArchiveMode((current) => current && Boolean(state.last_snapshot))
+      }
       setStreamStatus('connected')
     })
 
@@ -174,6 +216,19 @@ export function LiveTimingPage() {
     setPinned((prev) => togglePin(prev, racingNumber))
   }
 
+  const handleViewArchive = () => {
+    if (!archiveSnapshot) return
+    setIsLive(false)
+    setArchiveMode(true)
+    setPositions(archivePositions)
+  }
+
+  const archiveTimestamp = archiveSnapshotAt ? new Date(archiveSnapshotAt) : null
+  const archiveLabel =
+    archiveTimestamp && !Number.isNaN(archiveTimestamp.getTime())
+      ? `Archived snapshot from ${archiveTimestamp.toLocaleString()}`
+      : 'Archived live timing snapshot'
+
   return (
     <div className="page live-page" data-testid="live-page">
       {isError && (
@@ -182,12 +237,18 @@ export function LiveTimingPage() {
         </div>
       )}
 
-      {streamStatus === 'disconnected' && snapshot && (
+      {streamStatus === 'disconnected' && snapshot && !archiveMode && (
         <div className="live-status-strip live-status-warn">
           Stream disconnected — showing last received snapshot
         </div>
       )}
 
+      {archiveMode && snapshot && (
+        <div className="live-status-strip live-status-archive" data-testid="live-archive-strip">
+          {archiveLabel} — live updates are paused for this archive view
+        </div>
+      )}
+
       {isLoading && !snapshot && (
         <div className="loading-state">connecting to live timing…</div>
       )}
@@ -202,12 +263,25 @@ export function LiveTimingPage() {
           <p className="empty-state-desc" style={{ color: 'var(--text-2)' }}>
             The telemetry feed is currently offline. <br /><br /> Check the <a href="/" style={{ color: 'var(--red)', textDecoration: 'underline' }}>Command Center</a> for the weekend schedule or explore historical data in the <a href="/race-hub" style={{ color: 'var(--red)', textDecoration: 'underline' }}>Race Hub</a>.
           </p>
+          {hasArchive && (
+            <button type="button" className="live-archive-btn" onClick={handleViewArchive}>
+              <Archive size={15} />
+              View Last Session
+            </button>
+          )}
         </div>
       )}
 
       {snapshot && (
         <>
-          <SessionBanner isLive={isLive} snapshot={snapshot} rows={rows} connection={streamStatus} now={now} />
+          <SessionBanner
+            isLive={isLive}
+            isArchive={archiveMode}
+            snapshot={snapshot}
+            rows={rows}
+            connection={streamStatus}
+            now={now}
+          />
           <TrackStatusBanner status={snapshot.TrackStatus} />
           <PinnedDrivers rows={rows} history={gapHistory} pinned={pinned} onToggle={handleTogglePin} />
           <TrackMap

frontend/src/styles/app.css

@@ -808,6 +808,12 @@ a { color: inherit; text-decoration: none; }
   color: var(--yellow);
 }
 
+.live-status-archive {
+  background: rgba(70, 140, 255, 0.08);
+  border: 1px solid rgba(70, 140, 255, 0.24);
+  color: #8bb7ff;
+}
+
 /* ── Live empty state ── */
 .live-empty-status {
   display: flex;
@@ -815,6 +821,29 @@ a { color: inherit; text-decoration: none; }
   margin-bottom: var(--s4);
 }
 
+.live-archive-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--s2);
+  margin-top: var(--s5);
+  min-height: 36px;
+  padding: 0 var(--s4);
+  border: 1px solid rgba(255, 255, 255, 0.16);
+  border-radius: 4px;
+  background: rgba(255, 255, 255, 0.06);
+  color: var(--text);
+  font-family: var(--f-mono);
+  font-size: 11px;
+  font-weight: 800;
+  text-transform: uppercase;
+}
+
+.live-archive-btn:hover {
+  border-color: rgba(255, 255, 255, 0.28);
+  background: rgba(255, 255, 255, 0.1);
+}
+
 .mono { font-family: var(--f-mono); }
 
 .live-conn,

frontend/src/styles/meaning.css

@@ -0,0 +1,48 @@
+/* Compact value + muted meaning caption (issue #18). */
+
+.meaning {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: inherit;
+  gap: 1px;
+  line-height: 1.2;
+}
+
+.meaning-value {
+  /* inherits table cell mono styling from parent */
+}
+
+.meaning-caption {
+  font-size: 10px;
+  font-family: var(--f-mono);
+  color: var(--text-3);
+  letter-spacing: 0.02em;
+  white-space: nowrap;
+}
+
+.meaning-caption--good {
+  color: var(--green);
+}
+
+.meaning-caption--bad {
+  color: var(--red);
+}
+
+.meaning-caption--warn {
+  color: var(--yellow, #e8c547);
+}
+
+.meaning-caption--neutral {
+  color: var(--text-3);
+}
+
+/* Table cells: right-align caption under numeric values */
+td.r .meaning,
+.champ-td-dim .meaning,
+.champ-td-muted .meaning {
+  align-items: flex-end;
+}
+
+.tyredeg-row .meaning {
+  align-items: flex-start;
+}

frontend/src/styles/stint-timeline.css

@@ -40,6 +40,13 @@
   stroke-dasharray: 2 1;
 }
 
+.stint-timeline__pit-marker {
+  stroke: var(--text);
+  stroke-width: 1.5;
+  opacity: 0.7;
+  pointer-events: stroke;
+}
+
 .stint-timeline__axis-tick {
   font-family: var(--f-mono);
   font-size: 9px;

frontend/src/test/ChampionshipPage.test.tsx

@@ -112,6 +112,7 @@ describe('ChampionshipPage', () => {
     expect(screen.getAllByText('VER').length).toBeGreaterThan(0)
     expect(screen.getByText('Monaco GP', { exact: false })).toBeInTheDocument()
     expect(screen.getByTestId('champ-titlemath')).toHaveTextContent('mathematically win the title')
+    expect(screen.getAllByText('~10 pts/round').length).toBeGreaterThan(0)
   })
 
   it('switches to constructors and progression views', async () => {

frontend/src/test/LiveComponents.test.tsx

@@ -189,6 +189,26 @@ describe('TimingTower', () => {
     expect(screen.getByText(/no driver timing rows/i)).toBeInTheDocument()
   })
 
+  it('annotates DRS-range intervals in race mode', () => {
+    const raceRows = [
+      makeRow('1', 1, 'VER'),
+      makeRow('4', 2, 'NOR', { Interval: '+0.4', GapToLeader: '+0.4' }),
+    ]
+    render(
+      <TimingTower
+        rows={raceRows}
+        session={{
+          MeetingName: 'Monaco Grand Prix',
+          CircuitName: 'Monaco',
+          SessionType: 'Race',
+          SessionName: 'Race',
+          Path: '',
+        }}
+      />,
+    )
+    expect(screen.getByText('DRS range')).toBeInTheDocument()
+  })
+
   it('renders the SQ1 cutoff after P17 and marks rows below as at risk', () => {
     const sprintRows = Array.from({ length: 22 }, (_, index) =>
       makeRow(String(index + 1), index + 1, `D${index + 1}`),

frontend/src/test/LiveTimingPage.test.tsx

@@ -0,0 +1,155 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { fireEvent, render, screen, waitFor } from '@testing-library/react'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { LiveTimingPage } from '../pages/LiveTimingPage'
+import type { LiveStateResponse, LiveStreamData } from '../types'
+
+vi.mock('../api', () => ({
+  fetchLiveState: vi.fn(),
+  fetchLiveTrackOutline: vi.fn(),
+}))
+
+import { fetchLiveState, fetchLiveTrackOutline } from '../api'
+
+const mockFetchLiveState = vi.mocked(fetchLiveState)
+const mockFetchLiveTrackOutline = vi.mocked(fetchLiveTrackOutline)
+
+class MockEventSource {
+  onopen: (() => void) | null = null
+  onerror: (() => void) | null = null
+
+  constructor() {
+    setTimeout(() => this.onopen?.(), 0)
+  }
+
+  addEventListener() {}
+  close() {}
+}
+
+const archivedSnapshot: LiveStreamData = {
+  Drivers: {
+    '1': {
+      RacingNumber: '1',
+      Position: 1,
+      PrevPosition: 1,
+      GapToLeader: '',
+      Interval: '',
+      LastLapTime: '1:21.345',
+      LastLapPB: false,
+      LastLapOB: false,
+      BestLapTime: '1:20.987',
+      BestLapPB: false,
+      BestLapOB: false,
+      BestLapNum: 22,
+      InPit: false,
+      PitOut: false,
+      Retired: false,
+      KnockedOut: false,
+      Cutoff: false,
+      OnFlyingLap: false,
+      NumberOfLaps: 30,
+      SpeedTrap: '',
+      Sectors: [],
+    },
+  },
+  DriverInfo: {
+    '1': {
+      RacingNumber: '1',
+      BroadcastName: 'M VERSTAPPEN',
+      Tla: 'VER',
+      TeamName: 'Red Bull Racing',
+      TeamColour: '3671C6',
+      FirstName: 'Max',
+      LastName: 'Verstappen',
+    },
+  },
+  Tyres: {
+    '1': { Compound: 'HARD', New: false, Age: 12 },
+  },
+  Telemetry: {},
+  RCMessages: [],
+  Weather: {
+    AirTemp: 22,
+    TrackTemp: 41,
+    Humidity: 58,
+    WindSpeed: 3,
+    WindDir: 180,
+    Rainfall: false,
+  },
+  Session: {
+    MeetingName: 'Testonia Grand Prix',
+    CircuitName: 'Testring',
+    SessionType: 'Race',
+    SessionName: 'Race',
+    Path: '',
+  },
+  TeamRadio: [],
+  SessionStatus: 'Finished',
+  TrackStatus: '1',
+  CurrentLap: 57,
+  TotalLaps: 57,
+  Clock: '',
+  ClockRefTime: '',
+  ClockExtrapolating: false,
+  Stints: {},
+}
+
+function renderPage(response: LiveStateResponse) {
+  const queryClient = new QueryClient({
+    defaultOptions: { queries: { retry: false } },
+  })
+  mockFetchLiveState.mockResolvedValue(response)
+  mockFetchLiveTrackOutline.mockResolvedValue({
+    circuit_key: 1,
+    points: [],
+    bounds: { minX: 0, maxX: 1, minY: 0, maxY: 1 },
+  })
+
+  return render(
+    <QueryClientProvider client={queryClient}>
+      <LiveTimingPage />
+    </QueryClientProvider>,
+  )
+}
+
+describe('LiveTimingPage archive mode', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    Object.defineProperty(window, 'EventSource', {
+      value: MockEventSource,
+      writable: true,
+      configurable: true,
+    })
+  })
+
+  it('keeps archived snapshots behind the View Last Session action', async () => {
+    renderPage({
+      is_live: false,
+      data: null,
+      last_snapshot: archivedSnapshot,
+      last_positions: {
+        '1': { x: 10, y: 20, z: 0, status: 'OnTrack' },
+      },
+      last_snapshot_at: '2026-07-04T14:00:00Z',
+    })
+
+    expect(await screen.findByTestId('live-empty')).toHaveTextContent('No live session active')
+    expect(screen.queryByText('Timing Tower')).not.toBeInTheDocument()
+
+    fireEvent.click(screen.getByRole('button', { name: /view last session/i }))
+
+    await waitFor(() => {
+      expect(screen.getByTestId('live-archive-strip')).toHaveTextContent('Archived snapshot')
+    })
+    expect(screen.getByText('Timing Tower')).toBeInTheDocument()
+    expect(screen.getAllByText('VER').length).toBeGreaterThan(0)
+    expect(screen.getByText('archive')).toBeInTheDocument()
+  })
+
+  it('does not show the archive action when no snapshot is retained', async () => {
+    renderPage({ is_live: false, data: null })
+
+    expect(await screen.findByTestId('live-empty')).toHaveTextContent('No live session active')
+    expect(screen.queryByRole('button', { name: /view last session/i })).not.toBeInTheDocument()
+  })
+})

frontend/src/test/Meaning.test.tsx

@@ -0,0 +1,26 @@
+import { describe, expect, it } from 'vitest'
+import { render, screen } from '@testing-library/react'
+import { Meaning } from '../components/Meaning'
+
+describe('Meaning', () => {
+  it('renders bare value when meaning is null', () => {
+    render(<Meaning value="+1.234" meaning={null} />)
+    expect(screen.getByText('+1.234')).toBeInTheDocument()
+    expect(screen.queryByText('DRS range')).not.toBeInTheDocument()
+  })
+
+  it('renders value with caption and tooltip title', () => {
+    render(
+      <Meaning
+        value="+0.4"
+        meaning="DRS range"
+        title="Within 1.0s — DRS enabled next straight"
+        tone="good"
+      />,
+    )
+    const value = screen.getByText('+0.4')
+    expect(value).toBeInTheDocument()
+    expect(screen.getByText('DRS range')).toHaveClass('meaning-caption--good')
+    expect(value.closest('.meaning')).toHaveAttribute('title', 'Within 1.0s — DRS enabled next straight')
+  })
+})

frontend/src/test/StrategyView.test.tsx

@@ -106,6 +106,17 @@ describe('StrategyView — stints available', () => {
     )
     expect(screen.queryByText(/Stints not available/i)).not.toBeInTheDocument()
   })
+
+  it('maps pit_stops into timeline pit markers for the matching driver', () => {
+    const { container } = render(
+      <StrategyView results={results} stints={stints} pit_stops={pitStops} hasStints={true} />
+    )
+    const markers = container.querySelectorAll('[data-testid="pit-marker"]')
+    expect(markers).toHaveLength(1)
+    expect(markers[0]).toHaveAttribute('data-lap', '19')
+    const titles = [...container.querySelectorAll('title')].map((t) => t.textContent)
+    expect(titles).toContain('HAM pit stop · L19')
+  })
 })
 
 describe('StrategyView — stints missing', () => {

frontend/src/test/TyreDegPanel.test.tsx

@@ -52,9 +52,18 @@ describe('TyreDegPanel', () => {
     const panel = screen.getByTestId('tyredeg-panel')
     expect(panel).toHaveTextContent('VER')
     expect(panel).toHaveTextContent('M +5')
+    expect(panel).toHaveTextContent('fresh')
     expect(panel).toHaveTextContent('warming up')
   })
 
+  it('annotates tyre age meaning on stint rows', () => {
+    const rows = [
+      makeRow('1', 1, 'VER', { NumberOfLaps: 10, LastLapTime: '1:30.000' }, { Compound: 'MEDIUM', Age: 12 }),
+    ]
+    render(<TyreDegPanel rows={rows} sessionType="Race" pinned={[]} />)
+    expect(screen.getByText('mid-life')).toBeInTheDocument()
+  })
+
   it('renders slope and rejoin estimate once laps accumulate across snapshots', () => {
     const { rerender } = render(
       <TyreDegPanel rows={snapshotRows(1, '1:30.000')} sessionType="Race" pinned={[]} />,

frontend/src/test/compare-view.test.tsx

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach } from 'vitest'
-import { render, screen, waitFor } from '@testing-library/react'
+import { fireEvent, render, screen, waitFor } from '@testing-library/react'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { CompareView } from '../components/CompareView'
 import type { Driver, EnrichedResult, LapsComparisonResponse } from '../types'
@@ -158,13 +158,89 @@ const comparison: LapsComparisonResponse = {
   ],
 }
 
-function renderCompareView() {
+const nextSessionResults: EnrichedResult[] = [
+  {
+    driver_number: 16,
+    position: 1,
+    name_acronym: 'LEC',
+    full_name: 'Charles Leclerc',
+    team_name: 'Ferrari',
+    team_colour: 'E8002D',
+    dnf: false,
+    dns: false,
+    dsq: false,
+    duration: null,
+    gap_to_leader: null,
+    number_of_laps: 57,
+    points: 25,
+    session_key: 9550,
+    meeting_key: 1234,
+  },
+  {
+    driver_number: 55,
+    position: 2,
+    name_acronym: 'SAI',
+    full_name: 'Carlos Sainz',
+    team_name: 'Williams',
+    team_colour: '64C4FF',
+    dnf: false,
+    dns: false,
+    dsq: false,
+    duration: null,
+    gap_to_leader: 3.2,
+    number_of_laps: 57,
+    points: 18,
+    session_key: 9550,
+    meeting_key: 1234,
+  },
+]
+
+const nextSessionDrivers: Driver[] = [
+  {
+    driver_number: 16,
+    name_acronym: 'LEC',
+    full_name: 'Charles Leclerc',
+    first_name: 'Charles',
+    last_name: 'Leclerc',
+    team_name: 'Ferrari',
+    team_colour: 'E8002D',
+    headshot_url: '',
+    broadcast_name: 'C LECLERC',
+    session_key: 9550,
+    meeting_key: 1234,
+  },
+  {
+    driver_number: 55,
+    name_acronym: 'SAI',
+    full_name: 'Carlos Sainz',
+    first_name: 'Carlos',
+    last_name: 'Sainz',
+    team_name: 'Williams',
+    team_colour: '64C4FF',
+    headshot_url: '',
+    broadcast_name: 'C SAINZ',
+    session_key: 9550,
+    meeting_key: 1234,
+  },
+]
+
+function renderCompareView(
+  props: {
+    sessionKey?: number
+    results?: EnrichedResult[]
+    drivers?: Driver[]
+  } = {},
+) {
   const client = new QueryClient({
     defaultOptions: { queries: { retry: false } },
   })
   return render(
     <QueryClientProvider client={client}>
-      <CompareView sessionKey={9472} results={results} drivers={drivers} />
+      <CompareView
+        sessionKey={props.sessionKey ?? 9472}
+        results={props.results ?? results}
+        drivers={props.drivers ?? drivers}
+      />
     </QueryClientProvider>,
   )
 }
@@ -305,6 +381,28 @@ describe('CompareView', () => {
     expect(screen.getAllByText('HAM').length).toBeGreaterThan(0)
   })
 
+  it('resets the selected pair when the mounted session changes', async () => {
+    const { rerender } = renderCompareView()
+
+    fireEvent.change(screen.getByTestId('compare-picker-a'), { target: { value: '44' } })
+    expect(screen.getByTestId('compare-picker-a')).toHaveValue('44')
+
+    rerender(
+      <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
+        <CompareView
+          sessionKey={9550}
+          results={nextSessionResults}
+          drivers={nextSessionDrivers}
+        />
+      </QueryClientProvider>,
+    )
+
+    await waitFor(() => {
+      expect(screen.getByTestId('compare-picker-a')).toHaveValue('16')
+      expect(screen.getByTestId('compare-picker-b')).toHaveValue('55')
+    })
+  })
+
   it('renders telemetry and pace sections with mocked queries', async () => {
     renderCompareView()
 

frontend/src/test/delta-time-graph.test.tsx

@@ -47,7 +47,7 @@ describe('computeCumulativeDeltas', () => {
     expect(result[0].deltas[2]).toBeCloseTo(2)
   })
 
-  it('emits null for missing lap times while carrying cumulative forward', () => {
+  it('emits null for challenger missing lap times while carrying cumulative forward', () => {
     const withNull: DeltaSeries = {
       label: 'NOR',
       color: '#FF8000',
@@ -60,6 +60,41 @@ describe('computeCumulativeDeltas', () => {
     expect(result[0].deltas[2]).toBeCloseTo(-92)
   })
 
+  it('gaps all drivers when the reference lap is null and resumes without that window', () => {
+    const refWithNull: DeltaSeries = {
+      label: 'VER',
+      color: '#3671C6',
+      lapTimes: [90, null, 92],
+    }
+    const validChallenger: DeltaSeries = {
+      label: 'HAM',
+      color: '#E8002D',
+      lapTimes: [89, 91, 90],
+    }
+    const result = computeCumulativeDeltas([refWithNull, validChallenger])
+    expect(result[0].deltas[0]).toBeCloseTo(-1)
+    expect(result[0].deltas[1]).toBeNull()
+    // Lap 3 excludes the reference-null window for both: (89+90) - (90+92) = -3
+    expect(result[0].deltas[2]).toBeCloseTo(-3)
+  })
+
+  it('gaps challenger laps beyond a shorter reference series', () => {
+    const shortReference: DeltaSeries = {
+      label: 'VER',
+      color: '#3671C6',
+      lapTimes: [90, 91],
+    }
+    const longerChallenger: DeltaSeries = {
+      label: 'HAM',
+      color: '#E8002D',
+      lapTimes: [89, 92, 90],
+    }
+    const result = computeCumulativeDeltas([shortReference, longerChallenger])
+    expect(result[0].deltas[0]).toBeCloseTo(-1)
+    expect(result[0].deltas[1]).toBeCloseTo(0)
+    expect(result[0].deltas[2]).toBeNull()
+  })
+
   it('returns an empty array when only one series is provided', () => {
     expect(computeCumulativeDeltas([reference])).toEqual([])
   })
@@ -97,6 +132,19 @@ describe('DeltaTimeGraph', () => {
     expect(screen.queryByTestId('delta-line-VER')).not.toBeInTheDocument()
   })
 
+  it('splits polylines at reference-null laps', () => {
+    const refWithNull: DeltaSeries = {
+      label: 'VER',
+      color: '#3671C6',
+      lapTimes: [90, null, 92],
+    }
+    const { container } = render(
+      <DeltaTimeGraph series={[refWithNull, challenger]} />,
+    )
+    const lines = container.querySelectorAll('.delta-graph-driver-line')
+    expect(lines.length).toBeGreaterThan(1)
+  })
+
   it('shows a crosshair tooltip on hover', () => {
     vi.spyOn(SVGSVGElement.prototype, 'getBoundingClientRect').mockReturnValue({
       x: 0,
@@ -118,4 +166,31 @@ describe('DeltaTimeGraph', () => {
     expect(screen.getByText(/Lap 1/)).toBeInTheDocument()
     vi.restoreAllMocks()
   })
+
+  it('omits tooltip rows on reference-null laps', () => {
+    vi.spyOn(SVGSVGElement.prototype, 'getBoundingClientRect').mockReturnValue({
+      x: 0,
+      y: 0,
+      left: 0,
+      top: 0,
+      width: 640,
+      height: 220,
+      right: 640,
+      bottom: 220,
+      toJSON: () => ({}),
+    })
+    const refWithNull: DeltaSeries = {
+      label: 'VER',
+      color: '#3671C6',
+      lapTimes: [90, null, 92],
+    }
+    const { container } = render(
+      <DeltaTimeGraph series={[refWithNull, challenger]} />,
+    )
+    const hoverLayer = container.querySelector('.delta-graph-hover-layer')
+    fireEvent.mouseMove(hoverLayer!, { clientX: 352, clientY: 100 })
+    expect(screen.getByTestId('delta-crosshair')).toBeInTheDocument()
+    expect(screen.queryByTestId('delta-tooltip')).not.toBeInTheDocument()
+    vi.restoreAllMocks()
+  })
 })

frontend/src/test/live.test.ts

@@ -163,6 +163,20 @@ describe('live transforms', () => {
     expect(parsed?.data?.Drivers['16'].RacingNumber).toBe('16')
   })
 
+  it('parses archived EventSource snapshots separately from active data', () => {
+    const parsed = parseLiveStateEvent(JSON.stringify({
+      is_live: false,
+      data: null,
+      last_snapshot: snapshot,
+      last_positions: { '16': { x: 1, y: 2, z: 3, status: 'OnTrack' } },
+      last_snapshot_at: '2026-07-04T14:00:00Z',
+    }))
+    expect(parsed?.is_live).toBe(false)
+    expect(parsed?.data).toBeNull()
+    expect(parsed?.last_snapshot?.Drivers['16'].RacingNumber).toBe('16')
+    expect(parsed?.last_positions?.['16'].status).toBe('OnTrack')
+  })
+
   it('sorts timing rows by live position and includes drivers with metadata only', () => {
     const rows = sortLiveTimingRows(snapshot)
     expect(rows.map((row) => row.RacingNumber)).toEqual(['16', '1', '44'])

frontend/src/test/meaning.test.ts

@@ -0,0 +1,71 @@
+import { describe, expect, it } from 'vitest'
+import {
+  INTERVAL_DRS_MAX_SECONDS,
+  INTERVAL_UNDERCUT_MAX_SECONDS,
+  INTERVAL_UNDERCUT_MIN_SECONDS,
+  MAX_POINTS_PER_ROUND,
+  TYRE_CLIFF_LAPS,
+  intervalMeaning,
+  pointsGapMeaning,
+  tyreAgeMeaning,
+} from '../lib/meaning'
+
+describe('intervalMeaning', () => {
+  it('returns DRS range below the threshold', () => {
+    expect(intervalMeaning(0.4)?.caption).toBe('DRS range')
+    expect(intervalMeaning(INTERVAL_DRS_MAX_SECONDS - 0.01)?.caption).toBe('DRS range')
+  })
+
+  it('returns undercut window in the middle band', () => {
+    expect(intervalMeaning(INTERVAL_UNDERCUT_MIN_SECONDS)?.caption).toBe('undercut window')
+    expect(intervalMeaning(2.0)?.caption).toBe('undercut window')
+    expect(intervalMeaning(INTERVAL_UNDERCUT_MAX_SECONDS)?.caption).toBe('undercut window')
+  })
+
+  it('returns null outside known bands', () => {
+    expect(intervalMeaning(INTERVAL_UNDERCUT_MAX_SECONDS + 0.5)).toBeNull()
+    expect(intervalMeaning(10)).toBeNull()
+    expect(intervalMeaning(null)).toBeNull()
+    expect(intervalMeaning(undefined)).toBeNull()
+    expect(intervalMeaning(-1)).toBeNull()
+  })
+})
+
+describe('tyreAgeMeaning', () => {
+  it('labels fresh, mid-life, and laps-to-cliff for SOFT', () => {
+    const cliff = TYRE_CLIFF_LAPS.SOFT
+    expect(tyreAgeMeaning('SOFT', 2)?.caption).toBe('fresh')
+    expect(tyreAgeMeaning('SOFT', Math.ceil(cliff * 0.5))?.caption).toBe('mid-life')
+    expect(tyreAgeMeaning('SOFT', cliff - 2)?.caption).toBe('~2 laps to cliff')
+    expect(tyreAgeMeaning('SOFT', cliff + 5)?.caption).toBe('past cliff')
+  })
+
+  it('handles unknown compounds with defaults', () => {
+    expect(tyreAgeMeaning('UNKNOWN', 3)?.caption).toBe('fresh')
+    expect(tyreAgeMeaning(undefined, 3)?.caption).toBe('fresh')
+  })
+
+  it('returns null for invalid age', () => {
+    expect(tyreAgeMeaning('MEDIUM', null)).toBeNull()
+    expect(tyreAgeMeaning('MEDIUM', -1)).toBeNull()
+  })
+})
+
+describe('pointsGapMeaning', () => {
+  it('computes catchable pts/round', () => {
+    const result = pointsGapMeaning(40, 4, 'VER')
+    expect(result?.caption).toBe('~10 pts/round')
+    expect(result?.title).toContain('VER')
+  })
+
+  it('marks uncatchable gaps', () => {
+    const max = 3 * MAX_POINTS_PER_ROUND
+    expect(pointsGapMeaning(max + 1, 3, 'VER')?.caption).toBe('out of reach')
+  })
+
+  it('returns null for leader or invalid input', () => {
+    expect(pointsGapMeaning(0, 4)).toBeNull()
+    expect(pointsGapMeaning(10, 0)).toBeNull()
+    expect(pointsGapMeaning(null, 4)).toBeNull()
+  })
+})

frontend/src/test/tyre-stint-timeline.test.tsx

@@ -71,6 +71,61 @@ describe('TyreStintTimeline', () => {
     expect(screen.getByTestId('stint-timeline-empty')).toBeInTheDocument()
     expect(screen.getByText(/No stint data/i)).toBeInTheDocument()
   })
+
+  it('renders one pit marker per stop at the correct lap position', () => {
+    const rowsWithPits: StintTimelineRow[] = [
+      {
+        label: 'HAM',
+        color: '#E8002D',
+        stints: [{ compound: 'SOFT', lapStart: 1, lapEnd: 18 }],
+        pitStops: [19],
+      },
+      {
+        label: 'VER',
+        color: '#3671C6',
+        stints: [
+          { compound: 'MEDIUM', lapStart: 1, lapEnd: 30 },
+          { compound: 'SOFT', lapStart: 31, lapEnd: 78 },
+        ],
+        pitStops: [31, 52],
+      },
+    ]
+    const { container } = render(
+      <TyreStintTimeline rows={rowsWithPits} totalLaps={78} />,
+    )
+    const markers = container.querySelectorAll('[data-testid="pit-marker"]')
+    expect(markers).toHaveLength(3)
+    expect(markers[0]).toHaveAttribute('data-lap', '19')
+    expect(markers[1]).toHaveAttribute('data-lap', '31')
+    expect(markers[2]).toHaveAttribute('data-lap', '52')
+    expect(container.querySelectorAll('.stint-timeline__bar')).toHaveLength(3)
+  })
+
+  it('positions pit markers using lap_number and includes driver in tooltip', () => {
+    const rows: StintTimelineRow[] = [
+      {
+        label: 'HAM',
+        color: '#E8002D',
+        stints: [{ compound: 'SOFT', lapStart: 1, lapEnd: 18 }],
+        pitStops: [19],
+      },
+    ]
+    const { container } = render(<TyreStintTimeline rows={rows} totalLaps={78} />)
+    const marker = container.querySelector('[data-testid="pit-marker"]') as SVGLineElement
+    expect(marker).toBeTruthy()
+    // lap 19 → x = 48 + (18/78) * 580 ≈ 181.85
+    expect(Number(marker.getAttribute('x1'))).toBeCloseTo(181.85, 1)
+    const titles = [...container.querySelectorAll('title')].map((t) => t.textContent)
+    expect(titles).toContain('HAM pit stop · L19')
+  })
+
+  it('leaves rows without pit data unchanged', () => {
+    const { container } = render(
+      <TyreStintTimeline rows={sampleRows} totalLaps={78} />,
+    )
+    expect(container.querySelectorAll('[data-testid="pit-marker"]')).toHaveLength(0)
+    expect(container.querySelectorAll('.stint-timeline__bar')).toHaveLength(3)
+  })
 })
 
 const results: EnrichedResult[] = [

frontend/src/types.ts

@@ -206,6 +206,9 @@ export interface Weekend {
 export interface LiveStateResponse {
   is_live: boolean
   data: LiveStreamData | null
+  last_snapshot?: LiveStreamData | null
+  last_positions?: Record<string, LivePosition> | null
+  last_snapshot_at?: string
 }
 
 export interface LivePosition {
@@ -316,6 +319,7 @@ export interface LiveStreamData {
   Weather: LiveWeatherData
   Session: LiveSessionMeta
   TeamRadio: LiveRadioCapture[]
+  SessionStatus?: string
   TrackStatus: string
   CurrentLap: number
   TotalLaps: number

internal/api/cache.go

@@ -94,6 +94,12 @@ func cacheDBPath() string {
 	return filepath.Join(".cache", "box-box", "cache.db")
 }
 
+// DefaultCacheDBPath returns the HTTP cache database path used by the OpenF1
+// client in both TUI and web modes.
+func DefaultCacheDBPath() string {
+	return cacheDBPath()
+}
+
 // ttlForURL determines the appropriate TTL based on the URL pattern.
 // Returns 0 (CacheTTLForever) for historical data that will never change.
 func ttlForURL(url string) time.Duration {

internal/api/openf1.go

@@ -623,6 +623,19 @@ func (c *OpenF1Client) GetTeamRadio(sessionKey, driverNumber int) ([]models.Team
 // to maximise the chance of finding data quickly.
 var candidateDrivers = []int{1, 11, 44, 16, 55, 4, 14, 63, 81, 24}
 
+// TrackOutlinePrefetchResult summarizes a season track-outline cache warming
+// run. Counts are scoped to the unique non-zero circuit keys in the provided
+// meeting list.
+type TrackOutlinePrefetchResult struct {
+	Year           int
+	UniqueCircuits int
+	CachedBefore   int
+	CachedAfter    int
+	Skipped        int
+	Fetched        int
+	Failed         int
+}
+
 // PrefetchTrackOutlines fetches GPS location data for every circuit in the
 // provided meeting list and stores it in the cache so the track map tab can
 // render during live sessions when the free-tier API is locked.
@@ -632,28 +645,58 @@ var candidateDrivers = []int{1, 11, 44, 16, 55, 4, 14, 63, 81, 24}
 // Errors per-circuit are silently ignored — this is a best-effort operation
 // and must never block or crash the main UI.
 func (c *OpenF1Client) PrefetchTrackOutlines(meetings []models.Meeting) {
+	year := time.Now().Year()
+	for _, m := range meetings {
+		if m.Year != 0 {
+			year = m.Year
+			break
+		}
+	}
+	_ = c.PrefetchTrackOutlinesForYear(year, meetings)
+}
+
+// PrefetchTrackOutlinesForYear fetches and caches track outlines for unique
+// circuits in the provided meeting list, storing them under the explicit season
+// year. Unlike PrefetchTrackOutlines, it returns accounting suitable for CLI
+// cache-warming workflows.
+func (c *OpenF1Client) PrefetchTrackOutlinesForYear(year int, meetings []models.Meeting) TrackOutlinePrefetchResult {
 	const maxWorkers = 3
 
-	year := time.Now().Year()
-
-	// Filter to meetings that need fetching.
-	var pending []models.Meeting
+	result := TrackOutlinePrefetchResult{Year: year}
+	uniqueByCircuit := make(map[int]models.Meeting)
+	var unique []models.Meeting
 	for _, m := range meetings {
 		if m.CircuitKey == 0 {
 			continue
 		}
+		if _, exists := uniqueByCircuit[m.CircuitKey]; exists {
+			continue
+		}
+		uniqueByCircuit[m.CircuitKey] = m
+		unique = append(unique, m)
+	}
+
+	result.UniqueCircuits = len(unique)
+
+	// Filter to meetings that need fetching.
+	var pending []models.Meeting
+	for _, m := range unique {
 		if _, ok := c.cache.GetTrackOutline(m.CircuitKey, year); ok {
+			result.CachedBefore++
+			result.Skipped++
 			continue // already cached for this season
 		}
 		pending = append(pending, m)
 	}
 
 	if len(pending) == 0 {
-		return
+		result.CachedAfter = result.CachedBefore
+		return result
 	}
 
 	sem := make(chan struct{}, maxWorkers)
 	var wg sync.WaitGroup
+	var mu sync.Mutex
 
 	for _, mtg := range pending {
 		mtg := mtg // capture
@@ -662,19 +705,34 @@ func (c *OpenF1Client) PrefetchTrackOutlines(meetings []models.Meeting) {
 		go func() {
 			defer wg.Done()
 			defer func() { <-sem }()
-			c.prefetchCircuit(mtg, year)
+			ok := c.prefetchCircuit(mtg, year)
+			mu.Lock()
+			if ok {
+				result.Fetched++
+			} else {
+				result.Failed++
+			}
+			mu.Unlock()
 		}()
 	}
 
 	wg.Wait()
+
+	for _, m := range unique {
+		if _, ok := c.cache.GetTrackOutline(m.CircuitKey, year); ok {
+			result.CachedAfter++
+		}
+	}
+
+	return result
 }
 
 // prefetchCircuit fetches the track outline for a single meeting and stores it.
 // It prefers completed sessions (past date_end) so the data is full and stable.
-func (c *OpenF1Client) prefetchCircuit(mtg models.Meeting, year int) {
+func (c *OpenF1Client) prefetchCircuit(mtg models.Meeting, year int) bool {
 	sessions, err := c.GetSessionsForMeeting(int(mtg.MeetingKey))
 	if err != nil || len(sessions) == 0 {
-		return
+		return false
 	}
 
 	// Pick the best session: prefer a completed race, then any session with
@@ -696,7 +754,7 @@ func (c *OpenF1Client) prefetchCircuit(mtg models.Meeting, year int) {
 		}
 	}
 	if bestSession == nil {
-		return
+		return false
 	}
 
 	// Try candidate drivers in order until we find one with enough points.
@@ -706,7 +764,7 @@ func (c *OpenF1Client) prefetchCircuit(mtg models.Meeting, year int) {
 			continue
 		}
 		// Store under the circuit key for this year and stop.
-		_ = c.cache.SetTrackOutline(mtg.CircuitKey, year, locs)
-		return
+		return c.cache.SetTrackOutline(mtg.CircuitKey, year, locs) == nil
 	}
+	return false
 }

internal/api/track_outline_prefetch_test.go

@@ -0,0 +1,109 @@
+package api
+
+import (
+	"encoding/json"
+	"net/http"
+	"net/http/httptest"
+	"strconv"
+	"testing"
+	"time"
+
+	"github.com/AmanTahiliani/box-box/internal/models"
+)
+
+func newTrackOutlineTestClient(t *testing.T, srvURL string) *OpenF1Client {
+	t.Helper()
+	t.Setenv("HOME", t.TempDir())
+	t.Setenv("XDG_CACHE_HOME", t.TempDir())
+
+	c := NewOpenF1Client(srvURL, 5*time.Second)
+	c.pacer = &requestPacer{}
+	t.Cleanup(func() { _ = c.Close() })
+	return c
+}
+
+func TestPrefetchTrackOutlinesForYearSkipsCachedAndWritesLocations(t *testing.T) {
+	var sessionsByMeeting = map[string][]models.Session{
+		"202": {
+			{
+				SessionKey:  9002,
+				SessionName: "Race",
+				MeetingKey:  202,
+				CircuitKey:  2,
+				DateEnd:     "2026-01-01T12:00:00+00:00",
+			},
+		},
+	}
+	var sessionsRequested []string
+	var locationsRequested []string
+
+	srv := httptest.NewServer(http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		switch r.URL.Path {
+		case "/v1/sessions":
+			meetingKey := r.URL.Query().Get("meeting_key")
+			sessionsRequested = append(sessionsRequested, meetingKey)
+			_ = json.NewEncoder(w).Encode(sessionsByMeeting[meetingKey])
+		case "/v1/location":
+			sessionKey := r.URL.Query().Get("session_key")
+			driverNumber := r.URL.Query().Get("driver_number")
+			locationsRequested = append(locationsRequested, sessionKey+"/"+driverNumber)
+			_ = json.NewEncoder(w).Encode(testLocations(9002, 1, 51))
+		default:
+			t.Fatalf("unexpected request path %s", r.URL.Path)
+		}
+	}))
+	defer srv.Close()
+
+	client := newTrackOutlineTestClient(t, srv.URL)
+	if err := client.Cache().SetTrackOutline(1, 2026, testLocations(9001, 1, 51)); err != nil {
+		t.Fatalf("SetTrackOutline() error = %v", err)
+	}
+
+	result := client.PrefetchTrackOutlinesForYear(2026, []models.Meeting{
+		{MeetingKey: 101, Year: 2026, Circuit: models.Circuit{CircuitKey: 1}},
+		{MeetingKey: 202, Year: 2026, Circuit: models.Circuit{CircuitKey: 2}},
+		{MeetingKey: 303, Year: 2026, Circuit: models.Circuit{CircuitKey: 2}},
+	})
+
+	if result.UniqueCircuits != 2 {
+		t.Fatalf("UniqueCircuits = %d, want 2", result.UniqueCircuits)
+	}
+	if result.CachedBefore != 1 || result.Skipped != 1 || result.Fetched != 1 || result.Failed != 0 || result.CachedAfter != 2 {
+		t.Fatalf("unexpected result: %+v", result)
+	}
+	if got, want := len(sessionsRequested), 1; got != want {
+		t.Fatalf("sessions requested %d time(s), want %d: %v", got, want, sessionsRequested)
+	}
+	if sessionsRequested[0] != "202" {
+		t.Fatalf("requested meeting %s, want 202", sessionsRequested[0])
+	}
+	if got, want := len(locationsRequested), 1; got != want {
+		t.Fatalf("locations requested %d time(s), want %d: %v", got, want, locationsRequested)
+	}
+	if locationsRequested[0] != "9002/1" {
+		t.Fatalf("requested location %s, want 9002/1", locationsRequested[0])
+	}
+
+	locs, ok := client.Cache().GetTrackOutline(2, 2026)
+	if !ok {
+		t.Fatal("expected circuit 2 outline to be cached")
+	}
+	if len(locs) != 51 {
+		t.Fatalf("cached %d locations, want 51", len(locs))
+	}
+}
+
+func testLocations(sessionKey, driverNumber, count int) []models.Location {
+	locs := make([]models.Location, count)
+	for i := range locs {
+		locs[i] = models.Location{
+			Date:         "2026-01-01T12:00:" + strconv.Itoa(i%60) + "+00:00",
+			DriverNumber: driverNumber,
+			MeetingKey:   202,
+			SessionKey:   sessionKey,
+			X:            float64(i),
+			Y:            float64(i * 2),
+		}
+	}
+	return locs
+}

internal/live/parser_test.go

@@ -273,6 +273,40 @@ func TestProcessTopicTrackStatus(t *testing.T) {
 	}
 }
 
+func TestProcessTopicSessionStatus(t *testing.T) {
+	state := live.NewState()
+	if !state.ProcessTopic("SessionStatus", json.RawMessage(`{"Status": "Finished"}`)) {
+		t.Fatal("SessionStatus should update state")
+	}
+	snap := state.Snapshot()
+	if snap.SessionStatus != "Finished" {
+		t.Fatalf("session status = %q, want Finished", snap.SessionStatus)
+	}
+	if !snap.SnapshotUpdated {
+		t.Fatal("SessionStatus should mark snapshot updated")
+	}
+}
+
+func TestSessionStatusIsActive(t *testing.T) {
+	tests := []struct {
+		status string
+		want   bool
+	}{
+		{"Started", true},
+		{"Resumed", true},
+		{"Finished", false},
+		{"Finalised", false},
+		{"Ends", false},
+		{"Aborted", false},
+		{"", false},
+	}
+	for _, tt := range tests {
+		if got := live.SessionStatusIsActive(tt.status); got != tt.want {
+			t.Errorf("SessionStatusIsActive(%q) = %v, want %v", tt.status, got, tt.want)
+		}
+	}
+}
+
 func TestProcessTopicRaceControlMessages(t *testing.T) {
 	state := live.NewState()
 	data := json.RawMessage(`{

internal/live/signalr.go

@@ -197,7 +197,7 @@ func connectToF1LegacySignalR(dataChan chan LiveStreamData) error {
 		return err
 	}
 
-	subscribeMsg := []byte(`{"H":"Streaming","M":"Subscribe","A":[["Heartbeat","TimingData","Position.z","CarData.z","DriverList","LapCount","ExtrapolatedClock","TrackStatus","RaceControlMessages","WeatherData","SessionInfo","TeamRadio","CurrentTyres","TimingAppData","TimingStats"]],"I":1}`)
+	subscribeMsg := []byte(`{"H":"Streaming","M":"Subscribe","A":[["Heartbeat","TimingData","Position.z","CarData.z","DriverList","LapCount","ExtrapolatedClock","TrackStatus","RaceControlMessages","WeatherData","SessionInfo","TeamRadio","CurrentTyres","TimingAppData","TimingStats","SessionStatus"]],"I":1}`)
 	err = c.WriteMessage(websocket.TextMessage, subscribeMsg)
 	if err != nil {
 		return err

internal/live/state.go

@@ -26,6 +26,7 @@ type State struct {
 	Weather            LiveWeatherData
 	Session            LiveSessionMeta
 	TeamRadio          []LiveRadioCapture
+	SessionStatus      string
 	TrackStatus        string
 	CurrentLap         int
 	TotalLaps          int
@@ -93,6 +94,7 @@ func (s *State) Snapshot() LiveStreamData {
 		Weather:            s.Weather,
 		Session:            s.Session,
 		TeamRadio:          cpyRadio,
+		SessionStatus:      s.SessionStatus,
 		TrackStatus:        s.TrackStatus,
 		CurrentLap:         s.CurrentLap,
 		TotalLaps:          s.TotalLaps,
@@ -273,6 +275,14 @@ func (s *State) ProcessTopic(topic string, data json.RawMessage) bool {
 			s.TrackStatus = ts.Status
 			updated = true
 		}
+	case "SessionStatus":
+		var ss struct {
+			Status string `json:"Status"`
+		}
+		if json.Unmarshal(data, &ss) == nil && ss.Status != "" {
+			s.SessionStatus = ss.Status
+			updated = true
+		}
 	case "RaceControlMessages":
 		var rcm struct {
 			Messages json.RawMessage `json:"Messages"`

internal/live/types.go

@@ -162,6 +162,7 @@ type LiveStreamData struct {
 	Weather            LiveWeatherData
 	Session            LiveSessionMeta
 	TeamRadio          []LiveRadioCapture
+	SessionStatus      string
 	TrackStatus        string // "1"=green "2"=yellow "4"=SC "5"=red "6"=VSC
 	CurrentLap         int
 	TotalLaps          int
@@ -173,3 +174,27 @@ type LiveStreamData struct {
 	PositionUpdated    bool                        `json:"-"`
 	SnapshotUpdated    bool                        `json:"-"`
 }
+
+// SessionStatusIsActive reports whether a raw F1 live timing SessionStatus
+// value represents an actively running session.
+func SessionStatusIsActive(status string) bool {
+	switch normalizeSessionStatus(status) {
+	case "started", "resumed":
+		return true
+	default:
+		return false
+	}
+}
+
+func normalizeSessionStatus(status string) string {
+	out := make([]rune, 0, len(status))
+	for _, r := range status {
+		switch {
+		case r >= 'A' && r <= 'Z':
+			out = append(out, r+'a'-'A')
+		case r >= 'a' && r <= 'z', r >= '0' && r <= '9':
+			out = append(out, r)
+		}
+	}
+	return string(out)
+}

internal/web/live.go

@@ -30,11 +30,22 @@ type SSEHub struct {
 	broadcast  chan sseEvent
 
 	mu              sync.RWMutex
+	activeSnapshot  *live.LiveStreamData
+	activePositions map[string]live.LivePositionData
 	lastSnapshot    *live.LiveStreamData
 	lastPositions   map[string]live.LivePositionData
+	lastSnapshotAt  time.Time
 	isLive          bool
 }
 
+type liveStatePayload struct {
+	IsLive         bool                             `json:"is_live"`
+	Data           *live.LiveStreamData             `json:"data"`
+	LastSnapshot   *live.LiveStreamData             `json:"last_snapshot,omitempty"`
+	LastPositions  map[string]live.LivePositionData `json:"last_positions,omitempty"`
+	LastSnapshotAt *time.Time                       `json:"last_snapshot_at,omitempty"`
+}
+
 func newSSEHub() *SSEHub {
 	return &SSEHub{
 		register:   make(chan *sseClient, 16),
@@ -51,19 +62,16 @@ func (h *SSEHub) run() {
 		case c := <-h.register:
 			clients[c] = true
 			// Send catch-up snapshot so new clients see current state immediately.
-			h.mu.RLock()
-			snap := h.lastSnapshot
-			positions := cloneLivePositions(h.lastPositions)
-			live := h.isLive
-			h.mu.RUnlock()
-			if snap != nil {
-				if data, err := json.Marshal(map[string]any{"data": snap, "is_live": live}); err == nil {
+			state := h.State()
+			if state.Data != nil || state.LastSnapshot != nil {
+				if data, err := json.Marshal(state); err == nil {
 					select {
 					case c.ch <- formatSSEFrame("snapshot", data):
 					default:
 					}
 				}
 			}
+			positions := h.ActivePositions()
 			if len(positions) > 0 {
 				if data, err := json.Marshal(positions); err == nil {
 					select {
@@ -96,11 +104,125 @@ func formatSSEFrame(event string, data []byte) []byte {
 	return []byte(fmt.Sprintf("event: %s\ndata: %s\n\n", event, data))
 }
 
-// Snapshot returns the latest live data snapshot and whether a session is active.
-func (h *SSEHub) Snapshot() (*live.LiveStreamData, bool) {
+// State returns the active live snapshot and the retained in-memory archive.
+func (h *SSEHub) State() liveStatePayload {
 	h.mu.RLock()
 	defer h.mu.RUnlock()
-	return h.lastSnapshot, h.isLive
+	payload := liveStatePayload{
+		IsLive: h.isLive,
+	}
+	if h.isLive {
+		payload.Data = h.activeSnapshot
+	} else if h.lastSnapshot != nil {
+		payload.LastSnapshot = h.lastSnapshot
+		payload.LastPositions = cloneLivePositions(h.lastPositions)
+		if !h.lastSnapshotAt.IsZero() {
+			at := h.lastSnapshotAt
+			payload.LastSnapshotAt = &at
+		}
+	}
+	return payload
+}
+
+func (h *SSEHub) ActivePositions() map[string]live.LivePositionData {
+	h.mu.RLock()
+	defer h.mu.RUnlock()
+	return cloneLivePositions(h.activePositions)
+}
+
+func (h *SSEHub) applySnapshot(data live.LiveStreamData, now time.Time) liveStatePayload {
+	h.mu.Lock()
+	defer h.mu.Unlock()
+
+	if live.SessionStatusIsActive(data.SessionStatus) {
+		h.isLive = true
+		h.activeSnapshot = &data
+		if data.PositionUpdated && len(data.Positions) > 0 {
+			h.activePositions = cloneLivePositions(data.Positions)
+		}
+		return liveStatePayload{IsLive: true, Data: h.activeSnapshot}
+	}
+
+	archivePositions := cloneLivePositions(h.activePositions)
+	if data.PositionUpdated && len(data.Positions) > 0 {
+		archivePositions = cloneLivePositions(data.Positions)
+	}
+	h.isLive = false
+	h.activeSnapshot = nil
+	h.activePositions = nil
+	if hasLiveSnapshotData(data) {
+		h.lastSnapshot = &data
+		h.lastSnapshotAt = now
+		h.lastPositions = archivePositions
+	}
+	return h.stateLocked()
+}
+
+func (h *SSEHub) applyPositions(data live.LiveStreamData) map[string]live.LivePositionData {
+	h.mu.Lock()
+	defer h.mu.Unlock()
+
+	if len(data.Positions) == 0 {
+		return nil
+	}
+	positions := cloneLivePositions(data.Positions)
+	if h.isLive {
+		h.activePositions = positions
+		return positions
+	}
+	if h.lastSnapshot != nil {
+		h.lastPositions = positions
+	}
+	return nil
+}
+
+func (h *SSEHub) deactivate(now time.Time) liveStatePayload {
+	h.mu.Lock()
+	defer h.mu.Unlock()
+
+	if h.activeSnapshot != nil {
+		h.lastSnapshot = h.activeSnapshot
+		h.lastPositions = cloneLivePositions(h.activePositions)
+		h.lastSnapshotAt = now
+	}
+	h.isLive = false
+	h.activeSnapshot = nil
+	h.activePositions = nil
+	return h.stateLocked()
+}
+
+func (h *SSEHub) stateLocked() liveStatePayload {
+	payload := liveStatePayload{IsLive: h.isLive}
+	if h.isLive {
+		payload.Data = h.activeSnapshot
+		return payload
+	}
+	if h.lastSnapshot != nil {
+		payload.LastSnapshot = h.lastSnapshot
+		payload.LastPositions = cloneLivePositions(h.lastPositions)
+		if !h.lastSnapshotAt.IsZero() {
+			at := h.lastSnapshotAt
+			payload.LastSnapshotAt = &at
+		}
+	}
+	return payload
+}
+
+func hasLiveSnapshotData(data live.LiveStreamData) bool {
+	return len(data.Drivers) > 0 ||
+		len(data.DriverInfo) > 0 ||
+		len(data.Tyres) > 0 ||
+		len(data.Telemetry) > 0 ||
+		len(data.RCMessages) > 0 ||
+		len(data.TeamRadio) > 0 ||
+		len(data.Stints) > 0 ||
+		data.Session.MeetingName != "" ||
+		data.Session.SessionName != "" ||
+		data.Session.SessionType != "" ||
+		data.TrackStatus != "" ||
+		data.CurrentLap != 0 ||
+		data.TotalLaps != 0 ||
+		data.Clock != ""
 }
 
 // runLiveFeeds launches background goroutines for the F1 SignalR feed and keepalive.
@@ -129,13 +251,8 @@ func (s *Server) signalRLoop() {
 			log.Printf("web: live feed ended: %v", err)
 		}
 
-		s.hub.mu.Lock()
-		s.hub.isLive = false
-		s.hub.lastSnapshot = nil
-		s.hub.lastPositions = nil
-		s.hub.mu.Unlock()
-
-		if payload, err := json.Marshal(map[string]any{"data": nil, "is_live": false}); err == nil {
+		state := s.hub.deactivate(time.Now())
+		if payload, err := json.Marshal(state); err == nil {
 			s.hub.broadcast <- sseEvent{name: "snapshot", data: payload}
 		}
 
@@ -167,24 +284,20 @@ func (s *Server) connectAndDrain() error {
 		select {
 		case data := <-dataChan:
 			now := time.Now()
-			s.hub.mu.Lock()
 			if data.SnapshotUpdated {
-				s.hub.lastSnapshot = &data
-			}
-			if data.PositionUpdated && len(data.Positions) > 0 {
-				s.hub.lastPositions = cloneLivePositions(data.Positions)
-			}
-			s.hub.isLive = true
-			s.hub.mu.Unlock()
-
-			if data.SnapshotUpdated {
-				if payload, err := json.Marshal(map[string]any{"data": data, "is_live": true}); err == nil {
+				state := s.hub.applySnapshot(data, now)
+				if payload, err := json.Marshal(state); err == nil {
 					s.hub.broadcast <- sseEvent{name: "snapshot", data: payload}
 				}
 			}
 
 			if data.PositionUpdated && len(data.Positions) > 0 && now.Sub(lastPositionBroadcast) >= 250*time.Millisecond {
-				if payload, err := json.Marshal(data.Positions); err == nil {
+				positions := s.hub.applyPositions(data)
+				if len(positions) > 0 {
+					payload, err := json.Marshal(positions)
+					if err != nil {
+						continue
+					}
 					s.hub.broadcast <- sseEvent{name: "positions", data: payload}
 					lastPositionBroadcast = now
 				}
@@ -217,11 +330,7 @@ func cloneLivePositions(in map[string]live.LivePositionData) map[string]live.Liv
 
 // handleLiveState returns the current live data snapshot as JSON.
 func (s *Server) handleLiveState(w http.ResponseWriter, r *http.Request) {
-	snap, isLive := s.hub.Snapshot()
-	writeJSON(w, map[string]any{
-		"is_live": isLive,
-		"data":    snap,
-	})
+	writeJSON(w, s.hub.State())
 }
 
 // handleSSEStream is the persistent SSE endpoint for live data.

internal/web/live_archive_test.go

@@ -0,0 +1,90 @@
+package web
+
+import (
+	"encoding/json"
+	"net/http"
+	"net/http/httptest"
+	"testing"
+	"time"
+
+	"github.com/AmanTahiliani/box-box/internal/live"
+)
+
+func TestSSEHubArchivesTerminalSessionSnapshot(t *testing.T) {
+	hub := newSSEHub()
+	now := time.Date(2026, 7, 4, 14, 0, 0, 0, time.UTC)
+	active := live.LiveStreamData{
+		SessionStatus: "Started",
+		Drivers: map[string]live.LiveDriverData{
+			"1": {RacingNumber: "1", Position: 1},
+		},
+		Positions: map[string]live.LivePositionData{
+			"1": {X: 100, Y: -50, Z: 2, Status: "OnTrack"},
+		},
+		PositionUpdated: true,
+		SnapshotUpdated: true,
+	}
+	if state := hub.applySnapshot(active, now); !state.IsLive || state.Data == nil {
+		t.Fatalf("active state = %+v, want live data", state)
+	}
+
+	terminal := active
+	terminal.SessionStatus = "Finished"
+	terminal.Positions = nil
+	terminal.PositionUpdated = false
+	state := hub.applySnapshot(terminal, now.Add(time.Minute))
+
+	if state.IsLive {
+		t.Fatal("terminal SessionStatus should not be live")
+	}
+	if state.Data != nil {
+		t.Fatalf("inactive state data = %+v, want nil", state.Data)
+	}
+	if state.LastSnapshot == nil || state.LastSnapshot.SessionStatus != "Finished" {
+		t.Fatalf("last snapshot = %+v, want terminal snapshot", state.LastSnapshot)
+	}
+	if got := state.LastPositions["1"]; got.X != 100 || got.Status != "OnTrack" {
+		t.Fatalf("last positions = %+v, want carried active positions", state.LastPositions)
+	}
+	if state.LastSnapshotAt == nil || !state.LastSnapshotAt.Equal(now.Add(time.Minute)) {
+		t.Fatalf("last snapshot time = %v, want %v", state.LastSnapshotAt, now.Add(time.Minute))
+	}
+}
+
+func TestHandleLiveStateKeepsArchiveOutOfActiveData(t *testing.T) {
+	hub := newSSEHub()
+	now := time.Date(2026, 7, 4, 14, 0, 0, 0, time.UTC)
+	hub.applySnapshot(live.LiveStreamData{
+		SessionStatus: "Finished",
+		Session:       live.LiveSessionMeta{MeetingName: "British Grand Prix", SessionName: "Race"},
+		Drivers: map[string]live.LiveDriverData{
+			"44": {RacingNumber: "44", Position: 1},
+		},
+		SnapshotUpdated: true,
+	}, now)
+
+	srv := &Server{hub: hub}
+	req := httptest.NewRequest(http.MethodGet, "/api/v1/live/state", nil)
+	rec := httptest.NewRecorder()
+	srv.handleLiveState(rec, req)
+
+	if rec.Code != http.StatusOK {
+		t.Fatalf("status = %d, want 200", rec.Code)
+	}
+	var resp liveStatePayload
+	if err := json.Unmarshal(rec.Body.Bytes(), &resp); err != nil {
+		t.Fatalf("decode response: %v", err)
+	}
+	if resp.IsLive {
+		t.Fatal("archived snapshot should report is_live=false")
+	}
+	if resp.Data != nil {
+		t.Fatalf("archived snapshot leaked into data: %+v", resp.Data)
+	}
+	if resp.LastSnapshot == nil || resp.LastSnapshot.Session.MeetingName != "British Grand Prix" {
+		t.Fatalf("last snapshot = %+v, want archived race", resp.LastSnapshot)
+	}
+	if resp.LastSnapshotAt == nil {
+		t.Fatal("last_snapshot_at should be present for archived snapshots")
+	}
+}

tests/command-center.spec.ts

@@ -28,6 +28,41 @@ test.describe('Command Center', () => {
     await expect(page.getByTestId(`rh-session-${FULL_SESSION}`)).toBeVisible()
   })
 
+  test('archived live snapshot does not mark command center live', async ({ page }) => {
+    await page.route('**/api/v1/live/state', (route) =>
+      route.fulfill({
+        contentType: 'application/json',
+        body: JSON.stringify({
+          is_live: false,
+          data: null,
+          last_snapshot: {
+            Drivers: { '1': { RacingNumber: '1', Position: 1 } },
+            DriverInfo: { '1': { RacingNumber: '1', Tla: 'VER', TeamColour: '3671C6' } },
+            Tyres: {},
+            RCMessages: [],
+            Weather: {},
+            Session: { MeetingName: 'Archived GP', SessionName: 'Race', SessionType: 'Race' },
+            TeamRadio: [],
+            SessionStatus: 'Finished',
+            TrackStatus: '1',
+            CurrentLap: 57,
+            TotalLaps: 57,
+            Clock: '',
+            ClockRefTime: '',
+            ClockExtrapolating: false,
+            Stints: {},
+          },
+          last_snapshot_at: '2026-07-04T14:00:00Z',
+        }),
+      }),
+    )
+
+    await page.goto('/')
+    await expect(page.getByTestId('command-center')).toBeVisible()
+    await expect(page.getByTestId('cc-live-status')).toContainText('No live session')
+    await expect(page.getByTestId('cc-live-status')).not.toContainText('Live session active')
+  })
+
   test('existing routes continue to work', async ({ page }) => {
     await page.goto(`/race-hub?session_key=${FULL_SESSION}`)
     await expect(page.getByTestId('race-hub')).toBeVisible()

tests/live-timing.spec.ts

@@ -239,4 +239,39 @@ test.describe('Live Timing (no session)', () => {
     await expect(page.getByTestId('live-empty')).toBeVisible()
     await expect(page.getByTestId('live-page')).toContainText('No live session active')
   })
+
+  test('renders an archived snapshot only after View Last Session', async ({ page }) => {
+    await page.route('**/api/v1/live/state', (route) =>
+      route.fulfill({
+        contentType: 'application/json',
+        body: JSON.stringify({
+          is_live: false,
+          data: null,
+          last_snapshot: {
+            ...raceSnapshot.data,
+            SessionStatus: 'Finished',
+          },
+          last_positions: {
+            '1': { x: 100, y: -50, z: 2, status: 'OnTrack' },
+          },
+          last_snapshot_at: '2026-07-04T14:00:00Z',
+        }),
+      }),
+    )
+    await page.route('**/api/v1/live/stream', (route) =>
+      route.fulfill({
+        contentType: 'text/event-stream',
+        body: 'event: heartbeat\ndata: {}\n\n',
+      }),
+    )
+
+    await page.goto('/live')
+    await expect(page.getByTestId('live-empty')).toContainText('No live session active')
+    await expect(page.getByText('Timing Tower')).toHaveCount(0)
+
+    await page.getByRole('button', { name: 'View Last Session' }).click()
+    await expect(page.getByTestId('live-archive-strip')).toContainText('Archived snapshot')
+    await expect(page.getByText('Timing Tower')).toBeVisible()
+    await expect(page.locator('.live-state')).toContainText('archive')
+  })
 })