From 6ae5e40cc7f958d74a99c9e32e60ec7c523799c1 Mon Sep 17 00:00:00 2001
From: "Claude (Opus 4.6)" <claude@hermes.local>
Date: Wed, 25 Mar 2026 03:06:48 +0000
Subject: [PATCH] [claude] Re-implement Bitcoin block height counter (#480)
 (#495)

---
 app.js     | 32 ++++++++++++++++++++++++++++++++
 index.html |  6 ++++++
 style.css  | 36 ++++++++++++++++++++++++++++++++++++
 3 files changed, 74 insertions(+)

diff --git a/app.js b/app.js
index fe1f29a..057b668 100644
--- a/app.js
+++ b/app.js
@@ -1695,4 +1695,36 @@ function triggerHarnessPulse() {
   }
 }
 
+// === BITCOIN BLOCK HEIGHT ===
+(function initBitcoin() {
+  const blockHeightDisplay = document.getElementById('block-height-display');
+  const blockHeightValue = document.getElementById('block-height-value');
+  if (!blockHeightDisplay || !blockHeightValue) return;
+
+  let lastKnownBlockHeight = null;
+
+  async function fetchBlockHeight() {
+    try {
+      const res = await fetch('https://blockstream.info/api/blocks/tip/height');
+      if (!res.ok) return;
+      const height = parseInt(await res.text(), 10);
+      if (isNaN(height)) return;
+
+      if (lastKnownBlockHeight !== null && height !== lastKnownBlockHeight) {
+        blockHeightDisplay.classList.remove('fresh');
+        void blockHeightDisplay.offsetWidth;
+        blockHeightDisplay.classList.add('fresh');
+      }
+
+      lastKnownBlockHeight = height;
+      blockHeightValue.textContent = height.toLocaleString();
+    } catch (_) {
+      // Network unavailable
+    }
+  }
+
+  fetchBlockHeight();
+  setInterval(fetchBlockHeight, 60000);
+})();
+
 init();
diff --git a/index.html b/index.html
index 8031a64..baef6e1 100644
--- a/index.html
+++ b/index.html
@@ -155,6 +155,12 @@
   </div>
 </div>
 
+<!-- Bitcoin Block Height -->
+<div id="block-height-display">
+  <span class="block-height-label">⛏ BLOCK</span>
+  <span id="block-height-value">—</span>
+</div>
+
 <!-- Click to Enter -->
 <div id="enter-prompt" style="display:none;">
   <div class="enter-content">
diff --git a/style.css b/style.css
index 407b5c8..2586f7e 100644
--- a/style.css
+++ b/style.css
@@ -625,6 +625,42 @@ canvas#nexus-canvas {
   color: var(--color-primary);
 }
 
+/* === BITCOIN BLOCK HEIGHT === */
+#block-height-display {
+  position: fixed;
+  bottom: 12px;
+  right: 12px;
+  z-index: 20;
+  font-family: var(--font-body);
+  font-size: 11px;
+  letter-spacing: 0.15em;
+  color: var(--color-primary);
+  background: rgba(0, 0, 8, 0.7);
+  border: 1px solid var(--color-secondary);
+  padding: 4px 10px;
+  pointer-events: none;
+  white-space: nowrap;
+}
+
+.block-height-label {
+  color: var(--color-text-muted);
+  margin-right: 6px;
+  font-size: 10px;
+}
+
+#block-height-value {
+  color: var(--color-primary);
+}
+
+#block-height-display.fresh #block-height-value {
+  animation: block-flash 0.6s ease-out;
+}
+
+@keyframes block-flash {
+  0%   { color: #ffffff; text-shadow: 0 0 8px #4488ff; }
+  100% { color: var(--color-primary); text-shadow: none; }
+}
+
 /* Mobile adjustments */
 @media (max-width: 480px) {
   .chat-panel {