…
.foot{margin-top:22px;display:flex;gap:14px;flex-wrap:wrap}
.foot a{color:var(--soft)}
+/* the sample chat (moved from the hero Home, razie chat 6acbe2fd 2026-10-11) */
+.sx{font:inherit;color:inherit;display:flex;flex-direction:column;gap:8px;max-width:640px;margin:4px 0 8px}
+.sx .m{padding:10px 15px;border-radius:18px;max-width:80%;line-height:1.4;font-size:16px}
+.sx .y{align-self:flex-end;background:color-mix(in srgb,#185FA5 45%,var(--card,#26241f));color:var(--ink,#1d1d1b);border:1px solid color-mix(in srgb,#378ADD 55%,transparent);border-bottom-right-radius:5px}
+.sx .a{align-self:flex-start;background:var(--slate-bg,#f3f1ec);color:var(--ink,#1d1d1b);border-bottom-left-radius:5px}
+.sx .gap{height:6px}
+.make{margin:18px 0}
</style></head>
<body><div class="wrap">
…
<p class="sub">Everything your AI made for you. Ask it for another one in plain words.</p>
<div class="tiles" id="tiles"><p class="small">Loading your apps…</p></div>
+<section class="make"><h2>Make an app</h2><p class="small">Just talk to your AI in plain words. Here's a book club, built live; every app it makes gets a tile above.</p>
+<div class="sx">
+<div class="m y">I want an app that tracks the books our club reads, starting today.</div>
+<div class="m a">Done. Tap the new Book club tile on your home page.</div>
+<div class="gap"></div>
+<div class="m y">Cool. Change the colour scheme to dark, with a green tint.</div>
+<div class="m a">Done.</div>
+<div class="gap"></div>
+<div class="m y">OK, publish it.</div>
+<div class="m a">Done. It's live — here's the link to share.</div>
+<div class="gap"></div>
+<div class="m y">I'm reading The Cartographer of Lost Rivers, by Elena Marsh.</div>
+<div class="m a">Added to the top of your list.</div>
+</div>
+</section>
<section class="think"><h2>A thought</h2>
<div class="box" id="tx" contenteditable="plaintext-only" role="textbox" aria-multiline="true" aria-label="A thought" data-ph="An idea for an app, a change, something to remember…"></div>
…