diff --git a/UI_UPDATE.MD b/UI_UPDATE.MD
index 7e8623e..3bff8cb 100644
--- a/UI_UPDATE.MD
+++ b/UI_UPDATE.MD
@@ -54,40 +54,40 @@ Always come back and update UI_UPDATE.MD once complete with task and task item.
 ### Sub-task 1.2: JavaScript Separation and Organization
 
 #### 1.2.1: JavaScript Code Identification
-- [x] Locate all JavaScript code within `<script>` tags in index.php
-- [x] Identify JavaScript functions, event handlers, and global functions
-- [x] Map dependencies between different JavaScript sections
-- [x] Document any PHP- generated JavaScript content
+- [ ] Locate all JavaScript code within `<script>` tags in index.php
+- [ ] Identify JavaScript functions, event handlers, and global functions
+- [ ] Map dependencies between different JavaScript sections
+- [ ] Document any PHP- generated JavaScript content
 
 #### 1.2.2: Core App.js Structure Creation
-- [x] Create new app.js main file
-- [x] Define application configuration object
-- [x] Set up basic module loading structure
-- [x] Implement global error handling and logging
+- [ ] Create new app.js main file
+- [ ] Define application configuration object
+- [ ] Set up basic module loading structure
+- [ ] Implement global error handling and logging
 
 #### 1.2.3: Video Player Module Extraction
-- [x] Extract Video.js initialization code into video-player.js
-- [x] Separate video control functions
-- [x] Move stream status management logic
-- [x] Maintain error handling for video playback
+- [ ] Extract Video.js initialization code into video-player.js
+- [ ] Separate video control functions
+- [ ] Move stream status management logic
+- [ ] Maintain error handling for video playback
 
 #### 1.2.4: Chat System Module Creation
-- [x] Extract chat functionality into chat.js
-- [x] Separate message handling and UI updates
-- [x] Move user authentication and admin functions
-- [x] Implement event delegation for chat interactions
+- [ ] Extract chat functionality into chat.js
+- [ ] Separate message handling and UI updates
+- [ ] Move user authentication and admin functions
+- [ ] Implement event delegation for chat interactions
 
 #### 1.2.5: UI Controls Module Development
-- [x] Extract UI toggle and control functions into ui-controls.js
-- [x] Separate keyboard shortcuts implementation
-- [x] Move notification and toast management
-- [x] Create utility functions for DOM manipulation
+- [ ] Extract UI toggle and control functions into ui-controls.js
+- [ ] Separate keyboard shortcuts implementation
+- [ ] Move notification and toast management
+- [ ] Create utility functions for DOM manipulation
 
 #### 1.2.6: API Communication Module
-- [x] Extract AJAX/Fetch calls into api.js
-- [x] Create functions for heartbeat, message sending, and data fetching
-- [x] Implement API error handling and retry logic
-- [x] Separate WebSocket or polling mechanisms
+- [ ] Extract AJAX/Fetch calls into api.js
+- [ ] Create functions for heartbeat, message sending, and data fetching
+- [ ] Implement API error handling and retry logic
+- [ ] Separate WebSocket or polling mechanisms
 
 ### Sub-task 1.3: HTML Structure Refactoring
 
diff --git a/api.js b/api.js
deleted file mode 100644
index bcd7b0e..0000000
--- a/api.js
+++ /dev/null
@@ -1,222 +0,0 @@
-// API Communication Module
-// Handles all AJAX/Fetch calls and API interactions
-
-(function() {
-    'use strict';
-
-    AppModules.register('api');
-
-    const API_BASE_URL = '';
-
-    // Generic fetch wrapper with error handling and retries
-    function apiRequest(endpoint, options = {}) {
-        const url = endpoint.startsWith('?') ? endpoint : `${API_BASE_URL}${endpoint}`;
-
-        return fetch(url, {
-            method: options.method || 'GET',
-            headers: {
-                'Content-Type': 'application/x-www-form-urlencoded',
-                ...options.headers
-            },
-            body: options.body
-        })
-        .then(response => {
-            if (!response.ok) {
-                throw new Error(`HTTP ${response.status}: ${response.statusText}`);
-            }
-            return response.json();
-        })
-        .catch(error => {
-            AppLogger.error(`API request to ${endpoint} failed:`, error);
-            throw error;
-        });
-    }
-
-    // Stream status checking
-    function checkStreamStatus() {
-        return apiRequest('?api=stream_status')
-            .then(data => {
-                AppLogger.log('Stream status check:', data);
-                return data.online === true;
-            })
-            .catch(error => {
-                AppLogger.error('Stream status check failed:', error);
-                return false; // Assume offline if check fails
-            });
-    }
-
-    // User management
-    function getUserId() {
-        return apiRequest('', {
-            method: 'POST',
-            body: 'action=get_user_id'
-        })
-        .then(data => {
-            if (data.success) {
-                AppState.userId = data.user_id;
-                AppState.isAdmin = data.is_admin || false;
-
-                const userIdElement = document.getElementById('userId');
-                if (userIdElement) {
-                    userIdElement.textContent = '#' + AppState.userId;
-
-                    if (AppState.isAdmin) {
-                        userIdElement.classList.add('admin');
-                        userIdElement.textContent = '👑 #' + AppState.userId;
-                        const adminControls = document.getElementById('adminControls');
-                        if (adminControls) adminControls.style.display = 'flex';
-                    }
-                }
-
-                return data;
-            } else {
-                throw new Error('Failed to get user ID');
-            }
-        });
-    }
-
-    // Heartbeat functionality
-    function sendHeartbeat() {
-        const nicknameValue = document.getElementById('nickname')?.value || 'Anonymous';
-
-        return apiRequest('', {
-            method: 'POST',
-            body: `action=heartbeat&nickname=${encodeURIComponent(nicknameValue)}`
-        })
-        .then(data => {
-            if (data.success && data.viewer_count !== undefined) {
-                AppState.viewerCount = data.viewer_count;
-                updateViewerCount(data.viewer_count);
-            }
-        })
-        .catch(error => {
-            AppLogger.error('Heartbeat failed:', error);
-        });
-    }
-
-    // Chat message operations
-    function sendMessage(nickname, message) {
-        if (!nickname || !message) {
-            throw new Error('Nickname and message are required');
-        }
-
-        const body = `action=send&nickname=${encodeURIComponent(nickname)}&message=${encodeURIComponent(message)}`;
-
-        return apiRequest('', {
-            method: 'POST',
-            body: body
-        });
-    }
-
-    function fetchMessages() {
-        return apiRequest('', {
-            method: 'POST',
-            body: `action=fetch&last_id=${encodeURIComponent(AppState.lastMessageId)}`
-        })
-        .then(data => {
-            if (data.success) {
-                // Update viewer count
-                if (data.viewer_count !== undefined) {
-                    AppState.viewerCount = data.viewer_count;
-                    updateViewerCount(data.viewer_count);
-                }
-
-                return data;
-            } else {
-                throw new Error('Failed to fetch messages');
-            }
-        })
-        .catch(error => {
-            AppLogger.error('Fetch messages failed:', error);
-            updateConnectionStatus(false);
-            throw error;
-        });
-    }
-
-    // Admin functions
-    function deleteMessage(messageId) {
-        if (!AppState.isAdmin) return Promise.reject(new Error('Admin access required'));
-
-        return apiRequest('', {
-            method: 'POST',
-            body: `action=delete_message&message_id=${encodeURIComponent(messageId)}`
-        })
-        .then(data => {
-            if (data.success) {
-                return data;
-            } else {
-                throw new Error('Failed to delete message');
-            }
-        });
-    }
-
-    function banUser(userId) {
-        if (!AppState.isAdmin) return Promise.reject(new Error('Admin access required'));
-
-        return apiRequest('', {
-            method: 'POST',
-            body: `action=ban_user&user_id=${encodeURIComponent(userId)}`
-        })
-        .then(data => {
-            if (data.success) {
-                return data;
-            } else {
-                throw new Error('Failed to ban user');
-            }
-        });
-    }
-
-    function clearChat() {
-        if (!AppState.isAdmin) return Promise.reject(new Error('Admin access required'));
-
-        return apiRequest('', {
-            method: 'POST',
-            body: 'action=clear_chat'
-        })
-        .then(data => {
-            if (data.success) {
-                return data;
-            } else {
-                throw new Error('Failed to clear chat');
-            }
-        });
-    }
-
-    // UI feedback functions (will be moved to ui-controls later, but needed here for now)
-    function updateViewerCount(count) {
-        const viewerElement = document.getElementById('viewerCount');
-        if (viewerElement) {
-            viewerElement.textContent = count + (count === 1 ? ' viewer' : ' viewers');
-        }
-    }
-
-    function updateConnectionStatus(online) {
-        const statusDot = document.getElementById('statusDot');
-        const statusText = document.getElementById('statusText');
-
-        if (statusDot && statusText) {
-            if (online) {
-                statusDot.classList.remove('offline');
-                statusText.textContent = 'Connected';
-            } else {
-                statusDot.classList.add('offline');
-                statusText.textContent = 'Reconnecting...';
-            }
-        }
-    }
-
-    // Public API
-    window.API = {
-        checkStreamStatus: checkStreamStatus,
-        getUserId: getUserId,
-        sendHeartbeat: sendHeartbeat,
-        sendMessage: sendMessage,
-        fetchMessages: fetchMessages,
-        deleteMessage: deleteMessage,
-        banUser: banUser,
-        clearChat: clearChat
-    };
-
-    AppLogger.log('API module loaded');
-
-})();
diff --git a/app.js b/app.js
deleted file mode 100644
index ff8b882..0000000
--- a/app.js
+++ /dev/null
@@ -1,116 +0,0 @@
-// Core Dodgers Stream Application
-// Configuration and module loading
-
-const AppConfig = {
-    // API configuration
-    api: {
-        baseUrl: '',
-        heartbeatInterval: 5000,
-        chatPollInterval: 2000,
-        maxRetries: 3,
-        retryDelay: 1000
-    },
-    // Video player configuration
-    video: {
-        defaultVolume: 0.3,
-        maxRetries: 3,
-        recoveryTimeout: 10000,
-        streamMonitoringInterval: 10000,
-        recoveryCheckCount: 5,
-        recoveryCheckInterval: 2000
-    },
-    // UI configuration
-    ui: {
-        animationDuration: 300,
-        mobileBreakpoint: 768,
-        toastDuration: 3000
-    },
-    // Chat configuration
-    chat: {
-        maxMessages: 100,
-        maxMessageLength: 1000,
-        maxNicknameLength: 20,
-        typingTimeout: 1000
-    }
-};
-
-// Global application state
-const AppState = {
-    player: null,
-    userId: '',
-    nickname: '',
-    isAdmin: false,
-    streamMode: 'live', // 'live' or 'placeholder'
-    chatCollapsed: false,
-    unreadCount: 0,
-    soundEnabled: true,
-    lastMessageId: '',
-    allMessages: [],
-    viewerCount: 0,
-    errorRetryCount: 0,
-    isRetrying: false,
-    isRecovering: false,
-    recoveryInterval: null,
-    typingTimer: null,
-    isTyping: false
-};
-
-// Global error handling and logging
-const AppLogger = {
-    log: (message, ...args) => {
-        console.log(`[${new Date().toLocaleTimeString()}] ${message}`, ...args);
-    },
-    error: (message, ...args) => {
-        console.error(`[${new Date().toLocaleTimeString()}] ERROR: ${message}`, ...args);
-    },
-    warn: (message, ...args) => {
-        console.warn(`[${new Date().toLocaleTimeString()}] WARNING: ${message}`, ...args);
-    }
-};
-
-// Module registry for dependencies
-const AppModules = {
-    loaded: new Set(),
-
-    register: function(name) {
-        this.loaded.add(name);
-        AppLogger.log(`Module '${name}' registered`);
-    },
-
-    isLoaded: function(name) {
-        return this.loaded.has(name);
-    },
-
-    require: function(...names) {
-        for (const name of names) {
-            if (!this.isLoaded(name)) {
-                throw new Error(`Required module '${name}' is not loaded`);
-            }
-        }
-    }
-};
-
-// Global error handler
-window.addEventListener('unhandledrejection', (event) => {
-    AppLogger.error('Unhandled promise rejection:', event.reason);
-});
-
-window.addEventListener('error', (event) => {
-    AppLogger.error('Unhandled error:', event.error);
-});
-
-// Initialize application
-document.addEventListener('DOMContentLoaded', () => {
-    AppLogger.log('Dodgers Stream Theater initializing...');
-
-    // Start with basic UI setup
-    const nicknameInput = document.getElementById('nickname');
-    if (nicknameInput && localStorage.getItem('chatNickname')) {
-        nicknameInput.value = localStorage.getItem('chatNickname');
-        AppState.nickname = nicknameInput.value;
-    }
-
-    AppLogger.log('Core application initialized');
-});
-
-AppLogger.log('Core app.js loaded');
diff --git a/chat.js b/chat.js
deleted file mode 100644
index ec289b4..0000000
--- a/chat.js
+++ /dev/null
@@ -1,414 +0,0 @@
-// Chat System Module
-// Handles chat functionality, message handling, and user authentication
-
-(function() {
-    'use strict';
-
-    AppModules.require('api', 'ui-controls');
-    AppModules.register('chat');
-
-    // Initialize chat system
-    function initializeChat() {
-        AppLogger.log('Initializing chat system...');
-
-        // Get user ID first
-        API.getUserId()
-            .then(data => {
-                AppLogger.log('Chat initialized with user:', AppState.userId, AppState.isAdmin ? '(admin)' : '');
-
-                // Show admin toast if applicable
-                if (AppState.isAdmin) {
-                    UIControls.showToast('Admin mode activated');
-                }
-
-                // Set up nickname handling
-                const nicknameInput = document.getElementById('nickname');
-                if (nicknameInput) {
-                    // Load saved nickname
-                    const savedNickname = localStorage.getItem('chatNickname');
-                    if (savedNickname) {
-                        nicknameInput.value = savedNickname;
-                    }
-
-                    // Handle nickname changes
-                    UIControls.DOMUtils.addEvent(nicknameInput, 'change', function() {
-                        const nickname = this.value.trim();
-                        localStorage.setItem('chatNickname', nickname);
-                        AppState.nickname = nickname;
-                    });
-                }
-
-                // Set up message input handling
-                const messageInput = document.getElementById('messageInput');
-                if (messageInput) {
-                    // Enter key to send message
-                    UIControls.DOMUtils.addEvent(messageInput, 'keypress', function(e) {
-                        if (e.key === 'Enter' && !e.shiftKey) {
-                            e.preventDefault();
-                            sendMessage();
-                        }
-                    });
-
-                    // Typing indicator
-                    UIControls.DOMUtils.addEvent(messageInput, 'input', function() {
-                        handleTypingIndicator();
-                    });
-                }
-
-                // Set up send button
-                const sendButton = document.querySelector('.chat-input button') ||
-                                  document.querySelector('#messageInput').nextElementSibling;
-                if (sendButton && sendButton.tagName === 'BUTTON') {
-                    UIControls.DOMUtils.addEvent(sendButton, 'click', sendMessage);
-                }
-
-                // Start polling for messages
-                startMessagePolling();
-
-                // Send initial heartbeat
-                API.sendHeartbeat();
-
-                AppLogger.log('Chat system initialized successfully');
-            })
-            .catch(error => {
-                AppLogger.error('Failed to initialize chat:', error);
-                UIControls.showToast('Failed to initialize chat');
-            });
-    }
-
-    // Send message functionality
-    function sendMessage() {
-        const messageInput = document.getElementById('messageInput');
-        const nicknameInput = document.getElementById('nickname');
-        const message = messageInput?.value?.trim() || '';
-        const nickname = nicknameInput?.value?.trim() || '';
-
-        if (!nickname) {
-            if (nicknameInput) {
-                nicknameInput.style.borderColor = 'var(--dodgers-red)';
-                nicknameInput.focus();
-            }
-            UIControls.showToast('Please enter a nickname');
-            setTimeout(() => {
-                if (nicknameInput) nicknameInput.style.borderColor = '#e0e0e0';
-            }, 2000);
-            return;
-        }
-
-        if (!message) {
-            return; // Just return quietly for empty message
-        }
-
-        // Send message via API
-        API.sendMessage(nickname, message)
-            .then(data => {
-                if (data.success) {
-                    if (messageInput) messageInput.value = '';
-                    AppState.nickname = nickname;
-                    // Message will be added automatically by polling
-                } else if (data.error) {
-                    UIControls.showToast(data.error);
-                    UIControls.updateConnectionStatus(false);
-                }
-            })
-            .catch(error => {
-                AppLogger.error('Error sending message:', error);
-                UIControls.showToast('Failed to send message');
-                UIControls.updateConnectionStatus(false);
-            });
-    }
-
-    // Delete message (admin only)
-    function deleteMessage(messageId) {
-        if (!AppState.isAdmin) return;
-
-        if (!confirm('Delete this message?')) return;
-
-        API.deleteMessage(messageId)
-            .then(data => {
-                if (data.success) {
-                    removeMessageFromUI(messageId);
-                    UIControls.showToast('Message deleted');
-                } else {
-                    UIControls.showToast('Failed to delete message');
-                }
-            })
-            .catch(error => {
-                AppLogger.error('Error deleting message:', error);
-                UIControls.showToast('Failed to delete message');
-            });
-    }
-
-    // Ban user (admin only)
-    function banUser(userId) {
-        if (!AppState.isAdmin) return;
-
-        if (!confirm('Ban this user from chat?')) return;
-
-        API.banUser(userId)
-            .then(data => {
-                if (data.success) {
-                    UIControls.showToast('User banned');
-                } else {
-                    UIControls.showToast('Failed to ban user');
-                }
-            })
-            .catch(error => {
-                AppLogger.error('Error banning user:', error);
-                UIControls.showToast('Failed to ban user');
-            });
-    }
-
-    // Clear chat (admin only)
-    function clearChat() {
-        if (!AppState.isAdmin) return;
-
-        if (!confirm('Clear all chat messages?')) return;
-
-        API.clearChat()
-            .then(data => {
-                if (data.success) {
-                    clearMessagesUI();
-                    UIControls.showToast('Chat cleared');
-                    AppState.lastMessageId = '';
-                    API.sendHeartbeat(); // Force refresh all users
-                } else {
-                    UIControls.showToast('Failed to clear chat');
-                }
-            })
-            .catch(error => {
-                AppLogger.error('Error clearing chat:', error);
-                UIControls.showToast('Failed to clear chat');
-            });
-    }
-
-    // Message polling system
-    function startMessagePolling() {
-        // Poll for new messages
-        setInterval(fetchMessages, AppConfig.api.chatPollInterval);
-
-        // Send heartbeat periodically
-        setInterval(API.sendHeartbeat, AppConfig.api.heartbeatInterval);
-
-        // Initial fetch
-        fetchMessages();
-    }
-
-    // Fetch and display messages
-    function fetchMessages() {
-        API.fetchMessages()
-            .then(data => {
-                if (data.success) {
-                    // Handle initial load or message updates
-                    if (data.all_messages !== null) {
-                        // Initial load or forced refresh (like after admin clear)
-                        handleInitialMessageLoad(data);
-                    } else {
-                        // Incremental updates
-                        handleNewMessages(data.messages);
-                    }
-
-                    // Check for admin clear
-                    if (data.message_count === 0 && AppState.allMessages.length > 0) {
-                        handleChatCleared();
-                    }
-
-                    // Update last message ID
-                    if (AppState.allMessages.length > 0) {
-                        AppState.lastMessageId = AppState.allMessages[AppState.allMessages.length - 1].id;
-                    }
-
-                    UIControls.updateConnectionStatus(true);
-                }
-            })
-            .catch(error => {
-                AppLogger.error('Error fetching messages:', error);
-                UIControls.updateConnectionStatus(false);
-            });
-    }
-
-    // Handle initial message load
-    function handleInitialMessageLoad(data) {
-        AppState.allMessages = data.all_messages || [];
-        displayAllMessages();
-    }
-
-    // Handle new messages
-    function handleNewMessages(messages) {
-        if (!messages || messages.length === 0) return;
-
-        messages.forEach(msg => {
-            appendMessage(msg);
-
-            // Show notification if chat is collapsed and message is not from current user
-            if (AppState.chatCollapsed && msg.user_id !== AppState.userId) {
-                AppState.unreadCount++;
-                UIControls.updateNotificationBadge();
-                UIControls.playNotificationSound();
-            }
-        });
-    }
-
-    // Handle chat cleared by admin
-    function handleChatCleared() {
-        const chatMessages = document.getElementById('chatMessages');
-        if (chatMessages) {
-            chatMessages.innerHTML = '<div class="system-message">Chat was cleared by admin</div>';
-        }
-        AppState.allMessages = [];
-        AppState.lastMessageId = '';
-    }
-
-    // Typing indicator system
-    function handleTypingIndicator() {
-        const messageInput = document.getElementById('messageInput');
-        if (!messageInput) return;
-
-        const hasContent = messageInput.value.length > 0;
-
-        if (hasContent && !AppState.isTyping) {
-            AppState.isTyping = true;
-        }
-
-        clearTimeout(AppState.typingTimer);
-        AppState.typingTimer = setTimeout(() => {
-            AppState.isTyping = false;
-        }, AppConfig.chat.typingTimeout);
-    }
-
-    // UI manipulation functions
-    function displayAllMessages() {
-        const chatMessages = document.getElementById('chatMessages');
-
-        if (!chatMessages) return;
-
-        if (AppState.allMessages.length === 0) {
-            chatMessages.innerHTML = '<div class="empty-chat">No messages yet. Be the first to say hello! 👋</div>';
-            AppState.lastMessageCount = 0;
-            return;
-        }
-
-        chatMessages.innerHTML = '';
-
-        AppState.allMessages.forEach(msg => {
-            appendMessageElement(msg, false);
-        });
-
-        // Scroll to bottom
-        chatMessages.scrollTop = chatMessages.scrollHeight;
-        AppState.lastMessageCount = AppState.allMessages.length;
-    }
-
-    function appendMessage(msg) {
-        AppState.allMessages.push(msg);
-        appendMessageElement(msg, true);
-        AppState.lastMessageCount = AppState.allMessages.length;
-    }
-
-    function appendMessageElement(msg, animate) {
-        const chatMessages = document.getElementById('chatMessages');
-
-        if (!chatMessages) return;
-
-        // Remove empty chat message if it exists
-        const emptyChat = chatMessages.querySelector('.empty-chat');
-        if (emptyChat) {
-            emptyChat.remove();
-        }
-
-        const messageDiv = document.createElement('div');
-        messageDiv.className = 'message';
-        messageDiv.setAttribute('data-message-id', msg.id);
-
-        // Own message styling
-        if (msg.user_id === AppState.userId) {
-            messageDiv.className += ' own-message';
-        }
-
-        // Admin message styling
-        if (msg.is_admin) {
-            messageDiv.className += ' admin-message';
-        }
-
-        // Disable animation for initial load
-        if (!animate) {
-            messageDiv.style.animation = 'none';
-        }
-
-        // Create admin actions if user is admin
-        const adminActions = (AppState.isAdmin && msg.user_id !== AppState.userId) ?
-            `<div class="message-actions">
-                <button class="delete-btn" onclick="Chat.deleteMessage('${msg.id}')">Delete</button>
-                <button class="ban-btn" onclick="Chat.banUser('${msg.user_id}')">Ban</button>
-            </div>` : '';
-
-        // Create admin badge
-        const adminBadge = msg.is_admin ? '👑 ' : '';
-
-        messageDiv.innerHTML = `
-            <div class="message-header">
-                <span class="message-nickname${msg.is_admin ? ' admin' : ''}">${adminBadge}${msg.nickname}</span>
-                <span class="message-id">#${msg.user_id}</span>
-                <span class="message-time">${msg.time}</span>
-            </div>
-            <div class="message-text">${escapeHtml(msg.message)}</div>
-            ${adminActions}
-        `;
-
-        chatMessages.appendChild(messageDiv);
-
-        // Auto-scroll to bottom on new messages
-        if (animate) {
-            chatMessages.scrollTop = chatMessages.scrollHeight;
-        }
-    }
-
-    function removeMessageFromUI(messageId) {
-        const messageElement = document.querySelector(`[data-message-id="${messageId}"]`);
-        if (messageElement) {
-            messageElement.style.animation = 'slideOut 0.3s';
-            setTimeout(() => {
-                messageElement.remove();
-            }, 300);
-        }
-
-        // Remove from internal array
-        AppState.allMessages = AppState.allMessages.filter(msg => msg.id !== messageId);
-    }
-
-    function clearMessagesUI() {
-        const chatMessages = document.getElementById('chatMessages');
-        if (chatMessages) {
-            chatMessages.innerHTML = '<div class="system-message">Chat cleared by admin</div>';
-        }
-        AppState.allMessages = [];
-        AppState.lastMessageId = '';
-    }
-
-    // Utility function for HTML escaping
-    function escapeHtml(text) {
-        const div = document.createElement('div');
-        div.textContent = text;
-        return div.innerHTML;
-    }
-
-    // Public API
-    window.Chat = {
-        initializeChat: initializeChat,
-        sendMessage: sendMessage,
-        deleteMessage: deleteMessage,
-        banUser: banUser,
-        clearChat: clearChat,
-        displayAllMessages: displayAllMessages,
-        appendMessage: appendMessage
-    };
-
-    // Initialize when DOM is ready and modules are loaded
-    document.addEventListener('DOMContentLoaded', function() {
-        // Small delay to ensure all modules are loaded
-        setTimeout(initializeChat, 100);
-    });
-
-    AppLogger.log('Chat module loaded');
-
-})();
diff --git a/index.php b/index.php
index 6f6725a..07aea2a 100644
--- a/index.php
+++ b/index.php
@@ -403,10 +403,1242 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action'])) {
     <div class="toast" id="toast"></div>
 
     <script src="https://vjs.zencdn.net/8.6.1/video.min.js"></script>
-    <script src="app.js"></script>
-    <script src="api.js"></script>
-    <script src="ui-controls.js"></script>
-    <script src="chat.js"></script>
-    <script src="video-player.js"></script>
+    <script>
+        // Global variables
+        let player;
+        let nickname = localStorage.getItem('chatNickname') || '';
+        let userId = '';
+        let isAdmin = false;
+        let lastMessageId = '';
+        let allMessages = [];
+        let lastKnownMessageCount = 0;
+        let chatCollapsed = false;
+        let unreadCount = 0;
+        let soundEnabled = localStorage.getItem('soundEnabled') !== 'false';
+        let typingTimer;
+        let isTyping = false;
+
+        // Stream state variables
+        let streamMode = 'live'; // 'live' or 'placeholder'
+        let recoveryInterval;
+        let isRecovering = false;
+
+        // CENTRALIZED STATUS MANAGEMENT - ENSURES 100% ACCURACY
+        function updateStreamStatus(status, color) {
+            const badge = document.querySelector('.stream-badge');
+            if (badge) {
+                badge.textContent = status;
+                badge.style.background = color || 'var(--dodgers-red)'; // Default to live color
+                console.log(`📊 Stream status updated: ${status} (${color || 'red'})`);
+            }
+        }
+
+        // SYNC STATUS WITH STREAM MODE - PREVENTS INCORRECT DISPLAY
+        function syncStatusWithStreamMode() {
+            if (streamMode === 'placeholder') {
+                updateStreamStatus('PLACEHOLDER', '#17a2b8');
+            } else if (streamMode === 'live') {
+                updateStreamStatus('LIVE', 'var(--dodgers-red)');
+            } else {
+                updateStreamStatus('WAITING...', '#ffc107');
+            }
+        }
+
+        console.log('🔄 Initializing Dodgers Stream Player');
+        console.log('📊 Initial state: streamMode=live, errorRetryCount=0, isRecovering=false');
+        console.log('🎬 Starting Video.js initialization...');
+
+        // Initialize Video.js player
+        player = videojs('video-player', {
+			html5: {
+				vhs: {
+					overrideNative: true,
+					withCredentials: false,
+					// Add these for better resilience
+					handlePartialData: true,
+					smoothQualityChange: true,
+					allowSeeksWithinUnsafeLiveWindow: true,
+					handleManifestRedirects: true,
+					useBandwidthFromLocalStorage: true,
+					// Increase tolerance for errors
+					maxPlaylistRetries: 10,  // Retry playlist fetches
+					blacklistDuration: 5,    // Only blacklist for 5 seconds
+					bandwidth: 4194304       // Start with reasonable bandwidth estimate
+				}
+			},
+			liveui: true,
+			liveTracker: {
+				trackingThreshold: 30,    // Seconds behind live before seeking
+				liveTolerance: 15         // Seconds from live to be considered live
+			},
+			errorDisplay: false,  // We'll handle errors ourselves
+			responsive: false,
+			controlBar: {
+				volumePanel: {
+					inline: false
+				},
+				pictureInPictureToggle: true
+			}
+		});
+
+        // Track error state to prevent spam
+		let errorRetryCount = 0;
+		let isRetrying = false;
+		const MAX_RETRIES = 3; // Reduced for faster fallback
+
+		// AGGRESSIVE VOLUME ENFORCEMENT - BLOCKS VIDEO.JS FROM RESETTING VOLUME TO 100%
+		function enforceSavedVolume() {
+			const currentVolume = player.volume();
+			if (currentVolume === 1.0) {  // Video.js evil reset to 100% detected
+				const savedVolume = parseFloat(localStorage.getItem('playerVolume') || '0.3');
+				if (savedVolume !== 1.0) {
+					console.log('🚫 BLOCKED: Volume reset to 100% - forcing back to:', savedVolume);
+					player.volume(savedVolume);
+					return true; // Volume was forced back
+				}
+			}
+			return false; // Volume is OK
+		}
+
+		// TIMED VOLUME RESTORATION FUNCTION
+		function restoreVolume() {
+			const savedVolume = localStorage.getItem('playerVolume');
+			if (savedVolume) {
+				const volume = parseFloat(savedVolume);
+				console.log('🔊 RESTORING VOLUME TO:', volume);
+
+				// Force immediately, then reinforce with delay
+				player.volume(volume);
+				setTimeout(() => player.volume(volume), 100);
+				setTimeout(() => player.volume(volume), 500);
+
+				// Also reinforce on key events that Video.js might use to reset volume
+				setTimeout(() => {
+					['loadeddata', 'loadedmetadata', 'canplay'].forEach(event => {
+						player.one(event, () => {
+							setTimeout(() => {
+								const current = player.volume();
+								if (current === 1.0 || (current !== volume && !player.muted())) {
+									console.log('🔄 Reinforcing volume after', event + ':', volume);
+									player.volume(volume);
+								}
+							}, 50);
+						});
+					});
+				}, 100);
+			}
+		}
+
+		// Seperate function for HLS playback (used when stream is confirmed online)
+		function attemptHLSPlayback() {
+			console.log('🎬 Attempting HLS stream playback...');
+
+			// Try to play automatically
+			var playPromise = player.play();
+			if (playPromise !== undefined) {
+				playPromise.catch(function(error) {
+					console.log('Auto-play was prevented:', error);
+					showToast('Click play to start stream');
+				});
+			}
+		}
+
+		// Check stream status on page load
+		function checkInitialStreamStatus() {
+			return fetch('?api=stream_status')
+				.then(response => response.json())
+				.then(data => {
+					console.log('📡 Initial stream status check:', data);
+					return data.online === true; // Strict boolean check
+				})
+				.catch(error => {
+					console.log('❗ Initial stream status check failed:', error);
+					return false; // Assume offline if check fails
+				});
+		}
+
+		// Set default volume or restore saved volume
+		player.ready(function() {
+			console.log('Player is ready');
+
+			// IMMEDIATELY FIX ANY EVIL VIDEO.JS 100% VOLUME
+			if (player.volume() === 1.0) {
+				const savedVolume = localStorage.getItem('playerVolume') || '0.3';
+				player.volume(parseFloat(savedVolume));
+				console.log('🚫 FIXED: Initial 100% volume reset to:', savedVolume);
+			}
+
+			// Restore volume or set default
+			const savedVolume = localStorage.getItem('playerVolume');
+			if (savedVolume !== null) {
+				const volumeValue = parseFloat(savedVolume);
+				player.volume(volumeValue);
+				console.log('🔊 Restored saved volume:', volumeValue);
+			} else {
+				player.volume(0.3); // Default 30%
+				console.log('🔊 Set default volume: 0.3');
+			}
+
+			// AGGRESSIVE VOLUME MONITOR - BLOCKS 100% RESETS
+			player.on('volumechange', function() {
+				if (!enforceSavedVolume()) {
+					// User's intentional change - save it
+					if (!player.muted()) {
+						const newVolume = player.volume();
+						localStorage.setItem('playerVolume', newVolume);
+						console.log('💾 Saved volume setting:', newVolume);
+					}
+				}
+			});
+
+			// PROACTIVE STREAM STATUS CHECK - START WITH APPROPRIATE SOURCE
+			console.log('🔍 Checking stream status on page load...');
+			checkInitialStreamStatus().then(isOnline => {
+				if (!isOnline) {
+					console.log('🔄 Stream offline on load - switching to placeholder immediately');
+					switchToPlaceholder();
+				} else {
+					console.log('✅ Stream online on load - starting HLS playback');
+					// Stream is online, proceed with normal HLS loading
+					attemptHLSPlayback();
+					// Also start monitoring in case it goes offline soon
+					startStreamMonitoring();
+				}
+			});
+		});
+
+		// Start periodic stream monitoring
+		function startStreamMonitoring() {
+			if (!recoveryInterval) {
+				console.log('👁️ Starting stream monitoring...');
+				recoveryInterval = setInterval(() => {
+					if (streamMode !== 'placeholder') { // Only check if not already in placeholder mode
+						fetch('?api=stream_status')
+							.then(response => response.json())
+							.then(data => {
+								if (!data.online) {
+									console.log('⚠️ Stream went offline during playback - switching to placeholder');
+									switchToPlaceholder();
+								}
+							})
+							.catch(error => {
+								console.log('❗ Stream monitoring check failed:', error);
+							});
+					}
+				}, 10000); // Check every 10 seconds during normal operation
+			}
+		}
+
+		// Listen for VideoJS warnings to trigger fallback faster
+		player.on('warning', function(event) {
+			console.log('VideoJS warning:', event.detail);
+			// If we're getting playlist warnings and not already in recovery
+			if (!isRetrying && !isRecovering && streamMode === 'live') {
+				console.log('Playlist warning detected, increasing error count');
+				errorRetryCount += 1; // Full error increment per warning
+				console.log('Warning count now:', errorRetryCount);
+				if (errorRetryCount >= 3) { // Trigger after 3 consecutive warnings
+					console.log('Threshold reached, switching to placeholder');
+					switchToPlaceholder();
+				}
+			}
+		});
+
+		// Enhanced error handling with placeholder fallback
+		player.on('error', function() {
+			var error = player.error();
+			console.log('Player error:', error);
+
+			// Don't retry if we're already retrying or in placeholder mode
+			if (isRetrying || streamMode === 'placeholder') return;
+
+			// Handle different error types
+			if (error && (error.code === 2 || error.code === 4)) {
+				// Network errors (2) or media errors (4) - these are recoverable
+
+				if (errorRetryCount < MAX_RETRIES) {
+					isRetrying = true;
+					errorRetryCount++;
+
+					console.log(`Attempting recovery (${errorRetryCount}/${MAX_RETRIES})...`);
+
+					// Update UI to show attempting recovery
+					updateStreamStatus('RECONNECTING...', '#ffc107');
+
+					// Clear the error and attempt to recover
+					setTimeout(() => {
+						player.error(null);  // Clear error state
+
+						// For segment/playlist errors, just continue playing
+						// The player will automatically try to fetch new segments
+						if (player.paused()) {
+							player.play().catch(e => console.log('Play attempt failed:', e));
+						}
+
+						isRetrying = false;
+
+						// If still having issues after a bit, try a soft reload
+						setTimeout(() => {
+							if (player.error()) {
+								console.log('Soft reloading source...');
+								const currentTime = player.currentTime();
+								player.src(player.currentSrc());
+								player.play().catch(e => console.log('Play after reload failed:', e));
+							}
+						}, 3000);
+
+					}, 1000 * Math.min(errorRetryCount, 3)); // Exponential backoff, max 3 seconds
+
+				} else {
+					// Max retries exceeded - switch to placeholder
+					console.error('Max retries exceeded, switching to placeholder video');
+					switchToPlaceholder();
+				}
+			} else if (error && error.code === 3) {
+				// Decode error - might need different handling
+				console.error('Decode error, switching to placeholder:', error);
+				switchToPlaceholder();
+			}
+		});
+
+		// Reset error count on successful playback
+		player.on('loadeddata', function() {
+			errorRetryCount = 0;  // Reset retry count on success
+			isRetrying = false;
+			if (streamMode === 'live') {
+				updateStreamStatus('LIVE', 'var(--dodgers-red)');
+			}
+		});
+
+		// Add playing event to ensure we show correct status
+		player.on('playing', function() {
+			errorRetryCount = 0;  // Reset retry count
+			isRetrying = false;
+			if (streamMode === 'live') {
+				updateStreamStatus('LIVE', 'var(--dodgers-red)');
+			}
+		});
+
+		// Handle stalling (buffering)
+		player.on('waiting', function() {
+			console.log('Player is buffering...');
+			// Only show buffering state if we're not in error recovery
+			if (!isRetrying && errorRetryCount === 0 && streamMode === 'live') {
+				updateStreamStatus('BUFFERING...', '#ffc107');
+			}
+		});
+
+		// Monitor for extended stalls and reload stream
+		let stallTimeout;
+		let waitingStartTime = null;
+		let offlineConfirmCount = 0;
+
+		player.on('waiting', function() {
+			waitingStartTime = Date.now();
+			offlineConfirmCount = 0;
+			console.log('⏸️ Player entered buffering state at:', new Date(waitingStartTime).toLocaleTimeString());
+
+			// Do multiple API status checks to confirm stream is actually offline
+			// First check is immediate, then 2 more over 3 seconds to confirm
+			function checkStreamStatus(attempt = 1, maxAttempts = 5) {
+				console.log(`📡 Stream status check ${attempt}/${maxAttempts}...`);
+
+				fetch('?api=stream_status')
+					.then(response => response.json())
+					.then(data => {
+						console.log(`📡 Check ${attempt}:`, data);
+
+						if (!data.online) {
+							offlineConfirmCount++;
+							console.log(`⚠️ Confirmed offline - Attempts: ${offlineConfirmCount}/${maxAttempts}`);
+
+							if (offlineConfirmCount >= 2 || attempt >= maxAttempts) {
+								// Got 2+ offline confirmations or max attempts - definitely offline
+								console.log('❌ Stream confirmed offline after multiple checks - switching to placeholder');
+								switchToPlaceholder();
+								return;
+							}
+						} else {
+							// Stream still shows online - reset offline count
+							offlineConfirmCount = 0;
+							console.log('✅ Stream still shows online - normal buffering');
+						}
+
+						// If not confirmed offline yet and attempts remain, check again in 1.5s
+						if (offlineConfirmCount < 2 && attempt < maxAttempts) {
+							setTimeout(() => checkStreamStatus(attempt + 1, maxAttempts), 1500);
+						} else if (offlineConfirmCount < 2 && attempt >= maxAttempts) {
+							// All attempts done and stream still shows online - set long buffer timeout
+							console.log('🌟 Stream appears online after multiple checks - normal buffering');
+							if (stallTimeout) clearTimeout(stallTimeout);
+							stallTimeout = setTimeout(() => {
+								const stallDuration = Date.now() - waitingStartTime;
+								console.log(`🔄 LONG STALL DETECTED: ${stallDuration/1000} seconds - checking if still buffered...`);
+
+								// Double-check if we're still waiting after this timeout
+								if (player.paused() || player.currentTime() === 0 && waitingStartTime) {
+									// Still stalled - attempt recovery
+									console.log('✅ Still stalled after 3 minutes - attempting recovery...');
+									player.error(null); // Clear any error state
+									player.pause(); // Stop current playback
+									player.reset(); // Reset player state completely
+									player.src({
+										src: '?proxy=stream',
+										type: 'application/x-mpegURL'
+									}); // Use fresh URL instead of currentSrc()
+									player.load();
+
+									// Restore volume after reset, but before play
+									const savedVolume = localStorage.getItem('playerVolume');
+									const targetVolume = savedVolume !== null ? parseFloat(savedVolume) : 0.3;
+									player.volume(targetVolume);
+									console.log('🔊 Volume restored during recovery to:', targetVolume);
+
+									player.play().then(() => {
+										console.log('✅ Stream recovery successful after long stall');
+									}).catch(e => {
+										console.log('❌ Recovery failed, might switch to placeholder');
+									});
+								} else {
+									console.log('✨ Stall resolved - no action needed');
+								}
+							}, 180000); // 3 minutes for confirmed online streams
+						}
+
+					})
+					.catch(apiError => {
+						console.log('❗ API check failed:', apiError);
+						// If API fails, be conservative - assume online and set long timeout
+						if (stallTimeout) clearTimeout(stallTimeout);
+						stallTimeout = setTimeout(() => {
+							console.log('🔄 Conservative timeout reached (API failed) - attempting recovery...');
+							player.error(null);
+							player.src({
+								src: '?proxy=stream',
+								type: 'application/x-mpegURL'
+							});
+							player.load();
+							player.play().catch(e => console.log('Recover play failed:', e));
+						}, 60000); // 1 minute when API fails
+					});
+			}
+
+			// Start the multi-check process
+			checkStreamStatus();
+		});
+
+		// Cancel stall timeout when playback resumes
+		player.on('playing', function() {
+			if (waitingStartTime) {
+				const totalStallTime = Date.now() - waitingStartTime;
+				if (totalStallTime > 5000) { // Only log significant stalls
+					console.log(`✨ Playback resumed after ${totalStallTime/1000}s stall - clearing timeouts`);
+				}
+				waitingStartTime = null;
+			}
+			if (stallTimeout) {
+				clearTimeout(stallTimeout);
+				stallTimeout = null;
+			}
+		});
+
+		// Disable right-click context menu on video player
+		document.getElementById('video-player').addEventListener('contextmenu', function(e) {
+			e.preventDefault();
+			return false;
+		});
+
+		// Also disable context menu on the video element itself
+		player.ready(function() {
+			const videoElement = player.el().querySelector('video');
+			if (videoElement) {
+				videoElement.addEventListener('contextmenu', function(e) {
+					e.preventDefault();
+					return false;
+				});
+			}
+		});
+
+		// Optional: Add a manual recovery button for users
+		function manualRecovery() {
+			console.log('🔄 Manual recovery triggered by user');
+			errorRetryCount = 0;
+			isRetrying = false;
+
+			showToast('🔄 Manual stream refresh triggered');
+
+			// Force hard reset FIRST (clears all state)
+			player.reset();
+
+			// Clear any errors after reset
+			player.error(null);
+
+			// Now set fresh proxy URL
+			player.src({
+				src: '?proxy=stream',
+				type: 'application/x-mpegURL'
+			});
+
+			// Load and play
+			player.load();
+
+			setTimeout(() => {
+				player.play().catch(e => console.log('Manual recovery play failed:', e));
+			}, 500); // Short delay to ensure load completes
+		}
+        
+        // Chat functionality
+        function initializeChat() {
+            // Get user ID on load
+            fetch('', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded',
+                },
+                body: 'action=get_user_id'
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    userId = data.user_id;
+                    isAdmin = data.is_admin || false;
+                    
+                    const userIdElement = document.getElementById('userId');
+                    userIdElement.textContent = '#' + userId;
+                    
+                    if (isAdmin) {
+                        userIdElement.classList.add('admin');
+                        userIdElement.textContent = '👑 #' + userId;
+                        document.getElementById('adminControls').style.display = 'flex';
+                        showToast('Admin mode activated');
+                    }
+                }
+            });
+            
+            if (nickname) {
+                document.getElementById('nickname').value = nickname;
+            }
+            
+            document.getElementById('nickname').addEventListener('change', function() {
+                nickname = this.value.trim();
+                localStorage.setItem('chatNickname', nickname);
+            });
+            
+            document.getElementById('messageInput').addEventListener('keypress', function(e) {
+                if (e.key === 'Enter' && !e.shiftKey) {
+                    e.preventDefault();
+                    sendMessage();
+                }
+            });
+            
+            // Typing indicator
+            document.getElementById('messageInput').addEventListener('input', function() {
+                if (this.value.length > 0 && !isTyping) {
+                    isTyping = true;
+                    // In a real implementation, you'd send this to the server
+                }
+                
+                clearTimeout(typingTimer);
+                typingTimer = setTimeout(() => {
+                    isTyping = false;
+                }, 1000);
+            });
+        }
+        
+        function sendMessage() {
+            const messageInput = document.getElementById('messageInput');
+            const nicknameInput = document.getElementById('nickname');
+            const message = messageInput.value.trim();
+            nickname = nicknameInput.value.trim();
+            
+            if (!nickname) {
+                nicknameInput.style.borderColor = 'var(--dodgers-red)';
+                nicknameInput.focus();
+                showToast('Please enter a nickname');
+                setTimeout(() => {
+                    nicknameInput.style.borderColor = '#e0e0e0';
+                }, 2000);
+                return;
+            }
+            
+            if (!message) {
+                return;
+            }
+            
+            // Send message via AJAX
+            fetch('', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded',
+                },
+                body: `action=send&nickname=${encodeURIComponent(nickname)}&message=${encodeURIComponent(message)}`
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    messageInput.value = '';
+                    // Add message immediately to avoid delay
+                    appendMessage(data.message);
+                } else if (data.error) {
+                    showToast(data.error);
+                }
+            })
+            .catch(error => {
+                console.error('Error sending message:', error);
+                updateConnectionStatus(false);
+            });
+        }
+        
+        function deleteMessage(messageId) {
+            if (!isAdmin) return;
+            
+            fetch('', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded',
+                },
+                body: `action=delete_message&message_id=${encodeURIComponent(messageId)}`
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    // Remove message from DOM
+                    const msgElement = document.querySelector(`[data-message-id="${messageId}"]`);
+                    if (msgElement) {
+                        msgElement.style.animation = 'slideOut 0.3s';
+                        setTimeout(() => msgElement.remove(), 300);
+                    }
+                    
+                    // Remove message from allMessages array to prevent it from reappearing
+                    allMessages = allMessages.filter(msg => msg.id !== messageId);
+                    
+                    showToast('Message deleted');
+                }
+            });
+        }
+        
+        function banUser(userId) {
+            if (!isAdmin) return;
+            
+            if (confirm('Ban this user from chat?')) {
+                fetch('', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/x-www-form-urlencoded',
+                    },
+                    body: `action=ban_user&user_id=${encodeURIComponent(userId)}`
+                })
+                .then(response => response.json())
+                .then(data => {
+                    if (data.success) {
+                        showToast('User banned');
+                    }
+                });
+            }
+        }
+        
+        function clearChat() {
+            if (!isAdmin) return;
+            
+            if (confirm('Clear all chat messages?')) {
+                fetch('', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/x-www-form-urlencoded',
+                    },
+                    body: 'action=clear_chat'
+                })
+                .then(response => response.json())
+                .then(data => {
+                    if (data.success) {
+                        // Clear local messages and reset state
+                        allMessages = [];
+                        lastMessageId = '';
+                        document.getElementById('chatMessages').innerHTML = '<div class="system-message">Chat cleared by admin</div>';
+                        showToast('Chat cleared');
+                        
+                        // Force all users to refresh their chat by fetching all messages again
+                        setTimeout(() => {
+                            fetchMessages();
+                        }, 500);
+                    }
+                });
+            }
+        }
+        
+        function fetchMessages() {
+            fetch('', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded',
+                },
+                body: `action=fetch&last_id=${encodeURIComponent(lastMessageId)}`
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    // Update viewer count
+                    if (data.viewer_count !== undefined) {
+                        updateViewerCount(data.viewer_count);
+                    }
+                    
+                    const serverMessageCount = data.message_count || 0;
+                    
+                    if (data.all_messages !== null) {
+                        // Initial load or forced refresh
+                        allMessages = data.all_messages;
+                        lastKnownMessageCount = serverMessageCount;
+                        displayAllMessages();
+                        
+                        if (serverMessageCount === 0 && lastKnownMessageCount > 0) {
+                            // Chat was cleared
+                            document.getElementById('chatMessages').innerHTML = '<div class="system-message">Chat was cleared by admin</div>';
+                        }
+                    } else {
+                        // Check if message count decreased (admin deleted messages or cleared chat)
+                        if (serverMessageCount < lastKnownMessageCount) {
+                            // Something was deleted, refresh all messages
+                            lastMessageId = ''; // Reset to fetch all messages
+                            fetchMessages();
+                            return;
+                        }
+                        
+                        // Normal case: append new messages
+                        if (data.messages && data.messages.length > 0) {
+                            data.messages.forEach(msg => {
+                                appendMessage(msg);
+                                // Show notification if chat is collapsed and message is not from current user
+                                if (chatCollapsed && msg.user_id !== userId) {
+                                    unreadCount++;
+                                    updateNotificationBadge();
+                                    playNotificationSound();
+                                }
+                            });
+                        }
+                        
+                        lastKnownMessageCount = serverMessageCount;
+                    }
+                    updateConnectionStatus(true);
+                }
+            })
+            .catch(error => {
+                console.error('Error fetching messages:', error);
+                updateConnectionStatus(false);
+            });
+        }
+        
+        function sendHeartbeat() {
+            const nicknameValue = document.getElementById('nickname').value || 'Anonymous';
+            
+            fetch('', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded',
+                },
+                body: `action=heartbeat&nickname=${encodeURIComponent(nicknameValue)}`
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success && data.viewer_count !== undefined) {
+                    updateViewerCount(data.viewer_count);
+                }
+            })
+            .catch(error => {
+                console.error('Error sending heartbeat:', error);
+            });
+        }
+        
+        function updateViewerCount(count) {
+            const viewerElement = document.getElementById('viewerCount');
+            viewerElement.textContent = count + (count === 1 ? ' viewer' : ' viewers');
+        }
+        
+        function displayAllMessages() {
+            const chatMessages = document.getElementById('chatMessages');
+            
+            if (allMessages.length === 0) {
+                chatMessages.innerHTML = '<div class="empty-chat">No messages yet. Be the first to say hello! 👋</div>';
+                lastKnownMessageCount = 0;
+                return;
+            }
+            
+            chatMessages.innerHTML = '';
+            allMessages.forEach(msg => {
+                appendMessageElement(msg, false);
+            });
+            
+            if (allMessages.length > 0) {
+                lastMessageId = allMessages[allMessages.length - 1].id;
+                chatMessages.scrollTop = chatMessages.scrollHeight;
+            }
+            lastKnownMessageCount = allMessages.length;
+        }
+        
+        function appendMessage(msg) {
+            allMessages.push(msg);
+            appendMessageElement(msg, true);
+            lastMessageId = msg.id;
+        }
+        
+        function appendMessageElement(msg, animate) {
+            const chatMessages = document.getElementById('chatMessages');
+            
+            // Remove empty chat message if it exists
+            const emptyChat = chatMessages.querySelector('.empty-chat');
+            if (emptyChat) {
+                emptyChat.remove();
+            }
+            
+            const messageDiv = document.createElement('div');
+            messageDiv.className = 'message';
+            messageDiv.setAttribute('data-message-id', msg.id);
+            
+            if (msg.user_id === userId) {
+                messageDiv.className += ' own-message';
+            }
+            if (msg.is_admin) {
+                messageDiv.className += ' admin-message';
+            }
+            if (!animate) {
+                messageDiv.style.animation = 'none';
+            }
+            
+            const adminActions = isAdmin && msg.user_id !== userId ? `
+                <div class="message-actions">
+                    <button class="delete-btn" onclick="deleteMessage('${msg.id}')">Delete</button>
+                    <button class="ban-btn" onclick="banUser('${msg.user_id}')">Ban</button>
+                </div>
+            ` : '';
+            
+            const adminBadge = msg.is_admin ? '👑 ' : '';
+            
+            messageDiv.innerHTML = `
+                <div class="message-header">
+                    <span class="message-nickname${msg.is_admin ? ' admin' : ''}">${adminBadge}${msg.nickname}</span>
+                    <span class="message-id">#${msg.user_id}</span>
+                    <span class="message-time">${msg.time}</span>
+                </div>
+                <div class="message-text">${msg.message}</div>
+                ${adminActions}
+            `;
+            
+            chatMessages.appendChild(messageDiv);
+            
+            // Auto-scroll to bottom
+            if (animate) {
+                chatMessages.scrollTop = chatMessages.scrollHeight;
+            }
+        }
+        
+        function updateConnectionStatus(online) {
+            const statusDot = document.getElementById('statusDot');
+            const statusText = document.getElementById('statusText');
+            
+            if (online) {
+                statusDot.classList.remove('offline');
+                statusText.textContent = 'Connected';
+            } else {
+                statusDot.classList.add('offline');
+                statusText.textContent = 'Reconnecting...';
+            }
+        }
+        
+        function toggleChat() {
+            const chatSection = document.getElementById('chatSection');
+            const videoSection = document.getElementById('videoSection');
+            const toggleBtn = document.getElementById('chatToggleText');
+            
+            chatCollapsed = !chatCollapsed;
+            
+            if (chatCollapsed) {
+                chatSection.classList.add('collapsed');
+                videoSection.classList.add('expanded');
+                toggleBtn.textContent = 'Show Chat';
+            } else {
+                chatSection.classList.remove('collapsed');
+                videoSection.classList.remove('expanded');
+                toggleBtn.textContent = 'Hide Chat';
+                // Clear unread count
+                unreadCount = 0;
+                updateNotificationBadge();
+            }
+        }
+        
+        function updateNotificationBadge() {
+            const badge = document.getElementById('notificationBadge');
+            
+            if (unreadCount > 0) {
+                badge.textContent = unreadCount > 99 ? '99+' : unreadCount;
+                badge.classList.add('show');
+            } else {
+                badge.classList.remove('show');
+            }
+        }
+        
+        function playNotificationSound() {
+            if (soundEnabled && document.hidden) {
+                // Create a simple beep sound using Web Audio API
+                try {
+                    const audioContext = new (window.AudioContext || window.webkitAudioContext)();
+                    const oscillator = audioContext.createOscillator();
+                    const gainNode = audioContext.createGain();
+                    
+                    oscillator.connect(gainNode);
+                    gainNode.connect(audioContext.destination);
+                    
+                    oscillator.frequency.value = 800;
+                    oscillator.type = 'sine';
+                    gainNode.gain.value = 0.1;
+                    
+                    oscillator.start(audioContext.currentTime);
+                    oscillator.stop(audioContext.currentTime + 0.1);
+                } catch(e) {
+                    console.log('Audio notification failed:', e);
+                }
+            }
+        }
+        
+        function showToast(message) {
+            const toast = document.getElementById('toast');
+            toast.textContent = message;
+            toast.classList.add('show');
+
+            setTimeout(() => {
+                toast.classList.remove('show');
+            }, 3000);
+        }
+
+        // Fast recovery checks when in placeholder mode (every 2 seconds for 5 checks)
+        let recoveryCheckCount = 0;
+        let recoveryTimeout;
+
+        function startRecoveryChecks() {
+            console.log('🔍 Starting fast recovery checks (every 2s for 5 checks = 10s total)');
+            recoveryCheckCount = 0;
+
+            // Clear any existing recovery timeout
+            if (recoveryTimeout) {
+                clearTimeout(recoveryTimeout);
+            }
+
+            function checkRecovery() {
+                if (streamMode !== 'placeholder' || recoveryCheckCount >= 5) {
+                    if (recoveryCheckCount >= 5) {
+                        console.log('⏹️ Fast recovery checks complete - stream still offline, staying in placeholder mode');
+                    }
+                    return;
+                }
+
+                recoveryCheckCount++;
+                console.log(`🔍 Recovery check ${recoveryCheckCount}/5...`);
+
+                fetch('?api=stream_status')
+                    .then(response => response.json())
+                    .then(data => {
+                        console.log(`📡 Recovery check ${recoveryCheckCount}:`, data);
+                        if (data.online && streamMode === 'placeholder') {
+                            console.log('✅ Stream back online during recovery check - switching back');
+                            isRecovering = true;
+                            switchToLive();
+                        } else {
+                            // Schedule next check in 2 seconds (unless we've reached the limit)
+                            if (recoveryCheckCount < 5 && streamMode === 'placeholder') {
+                                recoveryTimeout = setTimeout(checkRecovery, 2000);
+                            }
+                        }
+                    })
+                    .catch(error => {
+                        console.log(`❗ Recovery check ${recoveryCheckCount} failed:`, error);
+                        // Still schedule next check even on failure
+                        if (recoveryCheckCount < 5 && streamMode === 'placeholder') {
+                            recoveryTimeout = setTimeout(checkRecovery, 2000);
+                        }
+                    });
+            }
+
+            // Start first check immediately
+            checkRecovery();
+        }
+
+        // Stream management functions
+        function switchToPlaceholder() {
+            if (streamMode === 'placeholder') {
+                console.log('⚠️ Already in placeholder mode, ignoring switch request');
+                return;
+            }
+
+            console.log('🔄 START: Switching to placeholder video');
+            console.log('📊 State before switch - streamMode:', streamMode, 'errorRetryCount:', errorRetryCount, 'isRecovering:', isRecovering);
+            streamMode = 'placeholder';
+            console.log('✅ State after switch - streamMode:', streamMode);
+
+            // Clear any existing recovery interval/timeout
+            if (recoveryInterval) {
+                clearInterval(recoveryInterval);
+            }
+            if (recoveryTimeout) {
+                clearTimeout(recoveryTimeout);
+            }
+
+            // Update UI first to give immediate feedback
+            updateStreamStatus('SWITCHING...', '#ffc107');
+
+            try {
+                // Stop playback and reset to clear all HLS state
+                player.pause();
+                player.reset();
+
+                // ENFORCE VOLUME AFTER RESET
+                restoreVolume();
+
+                // Wait longer for cleanup
+                setTimeout(() => {
+                    // Switch to placeholder MP4
+                    player.src({
+                        src: 'placeholder.mp4',
+                        type: 'video/mp4'
+                    });
+
+                    player.load();
+                    // ENFORCE VOLUME AFTER LOAD
+                    setTimeout(() => restoreVolume(), 200);
+
+                    // Start playing after load
+                    player.play().then(() => {
+                        console.log('Placeholder video started successfully');
+                        // Restore volume after switching
+                        const savedVolume = localStorage.getItem('playerVolume');
+                        const targetVolume = savedVolume !== null ? parseFloat(savedVolume) : 0.3;
+                        player.volume(targetVolume);
+                        console.log('🔊 Volume restored to:', targetVolume, '(saved:', savedVolume !== null, ')');
+                        // Update UI to show placeholder mode
+                        updateStreamStatus('PLACEHOLDER', '#17a2b8');
+                        showToast('Stream offline - showing placeholder video');
+
+                        // Start fast recovery checks (every 2 seconds for 5 checks = 10 seconds total)
+                        startRecoveryChecks();
+                    }).catch(e => {
+                        console.log('Placeholder play failed:', e);
+                        // Still update UI even if play fails
+                        updateStreamStatus('PLACEHOLDER', '#17a2b8');
+                        showToast('Stream offline - showing placeholder video');
+
+                        // Start fast recovery checks even if play failed
+                        startRecoveryChecks();
+                    });
+
+                }, 1000); // Give HLS more time to clean up
+
+            } catch (e) {
+                console.log('Error switching to placeholder:', e);
+                // Fallback approach
+                try {
+                    player.src({
+                        src: 'placeholder.mp4',
+                        type: 'video/mp4'
+                    });
+                    player.load();
+                    startRecoveryChecks();
+                } catch (e2) {
+                    console.log('Fallback also failed:', e2);
+                    startRecoveryChecks();
+                }
+            }
+        }
+
+        function switchToLive() {
+            if (streamMode === 'live') {
+                console.log('⚠️ Already in live mode, ignoring switch request');
+                return;
+            }
+
+            console.log('🔄 START: Switching back to live stream');
+            console.log('📊 State before switch - streamMode:', streamMode, 'isRecovering:', isRecovering);
+            streamMode = 'live';
+            isRecovering = false;
+            console.log('✅ State after switch - streamMode:', streamMode, 'isRecovering:', isRecovering);
+
+            // Clear recovery interval
+            if (recoveryInterval) {
+                clearInterval(recoveryInterval);
+                recoveryInterval = null;
+            }
+
+            // Update UI first
+            updateStreamStatus('SWITCHING...', '#ffc107');
+
+            try {
+                // Stop current playback and reset player state
+                player.pause();
+                player.reset();
+
+                // ENFORCE VOLUME AFTER RESET
+                restoreVolume();
+
+                // Wait for cleanup
+                setTimeout(() => {
+                    // Switch back to HLS stream
+                    player.src({
+                        src: '?proxy=stream',
+                        type: 'application/x-mpegURL'
+                    });
+
+                    // Reset error state
+                    errorRetryCount = 0;
+                    isRetrying = false;
+
+                    player.load();
+                    // ENFORCE VOLUME AFTER LOAD
+                    setTimeout(() => restoreVolume(), 200);
+
+                    player.play().then(() => {
+                        console.log('Live stream started successfully');
+                        // Restore volume after switching
+                        const savedVolume = localStorage.getItem('playerVolume');
+                        const targetVolume = savedVolume !== null ? parseFloat(savedVolume) : 0.3;
+                        player.volume(targetVolume);
+                        console.log('🔊 Volume restored to:', targetVolume, '(saved:', savedVolume !== null, ')');
+                        // Update UI to show reconnecting then live
+                        updateStreamStatus('RECONNECTING...', '#ffc107');
+                        showToast('Stream back online - switching to live');
+
+                        // After a moment, show live status
+                        setTimeout(() => {
+                            if (streamMode === 'live') {
+                                updateStreamStatus('LIVE', 'var(--dodgers-red)');
+                            }
+                        }, 2000);
+                    }).catch(e => {
+                        console.log('Live stream play failed:', e);
+                        // Restore volume after switching even if play fails
+                        const savedVolume = localStorage.getItem('playerVolume');
+                        const targetVolume = savedVolume !== null ? parseFloat(savedVolume) : 0.3;
+                        player.volume(targetVolume);
+                        console.log('🔊 Volume restored to:', targetVolume, '(saved:', savedVolume !== null, ')');
+                        // Still show as live even if initial play fails
+                        updateStreamStatus('LIVE', 'var(--dodgers-red)');
+                        showToast('Stream back online - switching to live');
+                    });
+
+                }, 1000); // Give more time for cleanup
+
+            } catch (e) {
+                console.log('Error switching to live:', e);
+                try {
+                    player.src({
+                        src: '?proxy=stream',
+                        type: 'application/x-mpegURL'
+                    });
+                    player.load();
+                } catch (e2) {
+                    console.log('Fallback also failed:', e2);
+                }
+            }
+        }
+
+        function checkStreamRecovery() {
+            if (isRecovering) {
+                console.log('⏳ Already recovering, skipping recovery check');
+                return;
+            }
+
+            console.log('🔍 Checking stream recovery status...');
+            console.log('📊 Current state - streamMode:', streamMode, 'isRecovering:', isRecovering);
+
+            fetch('?api=stream_status')
+                .then(response => response.json())
+                .then(data => {
+                    console.log('📡 Stream status response:', data);
+                    if (data.online && streamMode === 'placeholder') {
+                        console.log('✅ Live stream detected, switching back');
+                        isRecovering = true;
+                        console.log('🔄 Set isRecovering=true, will switch to live in 1 second');
+
+                        // Give it a moment then switch back
+                        setTimeout(() => {
+                            console.log('🚀 Executing switch to live stream');
+                            switchToLive();
+                        }, 1000);
+                    } else if (data.online) {
+                        console.log('ℹ️ Stream is online but not in placeholder mode');
+                    } else {
+                        console.log('❌ Stream is still offline, will check again in 5 seconds');
+                    }
+                })
+                .catch(error => {
+                    console.log('❗ Error checking stream status:', error);
+                });
+        }
+
+        function toggleFullscreen() {
+            if (player.isFullscreen()) {
+                player.exitFullscreen();
+                document.getElementById('fullscreenIcon').textContent = '⛶';
+            } else {
+                player.requestFullscreen();
+                document.getElementById('fullscreenIcon').textContent = '⛶';
+            }
+        }
+        
+        function togglePictureInPicture() {
+            if (document.pictureInPictureElement) {
+                document.exitPictureInPicture();
+            } else {
+                const video = document.getElementById('video-player');
+                if (video.requestPictureInPicture) {
+                    video.requestPictureInPicture();
+                }
+            }
+        }
+
+        // Initialize
+        initializeChat();
+
+        // Poll for new messages every 2 seconds
+        setInterval(fetchMessages, 2000);
+
+        // Send heartbeat every 5 seconds
+        setInterval(sendHeartbeat, 5000);
+
+        // Initial fetch
+        fetchMessages();
+        sendHeartbeat();
+
+        // Handle window resize
+        window.addEventListener('resize', function() {
+            if (window.innerWidth <= 768 && !chatCollapsed) {
+                // Auto-collapse chat on mobile for better video viewing
+                toggleChat();
+            }
+        });
+
+        // Keyboard shortcuts
+        document.addEventListener('keydown', function(e) {
+            // Toggle chat with 'C' key
+            if (e.key === 'c' && !e.target.matches('input')) {
+                toggleChat();
+            }
+            // Toggle fullscreen with 'F' key
+            if (e.key === 'f' && !e.target.matches('input')) {
+                toggleFullscreen();
+            }
+            // Focus chat with '/' key
+            if (e.key === '/' && !e.target.matches('input')) {
+                e.preventDefault();
+                document.getElementById('messageInput').focus();
+            }
+        });
+
+        // Page visibility API for notifications
+        document.addEventListener('visibilitychange', function() {
+            if (!document.hidden) {
+                // Clear unread when page becomes visible
+                if (!chatCollapsed) {
+                    unreadCount = 0;
+                    updateNotificationBadge();
+                }
+            }
+        });
+    </script>
 </body>
 </html>
diff --git a/ui-controls.js b/ui-controls.js
deleted file mode 100644
index 9161393..0000000
--- a/ui-controls.js
+++ /dev/null
@@ -1,282 +0,0 @@
-// UI Controls Module
-// Handles UI toggle functions, keyboard shortcuts, notifications, and DOM utilities
-
-(function() {
-    'use strict';
-
-    AppModules.require('api');
-    AppModules.register('ui-controls');
-
-    // Toast notification system
-    function showToast(message, duration = AppConfig.ui.toastDuration) {
-        const toast = document.getElementById('toast');
-        if (!toast) return;
-
-        toast.textContent = message;
-        toast.classList.add('show');
-
-        if (duration > 0) {
-            setTimeout(() => {
-                toast.classList.remove('show');
-            }, duration);
-        }
-    }
-
-    function hideToast() {
-        const toast = document.getElementById('toast');
-        if (toast) {
-            toast.classList.remove('show');
-        }
-    }
-
-    // Notification badge management
-    function updateNotificationBadge() {
-        const badge = document.getElementById('notificationBadge');
-
-        if (badge) {
-            if (AppState.unreadCount > 0) {
-                badge.textContent = AppState.unreadCount > 99 ? '99+' : AppState.unreadCount;
-                badge.classList.add('show');
-            } else {
-                badge.classList.remove('show');
-            }
-        }
-    }
-
-    // Chat toggle functionality
-    function toggleChat() {
-        const chatSection = document.getElementById('chatSection');
-        const videoSection = document.getElementById('videoSection');
-        const toggleBtn = document.getElementById('chatToggleText');
-
-        if (!chatSection || !videoSection || !toggleBtn) return;
-
-        AppState.chatCollapsed = !AppState.chatCollapsed;
-
-        if (AppState.chatCollapsed) {
-            chatSection.classList.add('collapsed');
-            videoSection.classList.add('expanded');
-            toggleBtn.textContent = 'Show Chat';
-        } else {
-            chatSection.classList.remove('collapsed');
-            videoSection.classList.remove('expanded');
-            toggleBtn.textContent = 'Hide Chat';
-            // Clear unread count when reopening
-            AppState.unreadCount = 0;
-            updateNotificationBadge();
-        }
-    }
-
-    // Viewer count update
-    function updateViewerCount(count) {
-        const viewerElement = document.getElementById('viewerCount');
-        if (viewerElement) {
-            viewerElement.textContent = count + (count === 1 ? ' viewer' : ' viewers');
-        }
-    }
-
-    // Connection status dot
-    function updateConnectionStatus(online) {
-        const statusDot = document.getElementById('statusDot');
-        const statusText = document.getElementById('statusText');
-
-        if (statusDot && statusText) {
-            if (online) {
-                statusDot.classList.remove('offline');
-                statusText.textContent = 'Connected';
-            } else {
-                statusDot.classList.add('offline');
-                statusText.textContent = 'Reconnecting...';
-            }
-        }
-    }
-
-    // Keyboard shortcuts handler
-    function handleKeyboardShortcuts(event) {
-        // Skip if typing in input field
-        if (event.target.matches('input, textarea')) {
-            return;
-        }
-
-        switch (event.key) {
-            case 'c':
-            case 'C':
-                // Toggle chat
-                event.preventDefault();
-                toggleChat();
-                break;
-            case 'f':
-            case 'F':
-                // Toggle fullscreen
-                event.preventDefault();
-                toggleFullscreen();
-                break;
-            case '/':
-                // Focus chat input
-                event.preventDefault();
-                const messageInput = document.getElementById('messageInput');
-                if (messageInput) {
-                    messageInput.focus();
-                }
-                break;
-            case 'p':
-            case 'P':
-                // Toggle picture-in-picture
-                event.preventDefault();
-                togglePictureInPicture();
-                break;
-        }
-    }
-
-    // Fullscreen functionality
-    function toggleFullscreen() {
-        if (!AppState.player) return;
-
-        if (AppState.player.isFullscreen()) {
-            AppState.player.exitFullscreen();
-        } else {
-            AppState.player.requestFullscreen();
-        }
-    }
-
-    // Picture-in-picture functionality
-    function togglePictureInPicture() {
-        const video = document.getElementById('video-player');
-        if (!video || !video.requestPictureInPicture) return;
-
-        if (document.pictureInPictureElement) {
-            document.exitPictureInPicture();
-        } else {
-            video.requestPictureInPicture();
-        }
-    }
-
-    // Sound notification for new messages
-    function playNotificationSound() {
-        if (!AppState.soundEnabled || !document.hidden) return;
-
-        try {
-            const audioContext = new (window.AudioContext || window.webkitAudioContext)();
-            const oscillator = audioContext.createOscillator();
-            const gainNode = audioContext.createGain();
-
-            oscillator.connect(gainNode);
-            gainNode.connect(audioContext.destination);
-
-            oscillator.frequency.value = 800;
-            oscillator.type = 'sine';
-            gainNode.gain.value = 0.1;
-
-            oscillator.start(audioContext.currentTime);
-            oscillator.stop(audioContext.currentTime + 0.1);
-        } catch(e) {
-            AppLogger.log('Audio notification failed:', e);
-        }
-    }
-
-    // Mobile responsive behavior
-    function handleWindowResize() {
-        const isMobile = window.innerWidth <= AppConfig.ui.mobileBreakpoint;
-
-        if (isMobile && !AppState.chatCollapsed) {
-            // Auto-collapse chat on mobile for better viewing
-            toggleChat();
-        }
-    }
-
-    // Page visibility API handler
-    function handleVisibilityChange() {
-        if (!document.hidden && !AppState.chatCollapsed) {
-            // Clear unread count when page becomes visible
-            AppState.unreadCount = 0;
-            updateNotificationBadge();
-        }
-    }
-
-    // DOM utility functions
-    const DOMUtils = {
-        // Add event listener with proper cleanup tracking
-        addEvent: function(element, event, handler) {
-            if (!element) return;
-
-            element.addEventListener(event, handler);
-
-            // Store handler for potential cleanup
-            if (!element._handlers) {
-                element._handlers = new Map();
-            }
-            if (!element._handlers.has(event)) {
-                element._handlers.set(event, []);
-            }
-            element._handlers.get(event).push(handler);
-        },
-
-        // Remove event listeners (for cleanup)
-        removeEvent: function(element, event, handler) {
-            if (!element || !element._handlers || !element._handlers.has(event)) return;
-
-            const handlers = element._handlers.get(event);
-            const index = handlers.indexOf(handler);
-            if (index > -1) {
-                handlers.splice(index, 1);
-                element.removeEventListener(event, handler);
-            }
-        },
-
-        // Get element with optional error logging
-        getElement: function(id, required = false) {
-            const element = document.getElementById(id);
-            if (required && !element) {
-                AppLogger.error(`Required element with id '${id}' not found`);
-            }
-            return element;
-        },
-
-        // Add/remove classes safely
-        addClass: function(element, className) {
-            if (element) element.classList.add(className);
-        },
-
-        removeClass: function(element, className) {
-            if (element) element.classList.remove(className);
-        },
-
-        toggleClass: function(element, className) {
-            if (element) element.classList.toggle(className);
-        }
-    };
-
-    // Initialize event listeners
-    function initializeEventListeners() {
-        // Keyboard shortcuts
-        DOMUtils.addEvent(document, 'keydown', handleKeyboardShortcuts);
-
-        // Window resize for mobile responsiveness
-        DOMUtils.addEvent(window, 'resize', handleWindowResize);
-
-        // Page visibility for notification clearing
-        DOMUtils.addEvent(document, 'visibilitychange', handleVisibilityChange);
-
-        AppLogger.log('UI controls event listeners initialized');
-    }
-
-    // Public API
-    window.UIControls = {
-        showToast: showToast,
-        hideToast: hideToast,
-        toggleChat: toggleChat,
-        toggleFullscreen: toggleFullscreen,
-        togglePictureInPicture: togglePictureInPicture,
-        updateViewerCount: updateViewerCount,
-        updateConnectionStatus: updateConnectionStatus,
-        updateNotificationBadge: updateNotificationBadge,
-        playNotificationSound: playNotificationSound,
-        DOMUtils: DOMUtils
-    };
-
-    // Initialize when DOM is ready
-    document.addEventListener('DOMContentLoaded', initializeEventListeners);
-
-    AppLogger.log('UI Controls module loaded');
-
-})();
diff --git a/video-player.js b/video-player.js
deleted file mode 100644
index 085564a..0000000
--- a/video-player.js
+++ /dev/null
@@ -1,540 +0,0 @@
-// Video Player Module
-// Handles Video.js initialization, stream management, and player controls
-
-(function() {
-    'use strict';
-
-    AppModules.require('api', 'ui-controls');
-    AppModules.register('video-player');
-
-    // Stream status management
-    function updateStreamStatus(status, color) {
-        const badge = document.querySelector('.stream-badge');
-        if (badge) {
-            badge.textContent = status;
-            badge.style.background = color || 'var(--dodgers-red)';
-            AppLogger.log(`📊 Stream status updated: ${status} (${color || 'red'})`);
-        }
-    }
-
-    // Video.js player initialization
-    function initializePlayer() {
-        AppLogger.log('🎬 Starting Video.js initialization...');
-
-        AppState.player = videojs('video-player', {
-            html5: {
-                vhs: {
-                    overrideNative: true,
-                    withCredentials: false,
-                    handlePartialData: true,
-                    smoothQualityChange: true,
-                    allowSeeksWithinUnsafeLiveWindow: true,
-                    handleManifestRedirects: true,
-                    useBandwidthFromLocalStorage: true,
-                    maxPlaylistRetries: 10,
-                    blacklistDuration: 5,
-                    bandwidth: 4194304
-                }
-            },
-            liveui: true,
-            liveTracker: {
-                trackingThreshold: 30,
-                liveTolerance: 15
-            },
-            errorDisplay: false,
-            responsive: false,
-            controlBar: {
-                volumePanel: {
-                    inline: false
-                },
-                pictureInPictureToggle: true
-            }
-        });
-
-        // Volume enforcement and restoration
-        setupVolumeManagement();
-
-        // Stream status checking
-        setupStreamMonitoring();
-
-        // Error handling
-        setupPlayerErrorHandling();
-
-        // Event handlers
-        setupPlayerEvents();
-
-        AppLogger.log('Video.js player initialized successfully');
-    }
-
-    // Volume management system
-    function setupVolumeManagement() {
-        AppState.player.ready(function() {
-            AppLogger.log('Player is ready');
-
-            // Immediate volume fix
-            enforceSavedVolume();
-
-            // Load saved volume or set default
-            const savedVolume = localStorage.getItem('playerVolume');
-            if (savedVolume !== null) {
-                const volumeValue = parseFloat(savedVolume);
-                AppState.player.volume(volumeValue);
-                AppLogger.log('🔊 Restored saved volume:', volumeValue);
-            } else {
-                AppState.player.volume(AppConfig.video.defaultVolume);
-                AppLogger.log('🔊 Set default volume:', AppConfig.video.defaultVolume);
-            }
-
-            // Volume monitoring and enforcement
-            AppState.player.on('volumechange', function() {
-                if (!enforceSavedVolume()) {
-                    // User's intentional change - save it
-                    if (!AppState.player.muted()) {
-                        const newVolume = AppState.player.volume();
-                        localStorage.setItem('playerVolume', newVolume);
-                        AppLogger.log('💾 Saved volume setting:', newVolume);
-                    }
-                }
-            });
-
-            // PROACTIVE STREAM STATUS CHECK
-            checkInitialStreamStatus();
-        });
-    }
-
-    // Volume enforcement function
-    function enforceSavedVolume() {
-        const currentVolume = AppState.player.volume();
-        if (currentVolume === 1.0) {
-            const savedVolume = parseFloat(localStorage.getItem('playerVolume') || AppConfig.video.defaultVolume.toString());
-            if (savedVolume !== 1.0) {
-                AppLogger.log('🚫 BLOCKED: Volume reset to 100% - forcing back to:', savedVolume);
-                AppState.player.volume(savedVolume);
-                return true;
-            }
-        }
-        return false;
-    }
-
-    // Stream status and monitoring
-    function checkInitialStreamStatus() {
-        AppLogger.log('🔍 Checking initial stream status...');
-
-        API.checkStreamStatus()
-            .then(isOnline => {
-                if (!isOnline) {
-                    AppLogger.log('🔄 Stream offline on load - switching to placeholder immediately');
-                    switchToPlaceholder();
-                } else {
-                    AppLogger.log('✅ Stream online on load - starting HLS playback');
-                    attemptHLSPlayback();
-                    startStreamMonitoring();
-                }
-            });
-    }
-
-    function startStreamMonitoring() {
-        if (!AppState.recoveryInterval) {
-            AppLogger.log('👁️ Starting stream monitoring...');
-            AppState.recoveryInterval = setInterval(() => {
-                if (AppState.streamMode !== 'placeholder') {
-                    API.checkStreamStatus()
-                        .then(data => {
-                            if (!data.online) {
-                                AppLogger.log('⚠️ Stream went offline during playback - switching to placeholder');
-                                switchToPlaceholder();
-                            }
-                        })
-                        .catch(error => {
-                            AppLogger.error('❗ Stream monitoring check failed:', error);
-                        });
-                }
-            }, AppConfig.video.streamMonitoringInterval);
-        }
-    }
-
-    // HLS playback attempt
-    function attemptHLSPlayback() {
-        AppLogger.log('🎬 Attempting HLS stream playback...');
-
-        var playPromise = AppState.player.play();
-        if (playPromise !== undefined) {
-            playPromise.catch(function(error) {
-                AppLogger.log('Auto-play was prevented:', error);
-                UIControls.showToast('Click play to start stream');
-            });
-        }
-    }
-
-    // Player error handling
-    function setupPlayerErrorHandling() {
-        // Warning events from Video.js
-        AppState.player.on('warning', function(event) {
-            AppLogger.log('VideoJS warning:', event.detail);
-            if (!AppState.isRetrying && !AppState.isRecovering && AppState.streamMode === 'live') {
-                AppState.errorRetryCount++;
-                AppLogger.log('Warning count now:', AppState.errorRetryCount);
-                if (AppState.errorRetryCount >= 3) {
-                    AppLogger.log('Threshold reached, switching to placeholder');
-                    switchToPlaceholder();
-                }
-            }
-        });
-
-        // Error handling
-        AppState.player.on('error', function() {
-            var error = AppState.player.error();
-            AppLogger.log('Player error:', error);
-
-            if (AppState.isRetrying || AppState.streamMode === 'placeholder') return;
-
-            if (error && (error.code === 2 || error.code === 4)) {
-                if (AppState.errorRetryCount < AppConfig.video.maxRetries) {
-                    AppState.isRetrying = true;
-                    AppState.errorRetryCount++;
-
-                    AppLogger.log(`Attempting recovery (${AppState.errorRetryCount}/${AppConfig.video.maxRetries})...`);
-                    updateStreamStatus('RECONNECTING...', '#ffc107');
-
-                    setTimeout(() => {
-                        AppState.player.error(null);
-                        AppState.player.pause();
-                        AppState.player.reset();
-
-                        // Restore volume
-                        enforceSavedVolume();
-
-                        // Try playing again
-                        if (AppState.player.paused()) {
-                            AppState.player.play().catch(e => AppLogger.log('Play attempt failed:', e));
-                        }
-
-                        AppState.isRetrying = false;
-
-                        // Soft reload fallback
-                        setTimeout(() => {
-                            if (AppState.player.error()) {
-                                AppLogger.log('Soft reloading source...');
-                                const currentTime = AppState.player.currentTime();
-                                AppState.player.src(AppState.player.currentSrc());
-                                AppState.player.play().catch(e => AppLogger.log('Play after reload failed:', e));
-                            }
-                        }, 3000);
-
-                    }, 1000 * Math.min(AppState.errorRetryCount, 3));
-
-                } else {
-                    AppLogger.error('Max retries exceeded, switching to placeholder video');
-                    switchToPlaceholder();
-                }
-            } else if (error && error.code === 3) {
-                AppLogger.error('Decode error, switching to placeholder:', error);
-                switchToPlaceholder();
-            }
-        });
-    }
-
-    // Player event setup
-    function setupPlayerEvents() {
-        // Reset error count on successful playback
-        AppState.player.on('loadeddata', function() {
-            AppState.errorRetryCount = 0;
-            AppState.isRetrying = false;
-            if (AppState.streamMode === 'live') {
-                updateStreamStatus('LIVE', 'var(--dodgers-red)');
-            }
-        });
-
-        AppState.player.on('playing', function() {
-            AppState.errorRetryCount = 0;
-            AppState.isRetrying = false;
-            if (AppState.streamMode === 'live') {
-                updateStreamStatus('LIVE', 'var(--dodgers-red)');
-            }
-        });
-
-        AppState.player.on('waiting', function() {
-            AppLogger.log('Player is buffering...');
-            if (!AppState.isRetrying && AppState.errorRetryCount === 0 && AppState.streamMode === 'live') {
-                updateStreamStatus('BUFFERING...', '#ffc107');
-            }
-
-            // Extended buffering detection
-            const waitingStartTime = Date.now();
-            let offlineConfirmCount = 0;
-
-            function checkBufferingStatus(attempt = 1, maxAttempts = 5) {
-                API.checkStreamStatus()
-                    .then(data => {
-                        if (!data.online) {
-                            offlineConfirmCount++;
-                            AppLogger.log(`⚠️ Confirmed offline - Attempts: ${offlineConfirmCount}/${maxAttempts}`);
-
-                            if (offlineConfirmCount >= 2 || attempt >= maxAttempts) {
-                                AppLogger.log('❌ Stream confirmed offline - switching to placeholder');
-                                switchToPlaceholder();
-                                return;
-                            }
-                        } else {
-                            offlineConfirmCount = 0;
-                        }
-
-                        if (offlineConfirmCount < 2 && attempt < maxAttempts) {
-                            setTimeout(() => checkBufferingStatus(attempt + 1, maxAttempts), 1500);
-                        }
-                    })
-                    .catch(apiError => {
-                        AppLogger.log('❗ API check failed:', apiError);
-                        if (attempt < maxAttempts) {
-                            setTimeout(() => checkBufferingStatus(attempt + 1, maxAttempts), 1500);
-                        }
-                    });
-            }
-
-            checkBufferingStatus();
-        });
-
-        // Context menu prevention
-        document.getElementById('video-player').addEventListener('contextmenu', function(e) {
-            e.preventDefault();
-            return false;
-        });
-
-        AppState.player.ready(function() {
-            const videoElement = AppState.player.el().querySelector('video');
-            if (videoElement) {
-                videoElement.addEventListener('contextmenu', function(e) {
-                    e.preventDefault();
-                    return false;
-                });
-            }
-        });
-    }
-
-    // Stream switching functions
-    function switchToPlaceholder() {
-        if (AppState.streamMode === 'placeholder') {
-            AppLogger.log('⚠️ Already in placeholder mode, ignoring switch request');
-            return;
-        }
-
-        AppLogger.log('🔄 START: Switching to placeholder video');
-        AppLogger.log('📊 State before switch:', {
-            streamMode: AppState.streamMode,
-            errorRetryCount: AppState.errorRetryCount,
-            isRecovering: AppState.isRecovering
-        });
-
-        AppState.streamMode = 'placeholder';
-
-        if (AppState.recoveryInterval) {
-            clearInterval(AppState.recoveryInterval);
-            AppState.recoveryInterval = null;
-        }
-        if (AppState.recoveryTimeout) {
-            clearTimeout(AppState.recoveryTimeout);
-            AppState.recoveryTimeout = null;
-        }
-
-        updateStreamStatus('SWITCHING...', '#ffc107');
-
-        try {
-            AppState.player.pause();
-            AppState.player.reset();
-            enforceSavedVolume();
-
-            setTimeout(() => {
-                AppState.player.src({
-                    src: 'placeholder.mp4',
-                    type: 'video/mp4'
-                });
-
-                AppState.player.load();
-                setTimeout(() => enforceSavedVolume(), 200);
-
-                AppState.player.play()
-                    .then(() => {
-                        AppLogger.log('Placeholder video started successfully');
-                        const savedVolume = localStorage.getItem('playerVolume') || AppConfig.video.defaultVolume.toString();
-                        const targetVolume = parseFloat(savedVolume);
-                        AppState.player.volume(targetVolume);
-                        updateStreamStatus('PLACEHOLDER', '#17a2b8');
-                        UIControls.showToast('Stream offline - showing placeholder video');
-                        startRecoveryChecks();
-                    })
-                    .catch(e => {
-                        AppLogger.log('Placeholder play failed:', e);
-                        updateStreamStatus('PLACEHOLDER', '#17a2b8');
-                        UIControls.showToast('Stream offline - showing placeholder video');
-                        startRecoveryChecks();
-                    });
-
-            }, 1000);
-
-        } catch (e) {
-            AppLogger.log('Error switching to placeholder:', e);
-            updateStreamStatus('PLACEHOLDER', '#17a2b8');
-            startRecoveryChecks();
-        }
-    }
-
-    function switchToLive() {
-        if (AppState.streamMode === 'live') {
-            AppLogger.log('⚠️ Already in live mode, ignoring switch request');
-            return;
-        }
-
-        AppLogger.log('🔄 START: Switching back to live stream');
-        AppLogger.log('📊 State before switch:', {
-            streamMode: AppState.streamMode,
-            isRecovering: AppState.isRecovering
-        });
-
-        AppState.streamMode = 'live';
-        AppState.isRecovering = false;
-
-        if (AppState.recoveryInterval) {
-            clearInterval(AppState.recoveryInterval);
-            AppState.recoveryInterval = null;
-        }
-
-        updateStreamStatus('SWITCHING...', '#ffc107');
-
-        try {
-            AppState.player.pause();
-            AppState.player.reset();
-            enforceSavedVolume();
-
-            setTimeout(() => {
-                AppState.player.src({
-                    src: '?proxy=stream',
-                    type: 'application/x-mpegURL'
-                });
-
-                AppState.errorRetryCount = 0;
-                AppState.isRetrying = false;
-
-                AppState.player.load();
-                setTimeout(() => enforceSavedVolume(), 200);
-
-                AppState.player.play()
-                    .then(() => {
-                        AppLogger.log('Live stream started successfully');
-                        const savedVolume = localStorage.getItem('playerVolume') || AppConfig.video.defaultVolume.toString();
-                        const targetVolume = parseFloat(savedVolume);
-                        AppState.player.volume(targetVolume);
-                        updateStreamStatus('RECONNECTING...', '#ffc107');
-                        UIControls.showToast('Stream back online - switching to live');
-
-                        setTimeout(() => {
-                            if (AppState.streamMode === 'live') {
-                                updateStreamStatus('LIVE', 'var(--dodgers-red)');
-                            }
-                        }, 2000);
-                    })
-                    .catch(e => {
-                        AppLogger.log('Live stream play failed:', e);
-                        const savedVolume = localStorage.getItem('playerVolume') || AppConfig.video.defaultVolume.toString();
-                        const targetVolume = parseFloat(savedVolume);
-                        AppState.player.volume(targetVolume);
-                        updateStreamStatus('LIVE', 'var(--dodgers-red)');
-                        UIControls.showToast('Stream back online - switching to live');
-                    });
-
-            }, 1000);
-
-        } catch (e) {
-            AppLogger.log('Error switching to live:', e);
-            AppState.player.src({ src: '?proxy=stream', type: 'application/x-mpegURL' });
-            AppState.player.load();
-        }
-    }
-
-    // Recovery check system
-    function startRecoveryChecks() {
-        AppLogger.log('🔍 Starting fast recovery checks every 2 seconds for 5 checks');
-
-        let recoveryCheckCount = 0;
-        let recoveryTimeout;
-
-        function checkRecovery() {
-            if (AppState.streamMode !== 'placeholder' || recoveryCheckCount >= AppConfig.video.recoveryCheckCount) {
-                if (recoveryCheckCount >= AppConfig.video.recoveryCheckCount) {
-                    AppLogger.log('⏹️ Fast recovery checks complete - stream still offline');
-                }
-                return;
-            }
-
-            recoveryCheckCount++;
-            AppLogger.log(`🔍 Recovery check ${recoveryCheckCount}/${AppConfig.video.recoveryCheckCount}...`);
-
-            API.checkStreamStatus()
-                .then(data => {
-                    if (data.online && AppState.streamMode === 'placeholder') {
-                        AppLogger.log('✅ Stream back online during recovery check - switching');
-                        AppState.isRecovering = true;
-                        switchToLive();
-                    } else {
-                        if (recoveryCheckCount < AppConfig.video.recoveryCheckCount) {
-                            recoveryTimeout = setTimeout(checkRecovery, AppConfig.video.recoveryCheckInterval);
-                        }
-                    }
-                })
-                .catch(error => {
-                    AppLogger.log(`❗ Recovery check ${recoveryCheckCount} failed:`, error);
-                    if (recoveryCheckCount < AppConfig.video.recoveryCheckCount) {
-                        recoveryTimeout = setTimeout(checkRecovery, AppConfig.video.recoveryCheckInterval);
-                    }
-                });
-        }
-
-        checkRecovery();
-    }
-
-    // Manual recovery function
-    function manualRecovery() {
-        AppLogger.log('🔄 Manual recovery triggered by user');
-        AppState.errorRetryCount = 0;
-        AppState.isRetrying = false;
-
-        UIControls.showToast('🔄 Manual stream refresh triggered');
-
-        AppState.player.reset();
-        AppState.player.error(null);
-
-        AppState.player.src({
-            src: '?proxy=stream',
-            type: 'application/x-mpegURL'
-        });
-
-        AppState.player.load();
-
-        setTimeout(() => {
-            AppState.player.play().catch(e => AppLogger.log('Manual recovery play failed:', e));
-        }, 500);
-    }
-
-    // Public API
-    window.VideoPlayer = {
-        initializePlayer: initializePlayer,
-        switchToPlaceholder: switchToPlaceholder,
-        switchToLive: switchToLive,
-        manualRecovery: manualRecovery,
-        updateStreamStatus: updateStreamStatus
-    };
-
-    // Initialize player when DOM and Video.js are ready
-    document.addEventListener('DOMContentLoaded', function() {
-        // Check if Video.js is loaded
-        if (typeof videojs === 'undefined') {
-            AppLogger.error('Video.js not found - video player will not initialize');
-            return;
-        }
-
-        // Small delay to ensure DOM is fully ready
-        setTimeout(initializePlayer, 50);
-    });
-
-    AppLogger.log('Video Player module loaded');
-
-})();