Add comprehensive light/dark mode support and fix playback

[mythz]

Styling Improvements:

• Replace hardcoded dark colors (bg-black, bg-gray-900, etc.) with semantic Tailwind classes
• Add full light/dark mode support using dark: variant throughout
• Significantly improve contrast and text legibility in both modes
• Use proper color tokens: bg-background, text-foreground, text-muted-foreground, border-border
• Add shadows and visual depth to components
• Improve button styles with better hover states

Component Updates:

Editor Layout:

• Header: bg-slate-100 dark:bg-slate-900 with proper contrast
• Sidebar: bg-slate-50 dark:bg-slate-900 for better readability
• Timeline area: bg-slate-100 dark:bg-slate-950

Asset Library:

• Card backgrounds: bg-white dark:bg-slate-800 with borders
• Better contrast for asset metadata and icons
• Improved hover states with shadow effects

Preview Canvas:

• Background: bg-slate-200 dark:bg-slate-900
• Better video player container styling with shadows
• Fixed playback functionality by improving Player component integration

Playback Controls:

• Better contrast with bg-white dark:bg-slate-900
• Rounded play button for better UX
• Improved typography with font-semibold for important text
• Better color hierarchy for time display

Timeline Components:

• Timeline ruler: proper light/dark mode with primary color cursor
• Track headers: improved contrast and legibility
• Track backgrounds: subtle colored backgrounds (blue/green/yellow) in both modes
• Timeline elements: enhanced with shadows and better borders
• Improved resize handles visibility

Playback Fix:

• Improved Player component state synchronization
• Better control over player behavior (disabled click/double-click/space handlers)
• Fixed play/pause button functionality

All text is now highly legible in both light and dark modes with proper contrast ratios.