[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_211":212,"_213":214},"routes/_app.x.$handle.$name",{"_96":95,"_32":46,"_105":86,"_27":106,"_13":14,"_107":-5,"_11":108,"_109":110,"_111":112,"_113":114,"_115":116,"_20":-5,"_117":-5,"_118":-5,"_119":25,"_120":121,"_122":123,"_124":-5,"_125":-5,"_126":127},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_44":45,"_32":46,"_39":47,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":-5,"_58":25,"_59":-5,"_60":-5,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":79,"_80":81,"_82":83,"_84":25},"version",16,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":38,"_39":40,"_41":14,"_42":43,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","frontend/water-button.js","latestPath","fileId","1934999a-602b-11f1-9710-1607ee4eb77e","name","water-button.js","fileType","script","content","// Flowing liquid waves — domain-warped FBM (Inigo-Quilez style). Fully bounded\n// math: fbm is always [0,1], so this can't blow out to white on any GPU\n// (unlike the precision-dependent zozuar raymarch). Verified offline before ship.\n// Clicking \"stirs\" the flow (a brief speed surge); the key depresses in CSS.\n\nconst VERT = `\nattribute vec2 aPos;\nvoid main(){ gl_Position = vec4(aPos, 0.0, 1.0); }\n`;\n\nconst FRAG = `\nprecision highp float;\nuniform vec2 iResolution;\nuniform float iTime;\n\nfloat hash21(vec2 p){\n p = fract(p * vec2(123.34, 345.45));\n p += dot(p, p + 34.345);\n return fract(p.x * p.y);\n}\nfloat vnoise(vec2 p){\n vec2 i = floor(p), f = fract(p);\n vec2 u = f * f * (3.0 - 2.0 * f);\n float a = hash21(i), b = hash21(i + vec2(1.0, 0.0));\n float c = hash21(i + vec2(0.0, 1.0)), d = hash21(i + vec2(1.0, 1.0));\n return mix(mix(a, b, u.x), mix(c, d, u.x), u.y);\n}\nfloat fbm(vec2 p){\n float s = 0.0, a = 0.5;\n for (int i = 0; i < 4; i++) { s += a * vnoise(p); p *= 2.0; a *= 0.5; }\n return s;\n}\n\nvoid main(){\n vec2 uv = gl_FragCoord.xy / iResolution.xy;\n vec2 p = (gl_FragCoord.xy - 0.5 * iResolution.xy) / iResolution.y * 3.0;\n float t = iTime * 0.15;\n\n // two-stage domain warp -> organic flowing motion\n vec2 q = vec2(fbm(p + vec2(0.0, t)),\n fbm(p + vec2(5.2, 1.3) - t));\n vec2 r = vec2(fbm(p + 1.6 * q + vec2(1.7, 9.2) + t * 0.7),\n fbm(p + 1.6 * q + vec2(8.3, 2.8) - t * 0.6));\n float n = fbm(p + 2.0 * r + vec2(t * 0.5, 0.0));\n\n // ridged noise for sharp wave-crest lines\n float ridge = 1.0 - abs(2.0 * fbm(p * 2.0 + 3.0 * r + vec2(t, 0.0)) - 1.0);\n ridge = pow(ridge, 3.0);\n\n // liquid palette: deep teal -> cyan -> foam\n vec3 deep = vec3(0.02, 0.09, 0.16);\n vec3 mid = vec3(0.05, 0.45, 0.55);\n vec3 hi = vec3(0.60, 0.93, 0.96);\n vec3 col = mix(deep, mid, smoothstep(0.20, 0.70, n));\n col = mix(col, hi, smoothstep(0.55, 0.95, n) * 0.7);\n col += hi * ridge * 0.5 * smoothstep(0.30, 0.90, n);\n\n // finish (bounded)\n vec2 c2 = uv - 0.5;\n col *= 1.0 - 0.25 * dot(c2, c2); // vignette\n col = col / (col + vec3(0.4)); // tonemap into range\n col = pow(col, vec3(0.85)); // gentle lift\n gl_FragColor = vec4(col, 1.0);\n}\n`;\n\nfunction compile(gl, type, src) {\n const s = gl.createShader(type);\n gl.shaderSource(s, src);\n gl.compileShader(s);\n if (!gl.getShaderParameter(s, gl.COMPILE_STATUS)) {\n throw new Error(gl.getShaderInfoLog(s) || \"shader compile failed\");\n }\n return s;\n}\n\nclass WaveButton {\n constructor(canvas) {\n this.canvas = canvas;\n this.broken = false;\n this.gl = canvas.getContext(\"webgl\", { antialias: true, alpha: false });\n if (!this.gl) { console.warn(\"WebGL unavailable\"); this.broken = true; return; }\n\n try {\n this._initGL();\n } catch (err) {\n console.error(\"Shader init failed:\", err);\n this.broken = true;\n }\n\n this.phase = 6.0;\n this.speed = 1.0;\n this.last = performance.now();\n requestAnimationFrame((t) => this._frame(t));\n }\n\n _initGL() {\n const gl = this.gl;\n const prog = gl.createProgram();\n gl.attachShader(prog, compile(gl, gl.VERTEX_SHADER, VERT));\n gl.attachShader(prog, compile(gl, gl.FRAGMENT_SHADER, FRAG));\n gl.linkProgram(prog);\n if (!gl.getProgramParameter(prog, gl.LINK_STATUS)) {\n throw new Error(gl.getProgramInfoLog(prog) || \"link failed\");\n }\n gl.useProgram(prog);\n this.prog = prog;\n\n const buf = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, buf);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]), gl.STATIC_DRAW);\n const aPos = gl.getAttribLocation(prog, \"aPos\");\n gl.enableVertexAttribArray(aPos);\n gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 0, 0);\n\n this.uRes = gl.getUniformLocation(prog, \"iResolution\");\n this.uTime = gl.getUniformLocation(prog, \"iTime\");\n }\n\n _resize() {\n const gl = this.gl, c = this.canvas;\n const dpr = Math.min(window.devicePixelRatio || 1, 2);\n const w = Math.round(c.clientWidth * dpr);\n const h = Math.round(c.clientHeight * dpr);\n if (w < 2 || h < 2) return false;\n if (c.width === w && c.height === h) return true;\n c.width = w; c.height = h;\n gl.viewport(0, 0, w, h);\n return true;\n }\n\n stir() { this.speed = Math.min(this.speed + 4.0, 7.0); }\n\n _frame(t) {\n if (!this._resize()) { requestAnimationFrame((tt) => this._frame(tt)); return; }\n const gl = this.gl;\n\n gl.clearColor(0.02, 0.06, 0.08, 1.0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n if (!this.broken) {\n const dt = Math.min((t - this.last) / 1000, 0.05);\n this.last = t;\n this.speed += (1.0 - this.speed) * Math.min(dt * 2.5, 1.0);\n this.phase += dt * this.speed;\n\n gl.useProgram(this.prog);\n gl.uniform2f(this.uRes, this.canvas.width, this.canvas.height);\n gl.uniform1f(this.uTime, this.phase);\n gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);\n }\n requestAnimationFrame((tt) => this._frame(tt));\n }\n}\n\nconst keyEl = document.getElementById(\"key\");\nconst btn = new WaveButton(document.getElementById(\"c\"));\n\nif (keyEl) {\n keyEl.addEventListener(\"pointerdown\", () => keyEl.classList.add(\"pressed\"));\n [\"pointerup\", \"pointerleave\", \"pointercancel\"].forEach((ev) =>\n keyEl.addEventListener(ev, () => keyEl.classList.remove(\"pressed\"))\n );\n keyEl.addEventListener(\"click\", () => { if (btn) btn.stir(); });\n keyEl.addEventListener(\"keydown\", (e) => {\n if (e.key === \" \" || e.key === \"Enter\") keyEl.classList.add(\"pressed\");\n });\n keyEl.addEventListener(\"keyup\", () => keyEl.classList.remove(\"pressed\"));\n}\n","// Flowing liquid waves — domain-warped FBM (Inigo-Quilez style). Fully bounded\n// math (fbm is always [0,1] + tonemap), so it can't blow out to white on any GPU.\n// Embedded in the splash page's primary CTA: hover speeds the flow, click stirs.\n\nconst VERT = `\nattribute vec2 aPos;\nvoid main(){ gl_Position = vec4(aPos, 0.0, 1.0); }\n`;\n\nconst FRAG = `\nprecision highp float;\nuniform vec2 iResolution;\nuniform float iTime;\n\nfloat hash21(vec2 p){\n p = fract(p * vec2(123.34, 345.45));\n p += dot(p, p + 34.345);\n return fract(p.x * p.y);\n}\nfloat vnoise(vec2 p){\n vec2 i = floor(p), f = fract(p);\n vec2 u = f * f * (3.0 - 2.0 * f);\n float a = hash21(i), b = hash21(i + vec2(1.0, 0.0));\n float c = hash21(i + vec2(0.0, 1.0)), d = hash21(i + vec2(1.0, 1.0));\n return mix(mix(a, b, u.x), mix(c, d, u.x), u.y);\n}\nfloat fbm(vec2 p){\n float s = 0.0, a = 0.5;\n for (int i = 0; i < 4; i++) { s += a * vnoise(p); p *= 2.0; a *= 0.5; }\n return s;\n}\n\nvoid main(){\n vec2 uv = gl_FragCoord.xy / iResolution.xy;\n vec2 p = (gl_FragCoord.xy - 0.5 * iResolution.xy) / iResolution.y * 3.0;\n float t = iTime * 0.15;\n\n vec2 q = vec2(fbm(p + vec2(0.0, t)),\n fbm(p + vec2(5.2, 1.3) - t));\n vec2 r = vec2(fbm(p + 1.6 * q + vec2(1.7, 9.2) + t * 0.7),\n fbm(p + 1.6 * q + vec2(8.3, 2.8) - t * 0.6));\n float n = fbm(p + 2.0 * r + vec2(t * 0.5, 0.0));\n\n float ridge = 1.0 - abs(2.0 * fbm(p * 2.0 + 3.0 * r + vec2(t, 0.0)) - 1.0);\n ridge = pow(ridge, 3.0);\n\n vec3 deep = vec3(0.02, 0.09, 0.16);\n vec3 mid = vec3(0.05, 0.45, 0.55);\n vec3 hi = vec3(0.60, 0.93, 0.96);\n vec3 col = mix(deep, mid, smoothstep(0.20, 0.70, n));\n col = mix(col, hi, smoothstep(0.55, 0.95, n) * 0.7);\n col += hi * ridge * 0.5 * smoothstep(0.30, 0.90, n);\n\n vec2 c2 = uv - 0.5;\n col *= 1.0 - 0.25 * dot(c2, c2);\n col = col / (col + vec3(0.4));\n col = pow(col, vec3(0.85));\n gl_FragColor = vec4(col, 1.0);\n}\n`;\n\nfunction compile(gl, type, src) {\n const s = gl.createShader(type);\n gl.shaderSource(s, src);\n gl.compileShader(s);\n if (!gl.getShaderParameter(s, gl.COMPILE_STATUS)) {\n throw new Error(gl.getShaderInfoLog(s) || \"shader compile failed\");\n }\n return s;\n}\n\nclass WaveButton {\n constructor(canvas) {\n this.canvas = canvas;\n this.broken = false;\n this.gl = canvas.getContext(\"webgl\", { antialias: true, alpha: false });\n if (!this.gl) { console.warn(\"WebGL unavailable\"); this.broken = true; return; }\n\n try {\n this._initGL();\n } catch (err) {\n console.error(\"Shader init failed:\", err);\n this.broken = true;\n }\n\n this.phase = 6.0;\n this.speed = 1.0;\n this.hover = false;\n this.last = performance.now();\n requestAnimationFrame((t) => this._frame(t));\n }\n\n _initGL() {\n const gl = this.gl;\n const prog = gl.createProgram();\n gl.attachShader(prog, compile(gl, gl.VERTEX_SHADER, VERT));\n gl.attachShader(prog, compile(gl, gl.FRAGMENT_SHADER, FRAG));\n gl.linkProgram(prog);\n if (!gl.getProgramParameter(prog, gl.LINK_STATUS)) {\n throw new Error(gl.getProgramInfoLog(prog) || \"link failed\");\n }\n gl.useProgram(prog);\n this.prog = prog;\n\n const buf = gl.createBuffer();\n gl.bindBuffer(gl.ARRAY_BUFFER, buf);\n gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]), gl.STATIC_DRAW);\n const aPos = gl.getAttribLocation(prog, \"aPos\");\n gl.enableVertexAttribArray(aPos);\n gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 0, 0);\n\n this.uRes = gl.getUniformLocation(prog, \"iResolution\");\n this.uTime = gl.getUniformLocation(prog, \"iTime\");\n }\n\n _resize() {\n const gl = this.gl, c = this.canvas;\n const dpr = Math.min(window.devicePixelRatio || 1, 2);\n const w = Math.round(c.clientWidth * dpr);\n const h = Math.round(c.clientHeight * dpr);\n if (w < 2 || h < 2) return false;\n if (c.width === w && c.height === h) return true;\n c.width = w; c.height = h;\n gl.viewport(0, 0, w, h);\n return true;\n }\n\n stir() { this.speed = Math.max(this.speed, 7.0); }\n\n _frame(t) {\n if (!this._resize()) { requestAnimationFrame((tt) => this._frame(tt)); return; }\n const gl = this.gl;\n\n gl.clearColor(0.02, 0.06, 0.08, 1.0);\n gl.clear(gl.COLOR_BUFFER_BIT);\n\n if (!this.broken) {\n const dt = Math.min((t - this.last) / 1000, 0.05);\n this.last = t;\n const base = this.hover ? 2.6 : 1.0; // gentle speed-up on hover\n this.speed += (base - this.speed) * Math.min(dt * 3.0, 1.0);\n this.phase += dt * this.speed;\n\n gl.useProgram(this.prog);\n gl.uniform2f(this.uRes, this.canvas.width, this.canvas.height);\n gl.uniform1f(this.uTime, this.phase);\n gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);\n }\n requestAnimationFrame((tt) => this._frame(tt));\n }\n}\n\nconst keyEl = document.getElementById(\"key\");\nconst btn = new WaveButton(document.getElementById(\"c\"));\n\nif (keyEl) {\n keyEl.addEventListener(\"pointerenter\", () => { if (btn) btn.hover = true; });\n keyEl.addEventListener(\"pointerleave\", () => { if (btn) { btn.hover = false; } keyEl.classList.remove(\"pressed\"); });\n keyEl.addEventListener(\"pointerdown\", () => keyEl.classList.add(\"pressed\"));\n [\"pointerup\", \"pointercancel\"].forEach((ev) =>\n keyEl.addEventListener(ev, () => keyEl.classList.remove(\"pressed\"))\n );\n keyEl.addEventListener(\"click\", (e) => { e.preventDefault(); if (btn) btn.stir(); });\n}\n","createdAt",["D",1780589880400],"branchVersion","branchId","8ab8138f-10f0-4e1c-b9d2-b5a0aadca321","id","a9782f58-8968-4788-978c-11dd19085ed6","water-button",["D",1780587284590],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Glass buttons that fill with shader water on click","imageUrl","9319c175-2593-4f88-ba21-04f2ef7b1c28","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","d663a026-6449-42f6-9156-1d4a2d64d38c","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_96":95,"_104":100},"org",{"_96":95,"_97":98,"_99":100,"_18":56,"_101":102,"_103":25},"branch",{"_13":85,"_32":86,"_44":43,"_87":45,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":46,"_94":95},"isOwned",18,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","dcm31","handle","displayName","Charlie","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/3e904faa-3764-4629-c475-f561a49b0000/square512?exp=1789563599&sig=6d4d4bc45e131131f67274a1f94308a04e903573252e7f03fdbea160d142eca1","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":207,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":54,"_55":-5,"_18":56,"_57":-5,"_58":25,"_59":-5,"_60":-5,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":208,"_80":209,"_82":210,"_84":25},"tree",[175,178,179,180],"files",[175,176,177,178,179,180],"counts",{"_165":62,"_166":136,"_167":62,"_168":169,"_170":171},"contents",[128,129,130,131],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles",true,"grants","orgs","customDomains",{},{"_44":158,"_32":159,"_30":160,"_135":-5,"_42":43,"_41":161,"_137":123,"_39":162,"_13":62,"_34":163,"_36":-5,"_24":25,"_141":-5,"_27":164},{"_44":151,"_32":152,"_30":153,"_135":-5,"_42":43,"_41":154,"_137":123,"_39":155,"_13":62,"_34":20,"_36":156,"_24":25,"_141":-5,"_27":157},{"_44":143,"_32":144,"_30":145,"_135":-5,"_42":43,"_41":146,"_137":123,"_39":147,"_13":148,"_34":20,"_36":149,"_24":25,"_141":-5,"_27":150},{"_44":132,"_32":133,"_30":134,"_135":-5,"_42":43,"_41":136,"_137":25,"_39":138,"_13":62,"_34":139,"_36":140,"_24":25,"_141":-5,"_27":142},"3c0f504b-39f5-4afb-9106-a7691c1e17c4","main.ts","e96b4e84-602a-11f1-ae41-1607ee4eb77e","parentId",1,"latest",["D",1780587284607],"http","import { Hono } from \"npm:hono@4\";\nimport { readFile, serveFile, parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err));\n\napp.get(\"/\", async (c) => c.html(await readFile(\"/index.html\", import.meta.url)));\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\nexport default app.fetch;\n","label",[133],"5d86c2b5-613e-4041-99bf-291a2131fb6b","index.html","eff8409a-602a-11f1-b844-1607ee4eb77e",14,["D",1780589818735],2,"\n\n\n\n\nHalcyon — calm infrastructure for fast teams\n\n\n\n\n\n\n\n

\n \n \n \n \n Halcyon\n \n \n

\n \n Get started\n

\n\n

\n Halcyon Streams is live →\n

Calm infrastructure
for fast teams.

Realtime data, queues, and object storage on one liquid-smooth platform. No ops, no cold starts, no drama.

\n\n

\n \n

\n \n Start free\n \n Read the docs\n

\n\n

Free to start · No credit card · SOC 2 Type II

\n\n \n

\n \n\n\n",[144],"2caa0778-5144-4470-ab18-ebd11b4ce1df","README.md","2cf3a75a-602b-11f1-a59c-1607ee4eb77e",5,["D",1780587397911],"# 💧 water-button\n\nTwo chunky glass buttons filled with shader-simulated water. Raw WebGL, no libraries.\n\n- **Left vessel** starts empty and fills ~8.5% per click (caps at 95%).\n- **Right vessel** always settles back to half full.\n- Both **slosh** when clicked — a side-to-side tilt plus a localized splash.\n\nThe water surface is a 1D height-field (128 columns) integrated on the CPU each\nframe, encoded into a `1×N` texture, and handed to a fragment shader that draws\nthe body, caustics, and a bright waterline. CSS handles the chunky rounded glass.\n\n```mermaid\nflowchart LR\n Click -->|tilt + splash impulse| Sim[Height-field sim
128 cols · fixed step]\n Sim -->|encode offsets| Tex[1xN texture]\n Tex --> Shader[Fragment shader]\n Shader --> Canvas[Canvas]\n```\n\n## Files\n- `main.ts` — Hono server (serves page + assets, `/source` redirect)\n- `index.html` — markup\n- `frontend/style.css` — dark aquarium theme, glass vessels\n- `frontend/water-button.js` — WebGL sim + interaction\n",[152],"414947f2-722a-493d-9ae8-8b19aa49a5c8","frontend","21d01b35-eec3-4be1-b4d4-ad92450858ed",3,["D",1780587321777],"directory",[159],"pulls","branches","forks","envVars",{"_172":62,"_174":62},"connections",{"_172":62,"_173":62},"count","unfilledCount","emptyCount",{"_44":158,"_32":159,"_30":160,"_135":-5,"_42":43,"_41":161,"_137":123,"_39":204,"_13":62,"_34":163,"_36":-5,"_24":25,"_141":-5,"_182":205,"_27":206},{"_44":196,"_32":197,"_30":198,"_135":160,"_42":43,"_41":199,"_137":123,"_39":200,"_13":148,"_34":20,"_36":201,"_24":25,"_141":-5,"_182":202,"_27":203},{"_44":191,"_32":33,"_30":31,"_135":160,"_42":43,"_41":14,"_137":123,"_39":192,"_13":193,"_34":35,"_36":38,"_24":25,"_141":-5,"_182":194,"_27":195},{"_44":151,"_32":152,"_30":153,"_135":-5,"_42":43,"_41":154,"_137":123,"_39":188,"_13":62,"_34":20,"_36":156,"_24":25,"_141":-5,"_182":189,"_27":190},{"_44":143,"_32":144,"_30":145,"_135":-5,"_42":43,"_41":146,"_137":123,"_39":185,"_13":148,"_34":20,"_36":149,"_24":25,"_141":-5,"_182":186,"_27":187},{"_44":132,"_32":133,"_30":134,"_135":-5,"_42":43,"_41":136,"_137":25,"_39":181,"_13":62,"_34":139,"_36":140,"_24":25,"_141":-5,"_182":183,"_27":184},["D",1780587284607],"children",[],[133],["D",1780589818735],[],[144],["D",1780587397911],[],[152],"7e3454e1-331b-4fd0-90f2-89ae29dbf328",["D",1780589880400],7,[],[159,33],"35336a79-9fbd-444d-9eda-7b0f24ca680c","style.css","ff92c340-602a-11f1-812b-1607ee4eb77e",15,["D",1780589850442],":root{\n --bg:#070d0f;\n --bg2:#0b1518;\n --ink:#e9f2f0;\n --muted:#7a938f;\n --faint:#546a67;\n --accent:#7fe9dd;\n --glow:rgba(64,224,208,.26);\n --serif:\"Fraunces\", Georgia, serif;\n --mono:\"DM Mono\", ui-monospace, monospace;\n}\n\n*{ box-sizing:border-box; }\nhtml,body{ height:100%; }\nbody{\n margin:0;\n font-family:var(--mono);\n color:var(--ink);\n background:radial-gradient(130% 90% at 50% -8%, var(--bg2) 0%, var(--bg) 58%);\n -webkit-font-smoothing:antialiased;\n position:relative;\n}\nbody::before{\n content:\"\"; position:fixed; inset:0; z-index:0; pointer-events:none;\n background:radial-gradient(46% 42% at 50% 38%, var(--glow), transparent 72%);\n filter:blur(10px);\n}\nbody::after{\n content:\"\"; position:fixed; inset:0; z-index:0; pointer-events:none;\n opacity:.04; mix-blend-mode:overlay;\n background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E\");\n}\n\n.page{\n position:relative; z-index:1;\n min-height:100svh;\n display:flex; flex-direction:column;\n padding:0 clamp(20px, 5vw, 56px);\n}\n\n/* ---------- nav ---------- */\n.nav{\n display:flex; align-items:center; justify-content:space-between;\n padding:24px 0;\n opacity:0; animation:fade .8s .05s ease forwards;\n}\n.brand{\n display:inline-flex; align-items:center; gap:10px;\n font-family:var(--serif); font-weight:600; font-size:21px; letter-spacing:-.01em;\n color:var(--ink); text-decoration:none;\n}\n.mark{\n display:grid; place-items:center;\n width:32px; height:32px; border-radius:9px;\n color:#04201d; background:linear-gradient(160deg, var(--accent), #2bb6ac);\n box-shadow:0 4px 14px -4px var(--glow);\n}\n.links{ display:flex; gap:30px; }\n.links a{ color:var(--muted); text-decoration:none; font-size:13.5px; transition:color .18s; }\n.links a:hover{ color:var(--ink); }\n.auth{ display:flex; align-items:center; gap:18px; }\n.signin{ color:var(--muted); text-decoration:none; font-size:13.5px; transition:color .18s; }\n.signin:hover{ color:var(--ink); }\n\n/* ---------- hero ---------- */\n.hero{\n flex:1;\n display:flex; flex-direction:column; align-items:center; justify-content:center;\n text-align:center;\n padding:40px 0 64px;\n}\n.badge{\n display:inline-flex; align-items:center; gap:9px;\n padding:7px 15px; border-radius:999px;\n font-size:12.5px; color:var(--muted); text-decoration:none;\n border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.02);\n transition:border-color .2s, color .2s;\n opacity:0; animation:rise .9s .1s ease forwards;\n}\n.badge:hover{ border-color:rgba(127,233,221,.35); color:var(--ink); }\n.badge .dot{ width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px var(--accent); }\n.badge .arr{ color:var(--accent); }\n\n.headline{\n margin:26px 0 0;\n font-family:var(--serif); font-weight:600;\n font-size:clamp(40px, 7.5vw, 78px); line-height:.98; letter-spacing:-.025em;\n color:#f4faf8;\n opacity:0; animation:rise 1s .18s ease forwards;\n}\n.sub{\n max-width:46ch; margin:22px auto 0;\n font-size:15px; line-height:1.55; color:var(--muted);\n opacity:0; animation:rise 1s .26s ease forwards;\n}\n\n.cta{\n margin-top:38px;\n display:flex; gap:14px; align-items:center; flex-wrap:wrap; justify-content:center;\n opacity:0; animation:rise 1s .34s ease forwards;\n}\n.microcopy{\n margin-top:22px; font-size:12px; color:var(--faint); letter-spacing:.02em;\n opacity:0; animation:rise 1s .44s ease forwards;\n}\n\n/* ---------- buttons ---------- */\n.btn-liquid{\n position:relative; overflow:hidden;\n display:inline-flex; align-items:center; justify-content:center;\n padding:17px 40px; border-radius:999px;\n text-decoration:none; color:#fff; font-weight:500; font-size:15px; letter-spacing:.01em;\n border:1px solid rgba(255,255,255,.16);\n box-shadow:\n 0 12px 30px -8px rgba(0,0,0,.6),\n 0 0 0 1px rgba(255,255,255,.03) inset,\n 0 1px 0 rgba(255,255,255,.22) inset;\n transition:transform .14s cubic-bezier(.2,.85,.25,1), box-shadow .25s ease;\n -webkit-tap-highlight-color:transparent; user-select:none;\n}\n.btn-liquid canvas{ position:absolute; inset:0; z-index:0; width:100%; height:100%; display:block; }\n.btn-liquid .scrim{\n position:absolute; inset:0; z-index:1; pointer-events:none;\n background:linear-gradient(180deg, rgba(0,16,18,.12), rgba(0,10,12,.42));\n}\n.btn-liquid .label{ position:relative; z-index:2; text-shadow:0 1px 7px rgba(0,0,0,.55); }\n.btn-liquid:hover{\n transform:translateY(-2px);\n box-shadow:\n 0 20px 44px -10px rgba(0,0,0,.7),\n 0 0 46px -8px var(--glow),\n 0 1px 0 rgba(255,255,255,.26) inset;\n}\n.btn-liquid:focus-visible{ outline:2px solid var(--accent); outline-offset:4px; }\n.btn-liquid.pressed{ transform:translateY(1px) scale(.99); }\n\n.btn-ghost{\n display:inline-flex; align-items:center; justify-content:center;\n padding:17px 30px; border-radius:999px;\n text-decoration:none; color:var(--ink); font-size:15px; font-weight:500;\n border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.02);\n transition:border-color .2s, color .2s, background .2s;\n}\n.btn-ghost:hover{ border-color:rgba(127,233,221,.45); color:#fff; background:rgba(127,233,221,.06); }\n.btn-sm{ padding:9px 16px; font-size:13px; border-radius:11px; }\n\n/* ---------- footer ---------- */\n.foot{\n display:flex; gap:18px; align-items:center; justify-content:space-between;\n padding:22px 0;\n font-size:11.5px; color:var(--faint);\n opacity:0; animation:fade 1s .5s ease forwards;\n}\n.foot a{\n color:var(--faint); text-decoration:none;\n border-bottom:1px solid rgba(84,106,103,.4); padding-bottom:1px; transition:.2s;\n}\n.foot a:hover{ color:var(--accent); border-color:var(--accent); }\n\n@keyframes rise{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:translateY(0); } }\n@keyframes fade{ from{ opacity:0; } to{ opacity:1; } }\n\n@media (max-width:720px){\n .links{ display:none; }\n .cta{ flex-direction:column; width:100%; }\n .btn-liquid, .btn-ghost{ width:100%; }\n .foot{ flex-direction:column; gap:8px; }\n}\n",[],[159,197],["D",1780587321777],[176,177],[159],["D",1780587284590],{"_96":95,"_104":100},{"_96":95,"_97":98,"_99":100,"_18":56,"_101":102,"_103":25},{"_13":85,"_32":86,"_44":43,"_87":45,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":46,"_94":95},"ctx",{"_78":-5,"_125":244,"_245":246,"_247":248,"_249":25,"_250":25,"_251":25,"_252":123,"_253":-5,"_254":-7,"_255":-7,"_256":62,"_257":25,"_258":25,"_259":-5,"_260":25,"_261":25,"_262":25,"_263":-5},"ENV",{"_215":216,"_217":218,"_219":86,"_220":221,"_222":223,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Calm infrastructurefor fast teams.

Calm infrastructure
for fast teams.

Diff · v16