diff --git a/beta/settings.png b/beta/settings.png
new file mode 100644
index 00000000..670a4795
Binary files /dev/null and b/beta/settings.png differ
diff --git a/beta/style.css b/beta/style.css
index abd880b3..d18ca3af 100644
--- a/beta/style.css
+++ b/beta/style.css
@@ -770,12 +770,12 @@ footer {
 .donation-card { border-color: var(--warning); background: rgba(245, 158, 11, 0.05); }
 
 /* UI Gallery */
-.ui-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; margin-top: 2rem; }
+.ui-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 1rem; margin-top: 2rem; }
 .ui-shot {
     border: 1px solid var(--border-color);
     border-radius: var(--radius);
     overflow: hidden;
-    height: 200px;
+    height: 280px;
     background: #000;
     position: relative;
     cursor: pointer;
@@ -788,9 +788,19 @@ footer {
     transition: transform 0.3s ease;
 }
 .ui-shot:hover img {
-    transform: scale(1.05);
+    transform: scale(1.25);
+}
+.ui-shot-caption { 
+    position: absolute; 
+    bottom: 0; 
+    left: 0; 
+    right: 0; 
+    background: rgba(0,0,0,0.8); 
+    color: white; 
+    padding: 0.5rem; 
+    font-size: 0.8rem; 
+    text-align: center; 
 }
-.ui-shot-caption { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.8); color: white; padding: 0.5rem; font-size: 0.8rem; text-align: center; }
 
 /* Preview Overlay */
 #ui-preview-overlay {
diff --git a/beta/ui.html b/beta/ui.html
index 2ac3bd48..bb4b55cd 100644
--- a/beta/ui.html
+++ b/beta/ui.html
@@ -85,7 +85,7 @@
                     <p>Move your management from the terminal to the browser. The integrated Web UI provides a high-fidelity command center that is served natively by the daemon, no complex web server setup required.</p>
                 </div>
             </div>
-            <div class="ui-shot" data-large="dashboard.png" style="width: 110%; min-height: 400px;">
+            <div class="ui-shot" data-large="dashboard.png" style="width: 110%; min-height: 450px;">
                 <img src="dashboard.png" alt="Daemon Dashboard">
                 <div class="ui-shot-caption">Daemon Dashboard</div>
             </div>
@@ -136,20 +136,28 @@
         <div class="ui-gallery">
             <div class="ui-shot" data-large="disks.png">
                 <img src="disks.png" alt="Dashboard">
-                <div class="ui-shot-caption">Dashboard Overview</div>
-            </div>
-            <div class="ui-shot" data-large="tasks.png">
-                <img src="tasks.png" alt="Disk Health">
                 <div class="ui-shot-caption">Disk Health</div>
             </div>
-            <div class="ui-shot" data-large="differences.png">
-                <img src="differences.png" alt="Task Manager">
+            <div class="ui-shot" data-large="smart.png">
+                <img src="smart.png" alt="Smart Details">
+                <div class="ui-shot-caption">Smart Details</div>
+            </div>
+            <div class="ui-shot" data-large="tasks.png">
+                <img src="tasks.png" alt="Task Manager">
                 <div class="ui-shot-caption">Task Manager</div>
             </div>
+            <div class="ui-shot" data-large="differences.png">
+                <img src="differences.png" alt="Differences">
+                <div class="ui-shot-caption">Differences</div>
+            </div>
             <div class="ui-shot" data-large="recovery.png">
                 <img src="recovery.png" alt="File Recovery">
                 <div class="ui-shot-caption">File Recovery</div>
             </div>
+            <div class="ui-shot" data-large="settings.png">
+                <img src="settings.png" alt="Settings">
+                <div class="ui-shot-caption">Settings</div>
+            </div>
         </div>
     </div>