feat: toggle playback from preview canvas

[AyobamiH]

Description

Adds direct playback control to the preview while continuing to use the existing playback state.

• click/tap the preview to toggle play and pause;
• add a keyboard-accessible preview playback control;
• keep the existing playback bar and keyboard shortcuts working;
• prevent nested interactive controls from triggering an additional playback toggle;
• keep PreviewCanvas unchanged so rendering remains separate from playback interaction.

Related issue

Closes #19

Type of change

• Bug fix
• New feature
• Documentation
• Refactor / maintenance
• Other

How has this been tested?

Verified locally with:

npm ci
git diff --exit-code -- package-lock.json
npm run format:check
npm run lint
npm run test:unit
npm run build
npx playwright install --with-deps chromium
npm test
npx playwright test e2e/playback.spec.ts --repeat-each=10 --workers=1
npx playwright test e2e/playback.spec.ts --repeat-each=10 --workers=4
npx playwright test e2e/playback.spec.ts --ui
git diff --check upstream/main...HEAD

Results:

* formatting passed;
* lint: 0 errors, 1 existing warning;
* unit tests: 3 passed;
* production build passed;
* full Playwright suite: 27 passed;
* playback stress: 50/50 serial and 50/50 parallel;
* Playwright UI: 5/5 playback tests passed with visual inspection of preview/shared-state and keyboard activation flows;
* manual mouse and keyboard playback checks passed.

## Screenshots

**Playwright UI:** 5/5 playback tests passing — preview click/shared state, keyboard activation, and existing Space/R controls verified.

https://github.com/user-attachments/assets/078f8bb9-08cc-4fa1-951a-eb91ef45cc34


**Preview/playback shared state**
Playwright E2E demonstrating preview click, playback-bar synchronization, nested control handling, and a passing shared-state test.

https://github.com/user-attachments/assets/6ecb0366-33a4-4a5e-9524-deb6cd2a2a6d


**Keyboard accessibility**
Playwright E2E demonstrating keyboard focus plus Space and Enter activation on the preview playback control, with the test passing.


https://github.com/user-attachments/assets/f8f2e6e8-dbdb-4737-ada2-4ea6a79bf0dd


## Checklist

* [x] My code follows the style of this project
* [x] I have tested my changes locally
* [x] I have updated documentation where needed
* [x] My pull request targets the `main` branch
* [x] I have read the [[Contributing guide](https://chatgpt.com/CONTRIBUTING.md)](../CONTRIBUTING.md)

[vercel]

@AyobamiH is attempting to deploy a commit to the Jaoude Studios Team on Vercel.

A member of the Team first needs to authorize it.

[eddiejaoude]

Thank you 🙏 . I will integrate this PR this weekend.