diff --git a/public/index.html b/public/index.html
index 58820ca2..842403f5 100644
--- a/public/index.html
+++ b/public/index.html
@@ -85,7 +85,7 @@
   <script src="hop-resolver.js?v=1774217881"></script>
   <script src="app.js?v=1774126708"></script>
   <script src="home.js?v=1774042199"></script>
-  <script src="packets.js?v=1774219295"></script>
+  <script src="packets.js?v=1774219358"></script>
   <script src="map.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="channels.js?v=1774331200" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="nodes.js?v=1774218049" onerror="console.error('Failed to load:', this.src)"></script>
diff --git a/public/packets.js b/public/packets.js
index bc0f4f29..46ab4231 100644
--- a/public/packets.js
+++ b/public/packets.js
@@ -1655,6 +1655,7 @@
       const param = routeParam;
       app.innerHTML = `<div style="max-width:800px;margin:0 auto;padding:20px"><div class="text-center text-muted" style="padding:40px">Loading packet…</div></div>`;
       try {
+        await loadObservers();
         const data = await api(`/packets/${param}`);
         if (!data?.packet) { app.innerHTML = `<div style="max-width:800px;margin:0 auto;padding:40px;text-align:center"><h2>Packet not found</h2><p>Packet ${param} doesn't exist.</p><a href="#/packets">← Back to packets</a></div>`; return; }
         const hops = [];