FIX: Focus video controls positioning issue

CSS Conflict Resolution:
- Changed focus controls class from 'video-controls' to 'focus-video-controls'
- Added 'position: relative' to prevent absolute positioning conflicts
- Resolves volume slider staying fixed on screen during scroll

 Volume Control Positioning:
- Focus video controls now stay with video content when scrolling
- No longer conflicts with BaseVideoPlayer CSS positioning rules
- Maintains proper focus session UI layout and behavior
- Volume slider moves naturally with the focus video container

src/features/tasks/interactiveTaskManager.js

@@ -1157,7 +1157,7 @@ class InteractiveTaskManager {
                                autoplay 
                                style="width: 100%; max-height: 400px; border-radius: 8px; margin: 15px 0;">
                         </video>
-                        <div class="video-controls" style="display: flex; align-items: center; justify-content: center; gap: 10px; margin: 10px 0;">
+                        <div class="focus-video-controls" style="display: flex; align-items: center; justify-content: center; gap: 10px; margin: 10px 0; position: relative;">
                             <label for="focus-video-volume" style="color: #bbb; font-size: 14px;">🔊</label>
                             <input type="range" 
                                    id="focus-video-volume"