diff --git a/frontend/index.html b/frontend/index.html
index 8939330..6af0926 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1358,54 +1358,57 @@
                             <span class="text-xs font-semibold uppercase tracking-wide" style="color: var(--text-tertiary);">Settings</span>
                         </div>
                         
-                        <div class="flex-1 overflow-y-auto custom-scrollbar p-3">
-                            <!-- Theme -->
-                            <div class="mb-4">
-                                <label class="block text-xs font-medium mb-2" style="color: var(--text-secondary);">Theme</label>
-                                <select 
-                                    x-model="currentTheme"
-                                    @change="setTheme(currentTheme)"
-                                    class="w-full px-2 py-2 text-sm rounded focus:outline-none focus:ring-2 focus:ring-opacity-50"
-                                    style="background-color: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-primary); cursor: pointer;"
-                                >
-                                    <template x-for="theme in availableThemes" :key="theme.id">
-                                        <option :value="theme.id" x-text="theme.name"></option>
-                                    </template>
-                                </select>
+                        <!-- Scrollable content -->
+                        <div class="flex-1 overflow-y-auto custom-scrollbar">
+                            <div class="p-3">
+                                <!-- Theme -->
+                                <div class="mb-4">
+                                    <label class="block text-xs font-medium mb-2" style="color: var(--text-secondary);">Theme</label>
+                                    <select 
+                                        x-model="currentTheme"
+                                        @change="setTheme(currentTheme)"
+                                        class="w-full px-2 py-2 text-sm rounded focus:outline-none focus:ring-2 focus:ring-opacity-50"
+                                        style="background-color: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-primary); cursor: pointer;"
+                                    >
+                                        <template x-for="theme in availableThemes" :key="theme.id">
+                                            <option :value="theme.id" x-text="theme.name"></option>
+                                        </template>
+                                    </select>
+                                </div>
+                                
+                                <!-- Logout (if auth enabled) - uses authEnabled from main app state -->
+                                <div x-show="authEnabled" class="mb-4">
+                                    <label class="block text-xs font-medium mb-2" style="color: var(--text-secondary);">Account</label>
+                                    <a 
+                                        href="/logout" 
+                                        class="flex items-center justify-center gap-2 px-3 py-2 text-sm rounded transition-colors"
+                                        style="background-color: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-primary);"
+                                        onmouseover="this.style.backgroundColor='var(--bg-hover)'"
+                                        onmouseout="this.style.backgroundColor='var(--bg-primary)'"
+                                    >
+                                        🔒 Logout
+                                    </a>
+                                </div>
                             </div>
                             
-                            <!-- Logout (if auth enabled) - uses authEnabled from main app state -->
-                            <div x-show="authEnabled" class="mb-4">
-                                <label class="block text-xs font-medium mb-2" style="color: var(--text-secondary);">Account</label>
+                            <!-- Footer Info (inside scroll area) -->
+                            <div class="p-3 mt-4 border-t text-center" style="border-color: var(--border-primary);">
+                                <div class="text-xs" style="color: var(--text-tertiary);">
+                                    <span x-text="notes.length"></span> notes
+                                    <span class="mx-1">·</span>
+                                    <span x-text="'v' + appVersion"></span>
+                                </div>
                                 <a 
-                                    href="/logout" 
-                                    class="flex items-center justify-center gap-2 px-3 py-2 text-sm rounded transition-colors"
-                                    style="background-color: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-primary);"
-                                    onmouseover="this.style.backgroundColor='var(--bg-hover)'"
-                                    onmouseout="this.style.backgroundColor='var(--bg-primary)'"
+                                    href="https://www.notediscovery.com" 
+                                    target="_blank" 
+                                    rel="noopener noreferrer"
+                                    class="text-xs hover:underline"
+                                    style="color: var(--accent-primary);"
                                 >
-                                    🔒 Logout
+                                    notediscovery.com
                                 </a>
                             </div>
                         </div>
-                        
-                        <!-- Footer Info -->
-                        <div class="flex-shrink-0 p-3 border-t text-center" style="border-color: var(--border-primary);">
-                            <div class="text-xs" style="color: var(--text-tertiary);">
-                                <span x-text="notes.length"></span> notes
-                                <span class="mx-1">·</span>
-                                <span x-text="'v' + appVersion"></span>
-                            </div>
-                            <a 
-                                href="https://www.notediscovery.com" 
-                                target="_blank" 
-                                rel="noopener noreferrer"
-                                class="text-xs hover:underline"
-                                style="color: var(--accent-primary);"
-                            >
-                                notediscovery.com
-                            </a>
-                        </div>
                     </div>
                 </template>
                 <!-- END SETTINGS PANEL -->