Tooltips now show three lines: name (bold), description (gray),
and educational text (italic). Previously only showed name + edu,
leaving building functional descriptions hidden.
Part of #57
Implements Reasoning Battles — a Paperclips-inspired canvas combat system
where structured reasoning (blue) fights adversarial testing (red) using
boid flocking (cohesion, aggression, separation) on a 310x150 grid.
Features:
- Boid flocking AI for ship movement
- Grid-based combat resolution with OODA loop speed bonus
- Napoleonic War battle names
- Auto-trigger battles scaled to drift and phase
- Battle history log
- Rewards: structured wins = knowledge, adversarial wins = code
- Unlocks at Phase 3
- Integrated into tick loop and render pipeline
Visual Identity Pass:
- Smooth phase transition overlay with staggered fade-in animation and particle burst
- Building purchase confetti at x10 milestones (gold + green particles)
- Animated resource counters (pulse on gain, shake on loss) - already existed, verified working
Ending Cinematic Enhancement:
- Beacon ending: fade-to-black transition, staggered text reveal, golden light rays,
continuous floating particles, expanded stat summary, 'Play Again' button
- Drift ending: glitch animation on title, fade-in overlay, stat summary with
buildings/projects/clicks/time/phase, dramatic line-by-line log reveal
Accessibility (#57):
- Sound mute toggle button (M key) with localStorage persistence
- High contrast mode toggle (C key) with CSS variable overrides
- Both toggles in fixed bottom-left toolbar with aria-labels
- Keyboard shortcuts M and C added, help overlay updated
- Drift ending button changed to 'Play AGAIN' with proper aria-label
Replace native browser title= tooltips with styled custom tooltips
that match the game's dark theme. Tooltips appear instantly on hover
with building/project name and educational content.
- Add CSS for #custom-tooltip with dark theme styling
- Add tooltip div to HTML body
- Add event delegation in main.js for [data-edu] elements
- Convert renderBuildings and renderProjects to use data-edu
and data-tooltip-label attrs instead of title=
- Tooltip follows cursor with screen-edge clamping
Refs: Epic #57 — Night of Polish, Task 4 (Tooltip system)
Auto-save game state when the browser tab is hidden (visibilitychange)
or closed/navigated away (beforeunload). Prevents data loss on mobile
where tab switching can kill the page without a save interval firing.
Part of epic #57 Night of Polish — Task 6: Mobile Polish.
Part of #57 — Task 4: Tutorial & Onboarding
- 5 click-through screens introducing game concepts (code, buildings,
research, phases, keyboard shortcuts)
- Skip button on every screen, keyboard support (Enter/Escape/arrows)
- Stores completion in localStorage — only shows once for new players
- Matches existing visual style (dark theme, accent colors, monospace)
- Start Playing button on final screen with shortcut hint (? overlay)
