diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionsAdd.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionsAdd.svelte
index 47bdb47a4..b2581f11e 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionsAdd.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionsAdd.svelte
@@ -2,10 +2,10 @@
 	import ChatFormActionAddButton from './ChatFormActionAddButton.svelte';
 	import ChatFormActionAddDropdown from './ChatFormActionAddDropdown.svelte';
 	import ChatFormActionAddSheet from './ChatFormActionAddSheet.svelte';
-	import { isMobile } from '$lib/stores';
+	import { deviceStore } from '$lib/stores';
 </script>
 
-{#if isMobile.current}
+{#if deviceStore.isMobile}
 	<ChatFormActionAddSheet>
 		{#snippet trigger({ disabled, onclick })}
 			<ChatFormActionAddButton {disabled} {onclick} />
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionModels.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionModels.svelte
index fad223a98..689ef8c3a 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionModels.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionModels.svelte
@@ -1,6 +1,12 @@
 <script lang="ts">
 	import { ModelsSelectorDropdown, ModelsSelectorSheet } from '$lib/components/app';
-	import { chatStore, conversationsStore, isMobile, modelsStore, serverStore } from '$lib/stores';
+	import {
+		chatStore,
+		conversationsStore,
+		deviceStore,
+		modelsStore,
+		serverStore
+	} from '$lib/stores';
 
 	interface Props {
 		disabled?: boolean;
@@ -170,7 +176,7 @@
 	}
 </script>
 
-{#if isMobile.current}
+{#if deviceStore.isMobile}
 	<ModelsSelectorSheet
 		disabled={disabled || isOffline}
 		bind:this={selectorModelRef}
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte
index 606fa6cd3..7b071d99e 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte
@@ -1,15 +1,14 @@
 <script lang="ts">
 	import ContextGaugeDial from './ContextGaugeDial.svelte';
-	import { useContextGauge } from '$lib/hooks/use-context-gauge.svelte';
 	import {
-		chatStore,
-		conversationsStore,
 		gaugeTriggerClick,
 		gaugeTriggerEnter,
 		gaugeTriggerKeydown,
 		gaugeTriggerLeave,
 		gaugeTriggerPointerDown
-	} from '$lib/stores';
+	} from './gauge-popup.svelte';
+	import { useContextGauge } from '$lib/hooks/use-context-gauge.svelte';
+	import { chatStore, conversationsStore } from '$lib/stores';
 	import { untrack } from 'svelte';
 
 	const gauge = useContextGauge();
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte
index eaaba69de..1153c70fd 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
 	import ContextGaugeDetailRow from './ContextGaugeDetailRow.svelte';
+	import { gaugePopup } from './gauge-popup.svelte';
 	import { ChevronDown } from '@lucide/svelte';
 	import * as Collapsible from '$lib/components/ui/collapsible';
 	import { STATS_UNITS } from '$lib/constants';
-	import { gaugePopup } from '$lib/stores/context-gauge-popup.svelte';
 
 	interface Props {
 		currentRead: number;
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte
index e6abb4a3e..5d80ecc11 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte
@@ -2,8 +2,13 @@
 	import { colorLevelBgClass, colorLevelTextClass } from './context-gauge';
 	import ContextGaugeDetails from './ContextGaugeDetails.svelte';
 	import ContextGaugeLoadModel from './ContextGaugeLoadModel.svelte';
+	import {
+		gaugeCardEnter,
+		gaugeCardLeave,
+		gaugePopup,
+		gaugePopupClose
+	} from './gauge-popup.svelte';
 	import { useContextGauge } from '$lib/hooks/use-context-gauge.svelte';
-	import { gaugeCardEnter, gaugeCardLeave, gaugePopup, gaugePopupClose } from '$lib/stores';
 	import { formatParameters } from '$lib/utils/formatters';
 
 	const gauge = useContextGauge();
diff --git a/tools/ui/src/lib/stores/context-gauge-popup.svelte.ts b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/gauge-popup.svelte.ts
similarity index 100%
rename from tools/ui/src/lib/stores/context-gauge-popup.svelte.ts
rename to tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/gauge-popup.svelte.ts
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputBasic.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputBasic.svelte
index e0c08c721..af3585e74 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputBasic.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputBasic.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { isMobile } from '$lib/stores';
+	import { deviceStore } from '$lib/stores';
 	import { autoResizeTextarea } from '$lib/utils';
 	import { onMount } from 'svelte';
 
@@ -37,7 +37,7 @@
 	}
 
 	export function focus() {
-		if (isMobile.current) return;
+		if (deviceStore.isMobile) return;
 
 		textareaElement?.focus({ preventScroll: true });
 	}
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte
index d87817adb..5ce788d5a 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { CODE_BLOCK, CODE_TOKEN_ATTR, UI_DATA_ATTRS } from '$lib/constants';
 	import { BooleanString, ChatFormInputRichTokenKind, ColorMode } from '$lib/enums';
-	import { isMobile } from '$lib/stores';
+	import { deviceStore } from '$lib/stores';
 	import type { ChatFormInputRichToken } from '$lib/types';
 	import type { SourceHistoryEntry } from '$lib/utils';
 	import {
@@ -750,7 +750,7 @@
 		syncEmptyState();
 		document.addEventListener('selectionchange', handleSelectionChange);
 
-		if (!isMobile.current) {
+		if (!deviceStore.isMobile) {
 			rootElement?.focus({ preventScroll: true });
 		}
 	});
@@ -792,7 +792,7 @@
 	}
 
 	export function focus() {
-		if (isMobile.current) return;
+		if (deviceStore.isMobile) return;
 
 		rootElement?.focus({ preventScroll: true });
 	}
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMention.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMention.svelte
index fbe6ce101..2cc3bd8b6 100644
--- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMention.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMention.svelte
@@ -8,7 +8,7 @@
 	import { BuiltInTool, FileMentionEntryType, GlobSearchType, KeyboardKey } from '$lib/enums';
 	import { useDebouncedSearch } from '$lib/hooks/use-debounced-search.svelte';
 	import { usePickerNavigation } from '$lib/hooks/use-picker-navigation.svelte';
-	import { isMobile, settingsStore, toolsStore } from '$lib/stores';
+	import { deviceStore, settingsStore, toolsStore } from '$lib/stores';
 	import type { FileMentionEntry, GlobEntryResult } from '$lib/types';
 	import { abbreviateHome, runGlobSearchWithChildren } from '$lib/utils';
 
@@ -130,7 +130,7 @@
 		return searchError ? `Search failed - ${searchError}` : 'No matching files or folders';
 	});
 
-	const showTooltip = $derived(!isMobile.current);
+	const showTooltip = $derived(!deviceStore.isMobile);
 
 	$effect(() => {
 		if (typeof window === 'undefined') return;
diff --git a/tools/ui/src/lib/components/app/chat/ChatMessages/ChatMessage/ChatMessage.svelte b/tools/ui/src/lib/components/app/chat/ChatMessages/ChatMessage/ChatMessage.svelte
index 78cb88721..b0f6b1b3d 100644
--- a/tools/ui/src/lib/components/app/chat/ChatMessages/ChatMessage/ChatMessage.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatMessages/ChatMessage/ChatMessage.svelte
@@ -11,7 +11,7 @@
 	import { setChatMessageActionsContext, setChatMessageEditContext } from '$lib/contexts';
 	import { AgenticSectionType, AttachmentType, MessageRole } from '$lib/enums';
 	import { DatabaseService } from '$lib/services/database.service';
-	import { chatStore, conversationsStore, isMobile } from '$lib/stores';
+	import { chatStore, conversationsStore, deviceStore } from '$lib/stores';
 	import type {
 		ChatMessageActions,
 		ChatMessageDeletionInfo,
@@ -304,7 +304,7 @@
 
 	// After the system message flow ends, hand focus to the main chat form
 	function focusMainChatForm() {
-		if (isMobile.current) return;
+		if (deviceStore.isMobile) return;
 
 		document.querySelector<HTMLTextAreaElement>('.chat-screen-form-wrapper textarea')?.focus();
 	}
diff --git a/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte b/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte
index 2b5ca68de..d78de1f85 100644
--- a/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreen.svelte
@@ -21,8 +21,7 @@
 	import {
 		chatStore,
 		conversationsStore,
-		device,
-		isMobile,
+		deviceStore,
 		serverStore,
 		settingsStore
 	} from '$lib/stores';
@@ -32,7 +31,7 @@
 	let { showCenteredEmpty = false } = $props();
 
 	let disableAutoScroll = $derived(
-		Boolean(settingsStore.config.disableAutoScroll) || isMobile.current
+		Boolean(settingsStore.config.disableAutoScroll) || deviceStore.isMobile
 	);
 	let isMobileUserScrolledUp = $state(false);
 	let mobileScrollDownHint = $state(false);
@@ -52,11 +51,11 @@
 	let hasPropsError = $derived(!!serverStore.error);
 	let isCurrentConversationLoading = $derived(chatStore.isLoading || chatStore.isStreaming());
 	let chatFormBottomPosition = $derived.by(() => {
-		if (!isMobile.current) return '1rem';
+		if (!deviceStore.isMobile) return '1rem';
 
-		if (device.isStandalone) return '1.5rem';
+		if (deviceStore.isStandalone) return '1.5rem';
 
-		if (device.isIOSSafari) return '0.25rem';
+		if (deviceStore.isIOSSafari) return '0.25rem';
 
 		return '0.5rem';
 	});
@@ -84,7 +83,7 @@
 	});
 
 	function handleMobileScroll() {
-		if (!isMobile.current) return;
+		if (!deviceStore.isMobile) return;
 
 		const container = scroll.chatScrollContainer;
 
@@ -184,7 +183,7 @@
 	}
 
 	function handleSendLikeScroll() {
-		if (!isMobile.current) {
+		if (!deviceStore.isMobile) {
 			autoScroll.enable();
 		}
 
@@ -197,7 +196,7 @@
 				'.chat-message:nth-last-child(2) .chat-message-user .chat-message-user-bubble'
 			) as HTMLElement | null;
 
-			if (isMobile.current) {
+			if (deviceStore.isMobile) {
 				// Keep the last user message bubble just above the input on mobile
 				const bubbleHeight = lastUserBubble?.scrollHeight ?? 0;
 				const baseHeight = container.scrollHeight - innerHeight;
@@ -220,7 +219,7 @@
 			}
 		}, 100);
 
-		if (isMobile.current) {
+		if (deviceStore.isMobile) {
 			autoScroll.setDisabled(disableAutoScroll);
 			mobileScrollDownHint = true;
 			mobileScrollDownHintLockedUntil = Date.now() + 500;
@@ -243,7 +242,8 @@
 
 	$effect(() => {
 		const shouldDisableAutoScroll =
-			settingsStore.config.disableAutoScroll || (isMobile.current && isCurrentConversationLoading);
+			settingsStore.config.disableAutoScroll ||
+			(deviceStore.isMobile && isCurrentConversationLoading);
 
 		autoScroll.setDisabled(shouldDisableAutoScroll);
 
@@ -266,7 +266,7 @@
 			autoScroll.enable();
 		}
 
-		if (isMobile.current && isCurrentConversationLoading) {
+		if (deviceStore.isMobile && isCurrentConversationLoading) {
 			mobileScrollDownHint = true;
 			mobileScrollDownHintLockedUntil = Date.now() + 500;
 		}
@@ -318,9 +318,9 @@
 		<div
 			class={[
 				'pointer-events-none md:sticky fixed  mt-auto transition-all duration-200',
-				device.isStandalone
+				deviceStore.isStandalone
 					? 'bottom-6 right-4 left-4'
-					: device.isIOSSafari
+					: deviceStore.isIOSSafari
 						? 'bottom-1 left-2 right-2'
 						: 'bottom-2 right-2 left-2',
 				isEmpty ? 'md:bottom-[calc(50dvh-7rem)] 2xl:bottom-[calc(50dvh-4rem)]' : 'md:bottom-4'
@@ -336,7 +336,7 @@
 			{/if}
 
 			<div class="pointer-events-none flex flex-col gap-6 items-center w-full">
-				{#if (isMobile.current ? mobileScrollDownHint || isMobileUserScrolledUp : autoScroll.userScrolledUp) && page.url.hash.includes(ROUTES.CHAT) && page.params.id}
+				{#if (deviceStore.isMobile ? mobileScrollDownHint || isMobileUserScrolledUp : autoScroll.userScrolledUp) && page.url.hash.includes(ROUTES.CHAT) && page.params.id}
 					<ChatScreenActionScrollDown
 						onclick={() => {
 							mobileScrollDownHint = false;
diff --git a/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreenForm.svelte b/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreenForm.svelte
index 4119b2816..464502980 100644
--- a/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreenForm.svelte
+++ b/tools/ui/src/lib/components/app/chat/ChatScreen/ChatScreenForm.svelte
@@ -3,7 +3,7 @@
 	import { page } from '$app/state';
 	import { ChatForm } from '$lib/components/app';
 	import { useDraftMessages } from '$lib/hooks/use-draft-messages.svelte';
-	import { isMobile } from '$lib/stores';
+	import { deviceStore } from '$lib/stores';
 	import { onMount } from 'svelte';
 
 	interface Props {
@@ -120,13 +120,13 @@
 	}
 
 	onMount(() => {
-		if (!isMobile.current) {
+		if (!deviceStore.isMobile) {
 			setTimeout(focusFormUnlessCaptured, 100);
 		}
 	});
 
 	afterNavigate((navigation) => {
-		if (navigation?.from != null && !isMobile.current) {
+		if (navigation?.from != null && !deviceStore.isMobile) {
 			setTimeout(focusFormUnlessCaptured, 100);
 		}
 	});
diff --git a/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigation.svelte b/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigation.svelte
index 260ff985b..aa63c2915 100644
--- a/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigation.svelte
+++ b/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigation.svelte
@@ -14,7 +14,7 @@
 	import { useKeyboardShortcuts } from '$lib/hooks/use-keyboard-shortcuts.svelte';
 	import { useMarqueeSelection } from '$lib/hooks/use-marquee-selection.svelte';
 	import { RouterService } from '$lib/services/router.service';
-	import { chatStore, conversationsStore, device, isMobile, settingsStore } from '$lib/stores';
+	import { chatStore, conversationsStore, deviceStore, settingsStore } from '$lib/stores';
 	import { buildConversationTree } from '$lib/utils';
 	import { circIn } from 'svelte/easing';
 	import { SvelteSet } from 'svelte/reactivity';
@@ -36,7 +36,7 @@
 	let logoHovered = $state(false);
 
 	const isStripExpanded = $derived(isExpandedMode || hoveredTooltip !== null);
-	const isOnMobile = $derived(isMobile.current);
+	const isOnMobile = $derived(deviceStore.isMobile);
 	const alwaysShowOnDesktop = $derived(settingsStore.config.alwaysShowSidebarOnDesktop as boolean);
 
 	$effect(() => {
@@ -65,7 +65,7 @@
 	});
 
 	$effect(() => {
-		if (isMobile.current && page.url.hash.includes(ROUTES.SEARCH)) {
+		if (deviceStore.isMobile && page.url.hash.includes(ROUTES.SEARCH)) {
 			isExpandedMode = false;
 		}
 	});
@@ -227,7 +227,7 @@
 	}
 
 	async function selectConversation(id: string) {
-		if (isMobile.current) {
+		if (deviceStore.isMobile) {
 			scheduleMobileCollapse();
 		}
 
@@ -315,9 +315,9 @@
 			'fixed md:sticky top-2 left-2 md:left-0 md:ml-2 md:mt-2 pt-2 z-10 w-[calc(100dvw-1rem)]',
 			'md:h-[calc(100dvh-1.125rem)]',
 			isExpandedMode &&
-				(device.isStandalone
+				(deviceStore.isStandalone
 					? 'h-[calc(100dvh-2rem)]'
-					: device.isIOSDevice
+					: deviceStore.isIOSDevice
 						? 'h-[calc(100dvh-0.5rem)]'
 						: 'h-[calc(100dvh-1rem)]'),
 			'rounded-3xl md:rounded-2xl',
@@ -353,7 +353,7 @@
 
 			{#if isOnMobile || (isExpandedMode && !alwaysShowOnDesktop)}
 				<div
-					class="flex items-center transition-all duration-150 ease-out {isMobile.current &&
+					class="flex items-center transition-all duration-150 ease-out {deviceStore.isMobile &&
 					!isExpandedMode
 						? 'opacity-0 h-0!'
 						: ''}"
@@ -361,7 +361,7 @@
 					out:fade={{ duration: 100 }}
 				>
 					<ActionIcon
-						icon={isMobile.current ? X : PanelLeftClose}
+						icon={deviceStore.isMobile ? X : PanelLeftClose}
 						size="lg"
 						iconSize="h-4.5 w-4.5 md:h-4 md:w-4"
 						class="backdrop-blur-none md:h-9 md:w-9 h-10 w-10 rounded-full mr-1 hover:bg-accent!"
@@ -375,9 +375,9 @@
 		</div>
 
 		<div
-			class="mt-2 flex min-h-0 flex-1 flex-col gap-4 md:gap-1 {isMobile.current
+			class="mt-2 flex min-h-0 flex-1 flex-col gap-4 md:gap-1 {deviceStore.isMobile
 				? 'transition-[opacity,height] duration-200 ease-out'
-				: ''} {isMobile.current && !isExpandedMode ? 'opacity-0 !h-0' : ''}"
+				: ''} {deviceStore.isMobile && !isExpandedMode ? 'opacity-0 !h-0' : ''}"
 			in:fade={{ duration: 200 }}
 			out:fade={{ duration: 200 }}
 		>
@@ -395,7 +395,7 @@
 					isSearchModeActive = true;
 				}}
 				onNewChat={() => {
-					if (isMobile.current) {
+					if (deviceStore.isMobile) {
 						scheduleMobileCollapse();
 					}
 				}}
diff --git a/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigationActions.svelte b/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigationActions.svelte
index 29880f0dd..dc333134b 100644
--- a/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigationActions.svelte
+++ b/tools/ui/src/lib/components/app/navigation/SidebarNavigation/SidebarNavigationActions.svelte
@@ -12,7 +12,7 @@
 		SIDEBAR_ACTIONS_ITEMS
 	} from '$lib/constants';
 	import { TooltipSide } from '$lib/enums';
-	import { isMobile } from '$lib/stores';
+	import { deviceStore } from '$lib/stores';
 	import type { Component } from 'svelte';
 	import { onMount } from 'svelte';
 	import { circIn } from 'svelte/easing';
@@ -42,7 +42,7 @@
 	let showIcons = $state(false);
 	let searchInputRef = $state<HTMLInputElement | null>(null);
 
-	const isOnMobile = $derived(isMobile.current);
+	const isOnMobile = $derived(deviceStore.isMobile);
 
 	$effect(() => {
 		if (isSearchModeActive && searchInputRef) {
@@ -107,7 +107,7 @@
 	>
 		{#each SIDEBAR_ACTIONS_ITEMS as item, i (item.tooltip)}
 			{@const isActive = isItemActive(item)}
-			{@const isSearchOnMobile = item.icon === Search && isMobile.current}
+			{@const isSearchOnMobile = item.icon === Search && deviceStore.isMobile}
 			{@const itemHref = isSearchOnMobile ? ROUTES.SEARCH : item.route}
 			{@const itemOnClick = item.route
 				? () => {
@@ -156,7 +156,7 @@
 	<div class="{className} flex-col gap-1 hidden md:flex">
 		{#each SIDEBAR_ACTIONS_ITEMS as item, i (item.tooltip)}
 			{@const isActive = isItemActive(item)}
-			{@const isSearchOnMobile = item.icon === Search && isMobile.current}
+			{@const isSearchOnMobile = item.icon === Search && deviceStore.isMobile}
 			{@const itemOnClick = item.route
 				? () => {
 						onNewChat?.();
diff --git a/tools/ui/src/lib/hooks/use-pwa.svelte.ts b/tools/ui/src/lib/hooks/use-pwa.svelte.ts
index 47359afd9..8d2ca2b0b 100644
--- a/tools/ui/src/lib/hooks/use-pwa.svelte.ts
+++ b/tools/ui/src/lib/hooks/use-pwa.svelte.ts
@@ -58,7 +58,7 @@ export function usePwa() {
 		// PWA pages update via the service worker path; the storage check is the non-PWA fallback only
 		if (navigator.serviceWorker?.controller) return;
 
-		const currentVersion = versionStore.value;
+		const currentVersion = versionStore.frontend;
 
 		if (!currentVersion) return;
 
diff --git a/tools/ui/src/lib/stores/build-info.svelte.ts b/tools/ui/src/lib/stores/build-info.svelte.ts
deleted file mode 100644
index d80de730d..000000000
--- a/tools/ui/src/lib/stores/build-info.svelte.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-/**
- * buildInfoStore - llama.cpp build information
- *
- * Reads the build version from `build.json` — embedded at llama.cpp build time
- * with the llama.cpp build number (LLAMA_BUILD_NUMBER). Shown in the UI when
- * `showBuildVersion` is enabled.
- *
- * In dev mode (via `npm run dev`), falls back to `import.meta.env.DEV`'s truthy
- * value since the artifact is not produced.
- */
-
-import { browser } from '$app/environment';
-import { base } from '$app/paths';
-
-let build = $state<string>('');
-
-async function loadBuild() {
-	if (!browser) return;
-
-	if (import.meta.env.DEV) {
-		build = 'dev';
-
-		return;
-	}
-
-	try {
-		const res = await fetch(`${base}/build.json`, { cache: 'no-store' });
-
-		if (res.ok) {
-			const data = await res.json();
-
-			build = data.version ?? '';
-		}
-	} catch {
-		// build.json missing or unreachable - leave as empty string
-	}
-}
-
-loadBuild();
-
-export const buildInfoStore = {
-	get value(): string {
-		return build;
-	}
-};
diff --git a/tools/ui/src/lib/stores/chat.svelte.ts b/tools/ui/src/lib/stores/chat.svelte.ts
index 7234d0027..0b9649be9 100644
--- a/tools/ui/src/lib/stores/chat.svelte.ts
+++ b/tools/ui/src/lib/stores/chat.svelte.ts
@@ -109,9 +109,6 @@ class ChatStore {
 	private isEditModeActive = $state(false);
 	private addFilesHandler: ((files: File[]) => void) | null = $state(null);
 	pendingEditMessageId = $state<string | null>(null);
-	private messageUpdateCallback:
-		| ((messageId: string, updates: Partial<DatabaseMessage>) => void)
-		| null = null;
 	private _pendingDraftMessage = $state<string>('');
 	private _pendingDraftFiles = $state<ChatUploadedFile[]>([]);
 
diff --git a/tools/ui/src/lib/stores/conversations.svelte.ts b/tools/ui/src/lib/stores/conversations.svelte.ts
index 2d0d0eb1d..f67c52b6b 100644
--- a/tools/ui/src/lib/stores/conversations.svelte.ts
+++ b/tools/ui/src/lib/stores/conversations.svelte.ts
@@ -100,14 +100,6 @@ class ConversationsStore {
 		localStorage.setItem(REASONING_EFFORT_DEFAULT_LOCALSTORAGE_KEY, this.pendingReasoningEffort);
 	}
 
-	/**
-	 * Callback for updating message content in chatStore.
-	 * Registered by chatStore to enable cross-store updates without circular dependency.
-	 */
-	private messageUpdateCallback:
-		| ((messageId: string, updates: Partial<DatabaseMessage>) => void)
-		| null = null;
-
 	/** In-flight init run; shared by concurrent callers, reset on failure to allow retry */
 	private initPromise: Promise<void> | null = null;
 
@@ -143,23 +135,6 @@ class ConversationsStore {
 		return this.initPromise;
 	}
 
-	/**
-	 * Alias for init() for backward compatibility.
-	 */
-	async initialize(): Promise<void> {
-		return this.init();
-	}
-
-	/**
-	 * Register a callback for message updates from other stores.
-	 * Called by chatStore during initialization.
-	 */
-	registerMessageUpdateCallback(
-		callback: (messageId: string, updates: Partial<DatabaseMessage>) => void
-	): void {
-		this.messageUpdateCallback = callback;
-	}
-
 	/**
 	 *
 	 *
diff --git a/tools/ui/src/lib/stores/device.svelte.ts b/tools/ui/src/lib/stores/device.svelte.ts
index fef4865a9..08ce2f205 100644
--- a/tools/ui/src/lib/stores/device.svelte.ts
+++ b/tools/ui/src/lib/stores/device.svelte.ts
@@ -1,5 +1,17 @@
+/**
+ * deviceStore - Browser environment signals
+ *
+ * Device capabilities, OS theme and viewport in one class store:
+ * deviceStore.isMobile, deviceStore.isIOSDevice / isIOSSafari / isWKWebView /
+ * isStandalone, deviceStore.systemTheme.isDark.
+ *
+ * UA-derived flags are static for the session; isStandalone and systemTheme
+ * track live media query changes.
+ */
+
 import { browser } from '$app/environment';
-import { MEDIA_QUERIES } from '$lib/constants';
+import { DEFAULT_MOBILE_BREAKPOINT, MEDIA_QUERIES } from '$lib/constants';
+import { MediaQuery } from 'svelte/reactivity';
 
 /**
  * iOS UA token detection.
@@ -17,53 +29,60 @@ const UA_PATTERNS = {
 	WEBVIEW_IOS: /CriOS|FxiOS|EdgiOS|GSA/
 } as const;
 
-interface DeviceContext {
+class DeviceStore {
 	/** Any iOS/iPadOS device, regardless of which app or browser embeds the page. */
-	isIOSDevice: boolean;
+	readonly isIOSDevice: boolean = false;
 	/** The Safari browser app on iOS, excluding other iOS browsers and WKWebViews. */
-	isIOSSafari: boolean;
+	readonly isIOSSafari: boolean = false;
 	/** Any WKWebView context on iOS: in-app browsers, embedded web views, and the
 	 *  third-party iOS browsers (all of which share the WKWebView engine). */
-	isWKWebView: boolean;
+	readonly isWKWebView: boolean = false;
 	/** PWA standalone mode: the page was launched from the home screen icon. */
-	isStandalone: boolean;
+	isStandalone = $state(false);
+	/** OS color scheme preference; the user override lives in settingsStore. */
+	readonly systemTheme = $state({ isDark: false });
+
+	private mobile = new MediaQuery(`max-width: ${DEFAULT_MOBILE_BREAKPOINT - 1}px`);
+
+	get isMobile(): boolean {
+		return this.mobile.current;
+	}
+
+	constructor() {
+		if (!browser) return;
+
+		const ua = navigator.userAgent;
+		const isTouch = navigator.maxTouchPoints > 0;
+
+		this.isIOSDevice =
+			UA_PATTERNS.IOS_PHONE.test(ua) || (UA_PATTERNS.MACINTOSH.test(ua) && isTouch);
+		// Safari keeps 'Safari/' in the UA; non-Safari iOS browsers emit their own
+		// token instead. WKWebView typically omits 'Safari/' entirely.
+		const hasSafariToken = UA_PATTERNS.SAFARI.test(ua) && !UA_PATTERNS.WEBVIEW_IOS.test(ua);
+
+		this.isIOSSafari = this.isIOSDevice && hasSafariToken;
+		this.isWKWebView = this.isIOSDevice && !hasSafariToken;
+		// navigator.standalone is the legacy iOS-only flag (deprecated but still
+		// present); display-mode: standalone is the modern standard (Safari 16.4+).
+		this.isStandalone =
+			window.matchMedia(MEDIA_QUERIES.DISPLAY_MODE_STANDALONE).matches ||
+			(navigator as Navigator & { standalone?: boolean }).standalone === true;
+		this.systemTheme.isDark = window.matchMedia(MEDIA_QUERIES.PREFERS_DARK).matches;
+
+		// isStandalone and systemTheme can change at runtime (e.g. user installs the
+		// PWA while the tab is open); the UA-derived flags are static for the session
+		const standaloneMql = window.matchMedia(MEDIA_QUERIES.DISPLAY_MODE_STANDALONE);
+
+		standaloneMql.addEventListener('change', (e) => {
+			this.isStandalone = e.matches;
+		});
+
+		const darkMql = window.matchMedia(MEDIA_QUERIES.PREFERS_DARK);
+
+		darkMql.addEventListener('change', (e) => {
+			this.systemTheme.isDark = e.matches;
+		});
+	}
 }
 
-const SERVER_DEFAULT: DeviceContext = {
-	isIOSDevice: false,
-	isIOSSafari: false,
-	isStandalone: false,
-	isWKWebView: false
-};
-
-function detect(): DeviceContext {
-	if (!browser) return SERVER_DEFAULT;
-
-	const ua = navigator.userAgent;
-	const isTouch = navigator.maxTouchPoints > 0;
-	const isIOSDevice = UA_PATTERNS.IOS_PHONE.test(ua) || (UA_PATTERNS.MACINTOSH.test(ua) && isTouch);
-	// Safari keeps 'Safari/' in the UA; non-Safari iOS browsers emit their own
-	// token instead. WKWebView typically omits 'Safari/' entirely.
-	const hasSafariToken = UA_PATTERNS.SAFARI.test(ua) && !UA_PATTERNS.WEBVIEW_IOS.test(ua);
-	const isIOSSafari = isIOSDevice && hasSafariToken;
-	const isWKWebView = isIOSDevice && !hasSafariToken;
-	// navigator.standalone is the legacy iOS-only flag (deprecated but still
-	// present); display-mode: standalone is the modern standard (Safari 16.4+).
-	const isStandalone =
-		window.matchMedia(MEDIA_QUERIES.DISPLAY_MODE_STANDALONE).matches ||
-		(navigator as Navigator & { standalone?: boolean }).standalone === true;
-
-	return { isIOSDevice, isIOSSafari, isStandalone, isWKWebView };
-}
-
-export const device = $state<DeviceContext>(detect());
-
-if (browser) {
-	// isStandalone can change at runtime (e.g. user installs the PWA while the
-	// tab is open); the UA-derived flags are static for the session.
-	const mql = window.matchMedia(MEDIA_QUERIES.DISPLAY_MODE_STANDALONE);
-
-	mql.addEventListener('change', (e) => {
-		device.isStandalone = e.matches;
-	});
-}
+export const deviceStore = new DeviceStore();
diff --git a/tools/ui/src/lib/stores/index.ts b/tools/ui/src/lib/stores/index.ts
index 8b906c9e3..1aea8a6da 100644
--- a/tools/ui/src/lib/stores/index.ts
+++ b/tools/ui/src/lib/stores/index.ts
@@ -53,26 +53,6 @@ export { permissionsStore } from './permissions.svelte';
 export { toolsStore } from './tools.svelte';
 
 // ENVIRONMENT / META
-export { buildInfoStore } from './build-info.svelte';
-
 export { versionStore } from './version.svelte';
 
-export { device } from './device.svelte';
-
-export { viewport, isMobile } from './viewport.svelte';
-
-export { theme } from './theme.svelte';
-
-export {
-	gaugePopup,
-	gaugePopupClose,
-	gaugeTriggerPointerDown,
-	gaugeTriggerClick,
-	gaugeTriggerKeydown,
-	gaugeTriggerEnter,
-	gaugeTriggerLeave,
-	gaugeCardEnter,
-	gaugeCardLeave
-} from './context-gauge-popup.svelte';
-
-export { persisted } from './persisted.svelte';
+export { deviceStore } from './device.svelte';
diff --git a/tools/ui/src/lib/stores/persisted.svelte.ts b/tools/ui/src/lib/stores/persisted.svelte.ts
deleted file mode 100644
index 683ab2365..000000000
--- a/tools/ui/src/lib/stores/persisted.svelte.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-import { browser } from '$app/environment';
-
-type PersistedValue<T> = {
-	get value(): T;
-	set value(newValue: T);
-};
-
-export function persisted<T>(key: string, initialValue: T): PersistedValue<T> {
-	let value = initialValue;
-
-	if (browser) {
-		try {
-			const stored = localStorage.getItem(key);
-
-			if (stored !== null) {
-				value = JSON.parse(stored) as T;
-			}
-		} catch (error) {
-			console.warn(`Failed to load ${key}:`, error);
-		}
-	}
-
-	const persist = (next: T) => {
-		if (!browser) {
-			return;
-		}
-
-		try {
-			if (next === null || next === undefined) {
-				localStorage.removeItem(key);
-
-				return;
-			}
-
-			localStorage.setItem(key, JSON.stringify(next));
-		} catch (error) {
-			console.warn(`Failed to persist ${key}:`, error);
-		}
-	};
-
-	return {
-		get value() {
-			return value;
-		},
-
-		set value(newValue: T) {
-			value = newValue;
-			persist(newValue);
-		}
-	};
-}
diff --git a/tools/ui/src/lib/stores/settings.svelte.ts b/tools/ui/src/lib/stores/settings.svelte.ts
index 89c9f22cb..2c1f279cc 100644
--- a/tools/ui/src/lib/stores/settings.svelte.ts
+++ b/tools/ui/src/lib/stores/settings.svelte.ts
@@ -40,9 +40,9 @@ import {
 } from '$lib/constants';
 import { ColorMode } from '$lib/enums';
 import { ParameterSyncService } from '$lib/services/parameter-sync.service';
+import { deviceStore } from '$lib/stores/device.svelte';
 // direct imports between stores, not via the barrel, to avoid circular deps
 import { serverStore } from '$lib/stores/server.svelte';
-import { isMobile } from '$lib/stores/viewport.svelte';
 import type { SettingsExportType } from '$lib/types';
 import {
 	configToParameterRecord,
@@ -138,7 +138,7 @@ class SettingsStore {
 
 			// Default sendOnEnter to false on mobile when the user has no saved preference
 			if (!(SETTINGS_KEYS.SEND_ON_ENTER in savedVal)) {
-				if (isMobile.current) {
+				if (deviceStore.isMobile) {
 					this.config[SETTINGS_KEYS.SEND_ON_ENTER] = false;
 				}
 			}
diff --git a/tools/ui/src/lib/stores/theme.svelte.ts b/tools/ui/src/lib/stores/theme.svelte.ts
deleted file mode 100644
index 999e37624..000000000
--- a/tools/ui/src/lib/stores/theme.svelte.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { browser } from '$app/environment';
-import { MEDIA_QUERIES } from '$lib/constants';
-
-export const theme = $state({
-	isSystemDark: browser && window.matchMedia(MEDIA_QUERIES.PREFERS_DARK).matches
-});
-
-if (browser) {
-	const mql = window.matchMedia(MEDIA_QUERIES.PREFERS_DARK);
-
-	mql.addEventListener('change', (e) => {
-		theme.isSystemDark = e.matches;
-	});
-}
diff --git a/tools/ui/src/lib/stores/version.svelte.ts b/tools/ui/src/lib/stores/version.svelte.ts
index 64a210673..4048d7385 100644
--- a/tools/ui/src/lib/stores/version.svelte.ts
+++ b/tools/ui/src/lib/stores/version.svelte.ts
@@ -1,44 +1,61 @@
 /**
- * versionStore - Frontend build version
+ * versionStore - Build version information
  *
- * Reads from SvelteKit's `_app/version.json` — generated by the @vite-pwa/sveltekit
- * plugin. The version string changes on every build, so comparing it against
- * localStorage reliably detects server upgrades.
+ * - `build`: llama.cpp build number from `build.json`, embedded at llama.cpp
+ *   build time (LLAMA_BUILD_NUMBER). Shown in the UI when `showBuildVersion`
+ *   is enabled.
+ * - `frontend`: frontend build version from SvelteKit's `_app/version.json`,
+ *   generated by the @vite-pwa/sveltekit plugin. Changes on every build, so
+ *   comparing it against localStorage reliably detects server upgrades.
  *
- * In dev mode, falls back to `'dev'`.
+ * In dev mode both fall back to `'dev'`.
  */
 
 import { browser } from '$app/environment';
 import { base } from '$app/paths';
 
-let version = $state<string>('');
+class VersionStore {
+	build = $state<string>('');
+	frontend = $state<string>('');
 
-async function loadVersion() {
-	if (!browser) return;
+	constructor() {
+		if (!browser) return;
 
-	if (import.meta.env.DEV) {
-		version = 'dev';
+		if (import.meta.env.DEV) {
+			this.build = 'dev';
+			this.frontend = 'dev';
 
-		return;
+			return;
+		}
+
+		void this.load();
 	}
 
-	try {
-		const res = await fetch(`${base}/_app/version.json`, { cache: 'no-store' });
+	private async load(): Promise<void> {
+		try {
+			const res = await fetch(`${base}/build.json`, { cache: 'no-store' });
 
-		if (res.ok) {
-			const data = await res.json();
+			if (res.ok) {
+				const data = await res.json();
 
-			version = data.version ?? '';
+				this.build = data.version ?? '';
+			}
+		} catch {
+			// build.json missing or unreachable - leave as empty string
+		}
+
+		try {
+			const res = await fetch(`${base}/_app/version.json`, { cache: 'no-store' });
+
+			if (res.ok) {
+				const data = await res.json();
+
+				this.frontend = data.version ?? '';
+			}
+		} catch {
+			// version.json missing or unreachable - leave as empty string
 		}
-	} catch {
-		// _app/version.json missing or unreachable - leave as empty string
 	}
 }
 
-loadVersion();
-
-export const versionStore = {
-	get value(): string {
-		return version;
-	}
-};
+export const versionStore = new VersionStore();
diff --git a/tools/ui/src/lib/stores/viewport.svelte.ts b/tools/ui/src/lib/stores/viewport.svelte.ts
deleted file mode 100644
index fee8db4ac..000000000
--- a/tools/ui/src/lib/stores/viewport.svelte.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { browser } from '$app/environment';
-import { DEFAULT_MOBILE_BREAKPOINT } from '$lib/constants';
-import { MediaQuery } from 'svelte/reactivity';
-
-export const viewport = $state({
-	width: browser ? window.innerWidth : 0
-});
-
-export const isMobile = new MediaQuery(`max-width: ${DEFAULT_MOBILE_BREAKPOINT - 1}px`);
diff --git a/tools/ui/src/routes/(chat)/+page.svelte b/tools/ui/src/routes/(chat)/+page.svelte
index c4958b7c1..224d264c4 100644
--- a/tools/ui/src/routes/(chat)/+page.svelte
+++ b/tools/ui/src/routes/(chat)/+page.svelte
@@ -77,7 +77,7 @@
 
 	onMount(async () => {
 		if (!conversationsStore.isInitialized) {
-			await conversationsStore.initialize();
+			await conversationsStore.init();
 		}
 
 		conversationsStore.clearActiveConversation();
diff --git a/tools/ui/src/routes/+layout.svelte b/tools/ui/src/routes/+layout.svelte
index f938c7edf..89bd57a09 100644
--- a/tools/ui/src/routes/+layout.svelte
+++ b/tools/ui/src/routes/+layout.svelte
@@ -19,15 +19,14 @@
 	import { usePwa } from '$lib/hooks/use-pwa.svelte';
 	import { RouterService } from '$lib/services/router.service';
 	import {
-		buildInfoStore,
 		chatStore,
 		conversationsStore,
-		isMobile,
+		deviceStore,
 		mcpStore,
 		modelsStore,
 		serverStore,
 		settingsStore,
-		theme
+		versionStore
 	} from '$lib/stores';
 	import { ModeWatcher } from 'mode-watcher';
 	import { untrack } from 'svelte';
@@ -55,7 +54,7 @@
 	const { needRefresh, updateServiceWorker } = pwa;
 
 	function updateFavicon() {
-		const dark = theme.isSystemDark;
+		const dark = deviceStore.systemTheme.isDark;
 
 		let icoLink = document.querySelector(FAVICON_SELECTORS.ICO_48X48) as HTMLLinkElement | null;
 
@@ -153,7 +152,7 @@
 	}
 
 	$effect(() => {
-		void theme.isSystemDark;
+		void deviceStore.systemTheme.isDark;
 
 		updateFavicon();
 	});
@@ -274,7 +273,7 @@
 	<div class="flex flex-col md:flex-row">
 		<SidebarNavigation
 			onSearchClick={() => {
-				if (isMobile.current) {
+				if (deviceStore.isMobile) {
 					goto(ROUTES.SEARCH);
 				} else if (chatSidebar?.activateSearchMode) {
 					chatSidebar.activateSearchMode();
@@ -294,8 +293,8 @@
 
 <!-- PWA update prompt + version -->
 <div class="fixed right-4 bottom-4 z-9999 flex flex-col items-end gap-1">
-	{#if showBuildVersion && buildInfoStore.value}
-		<span class="text-[10px] tabular-nums text-muted-foreground">{buildInfoStore.value}</span>
+	{#if showBuildVersion && versionStore.build}
+		<span class="text-[10px] tabular-nums text-muted-foreground">{versionStore.build}</span>
 	{/if}
 
 	<PwaRefreshAlert
diff --git a/tools/ui/src/routes/search/+page.svelte b/tools/ui/src/routes/search/+page.svelte
index cb7f77f95..a882e5552 100644
--- a/tools/ui/src/routes/search/+page.svelte
+++ b/tools/ui/src/routes/search/+page.svelte
@@ -5,7 +5,7 @@
 	import { SearchInput, SidebarNavigationSearchResults } from '$lib/components/app';
 	import { ROUTES } from '$lib/constants';
 	import { RouterService } from '$lib/services/router.service';
-	import { chatStore, conversationsStore, isMobile } from '$lib/stores';
+	import { chatStore, conversationsStore, deviceStore } from '$lib/stores';
 
 	let searchQuery = $state('');
 	let searchInputRef = $state<HTMLInputElement | null>(null);
@@ -23,7 +23,7 @@
 	// Search page is intended for mobile; on desktop the sidebar already exposes
 	// in-place search, so bounce back to a chat.
 	$effect(() => {
-		if (browser && !isMobile.current) {
+		if (browser && !deviceStore.isMobile) {
 			goto(ROUTES.NEW_CHAT, { replaceState: true });
 		}
 	});