feat: add live demo

tabs/demo.html

@@ -1,16 +1,33 @@
-<div class="summary">
-  <h2>🚀 NTv3 Live Demo</h2>
-  <p>Try out the NTv3 model interactively in this live demo. Predict functional tracks and genome annotation directly in your browser.</p>
-</div>
-
-<div style="margin-top: 18px; width: 100%; height: 800px; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden;">
-  <iframe 
-    src="https://huggingface.co/spaces/InstaDeepAI/ntv3_tracks" 
-    width="100%" 
-    height="100%" 
-    frameborder="0"
-    style="display: block; border: none;"
-    title="NTv3 Tracks Live Demo">
-  </iframe>
+<div class="grid">
+  <div class="card" style="grid-column: span 12; text-align: center; padding: 60px 40px;">
+    <h2 style="margin-bottom: 20px;">🚀 NTv3 Live Demo</h2>
+    <p style="margin-bottom: 30px; color: var(--muted); line-height: 1.7;">
+      Try out the NTv3 model interactively in this live demo. Predict functional tracks and genome annotation directly in your browser. Click the button below to open the interactive demo in a new window.
+    </p>
+    <a 
+      href="https://huggingface.co/spaces/InstaDeepAI/ntv3_tracks" 
+      target="_blank" 
+      rel="noopener"
+      style="
+        display: inline-block;
+        padding: 16px 32px;
+        background: var(--link);
+        color: white;
+        text-decoration: none;
+        border-radius: 12px;
+        font-weight: 600;
+        font-size: 16px;
+        transition: all 0.2s ease;
+        box-shadow: 0 4px 12px rgba(125, 211, 252, 0.3);
+      "
+      onmouseover="this.style.background='#60b8e8'; this.style.transform='translateY(-2px)'; this.style.boxShadow='0 6px 16px rgba(125, 211, 252, 0.4)';"
+      onmouseout="this.style.background='var(--link)'; this.style.transform='translateY(0)'; this.style.boxShadow='0 4px 12px rgba(125, 211, 252, 0.3)';"
+    >
+      🚀 Open Live Demo →
+    </a>
+    <p style="margin-top: 30px; font-size: 13px; color: var(--muted);">
+      The demo will open in a new tab. Make sure pop-ups are enabled for this site.
+    </p>
+  </div>
 </div>