diff --git a/src/App.svelte b/src/App.svelte
index d24486b..d0e2447 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -1,62 +1,71 @@
 <script>
-	import MainMenu from '$lib/pages/main/MainMenu.svelte';
-	import PrintMenu from '$lib/pages/print/PrintMenu.svelte';
-	import ScanPage from '$lib/pages/scan/ScanPage.svelte';
+  import MainMenu from '$lib/pages/main/MainMenu.svelte';
+  import PrintMenu from '$lib/pages/print/PrintMenu.svelte';
+  import ScanPage from '$lib/pages/scan/ScanPage.svelte';
+  import UpdateBanner from '$lib/common/ui/UpdateBanner.svelte';
+  import { useUpdateCheck } from '$lib/common/hooks/useUpdateCheck.svelte.js';
 
-	/** @type {'main' | 'print' | 'scan'} */
-	let page = $state('main');
+  /** @type {'main' | 'print' | 'scan'} */
+  let page = $state('main');
 
-	/** @param {'print' | 'scan' | 'photo' | 'access'} id */
-	function handleAction(id) {
-		if (id === 'print') {
-			page = 'print';
-		} else if (id === 'scan') {
-			page = 'scan';
-		} else {
-			console.log('Выбрано действие:', id);
-		}
-	}
+  const { needRefresh, doUpdate } = useUpdateCheck();
 
-	function handleBack() {
-		page = 'main';
-	}
+  /** @param {'print' | 'scan' | 'photo' | 'access'} id */
+  function handleAction(id) {
+    if (id === 'print') {
+      page = 'print';
+    } else if (id === 'scan') {
+      page = 'scan';
+    } else {
+      console.log('Выбрано действие:', id);
+    }
+  }
+
+  function handleBack() {
+    page = 'main';
+  }
+
+  function handleDismiss() {
+    // Пользователь нажал "Позже", баннер скроется
+  }
 </script>
 
 <style>
-	:global(html),
-	:global(body) {
-		margin: 0;
-		padding: 0;
-		background: #0b0d11;
-	}
-
-	:global(body) {
-		display: block;
-		place-items: initial;
-		min-width: 0;
-		color: #f5f7fa;
-		font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
-		-webkit-font-smoothing: antialiased;
-	}
-
-	.app-wrapper {
-		display: flex;
-		justify-content: center;
-	}
-
-	@media (max-width: 480px) {
-		.app-wrapper {
-			justify-content: center;
-		}
-	}
+  :global(html),
+  :global(body) {
+    margin: 0;
+    padding: 0;
+    background: #0b0d11;
+  }
+  :global(body) {
+    display: block;
+    place-items: initial;
+    min-width: 0;
+    color: #f5f7fa;
+    font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
+    -webkit-font-smoothing: antialiased;
+  }
+  .app-wrapper {
+    display: flex;
+    justify-content: center;
+  }
+  @media (max-width: 480px) {
+    .app-wrapper {
+      justify-content: center;
+    }
+  }
 </style>
 
+{#if needRefresh}
+  <UpdateBanner onUpdate={doUpdate} onDismiss={handleDismiss} />
+{/if}
+
 <main class="app-wrapper">
-	{#if page === 'main'}
-		<MainMenu onAction={handleAction} />
-	{:else if page === 'print'}
-		<PrintMenu onBack={handleBack} />
-	{:else if page === 'scan'}
-		<ScanPage onBack={handleBack} />
-	{/if}
+  {#if page === 'main'}
+    <MainMenu onAction={handleAction} />
+  {:else if page === 'print'}
+    <PrintMenu onBack={handleBack} />
+  {:else if page === 'scan'}
+    <ScanPage onBack={handleBack} />
+  {/if}
 </main>
diff --git a/src/lib/common/hooks/useUpdateCheck.svelte.js b/src/lib/common/hooks/useUpdateCheck.svelte.js
new file mode 100644
index 0000000..9765ab0
--- /dev/null
+++ b/src/lib/common/hooks/useUpdateCheck.svelte.js
@@ -0,0 +1,55 @@
+// lib/common/hooks/useUpdateCheck.svelte.js
+let needRefresh = $state(false);
+let updateServiceWorker = () => {};
+
+try {
+  const { useRegisterSW } = await import('virtual:pwa-register/svelte');
+  
+  const sw = useRegisterSW({
+    onRegistered(registration) {
+      console.log('✅ Service Worker зарегистрирован:', registration);
+      
+      if (registration) {
+        setInterval(() => {
+          registration.update();
+        }, 30 * 60 * 1000);
+        
+        document.addEventListener('visibilitychange', () => {
+          if (document.visibilityState === 'visible') {
+            registration.update();
+          }
+        });
+      }
+    },
+    onRegisterError(error) {
+      console.error('❌ Ошибка регистрации SW:', error);
+    }
+  });
+
+  if (sw?.needRefresh) {
+    $effect(() => {
+      needRefresh = sw.needRefresh[0];
+    });
+    updateServiceWorker = sw.updateServiceWorker || (() => {});
+  }
+} catch (error) {
+  console.warn('⚠️ PWA update check не инициализирован (возможно, dev-режим):', error);
+  needRefresh = false;
+}
+
+async function doUpdate() {
+  try {
+    await updateServiceWorker(true);
+    window.location.reload();
+  } catch (error) {
+    console.error('Ошибка обновления:', error);
+    window.location.reload();
+  }
+}
+
+export function useUpdateCheck() {
+  return {
+    get needRefresh() { return needRefresh; },
+    doUpdate
+  };
+}
diff --git a/src/lib/common/ui/UpdateBanner.svelte b/src/lib/common/ui/UpdateBanner.svelte
new file mode 100644
index 0000000..a5e0e88
--- /dev/null
+++ b/src/lib/common/ui/UpdateBanner.svelte
@@ -0,0 +1,139 @@
+<!-- lib/common/ui/UpdateBanner.svelte -->
+<script>
+  let { onUpdate, onDismiss } = $props();
+  let dismissed = $state(false);
+
+  function handleUpdate() {
+    onUpdate?.();
+  }
+
+  function handleDismiss() {
+    dismissed = true;
+    onDismiss?.();
+  }
+</script>
+
+{#if !dismissed}
+  <div class="update-banner">
+    <div class="banner-content">
+      <div class="banner-icon">🔄</div>
+      <div class="banner-text">
+        <p class="banner-title">Доступна новая версия</p>
+        <p class="banner-description">Обновите приложение для получения новых функций</p>
+      </div>
+      <div class="banner-actions">
+        <button class="btn-dismiss" onclick={handleDismiss}>Позже</button>
+        <button class="btn-update" onclick={handleUpdate}>Обновить</button>
+      </div>
+    </div>
+  </div>
+{/if}
+
+<style>
+  .update-banner {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    z-index: 10000;
+    padding: 12px 16px;
+    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
+    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
+    animation: slide-down 0.3s ease-out;
+  }
+
+  @keyframes slide-down {
+    from {
+      transform: translateY(-100%);
+      opacity: 0;
+    }
+    to {
+      transform: translateY(0);
+      opacity: 1;
+    }
+  }
+
+  .banner-content {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    max-width: 1200px;
+    margin: 0 auto;
+  }
+
+  .banner-icon {
+    font-size: 24px;
+    flex-shrink: 0;
+  }
+
+  .banner-text {
+    flex: 1;
+    min-width: 0;
+  }
+
+  .banner-title {
+    margin: 0 0 4px;
+    font-size: 15px;
+    font-weight: 700;
+    color: #fff;
+  }
+
+  .banner-description {
+    margin: 0;
+    font-size: 13px;
+    color: rgba(255, 255, 255, 0.85);
+    line-height: 1.4;
+  }
+
+  .banner-actions {
+    display: flex;
+    gap: 8px;
+    flex-shrink: 0;
+  }
+
+  .btn-dismiss,
+  .btn-update {
+    padding: 8px 16px;
+    border-radius: 8px;
+    font-size: 14px;
+    font-weight: 600;
+    cursor: pointer;
+    border: none;
+    transition: all 0.2s;
+  }
+
+  .btn-dismiss {
+    background: rgba(255, 255, 255, 0.15);
+    color: #fff;
+  }
+
+  .btn-dismiss:hover {
+    background: rgba(255, 255, 255, 0.25);
+  }
+
+  .btn-update {
+    background: #fff;
+    color: #6366f1;
+  }
+
+  .btn-update:hover {
+    transform: translateY(-1px);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  }
+
+  @media (max-width: 640px) {
+    .banner-content {
+      flex-wrap: wrap;
+    }
+
+    .banner-text {
+      flex-basis: calc(100% - 48px);
+    }
+
+    .banner-actions {
+      width: 100%;
+      justify-content: flex-end;
+      margin-top: 8px;
+    }
+  }
+</style>
diff --git a/src/lib/pages/print/PrintUI.svelte b/src/lib/pages/print/PrintUI.svelte
index 4284a73..627eb12 100644
--- a/src/lib/pages/print/PrintUI.svelte
+++ b/src/lib/pages/print/PrintUI.svelte
@@ -1,4 +1,4 @@
-<!-- svelte-ignore a11y_click_1vents_have_key_events a11y_no_static_element_interactions a11y_label_has_associated_control slot_element_deprecated svelte_self_deprecated -->
+<!-- svelte-ignore a11y_click_events_have_key_events a11y_no_static_element_interactions a11y_label_has_associated_control slot_element_deprecated svelte_self_deprecated -->
 <!-- lib/pages/print/PrintUI.svelte -->
 <script>
   import { QUALITIES, COLOR_MODES } from '$lib/common/utils/pricing.util.js';
diff --git a/vite.config.js b/vite.config.js
index b6d5c13..e1c1482 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -19,9 +19,28 @@ export default defineConfig({
       }
     }),
     VitePWA({
-      registerType: 'autoUpdate',
+      registerType: 'prompt',
+      injectRegister: 'auto',
       workbox: {
-        globPatterns: ['**/*.{js,css,html,ico,png,svg,wasm}']
+        globPatterns: ['**/*.{js,css,html,ico,png,svg,wasm}'],
+        // Важно: не кэшируем API endpoint версии
+        navigateFallbackDenylist: [/^\/api\/version/],
+        runtimeCaching: [
+          {
+            urlPattern: /^https:\/\/fonts\.googleapis\.com\/.*/i,
+            handler: 'CacheFirst',
+            options: {
+              cacheName: 'google-fonts-cache',
+              expiration: {
+                maxEntries: 10,
+                maxAgeSeconds: 60 * 60 * 24 * 365 // 1 год
+              },
+              cacheableResponse: {
+                statuses: [0, 200]
+              }
+            }
+          }
+        ]
       },
       manifest: {
         name: 'UnitPrint',
@@ -29,12 +48,17 @@ export default defineConfig({
         start_url: '/',
         display: 'standalone',
         background_color: '#ffffff',
-        theme_color: '#ff3e00',
+        theme_color: '#6366f1',
         icons: [
           {
             src: '/icon-192x192.png',
             sizes: '192x192',
             type: 'image/png'
+          },
+          {
+            src: '/icon-512x512.png',
+            sizes: '512x512',
+            type: 'image/png'
           }
         ]
       }