From 1c7af47f7a9cf6dbef85d4d96afea7e8719fcc84 Mon Sep 17 00:00:00 2001
From: you <you@example.com>
Date: Sun, 22 Mar 2026 08:17:18 +0000
Subject: [PATCH] =?UTF-8?q?Rain:=20vary=20hop=20count=20per=20observation?=
 =?UTF-8?q?=20column=20(=C2=B11=20hop)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Each observer sees a different path length in reality. Extra
rain columns now randomly vary ±1 hop from the base, giving
different fall distances for visual variety.
---
 public/index.html |  2 +-
 public/live.js    | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/public/index.html b/public/index.html
index 1198ee85..18ba9735 100644
--- a/public/index.html
+++ b/public/index.html
@@ -90,7 +90,7 @@
   <script src="nodes.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="traces.js?v=1774135052" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="analytics.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
-  <script src="live.js?v=1774167315" onerror="console.error('Failed to load:', this.src)"></script>
+  <script src="live.js?v=1774167438" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="observers.js?v=1774290000" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="observer-detail.js?v=1774028201" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="node-analytics.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
diff --git a/public/live.js b/public/live.js
index 865843f8..079ab912 100644
--- a/public/live.js
+++ b/public/live.js
@@ -1396,10 +1396,12 @@
     playSound(typeName);
     addFeedItem(icon, typeName, payload, hops, color, pkt);
     addRainDrop(pkt);
-    // Spawn extra rain columns for multiple observations
+    // Spawn extra rain columns for multiple observations with varied hop counts
     const obsCount = pkt.observation_count || (pkt.packet && pkt.packet.observation_count) || 1;
+    const baseHops = (pkt.decoded?.path?.hops || []).length || 1;
     for (let i = 1; i < obsCount; i++) {
-      setTimeout(() => addRainDrop(pkt), i * 150); // stagger slightly
+      const variedHops = Math.max(1, baseHops + Math.floor(Math.random() * 3) - 1); // ±1 hop
+      setTimeout(() => addRainDrop(pkt, variedHops), i * 150);
     }
 
     // Favorites filter: skip animation if packet doesn't involve a favorited node
@@ -1802,13 +1804,13 @@
     rainDrops = [];
   }
 
-  function addRainDrop(pkt) {
+  function addRainDrop(pkt, hopOverride) {
     if (!rainCanvas || !matrixRain) return;
     const rawHex = pkt.raw || pkt.raw_hex || (pkt.packet && pkt.packet.raw_hex) || '';
     if (!rawHex) return;
     const decoded = pkt.decoded || {};
     const hops = decoded.path?.hops || [];
-    const hopCount = Math.max(1, hops.length);
+    const hopCount = hopOverride || Math.max(1, hops.length);
     const bytes = [];
     for (let i = 0; i < rawHex.length; i += 2) {
       bytes.push(rawHex.slice(i, i + 2).toUpperCase());