VideoEditor: add guides, fit/fill, theater mode, keyboard shortcuts, and refactors

[TopProjectsCreator]

Motivation

• Improve the in-editor playback UX by adding visual guides, viewport fit options, and a theater mode for immersive previewing.
• Make playback controls more responsive and stable by memoizing handlers with useCallback.
• Surface useful keyboard shortcuts for quick navigation and toggling common view options.

Description

• Added new state for showGuides, theaterMode, and viewportFit and UI buttons in the top bar to toggle them and show current state.
• Implemented keyboard shortcuts in a useEffect (Space play/pause, J/L skip, G toggle guides, F toggle fit/fill, T toggle theater) and wired them to the new controls.
• Refactored play/seek/skip handlers to use useCallback and updated video element classes and container padding to support contain/cover fitting and full-bleed theater mode.
• Added on-screen HUD overlays including a dashed guides frame, time/fit/trim badges, and a compact top-bar hint; cleaned up icon imports accordingly.

Testing

• Ran unit tests with yarn test and the suite passed.
• Performed a TypeScript type check with yarn build which completed without errors.
• Ran linter (yarn lint) and formatting checks which returned no new issues.

---

Codex Task