vibespot 1.6.5 → 1.8.0

package/ui/dashboard.js

@@ -78,9 +78,16 @@ function hideDashboard() {
 // ---------------------------------------------------------------------------
 
 async function refreshDashboard() {
+  // Guard against a stale in-flight response rendering after the user
+  // switched to another theme (or left the dashboard) mid-fetch.
+  const themeAtStart = currentDashboardTheme;
+  const sessionAtStart = currentDashboardSessionId;
   try {
     const res = await fetch("/api/dashboard");
     const data = await res.json();
+    if (currentDashboardTheme !== themeAtStart || currentDashboardSessionId !== sessionAtStart) {
+      return;
+    }
     if (data.error) {
       console.warn("Dashboard load error:", data.error);
       return;
@@ -673,7 +680,9 @@ document.getElementById("dashboard-brand-assets")?.addEventListener("change", (e
   if (e.target.type !== "file") return;
   const card = e.target.closest(".brand-asset-card");
   if (!card || !e.target.files[0]) return;
-  handleBrandFileSelected(card.dataset.asset, e.target.files[0]);
+  const file = e.target.files[0];
+  e.target.value = ""; // allow re-selecting the same file after an error
+  handleBrandFileSelected(card.dataset.asset, file);
 });
 
 // ---------------------------------------------------------------------------
@@ -785,27 +794,43 @@ function updateBrandPreview() {
   const logoImg = document.getElementById("brand-preview-logo");
   const logoPlaceholder = document.getElementById("brand-preview-logo-placeholder");
   if (logoImg && logoPlaceholder) {
-    if (logoUrl) {
-      logoImg.src = logoUrl;
-      logoImg.hidden = false;
-      logoPlaceholder.hidden = true;
+    const safeLogoUrl = logoUrl ? safeImageUrl(logoUrl) : null;
+    if (safeLogoUrl) {
+      // Attach handlers before setting src so a fast (cached) result can't
+      // race past them and wedge the preview in a stale state.
       logoImg.onerror = () => {
         logoImg.hidden = true;
+        logoImg.removeAttribute("src");
         logoPlaceholder.hidden = false;
         logoPlaceholder.textContent = "Bad URL";
       };
       logoImg.onload = () => {
+        logoImg.hidden = false;
+        logoPlaceholder.hidden = true;
         logoPlaceholder.textContent = "No logo";
       };
+      logoImg.src = safeLogoUrl;
+      logoImg.hidden = false;
+      logoPlaceholder.hidden = true;
     } else {
       logoImg.hidden = true;
       logoImg.removeAttribute("src");
       logoPlaceholder.hidden = false;
-      logoPlaceholder.textContent = "No logo";
+      logoPlaceholder.textContent = logoUrl ? "Bad URL" : "No logo";
     }
   }
 }
 
+// Only http(s) URLs (or paths that resolve to them) may reach img.src —
+// blocks javascript:, data:, file: etc. from the free-text logo field.
+function safeImageUrl(url) {
+  try {
+    const parsed = new URL(url, window.location.href);
+    if (parsed.protocol === "http:" || parsed.protocol === "https:") return parsed.href;
+  } catch { /* unparseable */ }
+  return null;
+}
+
 for (const id of [
   "bk-hex-primary", "bk-hex-secondary", "bk-hex-accent",
   "bk-color-primary", "bk-color-secondary", "bk-color-accent",
@@ -1026,15 +1051,31 @@ async function uploadBrandAsset(type) {
   fileInput.click();
 }
 
+// Brand assets are prose fed into AI prompts — 1 MB of markdown is already
+// far beyond useful; anything bigger is a mis-picked file.
+const MAX_BRAND_ASSET_BYTES = 1024 * 1024;
+
 async function handleBrandFileSelected(type, file) {
-  const content = await file.text();
+  if (file.size > MAX_BRAND_ASSET_BYTES) {
+    await vibeAlert(
+      `File is too large (${(file.size / (1024 * 1024)).toFixed(1)} MB). Brand assets are text files up to 1 MB.`,
+      "Error",
+    );
+    return;
+  }
+  if (!/\.(md|markdown|txt)$/i.test(file.name || "")) {
+    await vibeAlert("Only .md and .txt files are supported.", "Error");
+    return;
+  }
 
   try {
-    const res = await fetch("/api/brand-assets", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ type, content }),
-    });
+    // Multipart keeps the file out of a JSON string (no UTF-16/binary
+    // mangling, no full-file JSON.stringify); the server enforces the same
+    // size cap and rejects non-text content.
+    const form = new FormData();
+    form.append("type", type);
+    form.append("file", file, file.name);
+    const res = await fetch("/api/brand-assets", { method: "POST", body: form });
     const data = await res.json();
     if (data.error) {
       await vibeAlert(data.error, "Error");

package/ui/docs/index.html

@@ -86,6 +86,10 @@
     <a class="doc-nav__link doc-nav__link--sub" href="#intent-types">Intents</a>
     <a class="doc-nav__link doc-nav__link--sub" href="#prompt-tips">Prompt Tips</a>
     <a class="doc-nav__link doc-nav__link--sub" href="#brand-assets">Brand Assets</a>
+    <a class="doc-nav__link" href="#checkpoints">Checkpoints</a>
+    <a class="doc-nav__link doc-nav__link--sub" href="#checkpoints-seams">The Three Seams</a>
+    <a class="doc-nav__link doc-nav__link--sub" href="#checkpoints-card">The Checkpoint Card</a>
+    <a class="doc-nav__link doc-nav__link--sub" href="#checkpoints-oneshot">One-Shot Escape Hatch</a>
     <a class="doc-nav__link" href="#plan-mode">Plan Mode</a>
     <a class="doc-nav__link doc-nav__link--sub" href="#plan-mode-when">When to Use</a>
     <a class="doc-nav__link doc-nav__link--sub" href="#plan-mode-flow">The Flow</a>
@@ -368,9 +372,14 @@ vibespot</code></pre>
       <tr><td><code>langfusePublicKey</code></td><td>string</td><td>Langfuse public key (<code>pk-lf-</code>)</td></tr>
       <tr><td><code>langfuseSecretKey</code></td><td>string</td><td>Langfuse secret key (<code>sk-lf-</code>)</td></tr>
       <tr><td><code>langfuseBaseUrl</code></td><td>string</td><td>Langfuse ingestion endpoint (default: <code>https://cloud.langfuse.com</code>)</td></tr>
+      <tr><td><code>lastSeenVersion</code></td><td>string</td><td>The version whose release notes you last dismissed in the <a href="#whats-new">What's new</a> dialog. Set automatically on dismiss; the dialog reappears when you upgrade to a newer version.</td></tr>
     </tbody>
   </table>
 
+  <h3 id="whats-new">What's new dialog</h3>
+  <p>The first time you open the builder after upgrading, a dialog shows the highlights of the new version with a link to the full changelog. Dismiss it &mdash; with the <strong>&times;</strong>, <strong>Got it</strong>, a click outside, or <kbd>Esc</kbd> &mdash; and it stays hidden until the next release. One card per version, never a repeat nag.</p>
+  <p>The highlights are pulled straight from <a href="https://github.com/borismichel/vibespot/blob/main/CHANGELOG.md"><code>CHANGELOG.md</code></a> at build time, so every release shows its own notes. Your dismissal is remembered per machine via <code>lastSeenVersion</code> in <code>~/.vibespot/config.json</code>.</p>
+
   <h3 id="env-vars">Environment Variables</h3>
   <p>API keys and server settings can be set as environment variables. The config file takes precedence &mdash; environment variables are used as fallbacks when no key is set in the config. In Docker deployments, env vars are the primary configuration method (see <a href="#docker-deployment">Docker Deployment</a>).</p>
   <table>
@@ -390,6 +399,10 @@ vibespot</code></pre>
       <tr><td><code>VIBESPOT_AGENTIC_MODE</code></td><td>Set <code>true</code> to enable the multi-stage agentic pipeline</td></tr>
       <tr><td><code>VIBESPOT_PORT</code></td><td>Override the HTTP server port (default: <code>4200</code>)</td></tr>
       <tr><td><code>VIBESPOT_NO_OPEN</code></td><td>Set <code>1</code> to suppress auto-opening the browser on startup</td></tr>
+      <tr><td><code>VIBESPOT_HOST</code></td><td>Bind address (default: <code>127.0.0.1</code>, loopback only). Set <code>0.0.0.0</code> to reach vibeSpot from another device &mdash; a non-loopback bind requires the access token printed at boot (see "Access from another device" in the README)</td></tr>
+      <tr><td><code>VIBESPOT_AUTH_TOKEN</code></td><td>Pin the shared-secret access token used on non-loopback binds (otherwise a fresh one is generated at boot and printed in the startup URL)</td></tr>
+      <tr><td><code>VIBESPOT_DISABLE_AUTH</code></td><td>Set <code>1</code> to disable the auth gate. Only for deployments behind their own authenticating proxy; on a non-loopback bind this additionally requires <code>VIBESPOT_TRUST_PROXY=1</code></td></tr>
+      <tr><td><code>VIBESPOT_TRUST_PROXY</code></td><td>Set <code>1</code> to acknowledge that an authenticating reverse proxy is the sole ingress, allowing <code>VIBESPOT_DISABLE_AUTH=1</code> on a non-loopback bind</td></tr>
       <tr><td><code>LANGFUSE_ENABLED</code></td><td>Set <code>true</code> to send <a href="#langfuse">Langfuse traces</a>. Required &mdash; keys alone don't enable it.</td></tr>
       <tr><td><code>LANGFUSE_PUBLIC_KEY</code></td><td>Langfuse public key (<code>pk-lf-</code>)</td></tr>
       <tr><td><code>LANGFUSE_SECRET_KEY</code></td><td>Langfuse secret key (<code>sk-lf-</code>)</td></tr>
@@ -954,12 +967,49 @@ testimonial carousel, and a minimal footer with social links.</code></pre>
   </ul>
 </div>
 
+<!-- ============================================================
+     Section: Checkpoints
+     ============================================================ -->
+<div class="doc-section" id="checkpoints">
+  <h2 id="checkpoints-heading">Checkpoints <a href="#checkpoints" class="doc-anchor">#</a></h2>
+  <p class="doc-subtitle">The default generation flow. Instead of running all four pipeline stages in one blocking shot, vibeSpot pauses at cheap seams and shows you a review card <em>before</em> spending tokens on the expensive parallel module build &mdash; so you steer the look and the skeleton while changes are still free.</p>
+
+  <p>The <a href="#agentic-pipeline">agentic pipeline</a> has a natural cost cliff: the design system (Stage 2a) and the module plan (Stage 2b) are a handful of cheap calls, but the module build (Stage 3) fans out one generation per module in parallel &mdash; the bulk of the spend and the wait. Checkpoints park the pipeline at the seams before that cliff. You see what the AI decided, adjust it, and only then pay for the build. Each gate is rendered from data the pipeline already produced, so showing the card costs nothing extra.</p>
+
+  <img class="doc-screenshot" style="max-width:360px" src="screenshots/checkpoint-card.png" alt="Design checkpoint card in the chat panel: a DESIGN CHECKPOINT badge, a rendered hero preview, the palette swatches and heading/body type specimen, the estimated build cost, and Approve / Steer / Skip / Cancel buttons">
+
+  <h3 id="checkpoints-seams">The Three Seams</h3>
+  <p>For a from-scratch page, checkpoints fire in order: <strong>brand intake &rarr; design &rarr; structure &rarr; build</strong>. Modifications to an existing page, email generation, and plan-approved runs build straight through without gating.</p>
+  <ol class="doc-steps">
+    <li><strong>Brand intake.</strong> When you ask for a new page and the theme has no style system yet, vibeSpot asks first instead of guessing: <strong>bring your brand</strong> (paste colors, drop in CSS/code, point at an existing theme or a live URL, describe your voice) or <strong>let it choose</strong>. What you provide seeds the <code>:root</code> design tokens that feed the design checkpoint. Skipped when the theme already has a style system.</li>
+    <li><strong>Design checkpoint.</strong> After the design-system stage, the pipeline parks and shows a <strong>design card</strong>: palette swatches, a heading/body type specimen, and one representative hero rendered straight from the design tokens. No extra model call &mdash; it's a deterministic preview of the tokens the build will use.</li>
+    <li><strong>Structure checkpoint.</strong> After the module planner, the pipeline parks again and shows the planned modules as an <strong>editable outline</strong>. Reorder rows (&#9650;/&#9660;), cut them (&#10005;), rename inline, or add a section &mdash; all client-side, no model call. The build honors exactly the outline you keep: a reorder or rename preserves that module's planned brief; an added row gets a sensible default brief.</li>
+  </ol>
+
+  <h3 id="checkpoints-card">The Checkpoint Card</h3>
+  <p>Every checkpoint card offers the same four actions, plus a cost estimate:</p>
+  <ul>
+    <li><strong>Approve</strong> &mdash; accept what's shown and continue to the next seam (or the build, at the last gate).</li>
+    <li><strong>Steer</strong> &mdash; type a note and vibeSpot re-runs <em>only</em> that stage with your guidance, then re-previews. Cheap to iterate, because you're redoing one stage, not the whole page.</li>
+    <li><strong>Skip</strong> &mdash; build now and suppress any remaining gates for this run. Skipping at the design gate suppresses the structure gate too.</li>
+    <li><strong>Cancel</strong> &mdash; drop the run. Nothing is written.</li>
+  </ul>
+  <p>Each card also shows the <strong>estimated cost of the build it gates</strong>, computed from spend-so-far via the per-page <a href="#observability">cost tracker</a> &mdash; so you know what Approve will cost before you click it. (CLI engines report no usage, so the estimate is omitted for them.)</p>
+  <div class="doc-callout doc-callout--tip">
+    <div class="doc-callout__label">&#128268; Crash-safe by design</div>
+    <p>A parked checkpoint isn't a paused, open promise &mdash; the pipeline <em>returns</em> at the gate and your resolution re-enters it via a resume token. The resume state is persisted with the session, so an open gate even survives a server restart: reopen the theme and the parked card is still there &mdash; approve, steer, or skip it and the run continues where it left off.</p>
+  </div>
+
+  <h3 id="checkpoints-oneshot">One-Shot Escape Hatch</h3>
+  <p>Checkpoints are <strong>on by default</strong> for from-scratch page generation. When you already know what you want and don't need to review, the <strong>one-shot</strong> button next to send runs the whole pipeline in one go &mdash; the previous one-call behaviour, no gates. It's a per-message choice: tap one-shot for this prompt, or hit send to go through the checkpoints.</p>
+</div>
+
 <!-- ============================================================
      Section: Plan Mode
      ============================================================ -->
 <div class="doc-section" id="plan-mode">
   <h2 id="plan-mode-heading">Plan Mode <a href="#plan-mode" class="doc-anchor">#</a></h2>
-  <p class="doc-subtitle">A deliberation phase that runs <em>before</em> any code is generated. Plan mode turns vague briefs into well-scoped plans through guided dialogue, then runs the agentic pipeline against the approved plan as a high-fidelity design brief.</p>
+  <p class="doc-subtitle">A deliberation phase that runs <em>before</em> any code is generated. Plan mode turns vague briefs into well-scoped plans through guided dialogue, then runs the agentic pipeline against the approved plan as a high-fidelity design brief. It is the heaviest variant of the <a href="#checkpoints">checkpoint</a> flow &mdash; a full written plan you approve, rather than a single review card.</p>
 
   <p>Without plan mode, vibeSpot generates immediately on every chat message &mdash; fast, but unforgiving on vague prompts. The AI guesses at audience, content, and structure, and you find out what it guessed only after a full generation cycle. Plan mode flips the order: the AI asks targeted questions first, surfaces what's missing, and only generates after you've reviewed and approved a written plan. The plan is markdown, persisted to <code>{theme}/.vibespot/plan.md</code>, and reviewable in a dedicated tab in the right pane.</p>
 
@@ -1010,6 +1060,11 @@ testimonial carousel, and a minimal footer with social links.</code></pre>
   </ul>
   <p>The plan persists across vibeSpot restarts. Open the same theme weeks later, toggle plan mode on, and your in-progress plan is right where you left it.</p>
 
+  <div class="doc-callout doc-callout--info">
+    <div class="doc-callout__label">&#128279; One primitive under the hood</div>
+    <p>Plan approval now runs on the same park-and-re-enter machinery as the design and structure <a href="#checkpoints">checkpoints</a>. <strong>Approve plan</strong> and <strong>Discard &amp; start over</strong> resolve through the shared <code>checkpoint_resolve</code> path (approve &rarr; build, cancel &rarr; discard), so plan mode, the design gate, and the structure gate are three faces of one gating model rather than separate code paths. A plan-approved run builds straight through &mdash; it doesn't re-gate at the design or structure seams, because the plan already covered that deliberation.</p>
+  </div>
+
   <div class="doc-callout doc-callout--tip">
     <div class="doc-callout__label">&#10024; Plan mode + brand assets</div>
     <p>If your theme has a styleguide, brand voice, or product context loaded, the plan-mode AI uses them automatically. The plan will reference the right colors and tone without you re-stating them. After approval, the agentic pipeline gets the plan <em>and</em> the brand assets &mdash; double the alignment.</p>
@@ -1500,7 +1555,7 @@ docker cp vibespot:/home/vibespot/vibespot-themes ./backup-themes</code></pre>
   </ul>
   <div class="doc-callout doc-callout--tip">
     <div class="doc-callout__label">&#9888;&#65039; Single instance &amp; auth</div>
-    <p>vibeSpot keeps active sessions in memory &mdash; run a single instance (no horizontal scaling without sticky sessions). It runs as a non-root user and has <strong>no built-in authentication</strong>. For internet-facing deployments, put an authenticating proxy (OAuth2 Proxy, Authelia, Cloudflare Access) in front. Persistence is filesystem-only on the named volumes &mdash; there is no database to run.</p>
+    <p>vibeSpot keeps active sessions in memory &mdash; run a single instance (no horizontal scaling without sticky sessions). It runs as a non-root user and has <strong>no built-in authentication</strong>. For internet-facing deployments, enable the bundled <strong>Azure Entra SSO gate</strong> (the <code>docker-compose.auth.yml</code> overlay) or put your own authenticating proxy (Authelia, Cloudflare Access) in front. Persistence is filesystem-only on the named volumes &mdash; there is no database to run.</p>
   </div>
 </div>
 

package/ui/email-preview.js

@@ -38,11 +38,7 @@
     }
   }
 
-  function escapeHtml(str) {
-    var div = document.createElement("div");
-    div.textContent = str;
-    return div.innerHTML;
-  }
+  // escapeHtml comes from the shared ui/escape-html.js (VIB-1902).
 
   function openEmailPreview() {
     overlay.classList.remove("hidden");

package/ui/escape-html.js

@@ -0,0 +1,14 @@
+/**
+ * Shared HTML escaper (VIB-1902). Loaded before every script that
+ * interpolates untrusted strings into innerHTML — chat.js, plan.js and
+ * email-preview.js previously each carried their own copy (the
+ * email-preview one didn't escape quotes, so it was unsafe in attribute
+ * context). One definition, attribute-safe, used everywhere.
+ */
+function escapeHtml(str) {
+  return String(str)
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;");
+}

package/ui/field-editor.js

@@ -39,7 +39,9 @@ async function openFieldEditor(moduleName) {
 }
 
 function closeFieldEditor() {
-  if (updateTimer) { clearTimeout(updateTimer); updateTimer = null; }
+  // Fire (not drop) any debounced edit still pending — closing the editor
+  // right after typing must not lose the change (VIB-1898).
+  flushPendingFieldSaves();
   currentEditModule = null;
   if (typeof showModuleListView === "function") {
     showModuleListView();
@@ -281,18 +283,10 @@ function createFieldInput(field, moduleName, fullPath) {
 // Update field and refresh preview
 // ---------------------------------------------------------------------------
 
-let updateTimer = null;
-
 function updateField(moduleName, fieldPath, value) {
-  // Debounce updates
-  clearTimeout(updateTimer);
-  updateTimer = setTimeout(() => {
-    fetch("/api/field", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ moduleName, fieldPath, value }),
-    }).then(() => refreshPreview());
-  }, 300);
+  // Debounced per field via the shared save module (field-save.js) — editing
+  // a second field no longer cancels the first field's save (VIB-1898).
+  saveFieldDebounced(moduleName, fieldPath, value);
 }
 
 // ---------------------------------------------------------------------------

package/ui/field-save.js

@@ -0,0 +1,82 @@
+/**
+ * Unified /api/field save path (VIB-1898).
+ *
+ * All three field-editing surfaces persist through this module — the field
+ * editor sidebar (field-editor.js), inline interact-mode edits
+ * (inline-edit.js) and the section-controls commits (section-controls.js).
+ * The debounce is keyed PER FIELD, so editing a second field never cancels
+ * the first field's pending save, and saves to the same field are chained so
+ * an earlier POST can't land after a later one.
+ */
+
+/** key -> { timer, moduleName, fieldPath, value, opts } */
+const fieldSavePending = new Map();
+/** key -> tail of that field's in-flight POST chain */
+const fieldSaveChains = new Map();
+const FIELD_SAVE_DEBOUNCE_MS = 300;
+
+function fieldSaveKey(moduleName, fieldPath) {
+  return `${moduleName}\u0000${fieldPath}`;
+}
+
+/**
+ * Save one field value now.
+ *
+ * @param {Object} [opts]
+ * @param {boolean} [opts.refresh=true] Refresh the preview after the POST.
+ * @returns {Promise<void>} resolves after the POST (and refresh) settle.
+ */
+function saveField(moduleName, fieldPath, value, opts = {}) {
+  const key = fieldSaveKey(moduleName, fieldPath);
+  // An immediate save supersedes any older debounced value for the field.
+  const pending = fieldSavePending.get(key);
+  if (pending) {
+    clearTimeout(pending.timer);
+    fieldSavePending.delete(key);
+  }
+  const tail = fieldSaveChains.get(key) || Promise.resolve();
+  const post = tail
+    .then(() =>
+      fetch("/api/field", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ moduleName, fieldPath, value }),
+      })
+    )
+    .then(() => {
+      if (opts.refresh !== false) refreshPreview();
+    })
+    .catch(() => {
+      /* field save failed — preview keeps its optimistic state */
+    });
+  fieldSaveChains.set(key, post);
+  post.then(() => {
+    if (fieldSaveChains.get(key) === post) fieldSaveChains.delete(key);
+  });
+  return post;
+}
+
+/**
+ * Debounced save, keyed per field — pending edits to OTHER fields are
+ * untouched. Same opts as saveField, plus opts.debounceMs.
+ */
+function saveFieldDebounced(moduleName, fieldPath, value, opts = {}) {
+  const key = fieldSaveKey(moduleName, fieldPath);
+  const prev = fieldSavePending.get(key);
+  if (prev) clearTimeout(prev.timer);
+  const entry = { moduleName, fieldPath, value, opts };
+  entry.timer = setTimeout(() => {
+    fieldSavePending.delete(key);
+    saveField(moduleName, fieldPath, value, opts);
+  }, opts.debounceMs ?? FIELD_SAVE_DEBOUNCE_MS);
+  fieldSavePending.set(key, entry);
+}
+
+/** Fire every pending debounced save immediately (e.g. the editor closes). */
+function flushPendingFieldSaves() {
+  for (const [key, entry] of Array.from(fieldSavePending)) {
+    clearTimeout(entry.timer);
+    fieldSavePending.delete(key);
+    saveField(entry.moduleName, entry.fieldPath, entry.value, entry.opts);
+  }
+}

package/ui/index.html

@@ -542,7 +542,10 @@
                         <button class="chat__input-icon" id="btn-starter-templates" type="button" title="Templates" aria-label="Templates">
                           <svg class="icon icon--sm" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18"/><path d="M9 21V9"/></svg>
                         </button>
-                        <button class="chat__send" id="chat-send" type="button" title="Send (Enter)" aria-label="Send message">
+                        <button class="chat__send chat__send--oneshot" id="chat-send-oneshot" type="button" title="One-shot — skip the design checkpoint and build the whole page in one go" aria-label="One-shot (skip checkpoints)">
+                          <svg class="icon icon--sm" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M13 2L4.5 12.5h6L9 22l8.5-10.5h-6L13 2z"/></svg>
+                        </button>
+                        <button class="chat__send" id="chat-send" type="button" title="Send (Enter) — pauses at the design checkpoint" aria-label="Send message">
                           <svg class="icon icon--md" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M3 12L21 4L13 22L11 14L3 12Z"/></svg>
                         </button>
                       </div>
@@ -886,7 +889,7 @@
                   <button class="btn btn--danger btn--sm dashboard__module-preview-delete" id="dashboard-preview-delete" type="button">Delete module</button>
                   <button class="dashboard__module-preview-close" id="dashboard-preview-close" type="button" aria-label="Close preview">&times;</button>
                 </div>
-                <iframe class="dashboard__module-preview-frame" id="dashboard-preview-frame" sandbox="allow-scripts allow-same-origin" title="Module preview"></iframe>
+                <iframe class="dashboard__module-preview-frame" id="dashboard-preview-frame" sandbox="allow-scripts" title="Module preview"></iframe>
               </div>
             </section>
 
@@ -949,7 +952,7 @@
         </div>
         <div class="email-preview-panel__notes" id="email-preview-notes"></div>
         <div class="email-preview-panel__body">
-          <iframe class="email-preview-panel__frame" id="email-preview-frame" sandbox="allow-scripts allow-same-origin" title="Email client preview"></iframe>
+          <iframe class="email-preview-panel__frame" id="email-preview-frame" sandbox="allow-scripts" title="Email client preview"></iframe>
         </div>
       </div>
     </div>
@@ -994,8 +997,9 @@
   <script src="/vendor/marked.umd.js"></script>
   <script src="/vendor/codemirror-bundle.global.js"></script>
   <script src="/icons.js"></script>
+  <script src="/escape-html.js"></script>
   <script src="/dialog.js"></script>
-  <script src="/setup.js?v=111"></script>
+  <script src="/setup.js?v=112"></script>
   <script src="/dashboard.js"></script>
   <script src="/settings.js"></script>
   <script src="/upload-panel.js"></script>
@@ -1003,10 +1007,12 @@
   <script src="/chat.js?v=109"></script>
   <script src="/plan.js"></script>
   <script src="/preview.js"></script>
+  <script src="/field-save.js"></script>
   <script src="/inline-edit.js"></script>
   <script src="/field-editor.js"></script>
   <script src="/code-editor.js"></script>
   <script src="/email-preview.js"></script>
   <script src="/section-controls.js"></script>
+  <script src="/whats-new.js"></script>
 </body>
 </html>