feat: add home page with resume functionality and recently added VOD

public/index.html

@@ -45,6 +45,13 @@
       </a>
       <div class="navbar-menu" id="navbar-menu">
         <a href="#" class="nav-link active" data-page="home">
+          <span class="nav-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"
+              class="icon">
+              <path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" />
+            </svg></span>
+          <span>Home</span>
+        </a>
+        <a href="#" class="nav-link" data-page="live">
           <span class="nav-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"
               class="icon">
               <path
@@ -88,8 +95,14 @@
 
     <!-- Main Content Area -->
     <main class="main-content">
-      <!-- Home Page -->
+      <!-- Home (Dashboard) Page -->
       <div id="page-home" class="page active">
+        <!-- Content will be rendered by HomePage.js -->
+        <div class="loading-state">Loading Dashboard...</div>
+      </div>
+
+      <!-- Live TV Page (formerly Home) -->
+      <div id="page-live" class="page">
         <div class="home-layout">
           <!-- Channel Toggle Button (Mobile) -->
           <button class="channel-toggle-btn" id="channel-toggle-btn">
@@ -1041,7 +1054,8 @@
   <script src="/js/components/ChannelList.js?v=3"></script>
   <script src="/js/components/SourceManager.js?v=2"></script>
   <script src="/js/components/EpgGuide.js?v=2"></script>
-  <script src="/js/pages/Home.js?v=3"></script>
+  <script src="/js/pages/HomePage.js?v=2"></script>
+  <script src="/js/pages/LivePage.js?v=2"></script>
   <script src="/js/pages/Guide.js?v=2"></script>
   <script src="/js/pages/MoviesPage.js?v=4"></script>
   <script src="/js/pages/SeriesPage.js?v=1"></script>