site: replace the homepage with the Vertical Inference page

[lloyal-research]

Replaces the homepage with the Vertical Inference design, split out of the self-contained artifact into the repo's existing shape.

How it was split

The artifact is one 2.4 MB file: shared stylesheet, six page-specific style blocks, two scripts and a base64 screenshot, all inline. The split is surgical — every block keeps its original position so the cascade and execution order are unchanged:

Artifact	Repo
<style> #1 (34 KB)	/styles.css (linked from the same position)
<style> #2–7 (16 KB)	inline in index.html, in place
<script> #1	/app.js
<script> #2 (copy-to-clipboard)	appended to /app.js
2.3 MB data:image/png	/assets/harness-dev-new.png

The shared stylesheet turned out to differ from the deployed styles.css by two blank lines, and app.js was byte-identical — so this is a genuinely small change to the shared assets.

Verification

Rendered the artifact and the built page side by side and compared pixel by pixel:

• 1600, 1440, 1280, 1024, 900, 768, 640, 500px — 0 differing pixels (scripts stripped from both, to isolate layout from animation phase)
• 1280×800 with scripts live — 0 differing pixels
• #developers scrolls to y=3542 on both

With animations running, the only deltas were animation phase: the page has three infinite animations (blink, pulse, travel) and fetching the screenshot over HTTP instead of from a data URI shifts their phase at capture time. Neutralising motion collapsed those to zero.

Functional checks: app.js loads and runs, is-scrolled applies on scroll, the scroll-spy underline tracks the section under the header, all six anchor targets resolve, the screenshot loads from /assets, and the copy button carries npx harness.dev@latest new with a working fallback when the clipboard API is unavailable.

One deliberate deviation

app.js scroll-spied the previous homepage's sections:

const scrollspyIds = ['difference', 'build', 'product', 'compute', 'partner'];

Three of those ids don't exist on this page, and the two new sections weren't spied at all, so the nav underline landed wherever the observer race settled. Now:

const scrollspyIds = ['build', 'agentapps', 'developers', 'partner'];

This is present in the artifact too — fixing it makes the built page behave better than the source, which is the one place they intentionally differ.

Notes

• The screenshot is 1.7 MB. Faithful to the artifact, but it's the page's whole weight budget — worth a resize or WebP pass separately, which would change rendering slightly.
• Section ids change from top/difference/build/ship/product/compute/partner to top/build/agentapps/developers/partner. The blog's nav links at /#difference, /#product and /#compute need repointing — handled in the blog PR (blog: rebuild on the Lloyal visual system, full bleed with an inverted shell #10).

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	website	3c43491	Commit Preview URL Branch Preview URL	Aug 10 2026, 06:50 PM