You know how it is

static/footnote.js

@@ -0,0 +1,48 @@
+document.addEventListener('DOMContentLoaded', function() {
+  console.log("🦶🦶🦶🦶🦶 FOOTNOTES LOADED 🦶🦶🦶🦶🦶🦶")
+
+  const footnoteRefs = document.querySelectorAll('.footref')
+
+  footnoteRefs.forEach(ref => {
+    const footnoteId = ref.href.split('#')[1]
+    ref.setAttribute('data-footnote-id', footnoteId)
+    ref.href = 'javascript:void(0)';
+
+    ref.addEventListener('mouseenter', function() {
+      // Find footnote element
+      const footnoteId = this.getAttribute('data-footnote-id')
+
+      const footnoteElement = document.getElementById(footnoteId).parentElement.nextElementSibling.children[0]
+
+      if (footnoteElement) {
+        // Create tooltip container
+        const tooltip = document.createElement('div');
+        tooltip.className = 'footnote-tooltip'
+        tooltip.innerHTML = footnoteElement.innerHTML
+
+        // Position tooltip
+        const rect = this.getBoundingClientRect();
+        tooltip.style.position = 'absolute'
+        tooltip.style.top = (rect.bottom + window.scrollY + 5) + 'px'
+        tooltip.style.left = rect.left + 'px'
+
+        // Add to page
+        document.body.appendChild(tooltip)
+
+        // Store reference for cleanup
+        this._tooltip = tooltip
+      }
+    });
+
+    ref.addEventListener('mouseleave', function() {
+      // Remove tooltip
+      if (this._tooltip) {
+        this._tooltip.remove()
+        this._tooltip = null
+      }
+    });
+  });
+
+  // Hide footnotes section
+  document.querySelector("#footnotes").style.display='none'
+});