From 948671b52580da76473fb15668a8bac9876ee758 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 2 Aug 2026 16:53:53 +0000
Subject: [PATCH 1/2] Rewrite the hero and examples copy, and make the sample
 fit a phone

The hero was a list of nouns wearing a sentence, and "Each opens in the
playground, running" is not a thing anybody says out loud. Both rewritten
to say what is actually on offer.

The HyperTalk sample was clipped on a phone: the longest line is
fifty-one characters, which cannot be shrunk to fit and gave no sign it
could be scrolled, so it just stopped at the edge. The page had no media
query at all. It has one now, and on a narrow screen the sample wraps
rather than disappearing; the buttons stack instead of crowding.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01R7eaxUAqy2gKQSBNnYZoFr
---
 apps/web/index.html      | 11 ++++++-----
 apps/web/src/landing.css | 42 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 48 insertions(+), 5 deletions(-)

diff --git a/apps/web/index.html b/apps/web/index.html
index 660456e..02ab579 100644
--- a/apps/web/index.html
+++ b/apps/web/index.html
@@ -6,7 +6,7 @@
     <title>HyperLab — an open-source, AI-native successor to HyperCard</title>
     <meta
       name="description"
-      content="Cards, buttons, fields and HyperTalk, with language models built into the language. Runs in the browser."
+      content="An open-source, AI-native successor to HyperCard. Scripts can ask a language model, and the whole thing runs in your browser."
     />
     <link rel="icon" type="image/svg+xml" href="favicon.svg" />
     <link rel="stylesheet" href="/src/landing.css" />
@@ -36,8 +36,9 @@ <h1 class="window__title" id="welcome-title">Welcome to HyperLab</h1>
         </div>
         <div class="window__body">
           <p class="hero__line">
-            An open-source, <strong>AI-native successor to HyperCard</strong>. Cards,
-            buttons, fields and HyperTalk, and a stack stays editable while it runs.
+            An open-source, <strong>AI-native successor to HyperCard</strong>. A script
+            can stop and ask a language model, and the stack stays editable the whole time
+            it runs.
           </p>
           <pre class="hero__script" aria-label="A HyperTalk example">
 on mouseUp
@@ -114,8 +115,8 @@ <h2 class="window__title" id="examples-title">Examples</h2>
         </div>
         <div class="window__body">
           <p>
-            Each opens in the playground, running. Switch to the edit tool to read the
-            scripts that make it work.
+            Open any of these and it starts running in the playground. Switch to the edit
+            tool to read the scripts behind it.
           </p>
           <ul class="stacks">
             <li>
diff --git a/apps/web/src/landing.css b/apps/web/src/landing.css
index 0cfc19f..7e4e76e 100644
--- a/apps/web/src/landing.css
+++ b/apps/web/src/landing.css
@@ -293,3 +293,45 @@ body {
 .colophon a {
   color: var(--ink);
 }
+
+/* ----------------------------------------------------------------- phones */
+
+/*
+ * A phone is narrower than `put ai("Summarize this card") into field
+ * "Summary"`. Scrolling the sample sideways is no help when nothing on
+ * screen says it scrolls — the line just stops at the edge and looks
+ * broken — and shrinking it to fit would take it under ten pixels. So on a
+ * narrow screen it wraps instead.
+ */
+@media (max-width: 34rem) {
+  .desk {
+    padding: 20px 10px 32px;
+    gap: 20px;
+  }
+
+  .window__body {
+    padding: 12px 14px;
+  }
+
+  .hero__script {
+    white-space: pre-wrap;
+    overflow-wrap: break-word;
+    font-size: 11px;
+  }
+
+  .hero__line {
+    font-size: 15px;
+  }
+
+  /* Thumb-sized, and each on its own line rather than three cramped side
+     by side. */
+  .hero__buttons {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .button {
+    text-align: center;
+    padding: 8px 18px;
+  }
+}

From f6578269d495c24718811d3be5ed46ae514d6ce3 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sun, 2 Aug 2026 16:56:46 +0000
Subject: [PATCH 2/2] Say what each example does instead of counting its parts
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Every blurb in the gallery was the same shape — a tally of nouns standing
in for a description. "A list, a dialog, and a loop" tells you nothing
about what the Todo stack is for. All six now describe what the thing
does.

The same habit had got into docs/website.md, where the components and the
crates were each rendered as a five-item list, and into the export
sentence on the landing page. Lists that carry real information — which
providers work, which formats a stack exports to — stay, because naming
them is the information.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01R7eaxUAqy2gKQSBNnYZoFr
---
 apps/web/index.html | 31 +++++++++++++++++++------------
 docs/website.md     | 14 +++++++-------
 2 files changed, 26 insertions(+), 19 deletions(-)

diff --git a/apps/web/index.html b/apps/web/index.html
index 02ab579..d75bab3 100644
--- a/apps/web/index.html
+++ b/apps/web/index.html
@@ -123,8 +123,8 @@ <h2 class="window__title" id="examples-title">Examples</h2>
               <a class="stack" href="play.html?stack=Cluedo">
                 <span class="stack__name">Cluedo</span>
                 <span class="stack__blurb"
-                  >A drawn mansion with clickable rooms, and a case you close by
-                  deduction.</span
+                  >The board is drawn artwork and every room on it is a button, so you
+                  close the case by clicking your way around the mansion.</span
                 >
               </a>
             </li>
@@ -132,8 +132,9 @@ <h2 class="window__title" id="examples-title">Examples</h2>
               <a class="stack" href="play.html?stack=Myst">
                 <span class="stack__name">Myst</span>
                 <span class="stack__blurb"
-                  >An island, four Ages, and one book you should not open. Go ▸ Map finds
-                  the trap without running a line.</span
+                  >Wander the island and the Ages it leads to, and try not to open the
+                  wrong book. Go ▸ Map finds that trap by reading the scripts, without
+                  running any of them.</span
                 >
               </a>
             </li>
@@ -141,8 +142,9 @@ <h2 class="window__title" id="examples-title">Examples</h2>
               <a class="stack" href="play.html?stack=LLMs%20for%20n00bs">
                 <span class="stack__name">LLMs for n00bs</span>
                 <span class="stack__blurb"
-                  >Nine slides on how a language model works. The last one asks a real
-                  model, and says so plainly when none is set up.</span
+                  >Explains how a language model works, one drawn slide at a time, then
+                  finishes by asking a real one — and says so plainly when you have not
+                  set one up.</span
                 >
               </a>
             </li>
@@ -150,7 +152,8 @@ <h2 class="window__title" id="examples-title">Examples</h2>
               <a class="stack" href="play.html?stack=Address%20Book">
                 <span class="stack__name">Address Book</span>
                 <span class="stack__blurb"
-                  >A card per person, one shared background.</span
+                  >Shows what backgrounds are for: everyone gets their own card, while the
+                  layout they all sit on is edited once.</span
                 >
               </a>
             </li>
@@ -158,14 +161,18 @@ <h2 class="window__title" id="examples-title">Examples</h2>
               <a class="stack" href="play.html?stack=Recipe%20Box">
                 <span class="stack__name">Recipe Box</span>
                 <span class="stack__blurb"
-                  >Chunk expressions doing arithmetic on the ingredients.</span
+                  >Doubles a recipe by pulling the number out of each ingredient line,
+                  which is what chunk expressions are for.</span
                 >
               </a>
             </li>
             <li>
               <a class="stack" href="play.html?stack=Todo">
                 <span class="stack__name">Todo</span>
-                <span class="stack__blurb">A list, a dialog, and a loop.</span>
+                <span class="stack__blurb"
+                  >Adds whatever you type to the list, then walks back through it to count
+                  what is still outstanding.</span
+                >
               </a>
             </li>
           </ul>
@@ -211,9 +218,9 @@ <h2 class="window__title" id="home-title">The desktop application</h2>
             same file.
           </p>
           <p>
-            Stacks export as a PDF, as a PNG of the map, as a self-contained web page, and
-            as a <a href="https://beyondloom.com/decker/">Decker</a> deck — from the
-            playground as readily as from the application.
+            Every export the application offers works in the playground too: PDF, a PNG of
+            the map, a self-contained web page, and a
+            <a href="https://beyondloom.com/decker/">Decker</a> deck.
           </p>
         </div>
       </section>
diff --git a/docs/website.md b/docs/website.md
index 0d6814a..75b70b1 100644
--- a/docs/website.md
+++ b/docs/website.md
@@ -12,17 +12,17 @@ follows from there being no server.
 
 ## The playground is the application
 
-The playground page renders the desktop's own React components — the card,
-the inspector, the assistant sidebar, the map, the dialogs. It can, because
+The playground page renders the desktop's own React components, down to the
+dialog a script blocks on. It can, because
 the desktop keeps its whole shell behind one module (`apps/desktop/src/api.ts`,
 a typed wrapper per command), and the renderer never learns which shell
 answers. Vite swaps that one module for `apps/web/src/api.ts`; nothing else
 in the desktop tree is touched, so the two interfaces cannot drift apart —
 they are the same files.
 
-Behind the web `api.ts` sits `crates/web` (`hyperlab-web`): the same crates
-the desktop wraps — runtime, parser, persistence, graph, the assistant —
-compiled to WebAssembly, exporting one function per desktop command. Its
+Behind the web `api.ts` sits `crates/web` (`hyperlab-web`), which wraps the
+same crates the Tauri shell wraps, compiled to WebAssembly and exporting one
+function per desktop command. Its
 `view.rs` is a hand-kept twin of the desktop's, and a test serializes a
 snapshot and checks the field names against what the renderer expects.
 
@@ -110,8 +110,8 @@ keeps the same shape with the parts a page has:
   script blocked mid-line on `ai("…")`. The wire protocol is the same Rust
   code the desktop uses (`hyperlab-ai-providers` built without its native
   clients); only the transport is the browser's.
-- The site being static files is the guarantee's other half: there is no
-  HyperLab server for a key, a stack, or a question to visit.
+- The site being static files is the guarantee's other half: nothing a
+  browser sends has anywhere of ours to stop off at on the way.
 
 Anthropic requires the `anthropic-dangerous-direct-browser-access` header
 before answering a browser at all. Sending it is honest here: the request