diff --git a/src/frontend/src/stores/userPreferences.ts b/src/frontend/src/stores/userPreferences.ts
index 73fec897..ad651152 100644
--- a/src/frontend/src/stores/userPreferences.ts
+++ b/src/frontend/src/stores/userPreferences.ts
@@ -1,9 +1,38 @@
 import { proxy } from 'valtio'
+import { subscribe } from 'valtio/index'
+import { STORAGE_KEYS } from '@/utils/storageKeys'
 
 type State = {
   is_idle_disconnect_modal_enabled: boolean
 }
 
-export const userPreferencesStore = proxy<State>({
+const DEFAULT_STATE = {
   is_idle_disconnect_modal_enabled: true,
+}
+
+function getUserPreferencesState(): State {
+  try {
+    const stored = localStorage.getItem(STORAGE_KEYS.USER_PREFERENCES)
+    if (!stored) return DEFAULT_STATE
+    const parsed = JSON.parse(stored)
+    return {
+      ...DEFAULT_STATE,
+      ...parsed,
+    }
+  } catch (error: unknown) {
+    console.error(
+      '[UserPreferencesStore] Failed to parse stored settings:',
+      error
+    )
+    return DEFAULT_STATE
+  }
+}
+
+export const userPreferencesStore = proxy<State>(getUserPreferencesState())
+
+subscribe(userPreferencesStore, () => {
+  localStorage.setItem(
+    STORAGE_KEYS.USER_PREFERENCES,
+    JSON.stringify(userPreferencesStore)
+  )
 })
diff --git a/src/frontend/src/utils/storageKeys.tsx b/src/frontend/src/utils/storageKeys.tsx
index 430698c9..8e883359 100644
--- a/src/frontend/src/utils/storageKeys.tsx
+++ b/src/frontend/src/utils/storageKeys.tsx
@@ -3,4 +3,5 @@
  */
 export const STORAGE_KEYS = {
   NOTIFICATIONS: 'app_notification_settings',
+  USER_PREFERENCES: 'app_user_preferences',
 } as const