diff --git a/web/src/components/Index.vue b/web/src/components/Index.vue
index a8c33b7..e2a9151 100644
--- a/web/src/components/Index.vue
+++ b/web/src/components/Index.vue
@@ -399,7 +399,7 @@ const siteTitle = computed(() => {
                       <span class="text-xs text-muted-foreground">{{ themeLabel }}</span>
                     </span>
                   </button>
-                  <button @click="logout" class="w-full text-left px-4 py-2 text-sm text-red-600 hover:bg-red-50 transition-colors">
+                  <button @click="logout" class="w-full text-left px-4 py-2 text-sm text-destructive hover:bg-muted dark:hover:bg-white/5 transition-colors">
                     <div class="flex items-center space-x-2">
                       <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                         <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1" />