lostpage 0.0.0-stage → 0.2.0

package/dist/scenes/lava-lamp.js

@@ -0,0 +1,55 @@
+import{shaderScene}from"../chunks/chunk-B4TY5M55.js";import{HASH,NOISE,POST,texture}from"../chunks/chunk-SH72TE6I.js";import{linear}from"../chunks/chunk-FVGCB66F.js";import{SANS,drawFittedText}from"../chunks/chunk-3ISI6SOJ.js";import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var FRAG=`
+uniform sampler2D uText;
+uniform vec3 uWax, uWax2, uLiq, uLiq2;
+uniform float uForm, uSpeed;
+${HASH}
+${NOISE}
+${POST}
+
+float field(vec2 p, float t) {
+  float f = 0.0;
+  for (int i = 0; i < 9; i++) {
+    float fi = float(i);
+    float sp = 0.07 + hash11(fi) * 0.08;
+    float x = (hash11(fi + 3.1) - 0.5) * 1.6 + sin(t * 0.3 + fi * 1.9) * 0.18;
+    float y = mod(hash11(fi + 7.7) + t * sp * (hash11(fi + 2.0) > 0.5 ? 1.0 : -1.0), 1.5) - 0.75;
+    float r = 0.08 + hash11(fi + 11.0) * 0.1;
+    vec2 d = p - vec2(x, y * 1.3);
+    d.y *= 0.85 + 0.15 * sin(t + fi);
+    f += r * r / max(dot(d, d), 1e-4);
+  }
+  return f;
+}
+
+void main() {
+  vec2 fc = gl_FragCoord.xy;
+  vec2 uv = fc / uRes;
+  vec2 p = (fc - 0.5 * uRes) / uRes.y;
+  float t = uTime * uSpeed;
+  // text field: blurred code shape adds to the metaball field so the wax gathers into it
+  float tx = textureLod(uText, uv, 3.5).a;
+  float breathe = 0.55 + 0.45 * sin(t * 0.25);
+  float f = field(p, t) + tx * 2.2 * uForm * breathe;
+  float e = 1.0 / uRes.y * 2.0;
+  float fx = field(p + vec2(e, 0.0), t) + textureLod(uText, uv + vec2(e * uRes.y / uRes.x, 0.0), 3.5).a * 2.2 * uForm * breathe;
+  float fy = field(p + vec2(0.0, e), t) + textureLod(uText, uv + vec2(0.0, e), 3.5).a * 2.2 * uForm * breathe;
+  vec3 n = normalize(vec3((f - fx) * 0.08, (f - fy) * 0.08, 1.0) );
+
+  vec3 bg = mix(uLiq2, uLiq, smoothstep(-0.6, 0.7, p.y + 0.1 * sin(p.x * 3.0 + t)));
+  bg += uWax * 0.12 * exp(-abs(p.x) * 2.0);
+  float inside = smoothstep(0.95, 1.05, f);
+  vec3 wax = mix(uWax2, uWax, smoothstep(1.0, 3.0, f));
+  vec3 L = normalize(vec3(-0.4, 0.6, 0.7));
+  float dif = max(dot(n, L), 0.0);
+  float spec = pow(max(dot(reflect(-L, n), vec3(0, 0, 1)), 0.0), 40.0);
+  wax = wax * (0.55 + 0.6 * dif) + spec * 0.6;
+  // subsurface glow near edges
+  wax += uWax * smoothstep(1.4, 1.0, f) * 0.35;
+  vec3 col = mix(bg, wax, inside);
+  // glow around the wax
+  col += uWax * 0.18 * smoothstep(0.4, 1.0, f) * (1.0 - inside);
+  col = toSRGB(aces(col * 1.1));
+  col += grain(fc, uTime) * 0.012;
+  fragColor = vec4(col, 1.0);
+}
+`,lava_lamp_default={id:"lava-lamp",name:"Lava Lamp",description:"Glossy wax blobs rise, merge and split, and every so often they pull together into the shape of the error.",category:"Abstract",kind:"2d",motion:"live",tags:["webgl","metaballs","retro","70s","groovy","calm","gradient"],layout:"bottom",codeInScene:!0,copy:{eyebrow:"Far out",title:"This page melted away.",message:"It got a little too groovy and dissolved. Mellow back to the homepage.",actions:[{label:"Float home",href:"/",variant:"primary"}]},params:{wax:"#ff6a2b",wax2:"#ff2b55",liquid:"#3b0f4f",liquid2:"#120320",form:.85,speed:1},theme:{bg:"#1b0629",fg:"#ffe9de",accent:"#ff8a4c","accent-fg":"#1b0629"},presetName:"Classic",presets:{neon:{name:"Neon Club",params:{wax:"#ff3bd4",wax2:"#7a3bff",liquid:"#05001a",liquid2:"#000000"},theme:{bg:"#05001a",accent:"#ff3bd4","accent-fg":"#fff"}},ocean:{name:"Ocean",params:{wax:"#3bd6ff",wax2:"#1f6bff",liquid:"#04243a",liquid2:"#010a14"},theme:{bg:"#03182a",accent:"#3bd6ff","accent-fg":"#010a14"}},lemon:{name:"Lemonade",params:{wax:"#ffe14d",wax2:"#ff9f1c",liquid:"#fffbe6",liquid2:"#ffe9b0"},theme:{bg:"#fff3c9",fg:"#3a2a00",accent:"#3a2a00","accent-fg":"#fff"}},mint:{name:"Mint",params:{wax:"#6bffcf",wax2:"#2bd4a0",liquid:"#0d3b4f",liquid2:"#031821"},theme:{bg:"#06222c",accent:"#6bffcf","accent-fg":"#03141a"}},sunset:{name:"Sunset",params:{wax:"#ffd23f",wax2:"#ff6b3d",liquid:"#ff4d8d",liquid2:"#5a1c6b"},theme:{bg:"#5a1c6b",accent:"#ffd23f","accent-fg":"#3a0f2b"}},milk:{name:"Milkshake",params:{wax:"#ff8fb1",wax2:"#ff5c8a",liquid:"#fff3e6",liquid2:"#ffe0ec"},theme:{bg:"#ffe8ef",fg:"#4a1328",accent:"#4a1328","accent-fg":"#fff"}},blue:{name:"Electric",params:{wax:"#3bc7ff",wax2:"#5a4bff",liquid:"#0b0b2e",liquid2:"#02020a"},theme:{bg:"#05051a",accent:"#3bc7ff","accent-fg":"#02020a"}}},setup(ctx){let p=ctx.params,cv=document.createElement("canvas"),tex=null,gl,draw=()=>{let h=Math.max(64,Math.round(512*ctx.height/Math.max(1,ctx.width)));cv.width=512,cv.height=h;let g=cv.getContext("2d");g.clearRect(0,0,512,h),g.save(),g.translate(0,h*.38-h*.22),drawFittedText(g,ctx.copy.code||"404",{width:512,height:h*.44,font:SANS,weight:900,fit:.8}),g.restore(),tex&&(gl.bindTexture(gl.TEXTURE_2D,tex),gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL,!0),gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,gl.RGBA,gl.UNSIGNED_BYTE,cv),gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL,!1),gl.generateMipmap(gl.TEXTURE_2D))};return{...shaderScene(ctx,{frag:FRAG,init(g){gl=g,draw(),tex=texture(gl,cv,{filter:"mipmap"})},uniforms:()=>({uText:tex,uWax:linear(p.wax),uWax2:linear(p.wax2),uLiq:linear(p.liquid),uLiq2:linear(p.liquid2),uForm:p.form,uSpeed:p.speed})}),resize:draw}}};export{lava_lamp_default as default};

package/dist/scenes/life.d.ts

@@ -0,0 +1,13 @@
+interface Params {
+    bg: string;
+    young: string;
+    old: string;
+    grid: string;
+    cell: number;
+    /** Generations per second. */
+    rate: number;
+    /** Seconds between re-seeding the code. */
+    reseed: number;
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;

package/dist/scenes/life.js

@@ -0,0 +1 @@
+import{codeBitmap}from"../chunks/chunk-MNUNTC4L.js";import{canvas2d}from"../chunks/chunk-DAZOIOF7.js";import"../chunks/chunk-3ISI6SOJ.js";import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var life_default={id:"life",name:"Game of Life",description:"Conway's cellular automaton starts from the shape of the error and evolves into gliders and chaos. Draw with your cursor to add life.",category:"Abstract",kind:"2d",motion:"live",tags:["canvas","generative","cellular-automaton","math","interactive","developer"],layout:"bottom",codeInScene:!0,copy:{eyebrow:"Generation 404",title:"This page didn't survive.",message:"It started as a perfect 404 and evolved into this. Draw on the grid to seed new life, or go home.",actions:[{label:"Restart at home",href:"/",variant:"primary"}]},params:{bg:"#0a0b10",young:"#7cf7c8",old:"#3b5bff",grid:"#12141c",cell:10,rate:12,reseed:14},theme:{bg:"#0a0b10",accent:"#7cf7c8","accent-fg":"#0a0b10","font-display":"var(--lp-font-mono)","title-weight":"600"},presetName:"Neon",presets:{matrix:{name:"Matrix",params:{bg:"#000a03",young:"#d7ffe6",old:"#18ff6d",grid:"#021208"},theme:{bg:"#000a03",accent:"#18ff6d","accent-fg":"#000a03"}},candy:{name:"Candy",params:{bg:"#fff6fa",young:"#ff3b8a",old:"#ffc2da",grid:"#ffeaf3"},theme:{bg:"#fff6fa",fg:"#3a0a22",accent:"#3a0a22","accent-fg":"#fff"}},paper:{name:"Graph Paper",params:{bg:"#f7f6f1",young:"#111111",old:"#9aa0a6",grid:"#e6e3da"},theme:{bg:"#f7f6f1",fg:"#111",accent:"#111","accent-fg":"#f7f6f1"}},heat:{name:"Heatmap",params:{bg:"#0d0505",young:"#ffe14d",old:"#ff2d2d",grid:"#170909"},theme:{bg:"#0d0505",accent:"#ffb03b","accent-fg":"#0d0505"}},tiny:{name:"Microscopic",params:{cell:5,rate:20,young:"#e0e7ff",old:"#6d5bff"}}},setup(ctx){let p=ctx.params,c=canvas2d(ctx),rnd=ctx.random,cols=0,rows=0,cell=p.cell,a=new Uint8Array(0),b=new Uint8Array(0),age=new Uint16Array(0),lastSeed=0;function seed(){let bw=Math.floor(cols*.72),bh=Math.floor(rows*.5),bm=codeBitmap(ctx.copy.code||"404",bw,bh,900),ox=Math.floor((cols-bw)/2),oy=Math.floor(rows*.08);for(let y=0;y<bh;y++)for(let x=0;x<bw;x++){let i=(oy+y)*cols+ox+x;bm[y*bw+x]&&(a[i]=1,age[i]=0)}let glider=[[1,0],[2,1],[0,2],[1,2],[2,2]];for(let k=0;k<4;k++){let gx=Math.floor(rnd()*(cols-4)),gy=Math.floor(rnd()*(rows-4));for(let[dx,dy]of glider)a[(gy+dy)*cols+gx+dx]=1}}function build(){cell=Math.max(4,Math.round(p.cell*Math.min(1.3,Math.max(.7,c.w/1440)))),cols=Math.ceil(c.w/cell),rows=Math.ceil(c.h/cell),a=new Uint8Array(cols*rows),b=new Uint8Array(cols*rows),age=new Uint16Array(cols*rows),seed()}function step(){for(let y=0;y<rows;y++){let ym=(y-1+rows)%rows*cols,y0=y*cols,yp=(y+1)%rows*cols;for(let x=0;x<cols;x++){let xm=(x-1+cols)%cols,xp=(x+1)%cols,n=a[ym+xm]+a[ym+x]+a[ym+xp]+a[y0+xm]+a[y0+xp]+a[yp+xm]+a[yp+x]+a[yp+xp],i=y0+x,live=a[i]&&n===2||n===3;b[i]=live?1:0,age[i]=live&&a[i]?Math.min(age[i]+1,999):0}}let tmp=a;a=b,b=tmp}ctx.on("pointermove",e=>{if(!(e.buttons||e.pointerType==="mouse"))return;let x=Math.floor(ctx.pointer.x/cell),y=Math.floor(ctx.pointer.y/cell);for(let dy=-1;dy<=1;dy++)for(let dx=-1;dx<=1;dx++){if(rnd()<.5)continue;let xx=(x+dx+cols)%cols,yy=(y+dy+rows)%rows;a[yy*cols+xx]=1}}),build();let acc=0,lerpHex=(h1,h2,t)=>{let n1=parseInt(h1.slice(1),16),n2=parseInt(h2.slice(1),16),r=(n1>>16&255)*(1-t)+(n2>>16&255)*t,g=(n1>>8&255)*(1-t)+(n2>>8&255)*t,bb=(n1&255)*(1-t)+(n2&255)*t;return`rgb(${r|0},${g|0},${bb|0})`},ramp=Array.from({length:16},(_,i)=>lerpHex(p.young,p.old,i/15));return{resize(){c.reset(),build()},frame(t,dt){let g=c.g;if(c.reset(),dt>0){acc+=dt;let hold=t-lastSeed<1.4;for(;acc>1/p.rate;)acc-=1/p.rate,hold||step();t-lastSeed>p.reseed&&(lastSeed=t,seed())}g.fillStyle=p.bg,g.fillRect(0,0,c.w,c.h),g.fillStyle=p.grid;for(let x=0;x<=cols;x++)g.fillRect(x*cell,0,1,c.h);for(let y=0;y<=rows;y++)g.fillRect(0,y*cell,c.w,1);for(let i=0;i<a.length;i++)a[i]&&(g.fillStyle=ramp[Math.min(15,age[i]>>1)],g.fillRect(i%cols*cell+1,(i/cols|0)*cell+1,cell-1,cell-1))}}}};export{life_default as default};

package/dist/scenes/lighthouse.d.ts

@@ -0,0 +1,11 @@
+interface Params {
+    sky: string;
+    sea: string;
+    rock: string;
+    beam: string;
+    fog: number;
+    /** Seconds per rotation. */
+    period: number;
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;

package/dist/scenes/lighthouse.js

@@ -0,0 +1,60 @@
+import{shaderScene}from"../chunks/chunk-B4TY5M55.js";import{HASH,NOISE,POST}from"../chunks/chunk-SH72TE6I.js";import{linear}from"../chunks/chunk-FVGCB66F.js";import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var FRAG=`
+uniform vec3 uSky, uSea, uRock, uBeam;
+uniform float uFog, uPeriod;
+${HASH}
+${NOISE}
+${POST}
+
+void main() {
+  vec2 fc = gl_FragCoord.xy;
+  vec2 uv = fc / uRes;
+  vec2 p = (fc - 0.5 * uRes) / uRes.y;
+  float t = uTime;
+  vec2 lamp = vec2(0.36, 0.12);
+  float ang = t * 6.28318 / uPeriod;
+  // beam direction sweeps in a circle; we see it as a cone that widens and narrows (foreshortening)
+  vec2 dir = vec2(cos(ang), 0.0);
+  float facing = sin(ang); // >0 toward the viewer
+  vec2 d = p - lamp;
+  float along = dot(d, normalize(vec2(dir.x, 0.0001 + 0.0)));
+  float spread = mix(0.05, 0.6, smoothstep(-0.2, 1.0, facing));
+  float cone = smoothstep(spread * abs(along) + 0.01, 0.0, abs(d.y)) * step(0.0, along * sign(dir.x + 1e-4));
+  cone *= exp(-abs(along) * mix(1.2, 0.4, facing));
+  vec3 col = mix(uSky * 0.4, uSky, smoothstep(-0.2, 0.5, p.y));
+  // clouds
+  col = mix(col, uSky * 1.4, smoothstep(0.5, 0.75, fbm(p * vec2(1.5, 3.0) + vec2(t * 0.02, 0.0))) * 0.4);
+  // sea
+  float hz = -0.08;
+  if (p.y < hz) {
+    float w = fbm(vec2(p.x * 10.0, (p.y - hz) * 60.0 / (hz - p.y + 0.05)) + vec2(t * 0.3, t * 0.1));
+    col = uSea * (0.55 + 0.5 * w);
+    // beam reflection on the water
+    float refl = exp(-pow((p.x - lamp.x - cos(ang) * 0.4 * (hz - p.y) * 3.0) * 8.0, 2.0)) * smoothstep(0.0, 0.6, facing) * (0.4 + w);
+    col += uBeam * refl * 0.25;
+  }
+  // fog lit by the beam
+  float fogN = fbm(p * 3.0 + vec2(t * 0.05, 0.0));
+  col += uBeam * cone * (0.35 + 0.65 * fogN) * (0.7 + uFog);
+  col = mix(col, uSky * 0.9, uFog * 0.35 * smoothstep(0.3, -0.1, abs(p.y - hz)));
+  // rocky headland and the tower
+  float cliff = -0.1 + 0.085 * smoothstep(0.05, 0.24, p.x) * smoothstep(0.78, 0.46, p.x) + 0.035 * (fbm(vec2(p.x * 9.0, 1.0)) - 0.5);
+  float rock = step(p.y, cliff) * step(0.02, p.x);
+  col = mix(col, uRock * (0.5 + 0.5 * fbm(p * 30.0)), rock);
+  vec2 tq = p - vec2(0.36, -0.035);
+  float tower = step(abs(tq.x), mix(0.035, 0.022, clamp(tq.y / 0.15, 0.0, 1.0))) * step(0.0, tq.y) * step(tq.y, 0.15);
+  float bands = step(0.5, fract(tq.y * 20.0));
+  vec3 tcol = mix(vec3(0.9), vec3(0.75, 0.12, 0.12), bands) * 0.55;
+  col = mix(col, tcol, tower);
+  float gallery = step(abs(tq.x), 0.032) * step(abs(tq.y - 0.155), 0.006);
+  col = mix(col, vec3(0.08), gallery);
+  // the lamp itself flares as the beam faces us
+  float ld = length(p - lamp);
+  float flare = smoothstep(-0.3, 1.0, facing);
+  col += uBeam * (exp(-ld * 90.0) * 2.0 + exp(-ld * 14.0) * 0.4 * flare + exp(-abs(p.y - lamp.y) * 120.0) * exp(-abs(p.x - lamp.x) * 3.0) * 0.4 * flare * flare);
+  col = toSRGB(aces(col * 1.1));
+  col *= mix(0.6, 1.0, vignette(uv, 0.3));
+  col += grain(fc, t) * 0.02;
+  fragColor = vec4(col, 1.0);
+}
+`,lighthouse_default={id:"lighthouse",name:"Lighthouse",description:"A lighthouse on a rocky headland sweeps its beam through the sea fog, searching the water for your page.",category:"Ocean",kind:"2d",motion:"live",tags:["webgl","lighthouse","night","ocean","fog","moody","cinematic"],layout:"left",copy:{eyebrow:"Keep watch",title:"We searched every wave.",message:"The beam has swept this coast all night. No sign of the page. Steer by the light and head home.",actions:[{label:"Steer for home",href:"/",variant:"primary"}]},params:{sky:"#0d1b2e",sea:"#06111f",rock:"#1a1a1d",beam:"#fff2c9",fog:.6,period:7},theme:{bg:"#08111e",fg:"#f2ecdc",accent:"#fff2c9","accent-fg":"#08111e","code-color":"rgba(255,242,201,.16)"},presetName:"Sea Fog",presets:{aurora:{name:"Northern Coast",params:{sky:"#03201f",sea:"#010f10",beam:"#e6fff6",fog:.4},theme:{bg:"#021615"}},storm:{name:"Squall",params:{sky:"#1a1f26",sea:"#0a0d10",fog:1,period:5},theme:{bg:"#111418"}},dusk:{name:"Last Light",params:{sky:"#3a2a52",sea:"#120f22",beam:"#ffe0b0",fog:.3},theme:{bg:"#1c1530"}}},css:`& .lp-overlay{padding-left:max(16px,calc(var(--lp-pad) * 1.5))}& .lp-head,& .lp-body{max-width:min(460px,40cqw)}
+@container (max-width:760px){& .lp-head,& .lp-body{max-width:none}& .lp-overlay{justify-content:flex-end}}`,setup(ctx){let p=ctx.params;return shaderScene(ctx,{frag:FRAG,uniforms:()=>({uSky:linear(p.sky),uSea:linear(p.sea),uRock:linear(p.rock),uBeam:linear(p.beam),uFog:p.fog,uPeriod:p.period})})}};export{lighthouse_default as default};

package/dist/scenes/loading.d.ts

@@ -0,0 +1,6 @@
+interface Params {
+    style: "minimal" | "dialog" | "terminal";
+    steps: string[];
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;

package/dist/scenes/loading.js

@@ -0,0 +1,34 @@
+import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var esc=s=>s.replace(/[&<>"]/g,c=>({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;"})[c]),loading_default={id:"loading",name:"Still Loading",description:"A progress bar that tries its best: resolving, asking nicely, checking under the couch. It stalls at 99%, then gives up at 404%.",category:"Playful",kind:"2d",motion:"live",tags:["dom","progress","funny","minimal","light","loading"],layout:"none",copy:{title:"Loading the page you asked for\u2026",message:"Any moment now. Actually, it doesn't exist.",actions:[{label:"Load the homepage instead",href:"/",variant:"primary"}]},params:{style:"minimal",steps:["Resolving address\u2026","Asking the server nicely\u2026","Checking under the couch\u2026","Looking behind the cache\u2026","Bribing the CDN\u2026","Almost there\u2026","Hmm.","Still nothing."]},theme:{bg:"#fafaf8",fg:"#111",accent:"#111","accent-fg":"#fff"},presetName:"Minimal",presets:{dark:{name:"Minimal Dark",params:{style:"minimal"},theme:{bg:"#0b0b0d",fg:"#f2f2f2",accent:"#f2f2f2","accent-fg":"#0b0b0d"}},warm:{name:"Minimal Warm",params:{style:"minimal"},theme:{bg:"#f6ede2",fg:"#2a1a0a",accent:"#e8572a","accent-fg":"#fff"}},dialog:{name:"Retro Dialog",params:{style:"dialog"},theme:{bg:"#008080",fg:"#000",accent:"#000","accent-fg":"#fff"}},terminal:{name:"Package Manager",params:{style:"terminal",steps:["resolving dependencies","fetching page@latest","linking","building","verifying integrity"]},theme:{bg:"#0d1117",fg:"#c9d1d9",accent:"#58a6ff","accent-fg":"#0d1117"}}},css:`
+& .ld{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:20px}
+& .ld-min{width:min(720px,100%)}
+& .ld-min h1{font:600 clamp(28px,4.4cqw,56px)/1.08 var(--lp-font-display);letter-spacing:-.04em;margin:0 0 10px}
+& .ld-min .step{color:var(--lp-muted);font-size:clamp(14px,1.3cqw,17px);min-height:1.4em;margin:0 0 28px}
+& .ld-bar{position:relative;height:8px;border-radius:99px;background:color-mix(in srgb,var(--lp-fg) 10%,transparent);overflow:hidden}
+& .ld-bar i{position:absolute;inset:0 auto 0 0;background:var(--lp-fg);border-radius:inherit}
+& .ld-bar.err i{background:#e5484d}
+& .ld-row{display:flex;justify-content:space-between;margin-top:12px;font:600 14px/1 var(--lp-font-mono)}
+& .ld-actions{margin-top:28px;opacity:0;transform:translateY(6px);transition:.5s}
+& .ld.done .ld-actions{opacity:1;transform:none}
+& .ld a.btn{display:inline-flex;padding:12px 18px;border-radius:999px;background:var(--lp-accent);color:var(--lp-accent-fg);text-decoration:none;font-size:13px;font-weight:600}
+& .ld-dialog{width:min(460px,100%);background:#c0c0c0;box-shadow:inset -2px -2px #000,inset 2px 2px #fff,inset -4px -4px #808080,inset 4px 4px #dfdfdf;padding:4px;font:12px/1.4 "MS Sans Serif","Tahoma","Geneva",sans-serif;color:#000}
+& .ld-dialog .tb{background:linear-gradient(90deg,#000080,#1084d0);color:#fff;font-weight:700;padding:4px 6px;display:flex;justify-content:space-between}
+& .ld-dialog .tb b{background:#c0c0c0;color:#000;width:16px;height:14px;display:flex;align-items:center;justify-content:center;box-shadow:inset -1px -1px #000,inset 1px 1px #fff;font-size:10px}
+& .ld-dialog .bd{padding:14px 12px}
+& .ld-dialog .anim{height:46px;position:relative;margin-bottom:10px}
+& .ld-dialog .anim .f{position:absolute;top:6px;width:34px;height:30px;background:#ffd84d;box-shadow:inset 0 0 0 1px #8a6b00}
+& .ld-dialog .anim .f.a{left:4px}& .ld-dialog .anim .f.b{right:4px}
+& .ld-dialog .anim .doc{position:absolute;top:2px;width:18px;height:22px;background:#fff;box-shadow:inset 0 0 0 1px #000}
+& .ld-dialog .pb{height:20px;box-shadow:inset 1px 1px #808080,inset -1px -1px #fff;background:#fff;padding:2px;display:flex;gap:2px;overflow:hidden;margin:8px 0}
+& .ld-dialog .pb i{width:10px;flex:none;background:#000080}
+& .ld-dialog .btns{display:flex;justify-content:flex-end;gap:6px;margin-top:10px}
+& .ld-dialog .btns a{min-width:76px;text-align:center;padding:4px 8px;background:#c0c0c0;color:#000;text-decoration:none;box-shadow:inset -1px -1px #000,inset 1px 1px #fff,inset -2px -2px #808080}
+& .ld-term{width:min(820px,100%);font:clamp(13px,1.2cqw,16px)/1.75 var(--lp-font-mono)}
+& .ld-term .ok{color:#3fb950}& .ld-term .er{color:#f85149}& .ld-term .dim{color:#8b949e}
+& .ld-term a{color:#58a6ff}
+& .ld-term .bar{color:#58a6ff;white-space:pre}
+`,setup(ctx){let p=ctx.params,c=ctx.copy,home=c.actions[0]?.href??"/",wrap=document.createElement("div");wrap.className="ld";let render;if(p.style==="dialog"){wrap.innerHTML=`<div class="ld-dialog" role="dialog" aria-labelledby="ldt"><div class="tb"><span id="ldt">Copying page\u2026</span><b aria-hidden="true">\u2715</b></div><div class="bd">
+        <div class="anim" aria-hidden="true"><div class="f a"></div><div class="f b"></div><div class="doc"></div></div>
+        <h1 class="lp-sr">Error ${esc(c.code)}: ${esc(c.title)}</h1><div class="msg">${esc(c.title)}</div><div class="pb"></div><div class="eta">Calculating time remaining\u2026</div>
+        <div class="btns"><a href="${esc(home)}">${esc(c.actions[0]?.label??"Home")}</a><a href="${esc(home)}">Cancel</a></div></div></div>`;let pb=wrap.querySelector(".pb"),doc=wrap.querySelector(".doc"),eta=wrap.querySelector(".eta"),msg=wrap.querySelector(".msg");render=t=>{let k=Math.min(.99,t/9),blocks=Math.floor(k*34);pb.children.length!==blocks&&(pb.innerHTML="<i></i>".repeat(blocks));let f=t*.7%1;doc.style.left=`calc(${10+f*80}% - 9px)`,doc.style.top=`${2+Math.sin(f*Math.PI)*-6+6}px`;let mins=Math.floor(t*37)%9999;eta.textContent=t>9?`Error ${c.code}: the source page cannot be found.`:`${Math.max(1,9999-mins)} minutes remaining`,t>9&&(msg.textContent=c.message)}}else if(p.style==="terminal"){wrap.innerHTML=`<div class="ld-term"><h1 class="lp-sr">Error ${esc(c.code)}: ${esc(c.title)}</h1><div class="log"></div></div>`;let log=wrap.querySelector(".log"),shown=-1;render=t=>{let step=Math.floor(t/.9),lines=[`<span class="dim">$</span> npm install ${esc(location?.pathname?.replace(/^\//,"")||"page")}`];for(let i=0;i<Math.min(step,p.steps.length);i++)lines.push(`<span class="ok">\u2714</span> ${esc(p.steps[i])}`);if(step<p.steps.length){let fill=Math.floor(t%.9/.9*24);lines.push(`<span class="bar">[${"\u2588".repeat(fill)}${"\u2591".repeat(24-fill)}]</span> ${esc(p.steps[step]??"")}`)}else lines.push(`<span class="er">\u2716 ERR! code E${esc(c.code)}</span>`,`<span class="er">\u2716 ERR! ${esc(c.title)}</span>`,`<span class="dim">npm ERR! ${esc(c.message)}</span>`,`<span class="dim">Try:</span> <a href="${esc(home)}">${esc(c.actions[0]?.label??"go home")}</a>`);(lines.length!==shown||step<p.steps.length)&&(log.innerHTML=lines.join("<br>"),shown=lines.length)}}else{wrap.innerHTML=`<div class="ld-min"><h1><span class="lp-sr">Error ${esc(c.code)}: </span><span class="ttl">${esc(c.title)}</span></h1><p class="step"></p>
+        <div class="ld-bar"><i></i></div><div class="ld-row"><span class="pct">0%</span><span class="eta"></span></div>
+        <div class="ld-actions"><a class="btn" href="${esc(home)}">${esc(c.actions[0]?.label??"Home")}</a></div></div>`;let bar=wrap.querySelector(".ld-bar"),fill=bar.querySelector("i"),pct=wrap.querySelector(".pct"),stepEl=wrap.querySelector(".step"),eta=wrap.querySelector(".eta"),ttl=wrap.querySelector(".ttl");render=t=>{let k=t<6?1-Math.pow(1-t/6,2.4):1,v=Math.min(99,Math.floor(k*99)),failed=t>8.5;fill.style.width=`${failed?100:v}%`,bar.classList.toggle("err",failed),pct.textContent=failed?`${c.code}%`:`${v}%`,eta.textContent=failed?"failed":t>6?"any second now":`${Math.max(1,Math.ceil(6-t))}s left`,stepEl.textContent=failed?c.message:p.steps[Math.min(p.steps.length-1,Math.floor(t/1.05))],failed&&(ttl.textContent="Couldn't load that page."),wrap.classList.toggle("done",failed)}}return ctx.root.append(wrap),wrap.querySelectorAll("a").forEach(a=>a.addEventListener("click",e=>{e.metaKey||e.ctrlKey||(e.preventDefault(),ctx.navigate(a.getAttribute("href"),e))})),{frame(t){render(ctx.reducedMotion?99:t)},destroy(){wrap.remove()}}}};export{loading_default as default};

package/dist/scenes/lost-at-sea.d.ts

@@ -0,0 +1,35 @@
+interface Params {
+    skyTop: string;
+    skyMid: string;
+    skyHorizon: string;
+    cloudLit: string;
+    cloudDark: string;
+    clouds: number;
+    water: string;
+    scatter: string;
+    /** Sun / moon: elevation & azimuth in degrees, colour, disc size, glow strength. */
+    sunElevation: number;
+    sunAzimuth: number;
+    sunColor: string;
+    sunDisc: number;
+    sunGlow: number;
+    sunSize: number;
+    buoy: boolean;
+    lamp: string;
+    lampPower: number;
+    /** Seconds per flash cycle; 0 = steady. */
+    blink: number;
+    waveHeight: number;
+    choppiness: number;
+    speed: number;
+    cameraHeight: number;
+    fog: number;
+    fogColor: string;
+    stars: number;
+    rain: number;
+    lightning: number;
+    bioluminescence: number;
+    exposure: number;
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;

package/dist/scenes/lost-at-sea.js

@@ -0,0 +1,258 @@
+import{shaderScene}from"../chunks/chunk-B4TY5M55.js";import{HASH,NOISE,POST}from"../chunks/chunk-SH72TE6I.js";import{linear}from"../chunks/chunk-FVGCB66F.js";import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var FRAG=`
+uniform vec3 uSkyTop, uSkyMid, uSkyHorizon, uCloudLit, uCloudDark, uWater, uScatter, uSunDir, uSunColor, uLamp, uFogColor;
+uniform float uClouds, uSunDisc, uSunGlow, uSunSize, uBuoy, uLampPower, uBlink, uAmp, uChop, uSpeed, uCamH, uFog, uStars, uRain, uLightning, uBio, uExposure;
+${HASH}
+${NOISE}
+${POST}
+
+const float FOCAL = 1.65;
+const vec3 BUOY = vec3(0.0, 0.0, -190.0);
+
+// Sum of sharpened directional waves, each one dragging the sample point along its slope,
+// which bunches crests together and widens troughs like real wind sea.
+float waves(vec2 p, int iters) {
+  float t = uTime * uSpeed;
+  float freq = 0.26;
+  float amp = uAmp * 0.5;
+  float h = 0.0;
+  float ang = 0.55;
+  for (int i = 0; i < 48; i++) {
+    if (i >= iters) break;
+    vec2 d = vec2(sin(ang), cos(ang));
+    float x = dot(d, p) * freq + t * sqrt(9.81 * freq) + float(i) * 1.618;
+    float w = exp(sin(x) - 1.0);
+    float dw = w * cos(x);
+    h += (w - 0.4) * amp;
+    p -= d * dw * amp * uChop * 0.9;
+    freq *= 1.18;
+    amp *= 0.82;
+    ang += 2.399;
+  }
+  return h;
+}
+
+vec3 waterNormal(vec2 p, float dist) {
+  float e = 0.01 + dist * 0.0024;
+  int iters = int(mix(34.0, 8.0, smoothstep(6.0, 420.0, dist)));
+  float h = waves(p, iters);
+  float hx = waves(p + vec2(e, 0.0), iters);
+  float hz = waves(p + vec2(0.0, e), iters);
+  return normalize(vec3(h - hx, e, h - hz));
+}
+
+float lightningFlash(float t) {
+  float k = floor(t / 7.3);
+  float lt = t - k * 7.3 - hash11(k) * 4.0;
+  float f = step(0.0, lt) * exp(-lt * 9.0) + step(0.16, lt) * 0.7 * exp(-(lt - 0.16) * 7.0) + step(0.42, lt) * 0.4 * exp(-(lt - 0.42) * 12.0);
+  return f * step(0.35, hash11(k + 3.1)) * uLightning;
+}
+
+vec3 sky(vec3 rd, float flash, bool detailed) {
+  float y = max(rd.y, 0.0);
+  vec3 col = mix(uSkyHorizon, uSkyMid, smoothstep(0.0, 0.14, y));
+  col = mix(col, uSkyTop, smoothstep(0.1, 0.75, y));
+
+  float sd = max(dot(rd, uSunDir), 0.0);
+  col += uSunColor * uSunGlow * (0.18 * pow(sd, 6.0) + 0.5 * pow(sd, 48.0) + 0.9 * pow(sd, 600.0));
+  // atmosphere band hugging the horizon near the light
+  col += uSunColor * uSunGlow * 0.35 * exp(-y * 18.0) * pow(sd, 3.0);
+
+  if (detailed && uStars > 0.0 && rd.y > 0.0) {
+    vec2 g = vec2(atan(rd.x, -rd.z), asin(rd.y)) * 260.0;
+    vec2 id = floor(g);
+    vec2 lp = fract(g) - 0.5 - (hash22(id) - 0.5) * 0.6;
+    float rnd = hash12(id + 7.0);
+    float s = smoothstep(0.16, 0.0, length(lp)) * step(0.985, rnd) * (0.5 + 0.5 * sin(uTime * (1.0 + rnd * 3.0) + rnd * 40.0));
+    col += vec3(0.85, 0.9, 1.0) * s * uStars * smoothstep(0.02, 0.2, y) * 1.4;
+  }
+
+  float disc = smoothstep(uSunSize, uSunSize * 0.8, acos(clamp(dot(rd, uSunDir), -1.0, 1.0)));
+  vec3 discCol = uSunColor * uSunDisc;
+  if (detailed && uSunDisc > 0.0 && uSunDir.y > 0.12) {
+    // moon: a little surface texture
+    vec2 mp = (rd.xy - uSunDir.xy) / uSunSize;
+    discCol *= 0.82 + 0.18 * fbm(mp * 3.0 + 4.0);
+  }
+  col = mix(col, discCol, disc * uSunDisc / max(uSunDisc, 1e-4));
+
+  if (uClouds > 0.0 && rd.y > -0.02) {
+    float yy = max(rd.y, 0.0) + 0.035;
+    vec2 cp = rd.xz / yy;
+    cp = cp * vec2(0.3, 0.8) + vec2(uTime * 0.012, uTime * 0.004);
+    float n = detailed ? fbm(cp * 0.9) : vnoise(cp * 0.9) * 0.55 + vnoise(cp * 1.9) * 0.3;
+    float n2 = detailed ? fbm(cp * 2.6 + 9.0) : 0.5;
+    float cov = smoothstep(1.0 - uClouds, 1.0 - uClouds + 0.38, n);
+    float thick = smoothstep(0.3, 0.75, n2 * 0.5 + n * 0.6);
+    vec3 cc = mix(uCloudLit, uCloudDark, thick);
+    cc += uSunColor * uSunGlow * 0.6 * pow(sd, 10.0) * (1.0 - thick);
+    cc += vec3(0.55, 0.62, 0.85) * flash * (0.6 + n2);
+    float fade = smoothstep(-0.02, 0.06, rd.y);
+    col = mix(col, cc, cov * fade * 0.92);
+  }
+  col += vec3(0.35, 0.4, 0.6) * flash * 0.35;
+  return col;
+}
+
+// Ray against the moving water surface: slab search, then bisection.
+float traceWater(vec3 ro, vec3 rd) {
+  float top = 1.7 * uAmp, bot = -0.75 * uAmp;
+  if (rd.y >= -1e-4) return -1.0;
+  float t0 = (ro.y - top) / -rd.y;
+  float t1 = min((ro.y - bot) / -rd.y, 4000.0);
+  float prevT = t0;
+  float t = t0;
+  float stepT = (t1 - t0) / 26.0;
+  for (int i = 0; i < 27; i++) {
+    vec3 p = ro + rd * t;
+    if (p.y < waves(p.xz, 9)) break;
+    prevT = t;
+    t += stepT;
+  }
+  float a = prevT, b = min(t, t1);
+  for (int i = 0; i < 6; i++) {
+    float m = 0.5 * (a + b);
+    vec3 p = ro + rd * m;
+    if (p.y < waves(p.xz, 9)) b = m; else a = m;
+  }
+  return 0.5 * (a + b);
+}
+
+float buoyBob(){ return waves(BUOY.xz, 10); }
+
+// Silhouette of a navigation buoy in metres (x across, y up from the waterline).
+float buoySDF(vec2 q) {
+  float hull = length(max(abs(q - vec2(0.0, 0.18)) - vec2(0.62, 0.22), 0.0)) - 0.08;
+  float tower = abs(q.x) - mix(0.36, 0.13, clamp((q.y - 0.3) / 2.0, 0.0, 1.0));
+  tower = max(tower, abs(q.y - 1.35) - 1.05);
+  float cage = length(max(abs(q - vec2(0.0, 2.52)) - vec2(0.17, 0.14), 0.0)) - 0.02;
+  float cap = length(max(abs(q - vec2(0.0, 2.73)) - vec2(0.2, 0.025), 0.0));
+  float mast = max(abs(q.x) - 0.018, abs(q.y - 3.0) - 0.28);
+  return min(min(min(hull, tower), min(cage, cap)), mast);
+}
+
+void main() {
+  vec2 fc = gl_FragCoord.xy;
+  vec2 uv = (fc - 0.5 * uRes) / uRes.y;
+  float t = uTime;
+  float flash = lightningFlash(t);
+
+  // camera: slight swell bob and roll, pointer adds a gentle look-around
+  float bob = sin(t * 0.55) * 0.16 * (0.4 + uAmp) + sin(t * 0.31 + 1.3) * 0.08;
+  vec3 ro = vec3(0.0, uCamH + bob, 0.0);
+  float yaw = uMouse.x * 0.07;
+  float pitch = 0.028 + uMouse.y * 0.025 + sin(t * 0.4) * 0.004 * (0.5 + uAmp);
+  float roll = sin(t * 0.47) * 0.006 * (0.6 + uAmp);
+  vec3 fw = normalize(vec3(sin(yaw), sin(pitch), -cos(yaw)));
+  vec3 rt = normalize(cross(fw, vec3(sin(roll), cos(roll), 0.0)));
+  vec3 up = cross(rt, fw);
+  vec3 rd = normalize(fw * FOCAL + rt * uv.x + up * uv.y);
+  float px = 1.0 / (FOCAL * uRes.y); // radians per pixel
+
+  vec3 col;
+  float tw = traceWater(ro, rd);
+  float hitDist = tw > 0.0 ? tw : 1e9;
+  float blink = uBlink > 0.0 ? 0.25 + 0.75 * pow(max(sin(t * 6.2831 / uBlink) * 0.5 + 0.5, 1e-4), 6.0) : 1.0;
+  float bobY = buoyBob();
+  vec3 lampPos = BUOY + vec3(0.0, 2.52 + bobY, 0.0);
+
+  if (tw > 0.0) {
+    vec3 p = ro + rd * tw;
+    vec3 n = waterNormal(p.xz, tw);
+    float h01 = clamp(p.y / max(uAmp * 1.9, 1e-3) + 0.35, 0.0, 1.0);
+    float ndv = max(dot(n, -rd), 0.0);
+    float fres = 0.02 + 0.98 * pow(1.0 - ndv, 5.0);
+    vec3 r = reflect(rd, n);
+    r.y = abs(r.y);
+    vec3 refl = sky(r, flash, false);
+    vec3 body = uWater + uScatter * pow(h01, 2.0) * (0.35 + 0.65 * max(dot(n, normalize(vec3(uSunDir.x, 0.0, uSunDir.z) + vec3(0, 0.3, 0))), 0.0));
+    col = mix(body, refl, fres);
+
+    // sun / moon glitter
+    float sr = max(dot(r, uSunDir), 0.0);
+    col += uSunColor * uSunGlow * (pow(sr, 900.0) * 7.0 + pow(sr, 90.0) * 0.35) * smoothstep(-0.05, 0.02, uSunDir.y);
+
+    // buoy lamp glitter (finite light)
+    if (uBuoy > 0.5) {
+      vec3 L = normalize(lampPos - p);
+      float lr = max(dot(r, L), 0.0);
+      float att = 1.0 / (1.0 + 0.00002 * dot(lampPos - p, lampPos - p));
+      float near = smoothstep(15.0, 140.0, tw);
+      col += uLamp * uLampPower * blink * att * (pow(lr, 2600.0) * 22.0 * (0.25 + 0.75 * near) + (pow(lr, 420.0) * 0.45 + pow(lr, 40.0) * 0.02) * near);
+    }
+
+    // crest foam and bioluminescence
+    float foam = smoothstep(0.78, 1.0, h01) * smoothstep(0.6, 1.4, uAmp) * (0.5 + 0.5 * vnoise(p.xz * 1.7 + t));
+    col = mix(col, uCloudLit * 1.4 + 0.05, foam * 0.45);
+    if (uBio > 0.0) {
+      float sparkle = pow(vnoise(p.xz * 6.0 - t * 0.9), 3.0) * 3.0 + pow(vnoise(p.xz * 17.0 + t), 4.0) * 4.0;
+      float crest = smoothstep(0.5, 0.9, h01) * (1.0 - smoothstep(0.92, 1.0, h01) * 0.5);
+      float edge = smoothstep(0.35, 0.0, abs(vnoise(p.xz * 0.9 + t * 0.15) - 0.5));
+      col += vec3(0.08, 0.8, 1.0) * uBio * crest * (0.15 + sparkle * edge) * exp(-tw * 0.01);
+    }
+
+    // aerial perspective
+    float haze = 1.0 - exp(-tw * (0.0016 + uFog * 0.02));
+    col = mix(col, mix(uSkyHorizon, uFogColor, clamp(uFog * 3.0, 0.0, 1.0)), haze);
+  } else {
+    col = sky(rd, flash, true);
+    if (uFog > 0.0) col = mix(col, uFogColor, clamp(uFog * 2.2, 0.0, 1.0) * exp(-max(rd.y, 0.0) * 9.0));
+  }
+
+  // buoy silhouette (a vertical card at the buoy distance)
+  if (uBuoy > 0.5) {
+    float tb = (ro.z - BUOY.z) / -rd.z;
+    if (tb > 0.0 && tb < hitDist + 1.5) {
+      vec3 q = ro + rd * tb;
+      vec2 local = vec2(q.x - BUOY.x, q.y - BUOY.y - bobY + 0.25);
+      float tilt = sin(t * 0.9) * 0.05;
+      local = mat2(cos(tilt), -sin(tilt), sin(tilt), cos(tilt)) * local;
+      float d = buoySDF(local);
+      float pxm = px * tb * 1.2;
+      float a = smoothstep(pxm, -pxm, d);
+      vec3 bc = mix(vec3(0.012, 0.016, 0.025), uLamp * 0.35 * blink, smoothstep(1.6, 2.6, local.y) * 0.5);
+      float haze = 1.0 - exp(-tb * (0.0016 + uFog * 0.02));
+      bc = mix(bc, mix(uSkyHorizon, uFogColor, clamp(uFog * 3.0, 0.0, 1.0)), haze * 0.85);
+      col = mix(col, bc, a);
+    }
+    // lamp core, halo, wide bloom and a faint horizontal streak
+    vec3 ld = normalize(lampPos - ro);
+    float ang = acos(clamp(dot(rd, ld), -1.0, 1.0)) / px;
+    vec3 lrel = vec3(dot(rd - ld, rt), dot(rd - ld, up), 0.0) / px;
+    float fogDim = exp(-uFog * 4.0);
+    float g = exp(-ang * ang / 4.5) * 3.0 + exp(-ang / 7.0) * 0.55 * fogDim + exp(-ang / 60.0) * 0.12 + exp(-ang / 240.0) * 0.05 * (1.0 + uFog * 6.0);
+    g += exp(-abs(lrel.y) / 1.6) * exp(-abs(lrel.x) / 90.0) * 0.08 * fogDim;
+    if (tw > 0.0 && hitDist < length(lampPos - ro) - 2.0) g *= 0.25;
+    col += uLamp * uLampPower * blink * g;
+  }
+
+  // rain streaks
+  if (uRain > 0.0) {
+    for (int i = 0; i < 3; i++) {
+      float fi = float(i);
+      vec2 ruv = uv * (vec2(90.0, 3.2) + fi * vec2(40.0, 1.5)) + vec2(uv.y * 9.0, t * (6.0 + fi * 2.5));
+      vec2 id = floor(ruv);
+      float rnd = hash12(id + fi * 17.0);
+      float y = fract(ruv.y + rnd * 7.0);
+      float streak = step(0.82, rnd) * smoothstep(0.0, 0.05, y) * smoothstep(0.45, 0.05, y) * smoothstep(0.12, 0.0, abs(fract(ruv.x) - 0.5));
+      col += mix(uSkyHorizon, vec3(0.7, 0.75, 0.85), 0.5) * streak * uRain * (0.18 - fi * 0.04);
+    }
+  }
+
+  col *= uExposure;
+  col = aces(col);
+  col = toSRGB(col);
+  col *= mix(0.72, 1.0, vignette(vUv, 0.22));
+  col += grain(fc, t) * 0.022;
+  fragColor = vec4(col, 1.0);
+}
+`,dir=(elevDeg,azDeg)=>{let e=elevDeg*Math.PI/180,a=azDeg*Math.PI/180;return[Math.sin(a)*Math.cos(e),Math.sin(e),-Math.cos(a)*Math.cos(e)]},lost_at_sea_default={id:"lost-at-sea",name:"Lost at Sea",description:"A live ocean at blue hour, one buoy light blinking on the horizon. Waves, reflections and weather are all rendered in real time.",category:"Ocean",kind:"3d",motion:"live",tags:["webgl","ocean","night","calm","cinematic","photoreal","weather"],layout:"split",copy:{eyebrow:"Off the chart",title:"Lost at sea.",message:"This page drifted beyond the map. Let's get you back to familiar waters.",actions:[{label:"Back to familiar waters",href:"/",variant:"primary",icon:"back"},{label:"Explore the site",href:"/",variant:"secondary",icon:"arrow"}]},params:{skyTop:"#08111f",skyMid:"#18273f",skyHorizon:"#3f5576",cloudLit:"#3a4f6f",cloudDark:"#0e1829",clouds:.62,water:"#020a15",scatter:"#0b2638",sunElevation:-4,sunAzimuth:-38,sunColor:"#7d8fb3",sunDisc:0,sunGlow:.35,sunSize:.012,buoy:!0,lamp:"#ffb057",lampPower:1.4,blink:4,waveHeight:.42,choppiness:1,speed:1,cameraHeight:2.3,fog:0,fogColor:"#3b4a60",stars:0,rain:0,lightning:0,bioluminescence:0,exposure:.9},theme:{bg:"#0a1424",fg:"#f3f5f8","code-color":"rgba(178,196,224,.24)",accent:"#f2eee6","accent-fg":"#0b1424"},presetName:"Blue Hour",presets:{midday:{name:"Midday",eyebrow:"Clear skies",title:"Calm seas. No page.",message:"Perfect sailing weather, and still not a sign of the page you wanted. The harbour's this way.",params:{skyTop:"#2f7fd6",skyMid:"#6fb3ee",skyHorizon:"#cfe8f7",cloudLit:"#ffffff",cloudDark:"#b9cfe0",clouds:.35,water:"#053a5c",scatter:"#0e8aa8",sunElevation:38,sunAzimuth:18,sunColor:"#fff6e0",sunDisc:2,sunGlow:.9,sunSize:.02,lampPower:.25,exposure:.72,waveHeight:.5},theme:{bg:"#1d6aa8","code-color":"rgba(255,255,255,.42)",accent:"#ffffff","accent-fg":"#06263d"}},"red-dawn":{name:"Red Dawn",eyebrow:"Red sky at morning",title:"Sailors take warning.",message:"The page set out at first light and never came back. Best stay close to home today.",params:{skyTop:"#1b1030",skyMid:"#7a1f3a",skyHorizon:"#ff5a3c",cloudLit:"#ff7a5a",cloudDark:"#2a0f1f",clouds:.7,water:"#0a0610",scatter:"#3a1220",sunElevation:1,sunAzimuth:-12,sunColor:"#ff6a3c",sunDisc:5,sunGlow:1.2,sunSize:.026,exposure:.75,waveHeight:.6},theme:{bg:"#2a0f1f","code-color":"rgba(255,190,170,.25)",accent:"#ffd9cc","accent-fg":"#2a0f1f"}},starless:{name:"New Moon",eyebrow:"Dead reckoning",title:"Not a star to steer by.",message:"No moon, no stars, no page. Just one small light out there, and it isn't yours.",params:{skyTop:"#010205",skyMid:"#03070f",skyHorizon:"#0b1424",cloudLit:"#0b1424",cloudDark:"#010205",clouds:.5,water:"#000204",scatter:"#020a12",sunGlow:.02,lamp:"#ffd36b",lampPower:2.2,blink:5,exposure:1.3},theme:{bg:"#010205","code-color":"rgba(170,190,220,.14)"}},monsoon:{name:"Monsoon",eyebrow:"Heavy weather",title:"Swept overboard.",message:"The page went over the side in the downpour. We're turning back for port.",params:{skyTop:"#1d2a2a",skyMid:"#3a4a48",skyHorizon:"#6b7a72",cloudLit:"#55645f",cloudDark:"#141c1c",clouds:.95,water:"#071210",scatter:"#16302a",sunGlow:.08,waveHeight:.95,choppiness:1.2,rain:1.4,fog:.08,fogColor:"#5a6a64",lamp:"#ffe36b",exposure:1.05},theme:{bg:"#1d2a2a","code-color":"rgba(220,235,225,.16)"}},lavender:{name:"Lavender Dusk",eyebrow:"Last light",title:"Drifting into the evening.",message:"The page sailed off as the sky turned violet. The lights of home are behind you.",params:{skyTop:"#241a4a",skyMid:"#5a4a8a",skyHorizon:"#d9a6c9",cloudLit:"#c99ad0",cloudDark:"#2a2050",clouds:.45,water:"#0a0818",scatter:"#2a1f4a",sunElevation:-2,sunAzimuth:25,sunColor:"#ffc2d9",sunGlow:.8,exposure:.85},theme:{bg:"#2a2050","code-color":"rgba(240,215,240,.24)",accent:"#fbe6ff","accent-fg":"#241a4a"}},"golden-hour":{name:"Golden Hour",eyebrow:"Sunset bearing",title:"Sailed past the sunset.",message:"The page you're after slipped below the horizon. The way home is still lit.",params:{skyTop:"#1a2340",skyMid:"#6b4a62",skyHorizon:"#f39a5c",cloudLit:"#e88f6b",cloudDark:"#3a2a3c",clouds:.5,water:"#06101c",scatter:"#3a2a2a",sunElevation:2.2,sunAzimuth:8,sunColor:"#ffb26a",sunDisc:6,sunGlow:1.3,sunSize:.022,lampPower:.8,exposure:.72,waveHeight:.45},theme:{bg:"#3a2a3c","code-color":"rgba(255,226,196,.26)",accent:"#fff3e6","accent-fg":"#2a1a20"}},moonlit:{name:"Moonlit",eyebrow:"Night watch",title:"Nothing but moonlight here.",message:"We searched every wave for this page. Follow the silver path back.",params:{skyTop:"#02050c",skyMid:"#0a1424",skyHorizon:"#1d2b44",cloudLit:"#3d4b66",cloudDark:"#070c16",clouds:.32,water:"#01050b",scatter:"#06131f",sunElevation:17,sunAzimuth:14,sunColor:"#c9d6f5",sunDisc:2.2,sunGlow:.32,sunSize:.03,stars:1,lampPower:.9,lamp:"#9ff0c4",blink:2.5},theme:{bg:"#050a14","code-color":"rgba(210,222,255,.18)"}},storm:{name:"Storm",eyebrow:"Small craft warning",title:"Rough waters.",message:"This page didn't survive the storm. Head for the harbour while we search.",actions:[{label:"Head for harbour",href:"/",variant:"primary",icon:"back"}],params:{skyTop:"#05070b",skyMid:"#151b24",skyHorizon:"#3b4652",cloudLit:"#2c3540",cloudDark:"#07090d",clouds:.92,water:"#03080d",scatter:"#0e2229",sunGlow:.1,waveHeight:1.05,choppiness:1.25,speed:1.25,cameraHeight:3.4,rain:1,lightning:1,lamp:"#ff5a4a",blink:1.6,lampPower:1.6,exposure:1.25},theme:{bg:"#0a0d12","code-color":"rgba(200,210,220,.17)"}},fog:{name:"Fog Bank",eyebrow:"Visibility nil",title:"Lost in the fog.",message:"We can hear the page, but we can't see it. Sound the horn and head back.",params:{skyTop:"#5e6a76",skyMid:"#76818c",skyHorizon:"#8a949d",cloudLit:"#97a0a8",cloudDark:"#6b7580",clouds:.2,water:"#141c23",scatter:"#26343c",fog:.32,fogColor:"#7f8a94",sunGlow:.2,sunColor:"#c9d2da",lamp:"#ff4b3a",blink:3,lampPower:2.2,waveHeight:.35,exposure:.95},theme:{bg:"#6f7a84",fg:"#0f171e","code-color":"rgba(20,30,40,.18)",accent:"#0f171e","accent-fg":"#eef1f3"}},bioluminescent:{name:"Bioluminescent",eyebrow:"Glowing waters",title:"The sea lit up, the page didn't.",message:"Every wave is glowing except the one you came for. Swim back to shore.",params:{skyTop:"#010309",skyMid:"#040a18",skyHorizon:"#0c1a2e",cloudLit:"#0f1d33",cloudDark:"#02050b",clouds:.25,water:"#000306",scatter:"#001820",stars:.8,bioluminescence:1.4,buoy:!1,sunGlow:.05,waveHeight:.7,exposure:1.2},theme:{bg:"#01050b","code-color":"rgba(120,240,255,.22)",accent:"#7ff3ff","accent-fg":"#00141a"}},arctic:{name:"Arctic Dawn",eyebrow:"Latitude unknown",title:"Too far north.",message:"The page froze somewhere past the last chart. Thaw out back home.",params:{skyTop:"#2c3c5c",skyMid:"#8a93b8",skyHorizon:"#f1c6c0",cloudLit:"#e9d4dc",cloudDark:"#7b829f",clouds:.4,water:"#0b1622",scatter:"#28485a",sunElevation:.5,sunAzimuth:-22,sunColor:"#ffd2b8",sunDisc:4,sunGlow:.9,sunSize:.02,lamp:"#fff1c9",lampPower:.6,waveHeight:.3,choppiness:.7,speed:.8,exposure:.78},theme:{bg:"#8a93b8","code-color":"rgba(255,255,255,.3)",accent:"#ffffff","accent-fg":"#1d2840"}}},css:`
+& .lp-eyebrow{display:flex;align-items:center;gap:16px;font-size:10px;letter-spacing:.42em}
+& .lp-eyebrow::before,& .lp-eyebrow::after{content:"";width:34px;height:1px;background:currentColor;opacity:.45}
+& .lp-code{font-weight:500;letter-spacing:-.02em;
+  -webkit-mask-image:linear-gradient(180deg,#000 25%,rgba(0,0,0,.5));mask-image:linear-gradient(180deg,#000 25%,rgba(0,0,0,.5))}
+& .lp-btn--primary{border-radius:3px;padding:12px 18px;font-size:12px}
+& .lp-btn--secondary{font-size:12px;border-bottom:0;opacity:.85}
+& .lp-btn--secondary:hover{opacity:1}
+& .lp-title{text-shadow:0 2px 30px rgba(0,0,0,.25)}
+& .lp-message,& .lp-btn--secondary{text-shadow:0 1px 14px rgba(0,0,0,.55)}
+`,setup(ctx){let p=ctx.params,c=s=>linear(s);return shaderScene(ctx,{frag:FRAG,uniforms:()=>({uSkyTop:c(p.skyTop),uSkyMid:c(p.skyMid),uSkyHorizon:c(p.skyHorizon),uCloudLit:c(p.cloudLit),uCloudDark:c(p.cloudDark),uClouds:p.clouds,uWater:c(p.water),uScatter:c(p.scatter),uSunDir:dir(p.sunElevation,p.sunAzimuth),uSunColor:c(p.sunColor),uSunDisc:p.sunDisc,uSunGlow:p.sunGlow,uSunSize:p.sunSize,uBuoy:p.buoy?1:0,uLamp:c(p.lamp),uLampPower:p.lampPower,uBlink:p.blink,uAmp:p.waveHeight,uChop:p.choppiness,uSpeed:p.speed,uCamH:p.cameraHeight,uFog:p.fog,uFogColor:c(p.fogColor),uStars:p.stars,uRain:p.rain,uLightning:p.lightning,uBio:p.bioluminescence,uExposure:p.exposure})})}};export{lost_at_sea_default as default};

package/dist/scenes/magic-8-ball.d.ts

@@ -0,0 +1,10 @@
+interface Params {
+    ball: string;
+    window: string;
+    die: string;
+    bg: string;
+    bg2: string;
+    answers: string[];
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;

package/dist/scenes/magic-8-ball.js

@@ -0,0 +1,2 @@
+import{canvas2d}from"../chunks/chunk-DAZOIOF7.js";import{rgba}from"../chunks/chunk-FVGCB66F.js";import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var magic_8_ball_default={id:"magic-8-ball",name:"Magic 8 Ball",description:"Ask the oracle where your page went. Click or tap to shake it, and the answer floats up through the dark liquid.",category:"Playful",kind:"2d",motion:"interactive",tags:["canvas","toy","funny","interactive","glossy","dark"],layout:"right",copy:{eyebrow:"Ask again later",title:"Outlook: not found.",message:"Even the oracle doesn't know where this page went. Shake it for a second opinion.",actions:[{label:"Go home",href:"/",variant:"primary"}]},params:{ball:"#0d0d10",window:"#06061a",die:"#2b3cff",bg:"#1c1530",bg2:"#05040a",answers:["PAGE NOT FOUND","ASK AGAIN LATER","OUTLOOK NOT SO GOOD","TRY THE HOMEPAGE","SIGNS POINT TO 404","REPLY HAZY, GO HOME","MY SOURCES SAY NO","CANNOT PREDICT NOW","DON'T COUNT ON IT"]},theme:{bg:"#120d20",fg:"#f2edff",accent:"#f2edff","accent-fg":"#120d20"},presetName:"Classic",presets:{gold:{name:"Gold Oracle",params:{ball:"#1a1206",window:"#0d0802",die:"#d4af37",bg:"#2a1d0a",bg2:"#0a0702"},theme:{bg:"#140d04",fg:"#fff3d6",accent:"#d4af37","accent-fg":"#140d04"}},mint:{name:"Mint",params:{ball:"#2ec4b6",window:"#04201d",die:"#ffffff",bg:"#e6fbf7",bg2:"#bff0e6"},theme:{bg:"#e6fbf7",fg:"#04201d",accent:"#04201d","accent-fg":"#fff"}},pink:{name:"Bubblegum",params:{ball:"#ff5fa2",window:"#2a0718",die:"#ffd23f",bg:"#ffe0ee",bg2:"#ffc2dc"},theme:{bg:"#ffe0ee",fg:"#3a0b22",accent:"#3a0b22","accent-fg":"#fff"}},crystal:{name:"Crystal",params:{ball:"#2a2f45",window:"#0a1430",die:"#00d1ff",bg:"#e8ecf7",bg2:"#c7cfe6"},theme:{bg:"#e8ecf7",fg:"#141a2e",accent:"#141a2e","accent-fg":"#fff"}}},css:`& .lp-overlay{padding-right:clamp(24px,8cqw,140px)}& .lp-head,& .lp-body{max-width:min(460px,42cqw)}
+@container (max-width:760px){& .lp-head,& .lp-body{max-width:none}& .lp-overlay{justify-content:flex-end}}`,setup(ctx){let p=ctx.params,c=canvas2d(ctx),ai=0,shakeT=-10,reveal=1,lastShake=0,shake=()=>{shakeT=performance.now()/1e3,reveal=0,ai=(ai+1+Math.floor(Math.random()*(p.answers.length-1)))%p.answers.length,ctx.invalidate()};ctx.on("pointerdown",e=>{e.target.closest("a,button")||shake()});let wrapText=(g,text,maxW)=>{let words=text.split(" "),lines=[],line="";for(let w of words){let test=line?line+" "+w:w;g.measureText(test).width>maxW&&line?(lines.push(line),line=w):line=test}return line&&lines.push(line),lines};return{resize(){c.reset()},frame(t,dt){let g=c.g;c.reset();let now=performance.now()/1e3,narrow=c.w<760,R=narrow?Math.min(c.w*.36,c.h*.26):Math.min(c.h*.34,c.w*.24),cx=narrow?c.w/2:c.w*.32,cy=narrow?c.h*.3:c.h*.48,se=now-shakeT;if(se<.9){let k2=1-se/.9;cx+=Math.sin(se*60)*R*.08*k2,cy+=Math.cos(se*47)*R*.05*k2}else ctx.reducedMotion||(cy+=Math.sin(t*1.2)*R*.02);se>.9&&(reveal=Math.min(1,reveal+dt*.8)),!ctx.pointer.engaged&&!ctx.reducedMotion&&t-lastShake>7&&(lastShake=t,shake());let bg=g.createRadialGradient(cx,cy,R*.5,cx,cy,Math.max(c.w,c.h));bg.addColorStop(0,p.bg),bg.addColorStop(1,p.bg2),g.fillStyle=bg,g.fillRect(0,0,c.w,c.h),g.fillStyle="rgba(0,0,0,.35)",g.beginPath(),g.ellipse(cx,cy+R*1.08,R*.8,R*.12,0,0,Math.PI*2),g.fill();let body=g.createRadialGradient(cx-R*.35,cy-R*.4,R*.05,cx,cy,R);body.addColorStop(0,rgba("#ffffff",.35)),body.addColorStop(.18,p.ball),body.addColorStop(1,"#000000"),g.fillStyle=body,g.beginPath(),g.arc(cx,cy,R,0,Math.PI*2),g.fill(),g.strokeStyle="rgba(255,255,255,.12)",g.lineWidth=R*.03,g.beginPath(),g.arc(cx,cy,R*.985,Math.PI*.1,Math.PI*.9),g.stroke();let wr=R*.46,win=g.createRadialGradient(cx,cy,0,cx,cy,wr);win.addColorStop(0,p.window),win.addColorStop(1,"#000"),g.fillStyle=win,g.beginPath(),g.arc(cx,cy,wr,0,Math.PI*2),g.fill(),g.strokeStyle="rgba(255,255,255,.25)",g.lineWidth=R*.02,g.stroke();let k=reveal;g.save(),g.translate(cx,cy+(1-k)*wr*.4+Math.sin(t*1.5)*wr*.015),g.rotate((1-k)*.6+Math.sin(t*.8)*.03),g.globalAlpha=k;let tr=wr*.88;g.fillStyle=p.die,g.beginPath(),g.moveTo(0,-tr*.62),g.lineTo(tr*.82,tr*.5),g.lineTo(-tr*.82,tr*.5),g.closePath(),g.fill(),g.fillStyle="#e8ecff",g.textAlign="center",g.textBaseline="middle",g.font=`800 ${tr*.13}px "Inter",ui-sans-serif,system-ui,sans-serif`;let lines=wrapText(g,p.answers[ai],tr*.62);lines.forEach((l,i)=>g.fillText(l,0,tr*.12+(i-(lines.length-1)/2)*tr*.16)),g.restore(),g.globalAlpha=1,g.fillStyle=rgba(p.window,.35*(1-k)),g.beginPath(),g.arc(cx,cy,wr,0,Math.PI*2),g.fill();let hl=g.createRadialGradient(cx-R*.42,cy-R*.48,0,cx-R*.42,cy-R*.48,R*.38);hl.addColorStop(0,"rgba(255,255,255,.55)"),hl.addColorStop(1,"rgba(255,255,255,0)"),g.fillStyle=hl,g.beginPath(),g.arc(cx,cy,R,0,Math.PI*2),g.fill(),ctx.pointer.engaged||(g.fillStyle="rgba(255,255,255,.55)",g.font="600 12px ui-monospace,Menlo,monospace",g.textAlign="center",g.fillText("click to shake",cx,cy+R*1.28))}}}};export{magic_8_ball_default as default};

package/dist/scenes/matrix-rain.d.ts

@@ -0,0 +1,13 @@
+interface Params {
+    color: string;
+    head: string;
+    bg: string;
+    /** Cell size in px. */
+    cell: number;
+    speed: number;
+    glyphs: string;
+    /** How strongly the code shows through the rain (0..1). */
+    reveal: number;
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;

package/dist/scenes/matrix-rain.js

@@ -0,0 +1,3 @@
+import{canvas2d}from"../chunks/chunk-DAZOIOF7.js";import{rgba}from"../chunks/chunk-FVGCB66F.js";import{MONO,SANS,textCanvas}from"../chunks/chunk-3ISI6SOJ.js";import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var KATAKANA="\uFF71\uFF72\uFF73\uFF74\uFF75\uFF76\uFF77\uFF78\uFF79\uFF7A\uFF7B\uFF7C\uFF7D\uFF7E\uFF7F\uFF80\uFF81\uFF82\uFF83\uFF84\uFF85\uFF86\uFF87\uFF88\uFF89\uFF8A\uFF8B\uFF8C\uFF8D\uFF8E\uFF8F\uFF90\uFF91\uFF92\uFF93\uFF94\uFF95\uFF96\uFF97\uFF98\uFF99\uFF9A\uFF9B\uFF9C\uFF9D0123456789",matrix_rain_default={id:"matrix-rain",name:"Digital Rain",description:"Falling columns of glyphs. Look closer and the 404 is written in the rain.",category:"Retro Tech",kind:"2d",motion:"live",tags:["canvas","matrix","code","hacker","green","dark"],layout:"bottom",codeInScene:!0,copy:{eyebrow:"Wake up",title:"There is no page.",message:"You followed the link down the rabbit hole. Take the green button back to reality.",actions:[{label:"Take me back",href:"/",variant:"primary"},{label:"Stay in the rain",href:"#",variant:"secondary"}]},params:{color:"#18ff6d",head:"#d7ffe6",bg:"#000a03",cell:16,speed:1,glyphs:KATAKANA,reveal:.9},theme:{bg:"#000a03",fg:"#c9ffd9",accent:"#18ff6d","accent-fg":"#000a03","font-display":"var(--lp-font-mono)","title-weight":"600"},presetName:"Green",presets:{violet:{name:"Violet",params:{color:"#b47bff",head:"#f3e6ff",bg:"#07000f"},theme:{bg:"#07000f",fg:"#f3e6ff",accent:"#b47bff","accent-fg":"#07000f"}},gold:{name:"Gold",params:{color:"#ffcf4d",head:"#fff6d6",bg:"#0a0700",glyphs:"0123456789$\xA5\u20AC\xA3"},theme:{bg:"#0a0700",fg:"#fff6d6",accent:"#ffcf4d","accent-fg":"#0a0700"}},hex:{name:"Hex Dump",title:"0x404: page not mapped.",params:{color:"#3bd6ff",head:"#e6faff",bg:"#00070c",glyphs:"0123456789ABCDEF",cell:15},theme:{bg:"#00070c",fg:"#e6faff",accent:"#3bd6ff","accent-fg":"#00070c"}},sakura:{name:"Pink Rain",params:{color:"#ff6fae",head:"#ffe6f2",bg:"#0d0208"},theme:{bg:"#0d0208",fg:"#ffe6f2",accent:"#ff6fae","accent-fg":"#0d0208"}},amber:{name:"Amber",params:{color:"#ffb000",head:"#fff0c8",bg:"#0a0600",glyphs:"0123456789ABCDEF"},theme:{bg:"#0a0600",fg:"#ffe2a8",accent:"#ffb000","accent-fg":"#0a0600"}},ice:{name:"Ice",params:{color:"#4fd8ff",head:"#e8fbff",bg:"#00060c"},theme:{bg:"#00060c",fg:"#d6f6ff",accent:"#4fd8ff","accent-fg":"#00060c"}},binary:{name:"Binary",title:"01000110 01101111 01110101 01101110 01100100? No.",params:{color:"#e6e6e6",head:"#ffffff",bg:"#050505",glyphs:"01",cell:14},theme:{bg:"#050505",fg:"#f2f2f2",accent:"#ffffff","accent-fg":"#050505"}},blood:{name:"Red Pill",eyebrow:"You took the red pill",title:"And it led here. Nowhere.",params:{color:"#ff2a3d",head:"#ffd6da",bg:"#0a0002"},theme:{bg:"#0a0002",fg:"#ffd6da",accent:"#ff2a3d","accent-fg":"#0a0002"}},paper:{name:"Paper",params:{color:"#2b2b2b",head:"#000000",bg:"#f4f1ea",glyphs:"abcdefghijklmnopqrstuvwxyz0123456789"},theme:{bg:"#f4f1ea",fg:"#111",accent:"#111","accent-fg":"#f4f1ea"}}},css:`& .lp-title{text-shadow:0 0 18px color-mix(in srgb,var(--lp-accent) 45%,transparent)}
+& .lp-message{color:color-mix(in srgb,var(--lp-fg) 75%,transparent)}
+& .lp-body{background:radial-gradient(closest-side,color-mix(in srgb,var(--lp-bg) 85%,transparent),transparent);padding:24px 40px}`,setup(ctx){let p=ctx.params,c=canvas2d(ctx),rnd=ctx.random,glyphs=[...p.glyphs],light=parseInt(p.bg.slice(1,3),16)>128,atlas,cols=0,rows=0,drops,speeds,mask,cellGlyph,cell=p.cell;function buildAtlas(color,headColor){let s=cell*2,a=document.createElement("canvas");a.width=s*glyphs.length,a.height=s*2;let g=a.getContext("2d");return g.font=`${s*.78}px ${MONO}`,g.textAlign="center",g.textBaseline="middle",glyphs.forEach((ch,i)=>{g.save(),g.translate(i*s+s/2,s/2),i%2===0&&g.scale(-1,1),g.fillStyle=color,g.fillText(ch,0,0),g.restore(),g.save(),g.translate(i*s+s/2,s+s/2),g.fillStyle=headColor,g.shadowColor=color,g.shadowBlur=s*.4,g.fillText(ch,0,0),g.restore()}),a}function build(){cell=Math.max(11,Math.round(p.cell*Math.min(1,Math.max(.75,c.w/1440)))),cols=Math.ceil(c.w/cell),rows=Math.ceil(c.h/cell),drops=new Float32Array(cols),speeds=new Float32Array(cols);for(let i=0;i<cols;i++)drops[i]=rnd()*rows*1.5-rows*.5,speeds[i]=(.5+rnd()*.9)*p.speed;cellGlyph=new Uint16Array(cols*rows);for(let i=0;i<cellGlyph.length;i++)cellGlyph[i]=Math.floor(rnd()*glyphs.length);let boxW=Math.min(c.w*.86,1200),boxH=Math.min(boxW*.42,c.h*.45),g=textCanvas(ctx.copy.code||"404",{width:cols,height:rows,font:SANS,weight:900,fit:1,cx:.5,cy:.4}).getContext("2d");g.clearRect(0,0,cols,rows);let tmp=textCanvas(ctx.copy.code||"404",{width:boxW/cell,height:boxH/cell,font:SANS,weight:900,fit:.98});g.drawImage(tmp,(cols-boxW/cell)/2,rows*.4-boxH/cell/2);let img=g.getImageData(0,0,cols,rows).data;mask=new Uint8Array(cols*rows);for(let i=0;i<cols*rows;i++)mask[i]=img[i*4+3]>110?1:0;atlas=buildAtlas(p.color,p.head),c.reset(),c.g.fillStyle=p.bg,c.g.fillRect(0,0,c.w,c.h)}build();let acc=0;return{resize(){build()},frame(t,dt){let g=c.g;c.reset();let still=dt===0;if(acc+=dt,!(still||acc>1/30))return;let sdt=still?0:acc;acc=0,g.globalCompositeOperation="source-over",g.fillStyle=rgba(p.bg,still?1:.11),g.fillRect(0,0,c.w,c.h);let s=cell*2,draw=(gi,x,y,head,alpha)=>{g.globalAlpha=alpha,g.drawImage(atlas,gi*s,head?s:0,s,s,x,y,cell,cell)};for(let i=0;i<cols;i++){drops[i]+=speeds[i]*sdt*22;let r=Math.floor(drops[i]);if(r>=0&&r<rows){let idx=r*cols+i;rnd()<.3&&(cellGlyph[idx]=Math.floor(rnd()*glyphs.length)),draw(cellGlyph[idx],i*cell,r*cell,!0,1)}r>rows+8&&rnd()>.96&&(drops[i]=-rnd()*20)}let reveal=p.reveal*(still?1:.7+.3*Math.sin(t*.8)**2),n=still?cols*rows:Math.ceil(cols*rows*.22);for(let k=0;k<n;k++){let idx=still?k:Math.floor(rnd()*cols*rows);if(!mask[idx])continue;let x=idx%cols,y=idx/cols|0;rnd()<.15&&(cellGlyph[idx]=Math.floor(rnd()*glyphs.length)),draw(cellGlyph[idx],x*cell,y*cell,rnd()<.35,reveal)}if(still)for(let k=0;k<cols*rows;k++)!mask[k]&&rnd()<.18&&draw(cellGlyph[k],k%cols*cell,(k/cols|0)*cell,!1,.25+rnd()*.4);g.globalAlpha=1}}}};export{matrix_rain_default as default};

package/dist/scenes/maze.d.ts

@@ -0,0 +1,9 @@
+interface Params {
+    bg: string;
+    wall: string;
+    player: string;
+    exit: string;
+    trail: string;
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;

package/dist/scenes/maze.js

@@ -0,0 +1 @@
+import{GAME_CSS,hud,input}from"../chunks/chunk-MNUNTC4L.js";import{canvas2d}from"../chunks/chunk-DAZOIOF7.js";import{rgba}from"../chunks/chunk-FVGCB66F.js";import"../chunks/chunk-3ISI6SOJ.js";import"../chunks/chunk-KIYSQVWX.js";import"../chunks/chunk-7XMDQMDO.js";var maze_default={id:"maze",name:"Labyrinth",description:"You're a dot lost in a maze. Use the arrow keys, WASD or swipes to find the exit, and the exit takes you home.",category:"Games",kind:"2d",motion:"game",tags:["canvas","game","playable","maze","puzzle","keyboard","touch","minimal"],layout:"bottom",codeInScene:!0,copy:{eyebrow:"Find the way out",title:"You took a wrong turn.",message:"Navigate to the glowing exit and we'll take you home. Arrow keys, WASD or swipe.",actions:[{label:"Skip the maze",href:"/",variant:"secondary",icon:"arrow"}]},params:{bg:"#f4f1ea",wall:"#1c1a17",player:"#ff4d2e",exit:"#2bb673",trail:"#ffb8a8"},theme:{bg:"#f4f1ea",fg:"#1c1a17",accent:"#1c1a17","accent-fg":"#f4f1ea"},presetName:"Paper",presets:{blueprint:{name:"Blueprint",params:{bg:"#123e7a",wall:"#e6f0ff",player:"#ffd23f",exit:"#3dff8a",trail:"#3a6aa8"},theme:{bg:"#123e7a",fg:"#e6f0ff",accent:"#e6f0ff","accent-fg":"#123e7a"}},candy:{name:"Candy",params:{bg:"#fff2f7",wall:"#ff4f8b",player:"#5b2cff",exit:"#2bb673",trail:"#d9ccff"},theme:{bg:"#fff2f7",fg:"#3a0a22",accent:"#3a0a22","accent-fg":"#fff"}},neon:{name:"Neon",params:{bg:"#07070f",wall:"#3bd6ff",player:"#ff3bd4",exit:"#3dff8a",trail:"#5a1a52"},theme:{bg:"#07070f",fg:"#e6f9ff",accent:"#3bd6ff","accent-fg":"#07070f"}},hedge:{name:"Hedge Maze",params:{bg:"#c9b98a",wall:"#2f5a2a",player:"#e8402a",exit:"#ffd23f",trail:"#e8c9a0"},theme:{bg:"#c9b98a",fg:"#1d2a14",accent:"#1d2a14","accent-fg":"#fff"}}},css:GAME_CSS,setup(ctx){let p=ctx.params,c=canvas2d(ctx),inp=input(ctx,{pointerPlays:!1}),rnd=ctx.random,cols=0,rows=0,cell=0,ox=0,oy=0,walls,player={x:0,y:0,dx:0,dy:0},trail=[],won=0,moveCd=0,solution=[],demoStep=0;function gen(){let areaH=c.h*.6;cell=Math.max(18,Math.min(34,Math.floor(Math.min(c.w/30,areaH/15)))),cols=Math.floor(c.w*.86/cell),rows=Math.floor(areaH/cell),ox=Math.floor((c.w-cols*cell)/2),oy=Math.max(16,Math.floor(c.h*.05)),walls=new Uint8Array(cols*rows).fill(15);let seen=new Uint8Array(cols*rows),stack=[[0,0]];seen[0]=1;let D=[[0,-1,1,4],[1,0,2,8],[0,1,4,1],[-1,0,8,2]];for(;stack.length;){let[x,y]=stack[stack.length-1],opts=D.filter(([dx2,dy2])=>{let nx=x+dx2,ny=y+dy2;return nx>=0&&ny>=0&&nx<cols&&ny<rows&&!seen[ny*cols+nx]});if(!opts.length){stack.pop();continue}let[dx,dy,a,b]=opts[Math.floor(rnd()*opts.length)];walls[y*cols+x]&=~a,walls[(y+dy)*cols+x+dx]&=~b,seen[(y+dy)*cols+x+dx]=1,stack.push([x+dx,y+dy])}player={x:0,y:0,dx:0,dy:0},trail=[[0,0]],won=0;let prev=new Int32Array(cols*rows).fill(-1);prev[0]=0;let q=[0];for(;q.length;){let k2=q.shift(),x=k2%cols,y=k2/cols|0;for(let[dx,dy,bit]of D){if(walls[k2]&bit)continue;let nk=(y+dy)*cols+x+dx;prev[nk]===-1&&(prev[nk]=k2,q.push(nk))}}solution=[];let k=cols*rows-1;for(;k!==0;)solution.unshift([k%cols,k/cols|0]),k=prev[k];demoStep=0}gen();let tryMove=(dx,dy)=>{let bit=dy<0?1:dx>0?2:dy>0?4:8;return walls[player.y*cols+player.x]&bit?!1:(player.x+=dx,player.y+=dy,trail.push([player.x,player.y]),trail.length>400&&trail.shift(),!0)};return{resize(){c.reset(),gen()},frame(t,dt){let g=c.g;if(c.reset(),moveCd-=dt,won>0)won-=dt,won<=0&&(inp.playing&&ctx.navigate(ctx.copy.actions[0]?.href??"/"),gen());else if(moveCd<=0){let dir=null;if(inp.playing){let s=inp.swipe;inp.swipe=null,inp.left||s==="left"?dir=[-1,0]:inp.right||s==="right"?dir=[1,0]:inp.up||s==="up"?dir=[0,-1]:(inp.down||s==="down")&&(dir=[0,1])}else if(!ctx.reducedMotion&&dt>0&&solution[demoStep]){let[nx,ny]=solution[demoStep];dir=[nx-player.x,ny-player.y],demoStep++}dir&&tryMove(dir[0],dir[1])&&(moveCd=inp.playing?.09:.11),player.x===cols-1&&player.y===rows-1&&(won=1.4)}g.fillStyle=p.bg,g.fillRect(0,0,c.w,c.h),g.strokeStyle=p.trail,g.lineWidth=cell*.36,g.lineCap="round",g.lineJoin="round",g.beginPath(),trail.forEach(([x,y],i)=>{let px2=ox+x*cell+cell/2,py2=oy+y*cell+cell/2;i===0?g.moveTo(px2,py2):g.lineTo(px2,py2)}),g.stroke();let ex=ox+(cols-.5)*cell,ey=oy+(rows-.5)*cell;g.fillStyle=rgba(p.exit,.25+.15*Math.sin(t*4)),g.beginPath(),g.arc(ex,ey,cell*.8,0,Math.PI*2),g.fill(),g.fillStyle=p.exit,g.fillRect(ex-cell*.3,ey-cell*.3,cell*.6,cell*.6),g.strokeStyle=p.wall,g.lineWidth=Math.max(2,cell*.12),g.lineCap="square",g.beginPath();for(let y=0;y<rows;y++)for(let x=0;x<cols;x++){let w=walls[y*cols+x],x0=ox+x*cell,y0=oy+y*cell;w&1&&(g.moveTo(x0,y0),g.lineTo(x0+cell,y0)),w&8&&(g.moveTo(x0,y0),g.lineTo(x0,y0+cell)),y===rows-1&&w&4&&(g.moveTo(x0,y0+cell),g.lineTo(x0+cell,y0+cell)),x===cols-1&&w&2&&(g.moveTo(x0+cell,y0),g.lineTo(x0+cell,y0+cell))}g.stroke();let px=ox+player.x*cell+cell/2,py=oy+player.y*cell+cell/2;g.fillStyle=p.player,g.shadowColor=p.player,g.shadowBlur=12,g.beginPath(),g.arc(px,py,cell*.3,0,Math.PI*2),g.fill(),g.shadowBlur=0;let fs=Math.max(10,Math.min(14,c.w/90));hud(g,"YOU",ox,oy-fs-6,fs,p.wall),hud(g,inp.playing?"EXIT \u2192 HOME":"EXIT",ox+cols*cell,oy+rows*cell+8,fs,p.wall,"right"),!inp.playing&&Math.floor(t*1.6)%2===0&&hud(g,"DEMO \xB7 PRESS AN ARROW KEY",c.w/2,oy+rows*cell+8,fs,rgba(p.wall,.7),"center"),won>0&&hud(g,inp.playing?"FOUND IT. TAKING YOU HOME\u2026":"SOLVED",c.w/2,oy+rows*cell/2-fs,fs*1.6,p.player,"center")}}}};export{maze_default as default};

package/dist/scenes/mesh-gradient.d.ts

@@ -0,0 +1,13 @@
+interface Params {
+    c1: string;
+    c2: string;
+    c3: string;
+    c4: string;
+    base: string;
+    speed: number;
+    grain: number;
+    /** Frosted glass card behind the copy. */
+    card: boolean;
+}
+declare const _default: import("..").SceneDef<Params>;
+export default _default;