New section 15 covers:
- Three audiences (spectator, participant, visitor) with distinct needs
- Information architecture: /watch, /compete, /leaderboard as primary hubs
- Homepage design: auto-playing featured replay, two CTAs, compact
leaderboard + playlists + season status + evolution mini
- Desktop top bar + mobile bottom tab bar navigation
- Responsive breakpoints (phone/tablet/desktop) with mobile-first
spectating, desktop-first building
- Mobile replay viewer: full-width canvas, pinch-to-zoom, tap play/pause,
swipe-to-scrub timeline, slide-up panels
- Sandbox is desktop-only (clear mobile message + "send to desktop" link)
- First-time visitor funnel: see → watch → engage → build
- Performance budget: <2s LCP, <200KB gzipped JS, code-split per route,
lazy WASM loading, stale-while-revalidate data fetching
- Design language: dark theme, minimal chrome, functional animation,
mono+sans-serif typography
- 11 reusable components covering all pages and breakpoints
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
8f7dea26ee