diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index bd0b566..6c57c73 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -45,6 +45,12 @@ const pollingFallback = ref(false)
 // the socket never opens at all, and present it as a normal live state.
 const usePolling = computed(() => pollingFallback.value || socketFailures.value >= 3)
 
+// Build versions shown in the footer. The client value is baked in at build
+// time; the server value comes from /api/version. A mismatch means the browser
+// is running a stale cached bundle.
+const clientVersion = __BUILD_VERSION__
+const serverVersion = ref('')
+
 let socket
 let pollTimer
 let statusTimer
@@ -139,6 +145,7 @@ function handleMessage(message) {
 async function ensureFreshBuild() {
   try {
     const { version } = await api.getVersion()
+    serverVersion.value = version || ''
     if (!version || version === 'unknown') return
     if (version === __BUILD_VERSION__) return
     const key = `reloaded:${version}`
@@ -255,5 +262,21 @@ onUnmounted(() => {
 
     <PositionsTable :positions="positions" @close="handleClose" />
     <OrdersTable :orders="orders" />
+
+    <footer class="flex flex-wrap items-center gap-x-4 gap-y-1 border-t border-edge/60 pt-3 text-xs text-slate-500">
+      <span>client <span class="font-mono text-slate-400">{{ clientVersion }}</span></span>
+      <span>
+        server
+        <span class="font-mono text-slate-400">{{ serverVersion || '…' }}</span>
+      </span>
+      <span
+        v-if="serverVersion && serverVersion !== clientVersion"
+        class="text-amber-300"
+      >
+        version mismatch — reloading to update
+      </span>
+      <span v-else-if="serverVersion" class="text-emerald-400">up to date</span>
+      <span v-if="socketError" class="text-amber-300">socket: {{ socketError }}</span>
+    </footer>
   </div>
 </template>