feat: Initialize ObsiGate application with core frontend and backend components.

frontend/index.html

@@ -350,16 +350,33 @@
 
       <!-- Content -->
       <main class="content-area" id="content-area" aria-label="Contenu principal">
-        <div id="dashboard-home" class="dashboard-home" role="region" aria-label="Derniers fichiers ouverts">
-          <div class="dashboard-header">
-            <div class="dashboard-title-row">
-              <i data-lucide="clock" class="dashboard-icon"></i>
-              <h2>Derniers fichiers ouverts</h2>
+        <div id="dashboard-home" class="dashboard-home" role="region" aria-label="Tableau de bord">
+          <!-- Bookmarks Section -->
+          <div id="dashboard-bookmarks-section" class="dashboard-section">
+            <div class="dashboard-header">
+              <div class="dashboard-title-row">
+                <i data-lucide="bookmark" class="dashboard-icon" style="color:var(--accent-green)"></i>
+                <h2>Bookmarks</h2>
+              </div>
             </div>
+            <div id="dashboard-bookmarks-grid" class="dashboard-recent-grid"></div>
+            <div id="dashboard-bookmarks-empty" class="dashboard-recent-empty">
+              <i data-lucide="pin"></i>
+              <span>Aucun bookmark</span>
+              <p>Épinglez des fichiers pour les retrouver ici.</p>
             </div>
           </div>
-          <div id="dashboard-recent-grid" class="dashboard-recent-grid"></div>
-          <div id="dashboard-loading" class="dashboard-loading">
+
+          <!-- Recently Opened Section -->
+          <div id="dashboard-recent-section" class="dashboard-section">
+            <div class="dashboard-header">
+              <div class="dashboard-title-row">
+                <i data-lucide="clock" class="dashboard-icon"></i>
+                <h2>Derniers fichiers ouverts</h2>
+              </div>
+            </div>
+            <div id="dashboard-recent-grid" class="dashboard-recent-grid"></div>
+            <div id="dashboard-loading" class="dashboard-loading">
             <div class="skeleton-card"></div>
             <div class="skeleton-card"></div>
             <div class="skeleton-card"></div>