(CODUX-113) Render polished ETA vessel motion

[numnx]

🧩 Task: Render polished ETA vessel motion

Automated task PR opened by Code UX for T02.

📋 Summary

Sprint: Sprint 179 · Quicksprint ETA · Task: T02

Upgrade the shared sprint and quicksprint ETA planning overlay into a polished seamless boat animation with an accessible coffee-cup easter egg, backed by focused dashboard tests and documentation.

🤖 Model & Provider

Provider	Codex CLI
Model	gpt-5.5

⏱️ Timing

Started	2026-07-07 12:40:59 UTC
Finished	2026-07-07 12:47:48 UTC
Duration	6m 49s

📊 Token Usage

Metric	Value
Input tokens	106,975
Cached input tokens	1,997,440
Output tokens	14,675
Total tokens	2,119,090
Invocations	1
Tool calls	44
Active time	6m 7s

Included usage estimate (subscription/local login): $1.97

✅ QA Review

⏳ QA review runs after this PR is opened. Check the task card in the dashboard for the outcome once it lands.

📝 Full Task Prompt

## Objective
Update the shared planning progress overlay so the ETA boat animation looks refined, moves smoothly, exits off the right side, and respawns from the left without a visible flip.

## Scope
- Edit `dashboard/src/v2/components/ui/PlanningProgressOverlay.tsx`
- Edit `dashboard/src/v2/components/ui/PlanningShip.tsx`
- Edit `tests/dashboard/v2/ui-components.test.tsx`
- Edit `dashboard/src/v2/components/ui/__tests__/ReducedMotionVisuals.test.tsx` if reduced-motion coverage needs adjustment
- Consume the animation contract added by T01 from `dashboard/src/v2/lib/sprint-planning-feedback.ts`

## Implementation Requirements
1. Replace the current `left: ${feedback.shipProgress * 100}%` rendering with the T01 travel metadata so the vessel can be offscreen before and after the visible course.
2. Improve the overlay visual treatment around the ETA vessel with a premium course, water/wake/harbour treatment, depth, and polished light/dark mode styling while keeping the existing ETA, Elapsed, action badge, description, minimize, secondary action, and cancel controls.
3. Smooth motion with transform-based positioning and opacity/visibility phases rather than visible left-edge snapping; ensure the same shared overlay works for both sprint planning and quicksprint execution accents.
4. Keep reduced-motion behavior accessible by disabling decorative continuous animation and rendering a static, legible progress state.
5. Update component tests to assert the overlay still renders action-specific labels, ETA/Elapsed content, controls, and the new travel style/contract without relying on brittle pixel values.

## Constraints
- Do not implement the coffee easter egg in this task; T03 owns that interaction.
- Do not edit quicksprint panel logic in this task; it should benefit from the shared overlay automatically.
- Preserve overlay dismissal, Escape handling, background click handling, and cancel semantics.
- Avoid new dependencies and avoid external assets; use Preact, SVG, CSS/Tailwind, and existing hooks only.

## Verification
- Run `pnpm exec vitest run tests/dashboard/v2/ui-components.test.tsx dashboard/src/v2/components/ui/__tests__/ReducedMotionVisuals.test.tsx`.
- Run `pnpm run typecheck:dashboard`.
- Success means the shared overlay renders the upgraded vessel with offscreen travel metadata and existing controls remain functional.

🌿 Branch Info

Base: feature/CODUX-179-quicksprint-eta
Head: task/feature-codux-179-quicksprint-eta-t02-codex-mran0rvl

---

🤖 Generated by Code UX