Spaces:

Aluode
/

AnttisBrain

Running

App Files Files Community

Aluode commited on 4 days ago

Commit

0028e15

verified ·

1 Parent(s): dec6e30

Update index.html

Browse files

Files changed (1) hide show

index.html +993 -18

index.html CHANGED Viewed

@@ -1,19 +1,994 @@
 <!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

 <!doctype html>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
+<title>ANTTI'S BRAIN — DESCENT · infinite procedural key-hunt</title>
+<style>
+  :root{
+    --void:#04060b; --ink:#c9d4e0; --amber:#e8b13a; --amber-dim:#8a6d2c;
+    --cyan:#54d2e2; --line:#1b2436; --dim:#67788d; --green:#4ec98f; --red:#e06060;
+    --gold:#ffd76a;
+  }
+  *{box-sizing:border-box}
+  html,body{margin:0;height:100%;background:var(--void);overflow:hidden;
+    font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:var(--ink)}
+  #gl{position:fixed;inset:0;width:100%;height:100%;display:block;cursor:grab}
+  #gl.drag{cursor:grabbing}
+  .panel{position:fixed;background:rgba(6,9,16,.74);border:1px solid var(--line);
+    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
+  #hud{top:14px;left:14px;padding:12px 14px;min-width:270px;font-size:11px;line-height:1.7}
+  #hud .ttl{color:var(--amber);letter-spacing:.16em;font-size:10px;
+    text-transform:uppercase;margin-bottom:8px;display:flex;justify-content:space-between;gap:18px}
+  #hud .ttl b{color:var(--amber-dim);font-weight:400}
+  #hud .row{display:flex;justify-content:space-between;color:#8494a8;gap:14px}
+  #hud .row span{color:var(--ink)}
+  #hud .row .k{color:var(--dim)}
+  #hud .row .room{color:var(--cyan);letter-spacing:.08em}
+  #hud .row .lvl{color:var(--gold);letter-spacing:.12em}
+  #hud .row .keyok{color:var(--green)}
+  #hud .row .keyno{color:var(--gold)}
+  #resWrap{margin-top:6px}
+  #resWrap label{display:flex;justify-content:space-between;color:var(--dim);font-size:10px;margin-bottom:3px}
+  #resWrap label span{color:var(--gold)}
+  #resBar{height:4px;background:var(--line);position:relative;overflow:hidden}
+  #resFill{position:absolute;inset:0;width:0%;background:linear-gradient(90deg,#8a6d2c,var(--gold));
+    transition:width .25s}
+  #hud .note{margin-top:7px;border-top:1px solid var(--line);padding-top:6px;
+    color:var(--dim);font-size:10px;line-height:1.6;max-width:300px}
+  #ctl{bottom:14px;left:14px;padding:12px 14px;width:288px;font-size:11px}
+  #ctl h2{margin:0 0 9px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
+    color:var(--cyan);font-weight:600}
+  .modes{display:flex;gap:6px;margin-bottom:11px}
+  .modes button{flex:1}
+  .field{margin:8px 0}
+  .field label{display:flex;justify-content:space-between;color:#8494a8;margin-bottom:4px}
+  .field label var{color:var(--ink);font-style:normal}
+  input[type=range]{width:100%;height:2px;-webkit-appearance:none;appearance:none;
+    background:var(--line);outline:none;margin:6px 0}
+  input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;
+    border-radius:50%;background:var(--amber);cursor:pointer;border:2px solid var(--void)}
+  input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;
+    background:var(--amber);cursor:pointer;border:2px solid var(--void)}
+  .btns{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap}
+  button{flex:1;min-width:56px;padding:7px 4px;background:transparent;color:var(--ink);
+    border:1px solid var(--line);font:inherit;font-size:10px;letter-spacing:.05em;
+    cursor:pointer;transition:.15s;text-transform:uppercase}
+  button:hover{border-color:var(--amber-dim);color:var(--amber)}
+  button.on{border-color:var(--cyan);color:var(--cyan)}
+  button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
+  #stat{margin-top:7px;font-size:10px;color:var(--dim);min-height:13px;word-break:break-all}
+  #help{bottom:14px;right:14px;padding:11px 13px;font-size:10.5px;line-height:1.85;
+    color:#73859a;text-align:right}
+  #help b{color:var(--amber)}
+  #banner{position:fixed;top:38%;left:0;right:0;text-align:center;pointer-events:none;
+    opacity:0;transition:opacity .5s;z-index:8}
+  #banner .b1{font-size:22px;letter-spacing:.4em;color:var(--gold);text-transform:uppercase;
+    text-shadow:0 0 24px rgba(255,215,106,.55)}
+  #banner .b2{font-size:11px;color:var(--dim);margin-top:8px;letter-spacing:.14em}
+  #banner.show{opacity:1}
+  #boot{position:fixed;inset:0;display:flex;flex-direction:column;gap:10px;
+    align-items:center;justify-content:center;background:rgba(4,6,11,.92);z-index:9;
+    transition:opacity .8s;text-align:center;padding:20px}
+  #boot.gone{opacity:0;pointer-events:none}
+  #boot .big{font-size:15px;letter-spacing:.28em;color:var(--amber)}
+  #boot .sub{font-size:11px;color:var(--dim);line-height:1.9;max-width:520px}
+  #boot .sub em{color:var(--gold);font-style:normal}
+  #bootStat{font-size:11px;color:var(--cyan);letter-spacing:.12em;min-height:14px}
+  #boot.err .big{color:var(--red)}
+  #boot.err .sub{color:#c99;word-break:break-all;text-align:left}
+</style>
+<canvas id="gl"></canvas>
+<div id="boot">
+  <div class="big">ANTTI'S BRAIN — DESCENT</div>
+  <div class="sub">an endless chain of chambers, hallucinated from one seed.<br>
+  each level is a run of rooms. somewhere in it, one crystal is not like the others:<br>
+  it pulses <em>gold</em>. touch it, and the red seal on the far gate dissolves.<br>
+  pass the gate: next level. rooms grow heavier, more twisted, stranger in shape.<br><br>
+  the <em>resonance</em> meter runs hot as you near the key. no enemies, no clocks —<br>
+  only geometry, depth, and the hash. nothing is stored; walk back and every<br>
+  room is re-dreamed identically. click / drag to enter · mouse look is inverted.</div>
+  <div id="bootStat">waking up…</div>
+</div>
+<div id="banner"><div class="b1" id="bn1"></div><div class="b2" id="bn2"></div></div>
+<div id="hud" class="panel">
+  <div class="ttl">Brain — Descent <b id="fps">— fps</b></div>
+  <div class="row"><span class="k">level</span><span class="lvl" id="lvlV">1</span></div>
+  <div class="row"><span class="k">room in level</span><span id="progV">—</span></div>
+  <div class="row"><span class="k">chamber</span><span class="room" id="roomV">—</span></div>
+  <div class="row"><span class="k">index / shape</span><span id="roomI">—</span></div>
+  <div class="row"><span class="k">mass · twist</span><span id="massV">—</span></div>
+  <div class="row"><span class="k">key crystal</span><span id="keyV" class="keyno">not found</span></div>
+  <div id="resWrap"><label>resonance <span id="resT">—</span></label>
+    <div id="resBar"><div id="resFill"></div></div></div>
+  <div class="row" style="margin-top:6px"><span class="k">mode</span><span id="modeV">Boundary</span></div>
+  <div class="row"><span class="k">boundary</span><span id="src">—</span></div>
+  <div class="row"><span class="k">music</span><span id="musV">—</span></div>
+  <div class="row"><span class="k">position</span><span id="pos">—</span></div>
+  <div class="note" id="modeNote">—</div>
+</div>
+<div id="ctl" class="panel">
+  <h2>The descent</h2>
+  <div class="modes">
+    <button id="m0" class="on">Boundary</button>
+    <button id="m1">Projection</button>
+    <button id="m2">Cascade</button>
+  </div>
+  <div class="field"><label>Mass gain <var id="m_l">1.0</var></label>
+    <input id="m" type="range" min="0.2" max="2.2" step="0.05" value="1.0"></div>
+  <div class="field"><label>Lensing <var id="g_l">1.0</var></label>
+    <input id="g" type="range" min="0" max="3" step="0.05" value="1.0"></div>
+  <div class="field"><label>Music volume <var id="v_l">0.5</var></label>
+    <input id="v" type="range" min="0" max="1" step="0.05" value="0.5"></div>
+  <div class="btns">
+    <button id="bSave">Save</button>
+    <button id="bLoad">Load</button>
+    <button id="bCode">Save code</button>
+  </div>
+  <div class="btns">
+    <button id="bMus" class="on">Music: on</button>
+    <button id="bSrc">Test pattern</button>
+  </div>
+  <div class="btns">
+    <button id="bSeed">New brain</button>
+    <button id="bIdle" class="on">Idle spin: on</button>
+  </div>
+  <div id="stat"></div>
+</div>
+<div id="help" class="panel">
+  <b>W A S D</b> move · <b>Q E</b> down/up<br>
+  drag to look (inverted) · <b>shift</b> boost<br>
+  gold pulse = the key · red membrane = the seal<br>
+  the amber thread lives in the gates
+</div>
+<video id="vid" style="display:none" playsinline muted></video>
+<script>
+'use strict';
+/* Do not hype. Do not lie. Just show. */
+const $=id=>document.getElementById(id);
+const cvs=$('gl'), boot=$('boot');
+/* any failure paints itself on the boot screen instead of dying silently */
+function bootErr(t){
+  boot.classList.add('err');boot.classList.remove('gone');
+  boot.innerHTML='<div class="big">It broke — here is why</div><div class="sub">'
+    +String(t).replace(/[<>&]/g,c=>({'<':'&lt;','>':'&gt;','&':'&amp;'}[c])).slice(0,600)+'</div>';
+}
+window.onerror=(m,s,l,c,e)=>{bootErr((e&&e.stack)||m+' @ line '+l);};
+window.addEventListener('unhandledrejection',e=>bootErr(e.reason));
+let gl=cvs.getContext('webgl2',{antialias:false,powerPreference:'high-performance'});
+if(!gl)gl=cvs.getContext('webgl2');
+if(!gl){bootErr('No WebGL2 — this brain needs a WebGL2 browser.');throw new Error('no webgl2');}
+const MAXW=15;          /* up to 5 moons x 3 live rooms */
+const VERT=`#version 300 es
+void main(){vec2 p=vec2((gl_VertexID<<1)&2,gl_VertexID&2);gl_Position=vec4(p*2.0-1.0,0.0,1.0);}`;
+const FRAG=`#version 300 es
+precision highp float;
+out vec4 O;
+uniform vec2 iRes;
+uniform float iTime;
+uniform vec3 camP,camR,camU,camF;
+uniform int nWell,mode,keyWell;
+uniform vec4 wells[${MAXW}];     /* xyz pos · w size */
+uniform vec3 wellCol[${MAXW}];
+uniform vec4 wellPar[${MAXW}];   /* x shape · y angA · z angB · w star-n */
+uniform vec3 roomPos[3];         /* prev · current · next */
+uniform vec4 roomPar[3];         /* x shape · y size · z half-height · w star-n */
+uniform vec4 roomMod[3];         /* x twist · y ripple amp · z ripple freq · w mass */
+uniform vec3 roomTintU[3];
+uniform vec4 seal;               /* xyz pos · w radius (<0 = open) */
+uniform float mGain,lensK;
+uniform sampler2D camTex;
+/* ---------- primitives ---------- */
+vec2 rot2(vec2 v,float a){float c=cos(a),s=sin(a);return vec2(c*v.x-s*v.y,s*v.x+c*v.y);}
+float sdBox3(vec3 p,vec3 b){vec3 q=abs(p)-b;return length(max(q,0.))+min(max(q.x,max(q.y,q.z)),0.);}
+float sdHexP(vec3 p,vec2 h){ /* cross-section xy · half-height z */
+  const vec3 k=vec3(-0.8660254,0.5,0.57735);
+  p=abs(p);
+  p.xy-=2.0*min(dot(k.xy,p.xy),0.0)*k.xy;
+  vec2 d=vec2(length(p.xy-vec2(clamp(p.x,-k.z*h.x,k.z*h.x),h.x))*sign(p.y-h.x),p.z-h.y);
+  return min(max(d.x,d.y),0.0)+length(max(d,0.0));}
+float sdStarN(vec2 p,float r,float n,float m){ /* n-pointed star, m in (2,n) */
+  float an=3.1415927/n, en=3.1415927/m;
+  vec2 acs=vec2(cos(an),sin(an)), ecs=vec2(cos(en),sin(en));
+  float bn=mod(atan(p.x,p.y),2.0*an)-an;
+  p=length(p)*vec2(cos(bn),abs(sin(bn)));
+  p-=r*acs;
+  p+=ecs*clamp(-dot(p,ecs),0.0,r*acs.y/ecs.y);
+  return length(p)*sign(p.x);}
+float sdOcta(vec3 p,float s){p=abs(p);return (p.x+p.y+p.z-s)*0.57735;}
+float opExtr(float d2,float z,float h){vec2 w=vec2(d2,abs(z)-h);
+  return min(max(w.x,w.y),0.0)+length(max(w,0.0));}
+float sdSeg(vec3 p,vec3 a,vec3 b){vec3 pa=p-a,ba=b-a;
+  float h=clamp(dot(pa,ba)/dot(ba,ba),0.0,1.0);return length(pa-ba*h);}
+/* ---------- the twelve shapes. rooms and moons share this ONE chain ----------
+   signed, negative inside. s = radius-ish, h = half-height, n = star points */
+float shapeSD(vec3 q,float sh,float s,float h,float n){
+  int i=int(sh+0.5);
+  if(i==0) return sdBox3(q,vec3(s,h,s));
+  if(i==1) return length(q)-s;
+  if(i==2) return sdHexP(vec3(q.x,q.z,q.y),vec2(s,h));
+  if(i==3){float m=2.0+(n-2.0)*0.45;
+           return opExtr(sdStarN(q.xz,s*1.15,n,m),q.y,h);}
+  if(i==4) return sdOcta(q,s*1.5);
+  if(i==5) return max(length(q.xz)-s,abs(q.y)-h);          /* cylinder */
+  if(i==6){vec3 c=q; c.y-=clamp(c.y,-h*0.55,h*0.55);       /* capsule vault */
+           return length(c)-s*0.90;}
+  if(i==7) return max(sdBox3(q,vec3(s*0.95)),sdOcta(q,s*1.45)); /* cut crystal */
+  if(i==8) return (length(vec3(q.x,q.y*1.35,q.z))-s*1.08)*0.72; /* ellipsoid dome */
+  if(i==9) return min(sdBox3(q,vec3(s,h*0.55,s*0.38)),          /* cross cathedral */
+              min(sdBox3(q,vec3(s*0.38,h*0.55,s)),
+                  sdBox3(q,vec3(s*0.45,h,s*0.45))));
+  if(i==10){float a=atan(q.z,q.x);                          /* gear */
+            float rr=s*(0.88+0.11*cos(a*n*2.0));
+            return max(length(q.xz)-rr,abs(q.y)-h)*0.68;}
+  /* 11 = wheel: torus + hub + four spokes, all walkable */
+  float tor=length(vec2(length(q.xz)-s*0.72,q.y))-s*0.40;
+  float hub=length(q)-s*0.40;
+  float sp=min(min(sdSeg(q,vec3(0.),vec3(s*0.72,0.,0.)),
+                   sdSeg(q,vec3(0.),vec3(-s*0.72,0.,0.))),
+               min(sdSeg(q,vec3(0.),vec3(0.,0.,s*0.72)),
+                   sdSeg(q,vec3(0.),vec3(0.,0.,-s*0.72))))-s*0.17;
+  return min(tor,min(hub,sp));
+}
+float roomSD(vec3 p,int r){
+  vec3 q=p-roomPos[r];
+  float tw=roomMod[r].x;
+  if(abs(tw)>0.0005) q.xz=rot2(q.xz,q.y*tw);
+  float d=shapeSD(q,roomPar[r].x,roomPar[r].y,roomPar[r].z,roomPar[r].w);
+  float ra=roomMod[r].y;
+  if(ra>0.001) d+=ra*sin(q.x*roomMod[r].z)*sin(q.y*roomMod[r].z)*sin(q.z*roomMod[r].z);
+  return d/(1.0+abs(tw)*roomPar[r].y*0.6+ra*roomMod[r].z);   /* Lipschitz guard */
+}
+float worldSD(vec3 p){
+  float d=min(roomSD(p,0),min(roomSD(p,1),roomSD(p,2)));
+  d=min(d,sdSeg(p,roomPos[0],roomPos[1])-1.7);
+  d=min(d,sdSeg(p,roomPos[1],roomPos[2])-1.7);
+  return d;}
+int nearestRoom(vec3 p){
+  float d0=roomSD(p,0),d1=roomSD(p,1),d2=roomSD(p,2);
+  return d0<d1?(d0<d2?0:2):(d1<d2?1:2);}
+vec3 wallNormal(vec3 p){ /* inward-facing */
+  const vec2 e=vec2(0.02,-0.02);
+  return -normalize(
+    e.xyy*worldSD(p+e.xyy)+e.yyx*worldSD(p+e.yyx)+
+    e.yxy*worldSD(p+e.yxy)+e.xxx*worldSD(p+e.xxx));}
+/* ---------- moons: the same twelve shapes, shrunk and rounded into glass.
+   core-scale, height-scale and rounding radius per shape, from const tables —
+   this keeps the shader small enough for slow driver compilers ---------- */
+const float CS[12]=float[12](0.50,1.00,0.60,0.765,0.613,0.52,0.644,0.590,0.740,0.600,0.568,0.55);
+const float CH[12]=float[12](0.50,1.00,0.34,0.180,0.613,0.42,0.545,0.590,0.740,0.470,0.280,0.55);
+const float CR[12]=float[12](0.26,0.00,0.22,0.16,0.24,0.20,0.00,0.18,0.06,0.14,0.12,0.10);
+float moonSD(vec3 p,int k){
+  vec3 q=p-wells[k].xyz;
+  float s=wells[k].w;
+  float bs=length(q)-s*2.2;
+  if(bs>0.6) return bs;
+  q.xz=rot2(q.xz,wellPar[k].y);
+  q.xy=rot2(q.xy,wellPar[k].z);
+  int i=int(wellPar[k].x+0.5);
+  return shapeSD(q,wellPar[k].x,s*CS[i],s*CH[i],wellPar[k].w)-s*CR[i];
+}
+vec3 moonNormal(vec3 p,int k){
+  const vec2 e=vec2(0.012,-0.012);
+  return normalize(
+    e.xyy*moonSD(p+e.xyy,k)+e.yyx*moonSD(p+e.yyx,k)+
+    e.yxy*moonSD(p+e.yxy,k)+e.xxx*moonSD(p+e.xxx,k));}
+/* ---------- boundary images ---------- */
+vec3 eqSample(vec3 n){
+  float u=0.5+atan(n.z,n.x)*0.159155;
+  float v=0.5-asin(clamp(n.y,-1.0,1.0))*0.318310;
+  return texture(camTex,vec2(1.0-u,v)).rgb;}
+vec3 wallImg(vec3 p){
+  int r=nearestRoom(p);
+  return eqSample(normalize(p-roomPos[r]))*roomTintU[r];}
+void main(){
+  vec2 uv0=(gl_FragCoord.xy-0.5*iRes)/iRes.y;
+  vec3 x=camP;
+  vec3 rd=normalize(uv0.x*camR+uv0.y*camU+1.5*camF);
+  vec3 glow=vec3(0.0), tint=vec3(1.0), accum=vec3(0.0), col=vec3(0.0);
+  float trav=0.0, stp=0.05;
+  int bnc=0; bool done=false;
+  const int MAXB=12;
+  /* the amber thread lives only in the corridors, not in the rooms */
+  vec3 gA0=mix(roomPos[0],roomPos[1],0.28), gB0=mix(roomPos[0],roomPos[1],0.72);
+  vec3 gA1=mix(roomPos[1],roomPos[2],0.28), gB1=mix(roomPos[1],roomPos[2],0.72);
+  for(int i=0;i<180;i++){
+    /* lensing: deflection per path length, dtheta ~ gradPhi * ds */
+    if(lensK>0.001){
+      vec3 pull=vec3(0.0);
+      for(int k=0;k<nWell;k++){
+        vec3 dv=wells[k].xyz-x; float r2=dot(dv,dv)+0.4;
+        pull+=dv*inversesqrt(r2)*(wells[k].w*mGain/r2); }
+      rd=normalize(rd+pull*stp*0.055*lensK);
+    }
+    float dm=1e9; int hb=-1;
+    for(int k=0;k<nWell;k++){
+      float sd=moonSD(x,k);
+      float r=length(x-wells[k].xyz);
+      float e=wells[k].w*mGain/(r+1.0);
+      glow+=wellCol[k]*e*e*0.03*stp;
+      if(k==keyWell)                       /* the key crystal breathes gold */
+        glow+=vec3(1.0,0.80,0.30)*e*e*(0.05+0.045*sin(iTime*4.0))*stp;
+      if(sd<dm){dm=sd;hb=k;} }
+    float dw=-worldSD(x);
+    {
+      float dg=min(sdSeg(x,gA0,gB0),sdSeg(x,gA1,gB1));
+      glow+=vec3(0.91,0.69,0.23)*(0.010*stp/(dg*dg+0.15))*smoothstep(4.0,1.0,dg);
+    }
+    float dsl=1e9;
+    if(seal.w>0.0){
+      dsl=length(x-seal.xyz)-seal.w;
+      glow+=vec3(0.95,0.22,0.18)*(0.012*stp/(dsl*dsl+0.22))*smoothstep(6.0,1.5,dsl);
+      if(dsl<0.04){                        /* the red membrane: sealed exit */
+        float pl=0.5+0.5*sin(iTime*3.0+x.y*2.2+x.x*1.3);
+        col=(vec3(0.72,0.10,0.09)+vec3(0.35,0.06,0.05)*pl)*tint;
+        done=true; break;
+      }
+    }
+    if(dm<0.03 && hb>=0){
+      vec3 n=moonNormal(x,hb);
+      float F=0.04+0.96*pow(1.0-max(dot(-rd,n),0.0),5.0);   /* Schlick, glass F0 */
+      if(mode==1){                     /* PROJECTION: moons carry the image (opaque) */
+        float L=0.0; for(int k=0;k<nWell;k++){
+          L+=wells[k].w*mGain/(length(x-wells[k].xyz)+1.0);}
+        col=tint*eqSample(n)*(0.55+0.7*min(L,1.4)); done=true; break;
+      }
+      /* BOUNDARY & CASCADE: heavy optical crystal.
+         Fresnel glints off the surface; the ray itself REFRACTS (Snell),
+         marches the negative-distance chord inside, exits the far side,
+         and keeps flying — you see the world warped through the glass. */
+      glow+=tint*eqSample(reflect(rd,n))*F*0.55;             /* mirror glint, Fresnel-weighted */
+      if(mode==2) accum+=tint*eqSample(n)*F*1.1;             /* cascade: crystal wears the face at the rims */
+      bnc++; if(bnc>MAXB){col=(mode==2)?accum:vec3(0.0);done=true;break;}
+      const float IOR=1.45;
+      vec3 d=refract(rd,n,1.0/IOR);
+      if(dot(d,d)<1e-4) d=reflect(rd,n);                     /* entry-grazing guard */
+      x-=n*0.04;                                             /* step inside the glass */
+      float chord=0.0;
+      for(int j=0;j<26;j++){
+        float sd=moonSD(x,hb);
+        if(sd>-0.006){                                       /* reached the far surface */
+          vec3 ne=moonNormal(x,hb);
+          vec3 ro=refract(d,-ne,IOR);
+          if(dot(ro,ro)<1e-4){ d=reflect(d,-ne); x+=d*0.03; chord+=0.03; continue; } /* TIR: bounce inside */
+          d=ro; break;                                       /* refract out */
+        }
+        float st=max(-sd*0.8,0.025);
+        x+=d*st; chord+=st;
+      }
+      /* Beer-Lambert: the crystal's colour tints what passes through, by chord length */
+      tint*=exp(-(vec3(1.0)-wellCol[hb])*chord*0.35)*0.96;
+      rd=d;
+      vec3 ne2=moonNormal(x,hb);
+      for(int j=0;j<10;j++){ if(moonSD(x,hb)>0.05)break; x+=ne2*0.05; }
+      x+=rd*0.04; trav+=chord+0.08; stp=0.05; continue;
+    }
+    if(dw<0.03){
+      if(mode==0){                     /* BOUNDARY: walls are the image */
+        vec3 wc=wallImg(x);
+        float L=0.0; for(int k=0;k<nWell;k++){
+          L+=wells[k].w*mGain/(length(x-wells[k].xyz)+1.0);}
+        float fog=exp(-trav*0.010);
+        col=wc*tint*(0.30+1.1*min(L,1.6))*fog; done=true; break;
+      } else {                         /* PROJECTION / CASCADE: walls mirror */
+        vec3 n=wallNormal(x);
+        rd=reflect(rd,n); tint*=0.85; bnc++;
+        if(bnc>MAXB){ col=(mode==2)?accum:vec3(0.0); done=true; break; }
+        for(int j=0;j<10;j++){ if(-worldSD(x)>0.05)break; x+=n*0.05; }
+        x+=rd*0.04; stp=0.05; continue;
+      }
+    }
+    stp=clamp(min(min(dm,dw),dsl)*0.9,0.03,3.0);
+    x+=rd*stp; trav+=stp;
+    if(trav>260.0)break;
+  }
+  if(!done) col=(mode==2)?accum:vec3(0.0);
+  col+=glow;
+  col=col/(col+1.0);
+  col=pow(col,vec3(0.4545));
+  float vig=1.0-0.35*dot(uv0,uv0);
+  O=vec4(col*vig,1.0);
+}`;
+/* ---------------- boundary texture (webcam + fallback) ---------------- */
+const vid=$('vid');
+let camOK=false, useCam=true;
+const camTex=gl.createTexture();
+gl.activeTexture(gl.TEXTURE0);
+gl.bindTexture(gl.TEXTURE_2D,camTex);
+gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MIN_FILTER,gl.LINEAR);
+gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MAG_FILTER,gl.LINEAR);
+gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_WRAP_S,gl.REPEAT);
+gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_WRAP_T,gl.CLAMP_TO_EDGE);
+if(navigator.mediaDevices&&navigator.mediaDevices.getUserMedia){
+  navigator.mediaDevices.getUserMedia({video:{width:640,height:480,facingMode:'user'}})
+    .then(st=>{vid.srcObject=st;vid.play();camOK=true;setSrcLabel();})
+    .catch(()=>{useCam=false;camOK=false;setSrcLabel();});
+}else{useCam=false;setSrcLabel();}
+const pat=document.createElement('canvas');pat.width=256;pat.height=256;
+const pctx=pat.getContext('2d');
+function drawPattern(t){
+  const g=pctx.createLinearGradient(0,0,0,256);
+  g.addColorStop(0,'#2a3550');g.addColorStop(1,'#6a4a70');
+  pctx.fillStyle=g;pctx.fillRect(0,0,256,256);
+  const cx=128+64*Math.cos(0.6*t),cy=128+48*Math.sin(0.9*t);
+  for(let s=0;s<24;s++){
+    pctx.fillStyle=s%2?'#d8c890':'#705838';
+    pctx.beginPath();pctx.arc(cx,cy,46-s*1.9,0,7);pctx.fill();
+  }
+  pctx.fillStyle='#101018';pctx.fillRect(176,56,40,40);
+  pctx.fillStyle='#c9d4e0';pctx.font='14px monospace';
+  pctx.fillText('no camera — pattern',56,240);
+}
+function setSrcLabel(){
+  $('src').textContent=useCam&&camOK?'webcam live':'test pattern';
+  $('bSrc').textContent=useCam?'Test pattern':'Use camera';
+}
+function uploadBoundary(t){
+  gl.activeTexture(gl.TEXTURE0);
+  gl.bindTexture(gl.TEXTURE_2D,camTex);
+  gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL,true);
+  if(useCam&&camOK&&vid.readyState>=2){
+    gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,gl.RGBA,gl.UNSIGNED_BYTE,vid);
+  }else{
+    drawPattern(t);
+    gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,gl.RGBA,gl.UNSIGNED_BYTE,pat);
+  }
+  gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL,false);
+}
+/* =====================================================================
+   THE PROCEDURAL BRAIN — now with LEVELS
+   Every chamber is a pure function of (SEED, index). Nothing is stored.
+   Level L is a run of depth(L) rooms. One room hides the KEY CRYSTAL
+   (moon 0, gold, pulsing). The far gate of the level is SEALED until
+   the key is touched. Room mass, twist, ripple and the shape pool all
+   deepen with the level. Save = 6 numbers. Everything else is hash.
+   ===================================================================== */
+let SEED=(Math.random()*4294967296)>>>0;
+function rng(i,salt){
+  let t=(SEED ^ Math.imul(i|0,2654435761) ^ Math.imul(salt|0,40503))>>>0;
+  t=Math.imul(t^(t>>>15),t|1);
+  t^=t+Math.imul(t^(t>>>7),t|61);
+  return ((t^(t>>>14))>>>0)/4294967296;
+}
+const SHAPENAMES=['CUBE','SPHERE','HEX PRISM','STAR','OCTAHEDRON','CYLINDER',
+                  'CAPSULE VAULT','CUT CRYSTAL','DOME','CROSS CATHEDRAL','GEAR','WHEEL'];
+const SYL=['KA','RA','JA','PIN','TA','VUO','LU','MI','SA','TÄH','TI','KI','VI','HEL','ME','NU','SO','LO'];
+/* ------- level geometry: depth(L) rooms per level, cumulative starts ------- */
+function depthOf(L){return Math.min(3+L,10);}          /* L1: 4 rooms … caps at 10 */
+function levelStartOf(L){let s=0;for(let k=1;k<L;k++)s+=depthOf(k);return s;}
+function levelOfRoom(i){
+  if(i<0)return 1;                                     /* the ante-brain: level 1 rules */
+  let L=1,s=0;
+  while(s+depthOf(L)<=i){s+=depthOf(L);L++;}
+  return L;
+}
+function rngL(L,salt){return rng(0x5EED+Math.imul(L,131),7000+salt);}
+function keyRoomOf(L){const d=depthOf(L);
+  return levelStartOf(L)+1+Math.floor(rngL(L,1)*(d-1));}
+function exitRoomOf(L){return levelStartOf(L)+depthOf(L)-1;}
+function nMoonsOf(L){return Math.min(3+((L-1)>>1),5);}
+function roomDef(i){
+  const L=levelOfRoom(i);
+  const pool=Math.min(6+Math.max(L-1,0),12);           /* shapes unlock with depth */
+  const shape=Math.floor(rng(i,1)*pool);
+  const size=7.0+rng(i,2)*4.0+Math.min(L*0.15,3.0);
+  const height=4.5+rng(i,3)*2.5;
+  const starN=5+Math.floor(rng(i,4)*3);                /* 5, 6 or 7 points */
+  const hue=rng(i,5);
+  const turn=(rng(i,6)-0.5)*2.4;                       /* gate heading vs. entry, +-69 deg */
+  const twist=(rng(i,8)-0.5)*2.0*Math.min(0.015+L*0.011,0.13);
+  const ripA=Math.min(Math.max(L-2,0)*0.06,0.45)*rng(i,9);
+  const ripF=0.5+rng(i,10)*1.2;
+  const massK=Math.min(0.7+rng(i,11)*0.9+L*0.04,2.8);
+  let name='';const nc=2+Math.floor(rng(i,7)*2);
+  for(let k=0;k<nc;k++)name+=SYL[Math.floor(rng(i,20+k)*SYL.length)];
+  const tint=[0.86+0.14*Math.cos(6.283*hue),
+              0.86+0.14*Math.cos(6.283*(hue+0.33)),
+              0.86+0.14*Math.cos(6.283*(hue+0.66))];
+  return {shape,size,height,starN,hue,turn,name,tint,twist,ripA,ripF,massK,level:L};
+}
+function moonDef(i,m){ /* moon m of room i — re-dreamed identically every visit */
+  const s=100+m*13;
+  const mass=-Math.log(1e-6+rng(i,s+1));
+  return {mass,
+    fx:0.05+rng(i,s+2)*0.20, fy:0.05+rng(i,s+3)*0.20, fz:0.05+rng(i,s+4)*0.20,
+    px:rng(i,s+5)*6.283, py:rng(i,s+6)*6.283, pz:rng(i,s+7)*6.283,
+    ax:0.28+rng(i,s+8)*0.22, ay:0.25+rng(i,s+9)*0.22, az:0.28+rng(i,s+10)*0.22,
+    ra:(rng(i,s+11)-0.5)*1.2, rb:(rng(i,s+12)-0.5)*1.2,
+    pa:rng(i,s+13)*6.283, pb:rng(i,s+14)*6.283,
+    hue:rng(i,s+15)};
+}
+/* ------- game state ------- */
+let LEVEL=1, keyFound=false, maxReached=1;
+let CI=0, dirIn=[Math.sin(rng(0,99)*6.283),Math.cos(rng(0,99)*6.283)];
+let R={};      /* the three live rooms: def, center, index */
+function rotXZ(v,a){const c=Math.cos(a),s=Math.sin(a);return [c*v[0]-s*v[1],s*v[0]+c*v[1]];}
+function computeDirIn(N){    /* dirIn is a pure function of SEED and N */
+  let d=[Math.sin(rng(0,99)*6.283),Math.cos(rng(0,99)*6.283)];
+  if(N>0){for(let j=0;j<N;j++)d=rotXZ(d,roomDef(j).turn);}
+  else if(N<0){for(let j=-1;j>=N;j--)d=rotXZ(d,-roomDef(j).turn);}
+  return d;
+}
+function rebuildChain(){
+  const dPrev=roomDef(CI-1), dCur=roomDef(CI), dNext=roomDef(CI+1);
+  const dirOut=rotXZ(dirIn,dCur.turn);
+  const Dn=dCur.size+dNext.size+12.0, Dp=dPrev.size+dCur.size+12.0;
+  R={
+    idx:[CI-1,CI,CI+1],
+    def:[dPrev,dCur,dNext],
+    pos:[[-dirIn[0]*Dp,0,-dirIn[1]*Dp],[0,0,0],[dirOut[0]*Dn,0,dirOut[1]*Dn]],
+    dirOut
+  };
+  $('roomV').textContent=dCur.name;
+  $('roomI').textContent='#'+CI+' · '+(dCur.shape===3?'STAR-'+dCur.starN:SHAPENAMES[dCur.shape]);
+  $('massV').textContent=dCur.massK.toFixed(2)+' · '+(dCur.twist>=0?'+':'')+dCur.twist.toFixed(3);
+  updateLevelHud();
+}
+function banner(a,b){
+  $('bn1').textContent=a;$('bn2').textContent=b||'';
+  const el=$('banner');el.classList.add('show');
+  clearTimeout(banner.t);banner.t=setTimeout(()=>el.classList.remove('show'),2600);
+}
+function updateLevelHud(){
+  $('lvlV').textContent=LEVEL;
+  const rIn=CI-levelStartOf(LEVEL);
+  $('progV').textContent=(CI<0?'—':(rIn+1)+' / '+depthOf(LEVEL));
+  $('keyV').textContent=keyFound?'found — seal open':'not found';
+  $('keyV').className=keyFound?'keyok':'keyno';
+}
+function onRoomChanged(){
+  const newL=levelOfRoom(CI);
+  if(newL>LEVEL){
+    LEVEL=newL;
+    keyFound=(LEVEL+1<=maxReached);           /* re-visiting a beaten level? seal stays open */
+    if(LEVEL>maxReached){maxReached=LEVEL;keyFound=false;
+      banner('LEVEL '+LEVEL,depthOf(LEVEL)+' rooms · find the gold crystal');
+      autoSave();}
+  }else if(newL<LEVEL){
+    LEVEL=newL;
+    keyFound=(LEVEL+1<=maxReached);           /* walked back: that seal was already opened */
+  }
+  updateLevelHud();
+}
+function advance(){                    /* stepped through the forward gate */
+  const shift=R.pos[2];
+  camP=[camP[0]-shift[0],camP[1]-shift[1],camP[2]-shift[2]];
+  dirIn=R.dirOut; CI++; rebuildChain(); onRoomChanged();
+}
+function retreat(){                    /* stepped back — re-dream the past */
+  const shift=R.pos[0];
+  camP=[camP[0]-shift[0],camP[1]-shift[1],camP[2]-shift[2]];
+  const dPrev=roomDef(CI-1);
+  dirIn=rotXZ(dirIn,-dPrev.turn); CI--; rebuildChain(); onRoomChanged();
+}
+/* ---------------- JS twins of the SDFs (collision + transitions) ---------- */
+function sdBoxJ(px,py,pz,bx,by,bz){
+  const qx=Math.abs(px)-bx,qy=Math.abs(py)-by,qz=Math.abs(pz)-bz;
+  return Math.hypot(Math.max(qx,0),Math.max(qy,0),Math.max(qz,0))
+        +Math.min(Math.max(qx,Math.max(qy,qz)),0);}
+function sdHexJ(px,py,pz,h1,h2){
+  const kx=-0.8660254,ky=0.5,kz=0.57735;
+  px=Math.abs(px);py=Math.abs(py);pz=Math.abs(pz);
+  const d0=Math.min(kx*px+ky*py,0)*2;
+  px-=d0*kx;py-=d0*ky;
+  const cl=Math.min(Math.max(px,-kz*h1),kz*h1);
+  const dx=Math.hypot(px-cl,py-h1)*Math.sign(py-h1);
+  const dy=pz-h2;
+  return Math.min(Math.max(dx,dy),0)+Math.hypot(Math.max(dx,0),Math.max(dy,0));}
+function sdStarNJ(px,py,r,n,m){
+  const an=Math.PI/n,en=Math.PI/m;
+  const ax=Math.cos(an),ay=Math.sin(an),ex=Math.cos(en),ey=Math.sin(en);
+  let bn=Math.atan2(px,py)%(2*an); if(bn<0)bn+=2*an; bn-=an;
+  const l=Math.hypot(px,py);
+  px=l*Math.cos(bn); py=l*Math.abs(Math.sin(bn));
+  px-=r*ax; py-=r*ay;
+  const cl=Math.min(Math.max(-(px*ex+py*ey),0),r*ay/ey);
+  px+=ex*cl; py+=ey*cl;
+  return Math.hypot(px,py)*Math.sign(px);}
+function opExtrJ(d2,z,h){const wy=Math.abs(z)-h;
+  return Math.min(Math.max(d2,wy),0)+Math.hypot(Math.max(d2,0),Math.max(wy,0));}
+function sdSegJ(px,py,pz,a,b){
+  const bax=b[0]-a[0],bay=b[1]-a[1],baz=b[2]-a[2];
+  const pax=px-a[0],pay=py-a[1],paz=pz-a[2];
+  const h=Math.min(Math.max((pax*bax+pay*bay+paz*baz)/(bax*bax+bay*bay+baz*baz),0),1);
+  return Math.hypot(pax-bax*h,pay-bay*h,paz-baz*h);}
+function sdSegOJ(px,py,pz,ax,ay,az,bx,by,bz){
+  const bax=bx-ax,bay=by-ay,baz=bz-az;
+  const pax=px-ax,pay=py-ay,paz=pz-az;
+  const h=Math.min(Math.max((pax*bax+pay*bay+paz*baz)/(bax*bax+bay*bay+baz*baz),0),1);
+  return Math.hypot(pax-bax*h,pay-bay*h,paz-baz*h);}
+function shapeSDJ(x,y,z,d){
+  const s=d.size,h=d.height;
+  switch(d.shape){
+    case 0:return sdBoxJ(x,y,z,s,h,s);
+    case 1:return Math.hypot(x,y,z)-s;
+    case 2:return sdHexJ(x,z,y,s,h);
+    case 3:{const m=2.0+(d.starN-2.0)*0.45;
+            return opExtrJ(sdStarNJ(x,z,s*1.15,d.starN,m),y,h);}
+    case 4:return (Math.abs(x)+Math.abs(y)+Math.abs(z)-s*1.5)*0.57735;
+    case 5:return Math.max(Math.hypot(x,z)-s,Math.abs(y)-h);
+    case 6:{const cy=y-Math.min(Math.max(y,-h*0.55),h*0.55);
+            return Math.hypot(x,cy,z)-s*0.90;}
+    case 7:return Math.max(sdBoxJ(x,y,z,s*0.95,s*0.95,s*0.95),
+                          (Math.abs(x)+Math.abs(y)+Math.abs(z)-s*1.45)*0.57735);
+    case 8:return (Math.hypot(x,y*1.35,z)-s*1.08)*0.72;
+    case 9:return Math.min(sdBoxJ(x,y,z,s,h*0.55,s*0.38),
+                  Math.min(sdBoxJ(x,y,z,s*0.38,h*0.55,s),
+                           sdBoxJ(x,y,z,s*0.45,h,s*0.45)));
+    case 10:{const a=Math.atan2(z,x);
+             const rr=s*(0.88+0.11*Math.cos(a*d.starN*2.0));
+             return Math.max(Math.hypot(x,z)-rr,Math.abs(y)-h)*0.68;}
+    default:{const tor=Math.hypot(Math.hypot(x,z)-s*0.72,y)-s*0.40;
+             const hub=Math.hypot(x,y,z)-s*0.40;
+             let sp=Math.min(sdSegOJ(x,y,z,0,0,0,s*0.72,0,0),
+                             sdSegOJ(x,y,z,0,0,0,-s*0.72,0,0));
+             sp=Math.min(sp,Math.min(sdSegOJ(x,y,z,0,0,0,0,0,s*0.72),
+                                     sdSegOJ(x,y,z,0,0,0,0,0,-s*0.72)))-s*0.17;
+             return Math.min(tor,Math.min(hub,sp));}
+  }
+}
+function roomSDJ(px,py,pz,r){
+  const d=R.def[r],c=R.pos[r];
+  let x=px-c[0],y=py-c[1],z=pz-c[2];
+  if(Math.abs(d.twist)>0.0005){
+    const ca=Math.cos(y*d.twist),sa=Math.sin(y*d.twist);
+    const nx=ca*x-sa*z, nz=sa*x+ca*z; x=nx; z=nz;
+  }
+  let sd=shapeSDJ(x,y,z,d);
+  if(d.ripA>0.001)
+    sd+=d.ripA*Math.sin(x*d.ripF)*Math.sin(y*d.ripF)*Math.sin(z*d.ripF);
+  return sd/(1.0+Math.abs(d.twist)*d.size*0.6+d.ripA*d.ripF);
+}
+function worldSDJ(px,py,pz){
+  let d=Math.min(roomSDJ(px,py,pz,0),Math.min(roomSDJ(px,py,pz,1),roomSDJ(px,py,pz,2)));
+  d=Math.min(d,sdSegJ(px,py,pz,R.pos[0],R.pos[1])-1.7);
+  d=Math.min(d,sdSegJ(px,py,pz,R.pos[1],R.pos[2])-1.7);
+  return d;}
+/* ---------------- moons + key + seal upload ---------------- */
+let P={mGain:1.0,lensK:1.0},mode=0,idle=1;
+const wellsF=new Float32Array(MAXW*4), colsF=new Float32Array(MAXW*3),
+      parF=new Float32Array(MAXW*4),
+      roomPosF=new Float32Array(9), roomParF=new Float32Array(12),
+      roomModF=new Float32Array(12), roomTintF=new Float32Array(9);
+function moonCol(h){
+  return[0.55+0.45*Math.cos(6.283*h),0.55+0.45*Math.cos(6.283*(h+0.33)),0.55+0.45*Math.cos(6.283*(h+0.66))];}
+let keyWell=-1, keyPos=null, keyR=0;
+let sealV=[0,0,0,-1];
+function packWorld(t){
+  let w=0; keyWell=-1; keyPos=null;
+  const nM=nMoonsOf(LEVEL), kRoom=keyRoomOf(LEVEL);
+  for(let r=0;r<3;r++){
+    const d=R.def[r],c=R.pos[r];
+    roomPosF[r*3]=c[0];roomPosF[r*3+1]=c[1];roomPosF[r*3+2]=c[2];
+    roomParF[r*4]=d.shape;roomParF[r*4+1]=d.size;roomParF[r*4+2]=d.height;roomParF[r*4+3]=d.starN;
+    roomModF[r*4]=d.twist;roomModF[r*4+1]=d.ripA;roomModF[r*4+2]=d.ripF;roomModF[r*4+3]=d.massK;
+    roomTintF[r*3]=d.tint[0];roomTintF[r*3+1]=d.tint[1];roomTintF[r*3+2]=d.tint[2];
+    const A=d.size*0.62, Ay=d.height*0.55;
+    for(let m=0;m<nM && w<MAXW;m++,w++){
+      const md=moonDef(R.idx[r],m);
+      const isKey=(!keyFound && R.idx[r]===kRoom && m===0);
+      let size=(0.45+(md.mass/3.0)*0.75)*P.mGain*d.massK;
+      size=Math.min(size,1.6); if(isKey)size=Math.min(size*1.25,1.8);
+      /* the key swings wide, off the walking line — you must go to it */
+      const ax=isKey?Math.min(md.ax*1.6,0.55):md.ax,
+            ay=isKey?Math.min(md.ay*1.5,0.50):md.ay,
+            az=isKey?Math.min(md.az*1.6,0.55):md.az;
+      wellsF[w*4+0]=c[0]+A*ax*Math.sin(md.fx*t+md.px);
+      wellsF[w*4+1]=c[1]+Ay*ay*Math.sin(md.fy*t+md.py);
+      wellsF[w*4+2]=c[2]+A*az*Math.sin(md.fz*t+md.pz);
+      wellsF[w*4+3]=size;
+      const cc=isKey?[1.0,0.84,0.36]:moonCol(md.hue);
+      colsF[w*3]=cc[0];colsF[w*3+1]=cc[1];colsF[w*3+2]=cc[2];
+      parF[w*4]=d.shape;parF[w*4+1]=md.ra*t+md.pa;parF[w*4+2]=md.rb*t+md.pb;parF[w*4+3]=d.starN;
+      if(isKey){keyWell=w;keyPos=[wellsF[w*4],wellsF[w*4+1],wellsF[w*4+2]];keyR=size;}
+    }
+  }
+  /* the seal: a red membrane in the corridor after the level's last room */
+  const eRoom=exitRoomOf(LEVEL);
+  if(!keyFound && CI===eRoom){
+    sealV=[(R.pos[1][0]+R.pos[2][0])*0.5,(R.pos[1][1]+R.pos[2][1])*0.5,
+           (R.pos[1][2]+R.pos[2][2])*0.5,2.6];
+  }else sealV=[0,0,0,-1];
+  return w;
+}
+/* ---------------- camera & input (mouse INVERTED, as requested) ------------ */
+let camP=[0,0,0], yaw=0, pitch=0;
+function faceForwardGate(){yaw=Math.atan2(R.dirOut[0],R.dirOut[1]);pitch=0;}
+rebuildChain();faceForwardGate();
+const keys={};
+addEventListener('keydown',e=>{keys[e.code]=1;
+  if(['KeyW','KeyA','KeyS','KeyD','KeyQ','KeyE'].includes(e.code))e.preventDefault();});
+addEventListener('keyup',e=>{keys[e.code]=0;});
+let dragging=false,lx=0,ly=0;
+cvs.addEventListener('pointerdown',e=>{dragging=true;lx=e.clientX;ly=e.clientY;
+  cvs.classList.add('drag');cvs.setPointerCapture(e.pointerId);
+  boot.classList.add('gone');startMusic();});
+cvs.addEventListener('pointerup',()=>{dragging=false;cvs.classList.remove('drag');});
+cvs.addEventListener('pointermove',e=>{
+  if(!dragging)return;
+  yaw+=(e.clientX-lx)*0.0032;pitch-=(e.clientY-ly)*0.0032;   /* horiz inverted · vert natural */
+  pitch=Math.max(-1.5,Math.min(1.5,pitch));
+  lx=e.clientX;ly=e.clientY;
+});
+boot.addEventListener('click',()=>{boot.classList.add('gone');startMusic();});
+function insideVal(px,py,pz){
+  let v=-worldSDJ(px,py,pz);
+  if(sealV[3]>0)
+    v=Math.min(v,Math.hypot(px-sealV[0],py-sealV[1],pz-sealV[2])-sealV[3]);
+  return v;
+}
+function tryMove(nx,ny,nz){
+  if(insideVal(nx,ny,nz)>0.35){camP=[nx,ny,nz];return;}
+  if(insideVal(nx,camP[1],camP[2])>0.35)camP[0]=nx;
+  if(insideVal(camP[0],ny,camP[2])>0.35)camP[1]=ny;
+  if(insideVal(camP[0],camP[1],nz)>0.35)camP[2]=nz;
+}
+/* ---------------- music: game1..4.mp3 next to this file, endless ---------- */
+const TRACKS=['game1.mp3','game2.mp3','game3.mp3','game4.mp3','game5.mp3',
+              'game6.mp3','game7.mp3','game8.mp3','game9.mp3','game10.mp3'];
+let musicOn=true, musicStarted=false, mIdx=Math.floor(Math.random()*TRACKS.length), mFails=0;
+const audio=(typeof Audio!=='undefined')?new Audio():null;
+if(audio){
+  audio.preload='auto'; audio.volume=0.5;
+  audio.addEventListener('ended',()=>{mFails=0;playTrack(mIdx+1);});
+  audio.addEventListener('error',()=>{
+    if(++mFails<TRACKS.length)playTrack(mIdx+1);
+    else $('musV').textContent='no mp3s found';
+  });
+  audio.addEventListener('playing',()=>{mFails=0;$('musV').textContent=TRACKS[mIdx];});
+}
+function playTrack(i){
+  if(!audio||!musicOn)return;
+  mIdx=((i%TRACKS.length)+TRACKS.length)%TRACKS.length;
+  audio.src=TRACKS[mIdx];
+  audio.play().catch(()=>{/* autoplay policy: waits for a click */});
+}
+function startMusic(){
+  if(musicStarted||!musicOn||!audio)return;
+  musicStarted=true; playTrack(mIdx);
+}
+$('bMus').onclick=e=>{
+  musicOn=!musicOn;
+  e.target.classList.toggle('on',musicOn);
+  e.target.textContent='Music: '+(musicOn?'on':'off');
+  if(!audio)return;
+  if(musicOn){musicStarted=false;startMusic();}
+  else {audio.pause();$('musV').textContent='off';}
+};
+$('musV').textContent='starts on first click';
+/* ---------------- save / load ----------------
+   the whole game is 6 numbers. everything else is the hash. */
+function saveObj(){return {v:1,s:SEED,l:LEVEL,c:CI,k:keyFound?1:0,m:maxReached};}
+function saveCode(){return btoa(JSON.stringify(saveObj()));}
+function applySave(o){
+  if(!o||o.v!==1||typeof o.s!=='number')throw new Error('bad save');
+  SEED=o.s>>>0; LEVEL=Math.max(1,o.l|0); CI=o.c|0;
+  keyFound=!!o.k; maxReached=Math.max(LEVEL,o.m|0);
+  dirIn=computeDirIn(CI); camP=[0,0,0];
+  rebuildChain(); faceForwardGate(); updateLevelHud();
+}
+function autoSave(){
+  try{localStorage.setItem('brainDescentSave',saveCode());}catch(e){/* fine: file:// or sandbox */}
+}
+$('bSave').onclick=()=>{
+  autoSave();
+  $('stat').textContent='saved · level '+LEVEL+' room #'+CI+' (Save code gives a portable copy)';
+};
+$('bCode').onclick=()=>{
+  const c=saveCode();
+  $('stat').textContent='code: '+c;
+  if(navigator.clipboard)navigator.clipboard.writeText(c).catch(()=>{});
+};
+$('bLoad').onclick=()=>{
+  let code='';
+  try{code=localStorage.getItem('brainDescentSave')||'';}catch(e){}
+  const inp=prompt('Paste a save code (leave as-is to load the local save):',code);
+  if(inp===null)return;
+  try{applySave(JSON.parse(atob(inp.trim())));
+    $('stat').textContent='loaded · level '+LEVEL+' room #'+CI+' · seed '+SEED.toString(16);
+    banner('LEVEL '+LEVEL,'re-dreamed from the hash');
+  }catch(e){$('stat').textContent='could not read that save code';}
+};
+/* ---------------- controls ---------------- */
+const MODES=[
+  {name:'Boundary', note:'the walls are your camera. the moons are optical crystals — the room bends and refocuses through every one of them.'},
+  {name:'Projection', note:'the moons carry your face; every wall is a mirror. the image emanates from the bulk — the holographic swap.'},
+  {name:'Cascade', note:'heavy glass: Fresnel rims wear your face, the ray refracts through and keeps going, tinted by each crystal it crosses.'},
+];
+function setMode(mi){
+  mode=mi;
+  ['m0','m1','m2'].forEach((id,i)=>$(id).classList.toggle('on',i===mi));
+  $('modeV').textContent=MODES[mi].name;
+  $('modeNote').textContent=MODES[mi].note;
+}
+setMode(0);
+function bind(id,lab,fn){const el=$(id);el.addEventListener('input',()=>{fn(parseFloat(el.value));$(lab).textContent=el.value;});}
+bind('m','m_l',v=>{P.mGain=v;});
+bind('g','g_l',v=>{P.lensK=v;});
+bind('v','v_l',v=>{if(audio)audio.volume=v;});
+$('m0').onclick=()=>setMode(0);
+$('m1').onclick=()=>setMode(1);
+$('m2').onclick=()=>setMode(2);
+$('bSrc').onclick=()=>{useCam=!useCam;setSrcLabel();};
+$('bSeed').onclick=()=>{ SEED=(Math.random()*4294967296)>>>0;
+  LEVEL=1;maxReached=1;keyFound=false;CI=0;
+  dirIn=[Math.sin(rng(0,99)*6.283),Math.cos(rng(0,99)*6.283)];
+  camP=[0,0,0]; rebuildChain(); faceForwardGate(); updateLevelHud();
+  banner('LEVEL 1','a new brain · seed '+SEED.toString(16));
+  $('stat').textContent='new brain · seed '+SEED.toString(16); };
+$('bIdle').onclick=e=>{idle^=1;e.target.classList.toggle('on',!!idle);
+  e.target.textContent='Idle spin: '+(idle?'on':'off');};
+if(matchMedia('(prefers-reduced-motion: reduce)').matches){
+  idle=0;$('bIdle').classList.remove('on');$('bIdle').textContent='Idle spin: off';
+}
+/* try to resume a local autosave silently */
+try{const c=localStorage.getItem('brainDescentSave');
+  if(c){applySave(JSON.parse(atob(c)));
+    $('stat').textContent='resumed · level '+LEVEL+' room #'+CI;}
+}catch(e){/* fresh brain */}
+updateLevelHud();
+/* ---------------- resize ---------------- */
+function resize(){
+  const dpr=Math.min(devicePixelRatio||1,1.35);
+  cvs.width=Math.floor(innerWidth*dpr);
+  cvs.height=Math.floor(innerHeight*dpr);
+  gl.viewport(0,0,cvs.width,cvs.height);
+}
+addEventListener('resize',resize);resize();
+/* ---------------- resonance: hot / cold toward the key ---------------- */
+function updateResonance(){
+  if(keyFound){$('resT').textContent='key held';$('resFill').style.width='100%';return;}
+  const kRoom=keyRoomOf(LEVEL);
+  let res,txt;
+  if(keyPos){
+    const d=Math.hypot(camP[0]-keyPos[0],camP[1]-keyPos[1],camP[2]-keyPos[2]);
+    res=Math.max(0.35,Math.min(1,1-(d-2)/42));
+    txt='very close — '+d.toFixed(0)+' m';
+  }else{
+    const away=kRoom-CI;
+    res=Math.max(0.04,0.34/(1+Math.abs(away)));
+    txt=Math.abs(away)+' room'+(Math.abs(away)===1?'':'s')+(away>0?' ahead':' behind');
+  }
+  $('resT').textContent=txt;
+  $('resFill').style.width=(res*100).toFixed(0)+'%';
+}
+/* ---------------- shader compile: DEFERRED so the boot screen paints first,
+   PARALLEL where the driver allows it, and any failure shows its log -------- */
+let prog=null,U={};
+function sh(type,src){const s=gl.createShader(type);gl.shaderSource(s,src);
+  gl.compileShader(s);return s;}
+function compileAndStart(){
+  const vs=sh(gl.VERTEX_SHADER,VERT), fs=sh(gl.FRAGMENT_SHADER,FRAG);
+  prog=gl.createProgram();
+  gl.attachShader(prog,vs);gl.attachShader(prog,fs);
+  gl.linkProgram(prog);
+  const ext=gl.getExtension('KHR_parallel_shader_compile');
+  function finish(){
+    if(!gl.getProgramParameter(prog,gl.LINK_STATUS)){
+      const log=(gl.getShaderInfoLog(fs)||'')+' '+(gl.getShaderInfoLog(vs)||'')
+               +' '+(gl.getProgramInfoLog(prog)||'');
+      bootErr('Shader failed: '+log.trim());
+      return;
+    }
+    gl.useProgram(prog);
+    ['iRes','iTime','camP','camR','camU','camF','nWell','mode','keyWell','mGain','lensK','camTex',
+     'wells','wellCol','wellPar','roomPos','roomPar','roomMod','roomTintU','seal']
+     .forEach(k=>U[k]=gl.getUniformLocation(prog,k));
+    gl.uniform1i(U.camTex,0);
+    $('bootStat').textContent='ready — click to enter';
+    requestAnimationFrame(loop);
+  }
+  if(ext){
+    (function poll(){
+      if(gl.getProgramParameter(prog,ext.COMPLETION_STATUS_KHR))finish();
+      else requestAnimationFrame(poll);
+    })();
+  }else finish();
+}
+/* ---------------- loop ---------------- */
+let t0=performance.now(),simT=0,frames=0,fpsT=t0;
+function loop(now){
+  const dt=Math.min((now-t0)/1000,0.05);t0=now;
+  if(idle)simT+=dt; else simT+=dt*0.06;
+  const cp=Math.cos(pitch),sp=Math.sin(pitch),cy=Math.cos(yaw),sy=Math.sin(yaw);
+  const F=[sy*cp,sp,cy*cp], Rv=[cy,0,-sy], Uv=[-sy*sp,cp,-cy*sp];
+  const spd=(keys.ShiftLeft||keys.ShiftRight?14:6)*dt;
+  let mx=0,my=0,mz=0;
+  if(keys.KeyW){mx+=F[0]*spd;my+=F[1]*spd;mz+=F[2]*spd;}
+  if(keys.KeyS){mx-=F[0]*spd;my-=F[1]*spd;mz-=F[2]*spd;}
+  if(keys.KeyD){mx+=Rv[0]*spd;mz+=Rv[2]*spd;}
+  if(keys.KeyA){mx-=Rv[0]*spd;mz-=Rv[2]*spd;}
+  if(keys.KeyE)my+=spd;
+  if(keys.KeyQ)my-=spd;
+  if(mx||my||mz)tryMove(camP[0]+mx,camP[1]+my,camP[2]+mz);
+  /* room transition: deep inside next -> dream forward; inside prev -> re-dream back */
+  if(roomSDJ(camP[0],camP[1],camP[2],2)<-1.0)advance();
+  else if(roomSDJ(camP[0],camP[1],camP[2],0)<-1.0)retreat();
+  uploadBoundary(simT);
+  const nW=packWorld(simT);
+  /* key pickup: touch the gold crystal */
+  if(!keyFound && keyPos){
+    const d=Math.hypot(camP[0]-keyPos[0],camP[1]-keyPos[1],camP[2]-keyPos[2]);
+    if(d<keyR+1.0){
+      keyFound=true; keyWell=-1; sealV=[0,0,0,-1];
+      banner('KEY CRYSTAL','the seal dissolves — find the far gate');
+      updateLevelHud(); autoSave();
+    }
+  }
+  gl.useProgram(prog);
+  gl.uniform2f(U.iRes,cvs.width,cvs.height);
+  gl.uniform1f(U.iTime,simT);
+  gl.uniform3f(U.camP,camP[0],camP[1],camP[2]);
+  gl.uniform3f(U.camR,Rv[0],Rv[1],Rv[2]);
+  gl.uniform3f(U.camU,Uv[0],Uv[1],Uv[2]);
+  gl.uniform3f(U.camF,F[0],F[1],F[2]);
+  gl.uniform1i(U.nWell,nW);
+  gl.uniform1i(U.mode,mode);
+  gl.uniform1i(U.keyWell,keyWell);
+  gl.uniform1f(U.mGain,P.mGain);
+  gl.uniform1f(U.lensK,P.lensK);
+  gl.uniform4fv(U.wells,wellsF);
+  gl.uniform3fv(U.wellCol,colsF);
+  gl.uniform4fv(U.wellPar,parF);
+  gl.uniform3fv(U.roomPos,roomPosF);
+  gl.uniform4fv(U.roomPar,roomParF);
+  gl.uniform4fv(U.roomMod,roomModF);
+  gl.uniform3fv(U.roomTintU,roomTintF);
+  gl.uniform4f(U.seal,sealV[0],sealV[1],sealV[2],sealV[3]);
+  gl.drawArrays(gl.TRIANGLES,0,3);
+  frames++;
+  if(now-fpsT>400){
+    $('fps').textContent=Math.round(frames*1000/(now-fpsT))+' fps';
+    frames=0;fpsT=now;
+    $('pos').textContent=camP.map(v=>v.toFixed(1)).join(', ');
+    updateResonance();
+  }
+  requestAnimationFrame(loop);
+}
+/* let the boot screen paint before the driver chews on the shader */
+$('bootStat').textContent='dreaming the shader…';
+requestAnimationFrame(()=>{try{compileAndStart();}catch(e){bootErr(e&&e.stack||e);}});
+</script>