From 03df35080d309a814937cec95ea660fcff698d3d Mon Sep 17 00:00:00 2001
From: igneum-josh <337424239+igneum-josh@users.noreply.github.com>
Date: Sat, 3 Oct 2026 17:06:32 +0100
Subject: [PATCH] Chain scene: denser on phones

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 site/index.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/site/index.html b/site/index.html
index 96ca82d19..5ff9bd0ae 100644
--- a/site/index.html
+++ b/site/index.html
@@ -98,7 +98,7 @@ section{padding-block:clamp(56px,8vw,96px)}
 .viz-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 20px;margin-bottom:12px}
 .viz-stats{display:flex;gap:18px;font-size:12px;color:var(--ash)}
 .viz-stats b{color:var(--bone);font-weight:500;font-variant-numeric:tabular-nums}
-#chain{display:block;width:100%;height:clamp(220px,36vw,340px);border-radius:12px;background:var(--obsidian)}
+#chain{display:block;width:100%;height:clamp(200px,36vw,340px);border-radius:12px;background:var(--obsidian)}
 .dag{padding:clamp(18px,3vw,32px);overflow:hidden}
 .dag-rows{display:flex;flex-direction:column;gap:var(--dg,14px);--bs:34px;--dg:14px}
 @media (max-width:640px){.dag-rows{--bs:26px;--dg:9px}}
@@ -474,7 +474,7 @@ footer .wrap{padding-block:48px 32px}
   (function(){
     var c=document.getElementById('chain'),x=c.getContext('2d'),W,H,blocks=[],sparks=[],ripples=[],n=0,proven=0,locked=0,lanes=5,S,GAP,speed;
     var cb=document.getElementById('c-blocks'),cp=document.getElementById('c-proven'),cl=document.getElementById('c-locked');
-    function size(){W=c.clientWidth;H=c.clientHeight;c.width=W*dpr;c.height=H*dpr;x.setTransform(dpr,0,0,dpr,0,0);S=W<600?18:26;GAP=S*3.1;speed=GAP/1000;}
+    function size(){W=c.clientWidth;H=c.clientHeight;c.width=W*dpr;c.height=H*dpr;x.setTransform(dpr,0,0,dpr,0,0);S=W<600?18:26;GAP=W<600?S*2.5:S*3.1;speed=GAP/1000;}
     size();window.addEventListener('resize',size);
     function laneY(l){return H*0.14+l*(H*0.72/(lanes-1));}
     function spawn(px){n++;var lane=Math.floor(Math.random()*lanes);var b={id:n,x:px,y:laneY(lane),born:performance.now(),shards:[0,0,0,0],claimed:[false,false,false,false],state:'mined',cp:n%6===0,parents:[],glow:0,flash:0};
@@ -515,7 +515,7 @@ footer .wrap{padding-block:48px 32px}
       ripples.forEach(function(r){x.strokeStyle='rgba(242,84,27,'+r.a+')';x.lineWidth=1.5;x.beginPath();x.arc(r.x,r.y,r.r,0,Math.PI*2);x.stroke();});
       if(!reduce)requestAnimationFrame(frame);
     }
-    for(var i=0;i<Math.ceil(W/(S*3.1))+1;i++){spawn(W-i*S*3.1);var b=blocks[blocks.length-1];b.born=performance.now()-i*1000;if(i>5){b.state='proven';b.shards=[1,1,1,1];b.claimed=[true,true,true,true];proven++;if(b.cp&&i>5){b.locked=true;locked++;}}else if(i>1){b.state='proving';b.claimed=[true,true,false,false];b.shards=[1,1,0,0];}}
+    for(var i=0;i<Math.ceil(W/GAP)+1;i++){spawn(W-i*GAP);var b=blocks[blocks.length-1];b.born=performance.now()-i*1000;if(i>5){b.state='proven';b.shards=[1,1,1,1];b.claimed=[true,true,true,true];proven++;if(b.cp&&i>5){b.locked=true;locked++;}}else if(i>1){b.state='proving';b.claimed=[true,true,false,false];b.shards=[1,1,0,0];}}
     cb.textContent=n;cp.textContent=proven;cl.textContent=locked;
     requestAnimationFrame(frame);
   })();