diff --git a/CHANGELOG.md b/CHANGELOG.md
index b36da93..d43a259 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,141 @@ This project follows [Semantic Versioning](https://semver.org/).
 ---
 ---
 
+## [4.4.0] — 2026-09-07
+
+### Added — `cdn.full.global.js`, patterns for no-build pages
+
+A `<script>` tag resolves no specifiers, so a no-build page could not reach
+`sibujs/patterns` at all: `machine` and its siblings were unavailable to the
+audience islands are most often used by. They now ship in a second CDN bundle,
+a superset of the default one, under the same `Sibu` global with the namespace
+kept as `Sibu.patterns`. Core is spread last so it wins any collision. New
+export paths: `sibujs/cdn-full` and `sibujs/cdn-full-dev`.
+
+A separate artifact rather than a merge, and that is the whole point. Merging
+patterns into `cdn.global.js` charged every no-build page +13.0% gzip for code
+it never calls — measured, reviewed, and reverted before release. Pages that
+want `machine` ask for it by URL; pages that want `signal` are not billed for
+it.
+
+**Size, measured.** The default bundle came out of this smaller than it went
+in, because it also lost esbuild's `globalName` wrapper (below):
+
+| bundle | before | after |
+| --- | --- | --- |
+| `cdn.global.js` | 80,202 B raw / 26,330 B gzip | 76,490 B / 26,118 B (−4.6% / −0.8%) |
+| `cdn.dev.global.js` | — / 30,199 B gzip | 85,526 B / 30,005 B (−0.6%) |
+| `cdn.full.global.js` | — | 85,972 B / 29,605 B |
+| `cdn.full.dev.global.js` | — | 95,539 B / 33,661 B |
+
+Gzip figures are `zlib` level 9, which is what the budget test asserts — the
+default level is not reproducible across zlib builds.
+
+Nothing changes for ESM/CJS consumers — their entry points are untouched and
+still tree-shake per import.
+
+### Fixed — `validateProps` and `assertType` ran in production browsers
+
+`patterns/contracts.ts` decided dev-vs-production by reading
+`process.env.NODE_ENV` directly. That is not a `define` target, so no bundler
+could fold it, and `process` does not exist in a browser at all — which the
+guards read as *development*:
+
+- `validateProps()` performed full validation and emitted `console.warn` on
+  every production page, and its message text shipped in the bundle.
+- `assertType()` threw instead of returning early, in exactly the builds its
+  own doc comment promised it would be a no-op.
+
+Both now gate on `DEV`, the foldable flag the rest of the framework uses, with
+the warning built inside the guarded branch so the string folds away with it.
+Behaviour for ESM/CJS consumers who define `__SIBU_DEV__` is unchanged; a
+browser build that defines nothing now treats itself as production, matching
+every other diagnostic in the library.
+
+This surfaced only because `patterns` briefly became a CDN artifact. It had
+been latent for as long as `contracts.ts` existed, invisible while the module
+was reachable only through a bundler that set `NODE_ENV`.
+
+`tests/dist-artifacts.test.ts` now executes the published IIFEs and asserts the
+behaviour rather than grepping for strings: `validateProps` warns in the
+development bundle and neither validates nor warns in the production one, and
+`assertType` throws in one and is a no-op in the other. The hand-maintained
+marker list missed this for a full release, which is the argument for testing
+what the bytes DO.
+
+### Fixed — the contract diagnostics are now actually stripped, not just silenced
+
+The first pass at the fix above gated on the imported `DEV` const. That made the
+behaviour correct — nothing warned, nothing threw — while leaving the code in the
+bundle: esbuild folded `DEV` to `!1` and emitted `if (!1) { … }`, because a
+cross-module const is substituted AFTER dead-code elimination has run. The
+assertion body and the `[SibuJS Contract]` message shipped behind a condition
+that could never be true.
+
+Both gates now lead with a bare `__SIBU_DEV__`, which is a `define` target and
+is therefore substituted early, before elimination — the shape `devWarn` has
+always used, and the same ordering `src/core/dev.ts` documents. The dead blocks
+are gone from the artifact.
+
+Note for anyone auditing this: `"… is required"` and `"… must be one of:"` DO
+appear in the production bundle and must. They are the return values of the
+exported `validators.required` and `validators.oneOf`, which run in production
+by design. Only `[SibuJS Contract]` and the prop-validation warning are
+diagnostics, and only those are asserted absent.
+
+`tests/dist-artifacts.test.ts` and `tests-browser/cdn-full.spec.ts` both pass a
+SPY validator to `validateProps` and assert it is never invoked in the
+production bundle, with the development bundle as the positive control. "It did
+not warn" would also pass for a branch that ran and stayed quiet.
+
+Getting that residue out took two attempts. The first moved validation into a
+second pass over the schema — free of validation-only allocations in
+production, but it reordered
+USER CALLBACKS: defaults and validators are both supplied by the caller, and
+running every default before any validator means a later property's factory no
+longer observes what an earlier property's validator wrote. Schema entries are
+processed in insertion order and each property is finished — normalize, default,
+validate — before the next begins, so `validateProps` now branches into two
+whole loops, one per mode, instead of splitting the work into two passes.
+
+The same reasoning caught one more. Normalizing a shorthand schema entry into
+`{ type: def }` is validation-only work, and it was still happening in
+production because both modes shared a helper that did it — which is also
+exactly where such an allocation hides from a test that reads
+`validateProps.toString()`. The two paths are now written out separately and
+the production loop skips shorthand entries outright: a bare validator carries
+no default, so that mode has nothing to do with it. Production is now the props
+copy, one loop over the schema entries, and the defaults it applies — the two
+allocations the work itself requires, and no validation-only ones.
+
+One residue outlived the first two passes. `validateProps` collected its
+findings in an `errors` array declared above the loop that fills it — outside
+the guard — so the validation branch stripped cleanly while the allocation in
+front of it did not, leaving `let r = []` on every production call, forever
+unread. The array is declared inside the guarded loop, so the whole development path
+folds together. The production
+function is `{...props}` plus the defaults loop and nothing else, and a test
+asserts the shipped function contains no array literal at all.
+
+### Fixed — the CDN builds no longer take esbuild’s `globalName`
+
+`globalName: "Sibu"` makes esbuild emit `var Sibu = (() => { … })()`, and that
+assignment runs AFTER the module body. `cdn.ts` installs its object from inside
+the body, so the wrapper overwrote it with the module’s own export namespace.
+Harmless while the two matched; silently wrong the moment they did not, which
+is what happened the first time a bundle merged anything in.
+
+Both entry points now assign `globalThis.Sibu` themselves and the config sets
+no `globalName`. The bundles self-register in a worker as a result, and are
+~3.7 KB smaller for losing the wrapper.
+
+A first version of the test missed this because it ran the IIFE against a
+`window` stand-in that was not the context’s global, so the two assignments
+landed in different slots. It now runs with `window === globalThis`, as a
+browser has it.
+
+---
+
 ## [4.3.0] — 2026-09-07
 
 Two defects where a value of the right *shape* was judged by the wrong test, so
diff --git a/README.md b/README.md
index c2b6530..4e49a6d 100644
--- a/README.md
+++ b/README.md
@@ -226,10 +226,29 @@ Either way, the API is on `window.Sibu`:
 Develop against `cdn.dev.global.js` and swap the one line to ship. The runtime
 behaviour is identical; only the warnings differ.
 
-A bundled app needs neither file — import from `"sibujs"` and let your bundler
-define `__SIBU_DEV__` per build (the Vite and webpack plugins in `sibujs/build`
-do this for you). The two CDN files exist because a `<script>` tag has no
-bundler to make that choice.
+### Patterns on the CDN
+
+A `<script>` tag resolves no specifiers, so a no-build page cannot reach
+`sibujs/patterns` — `machine` and its siblings were simply unavailable. They
+ship in a second bundle, which is a superset of the one above:
+
+```html
+<script src="https://unpkg.com/sibujs@latest/dist/cdn.full.global.js"></script>
+<script>
+  const { signal, machine } = window.Sibu;   // Sibu.patterns is also there
+</script>
+```
+
+Load **one or the other**, never both. It is a separate file rather than a
+merge so the default bundle keeps its byte budget: patterns costs ~13% gzip,
+and most pages never call any of it. `cdn.full.dev.global.js` is the
+development counterpart, and both are reachable as `sibujs/cdn-full` and
+`sibujs/cdn-full-dev`.
+
+A bundled app needs neither file — import from `"sibujs"` and let your
+bundler define `__SIBU_DEV__` per build (the Vite and webpack plugins in
+`sibujs/build` do this for you). The two CDN files exist because a `<script>`
+tag has no bundler to make that choice.
 
 ---
 
diff --git a/cdn.full.ts b/cdn.full.ts
new file mode 100644
index 0000000..c16ec04
--- /dev/null
+++ b/cdn.full.ts
@@ -0,0 +1,40 @@
+// ---------------------------------------------------------------------------
+// Sibu — CDN / IIFE bundle, core + patterns
+//
+// The same runtime as `cdn.global.js` with the `sibujs/patterns` entry point
+// merged in. Load ONE of the two, never both.
+//
+// Usage:
+//   <script src="https://unpkg.com/sibujs@latest/dist/cdn.full.global.js"></script>
+//   <script>
+//     const { signal, machine } = window.Sibu;
+//   </script>
+//
+// WHY THIS IS A SEPARATE FILE. A <script> tag resolves no specifiers, so a
+// no-build page had no way to reach `machine` and its siblings at all — they
+// live behind `sibujs/patterns`, which only a bundler can resolve. Merging them
+// into `cdn.global.js` closed that gap and charged every other no-build page
+// +13% gzip for code it never calls. Two files costs one decision at the
+// <script> tag and nothing at runtime.
+//
+// SPREAD ORDER IS LOAD-BEARING: core last, so core wins any collision. The
+// namespace stays reachable as `Sibu.patterns` for anything that loses one.
+// ---------------------------------------------------------------------------
+
+import * as core from "./index";
+import * as patterns from "./patterns";
+
+// `globalThis` rather than `window`, so the bundle also self-registers in a
+// worker. In a browser they are the same object. See `tsup.cdn.config.ts` for
+// why this is written by hand instead of via esbuild's `globalName`.
+if (typeof globalThis !== "undefined") {
+  (globalThis as unknown as Record<string, unknown>).Sibu = { ...patterns, ...core, patterns };
+}
+
+// Also export everything for ESM consumers of this file.
+//
+// Only `./index`, deliberately. A second `export *` would make every name the
+// two entries share ambiguous, and the ES module spec resolves that by
+// excluding the name from BOTH. The global above is spread explicitly and has
+// no such rule; that is where the merged surface lives.
+export * from "./index";
diff --git a/cdn.ts b/cdn.ts
index 104891e..0577a0a 100644
--- a/cdn.ts
+++ b/cdn.ts
@@ -11,10 +11,31 @@
 
 import * as core from "./index";
 
-// Auto-register on window when loaded via <script> tag
-if (typeof window !== "undefined") {
-  (window as unknown as Record<string, unknown>).Sibu = core;
+// Auto-register on window when loaded via <script> tag.
+//
+// CORE ONLY, and that is a budget decision rather than an oversight. This is
+// the file every no-build page downloads, so anything merged in is paid for by
+// consumers who never call it. `patterns` cost +13% gzip on its own, which is
+// why it lives in `cdn.full.global.js` instead: pages that want `machine` ask
+// for it, and pages that want `signal` are not charged for it.
+//
+// `sibujs/ui` is in neither. It is the framework's UI-behaviour layer — form
+// handling, a11y primitives, virtual lists, transitions, toasts — which most
+// pages never touch, and it exports its own `dialog` and `form` that are NOT
+// the element tag factories of the same name, so merging it would put two
+// unrelated meanings on one key. It stays bundler-only.
+//
+// `globalThis` rather than `window`, so the bundle also self-registers in a
+// worker. In a browser they are the same object. See `tsup.cdn.config.ts` for
+// why this is written by hand instead of via esbuild's `globalName`.
+if (typeof globalThis !== "undefined") {
+  (globalThis as unknown as Record<string, unknown>).Sibu = { ...core };
 }
 
-// Also export everything for ESM consumers of this file
+// Also export everything for ESM consumers of this file.
+//
+// Only `./index`, deliberately. A second `export *` would make every name two
+// entries share ambiguous, and the ES module spec resolves that by excluding
+// the name from BOTH. The global above is spread explicitly and has no such
+// rule; that is where the merged surface lives.
 export * from "./index";
diff --git a/examples/chess/README.md b/examples/chess/README.md
index 5ac208c..5c0e71d 100644
--- a/examples/chess/README.md
+++ b/examples/chess/README.md
@@ -4,15 +4,16 @@ A complete chess game built as an **enhanced island**: the 64 squares are server
 HTML, SibuJS attaches bindings to them, and no square is ever rebuilt.
 
 ```bash
-npm ci
-npm run build                 # the package's own dist/ (the example imports it directly)
-npm run example:chess:build   # vendors chess.js into ./vendor/chess.js
 npm run example:serve         # → http://localhost:5099/examples/chess/
 ```
 
-`npm run example:chess:build` is only needed once, or after bumping `chess.js` —
-`vendor/chess.js` is committed so a fresh clone can serve the example with just
-a `npm run build`.
+That is the whole setup. The runtime comes from a `<script>` tag pointing at
+the CDN, and `vendor/chess.js` is committed, so the example does **not** need
+the package built — a fresh clone serves it as-is. A static server is the only
+requirement, because ES modules do not load over `file://`.
+
+`npm run example:chess:build` re-vendors `chess.js` into `./vendor/`, and is
+only needed after bumping the engine.
 
 ---
 
diff --git a/examples/chess/chess-island.js b/examples/chess/chess-island.js
index 85181f5..abf8b6b 100644
--- a/examples/chess/chess-island.js
+++ b/examples/chess/chess-island.js
@@ -1,10 +1,12 @@
 // ---------------------------------------------------------------------------
 // Chess — the SibuJS islands reference application.
 //
-// No build step for this file: it is loaded as a plain ES module and imports
-// the package's own `dist/` entry points. The only thing that was bundled is
-// the third-party rules engine (`vendor/chess.js`, see
-// `scripts/build-example-chess.mjs`).
+// No build step anywhere in this example. It is a plain ES module, the runtime
+// arrives from a <script> tag pointing at the CDN, and the only thing ever
+// bundled is the third-party rules engine (`vendor/chess.js`, see
+// `scripts/build-example-chess.mjs`), which is committed. Serve the directory
+// and it runs — which is the claim islands make, so the demo should not need a
+// toolchain to prove it.
 //
 // THE ARCHITECTURAL BOUNDARY THIS EXISTS TO SHOW
 // ----------------------------------------------
@@ -32,27 +34,106 @@
 // docs/architecture/external-state.md explains when each is worth it.
 // ---------------------------------------------------------------------------
 
-import {
-  batch,
-  div,
-  dispose,
-  each,
-  external,
-  li,
-  mount,
-  mountIslands,
-  ol,
-  p,
-  registerIsland,
-  signal,
-  when,
-} from "../../dist/index.js";
-import { machine } from "../../dist/patterns.js";
-import { createDialogAria, createFocusManager } from "../../dist/ui.js";
 import { Chess, SQUARES } from "./vendor/chess.js";
 
+// ---------------------------------------------------------------------------
+// SibuJS comes from the <script> tag in index.html, not from an import.
+//
+// This example used to import `../../dist/index.js`, which meant it only ran
+// after `npm run build` inside a framework checkout — a build step in the one
+// demo whose entire subject is that islands need no build step. It now reads
+// the same global a reader would use on their own page, so the example is the
+// thing it documents: server HTML, one script tag, no toolchain.
+//
+// The tag is a classic script and this file is a module, so the runtime is
+// always installed before this line runs — modules are deferred, classic
+// scripts in the document are not.
+// ---------------------------------------------------------------------------
+const Sibu = globalThis.Sibu;
+if (!Sibu) {
+  throw new Error(
+    "[chess example] SibuJS is not on the page. index.html must load " +
+      "https://unpkg.com/sibujs@latest/dist/cdn.full.global.js before this module.",
+  );
+}
+const { batch, div, dispose, each, external, li, machine, mount, mountIslands, ol, p, registerIsland, signal, when } =
+  Sibu;
+
+// ---------------------------------------------------------------------------
+// Three helpers, written out here rather than imported.
+//
+// `createDialogAria` and `createFocusManager` are written out here rather than
+// imported. They live in `sibujs/ui`, a bundler-only entry point — a <script>
+// tag resolves no specifiers, so there is no way to reach them from a page like
+// this one.
+//
+// `machine` is NOT in this list: it comes from `Sibu` above, because the page
+// loads `cdn.full.global.js`, the bundle that carries `sibujs/patterns`. That
+// is the point of loading the full artifact here rather than copying a reduced
+// state machine into the example.
+//
+// The two below are a dozen lines each, which is the part worth taking away:
+// with a bundler, import them; without one, write them.
+// ---------------------------------------------------------------------------
+
+/** Per-page counter behind the generated ARIA ids. */
+let ariaIds = 0;
+
+/**
+ * Give a dialog element its ARIA contract.
+ *
+ * The ids are generated rather than written into the server HTML, so two
+ * boards on one page cannot collide on `aria-labelledby`.
+ *
+ * @param element - The dialog element.
+ * @returns The ids to assign to the title and description elements.
+ */
+function createDialogAria(element) {
+  const n = ++ariaIds;
+  const titleId = `dialog-title-${n}`;
+  const descriptionId = `dialog-desc-${n}`;
+  element.setAttribute("role", "dialog");
+  element.setAttribute("aria-modal", "true");
+  element.setAttribute("aria-labelledby", titleId);
+  element.setAttribute("aria-describedby", descriptionId);
+  if (!element.hasAttribute("tabindex")) element.setAttribute("tabindex", "-1");
+  return { titleId, descriptionId };
+}
+
+const FOCUSABLE =
+  'a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]:not([tabindex="-1"])';
+
+/**
+ * Track the focusable children of a container.
+ *
+ * Queried on each call rather than cached: the promotion dialog's buttons are
+ * rendered by a binding, so a list captured once would go stale.
+ *
+ * @param container - The element to scope the search to.
+ * @returns `items()` in document order, and `focusFirst()`.
+ */
+function createFocusManager(container) {
+  const items = () => Array.from(container.querySelectorAll(FOCUSABLE));
+  return {
+    items,
+    focusFirst() {
+      const all = items();
+      if (all.length > 0) all[0].focus();
+    },
+  };
+}
+
+// SOLID glyphs for both sides, coloured by `data-side` in CSS rather than by
+// picking a different character per colour.
+//
+// The outline set (♙♘♗♖♕♔) is the conventional choice for white, but those
+// glyphs are hollow: what shows inside them is the square underneath. A white
+// piece therefore only looks white when it happens to be standing on a pale
+// square, and on this board it read as a blue-filled outline — the two sides
+// became hard to tell apart at a glance. Filled glyphs take a real fill colour,
+// so a white piece is white on every square.
 const GLYPH = {
-  wp: "♙", wn: "♘", wb: "♗", wr: "♖", wq: "♕", wk: "♔",
+  wp: "♟", wn: "♞", wb: "♝", wr: "♜", wq: "♛", wk: "♚",
   bp: "♟", bn: "♞", bb: "♝", br: "♜", bq: "♛", bk: "♚",
 };
 const NAME = { p: "pawn", n: "knight", b: "bishop", r: "rook", q: "queen", k: "king" };
@@ -243,11 +324,19 @@ function createChessFeature() {
     return piece ? GLYPH[`${piece.color}${piece.type}`] : "";
   }
 
+  /** "w" / "b" for the piece on `sq`, or "" when the square is empty. */
+  function sideOn(sq) {
+    position.track();
+    const piece = game.get(sq);
+    return piece ? piece.color : "";
+  }
+
   return {
     marks,
     selected,
     flipped,
     setFlipped,
+    sideOn,
     message,
     targets: () => targets,
     selectSquare,
@@ -306,7 +395,7 @@ function setupChess(ctx) {
   const dialogDesc = ctx.ref("@promotion-desc");
   // Ids are generated, not written in the server HTML, so two boards on one
   // page cannot collide on `aria-labelledby`.
-  const dialogAria = createDialogAria(dialogEl, { modal: true });
+  const dialogAria = createDialogAria(dialogEl);
   dialogTitle.id = dialogAria.titleId;
   dialogDesc.id = dialogAria.descriptionId;
   const dialogFocus = createFocusManager(dialogEl);
@@ -437,7 +526,13 @@ function setupChess(ctx) {
   // `aria-label` and the glyph never fight over the same text content.
   ctx.each("@piece", (pieceEl) => {
     const sq = pieceEl.closest("[data-square]").dataset.square;
-    return { text: () => feature.glyphFor(sq) };
+    return {
+      text: () => feature.glyphFor(sq),
+      // Which side owns the piece, as an attribute the stylesheet can select on.
+      // Same shape as every other binding here: one signal read, one attribute
+      // written, no second source of truth.
+      attr: { "data-side": () => feature.sideOn(sq) },
+    };
   });
 
   // -- keyboard navigation ---------------------------------------------------
@@ -512,6 +607,17 @@ function setupChess(ctx) {
   ctx.text("@clock", feature.clockText);
   ctx.text("@captured-w", () => feature.capturedBy("w"));
   ctx.text("@captured-b", () => feature.capturedBy("b"));
+  // A tray holds either piece glyphs or the word "none". The two need different
+  // treatment — the glyphs are outlined so a captured white piece is
+  // distinguishable from a black one, and that outline has no business being
+  // drawn around a word. The attribute lets the stylesheet tell them apart.
+  //
+  // `ctx.attr` serializes a boolean literally, so this writes "true"/"false"
+  // rather than adding and removing the attribute. The stylesheet therefore
+  // matches on the VALUE: `[data-empty]` alone would match both states, which
+  // silently suppressed the outline on real pieces too.
+  ctx.attr("@captured-w", "data-empty", () => feature.capturedBy("w") === "none");
+  ctx.attr("@captured-b", "data-empty", () => feature.capturedBy("b") === "none");
   ctx.classed("@board", "flipped", feature.flipped);
 
   ctx.on("@undo", "click", () => {
diff --git a/examples/chess/chess.css b/examples/chess/chess.css
index 12eb758..3c10ff3 100644
--- a/examples/chess/chess.css
+++ b/examples/chess/chess.css
@@ -5,22 +5,62 @@
 
 :root {
   color-scheme: light dark;
-  --bg: #f6f6f4;
-  --fg: #1b1b1a;
-  --line: #d8d6d0;
-  --light-sq: #eeead9;
-  --dark-sq: #b3907a;
-  --accent: #2f6f4e;
+  --bg: #fbfbfd;
+  --fg: #141414;
+  --line: #e6e6ea;
+  /* The board is drawn in the same indigo family as sibujs.dev — hue 265 in
+     OKLCH, the site's own `--primary` hue — rather than in wood tones that sit
+     beside it looking borrowed. Squares stay near-neutral (low chroma) so the
+     pieces and the highlight carry the eye; the highlight is the only place the
+     brand chroma appears at full strength.
+
+     Every value below was chosen against measured contrast, not by eye:
+     piece/light 16.8:1, piece/dark 5.5:1, square/square 3.0:1. */
+  --light-sq: #e9effb;
+  --dark-sq: #7989ab;
+  /* Last move — two values, because one cannot serve both squares. The light
+     square needs a highlight that goes darker, the mid-tone square one that
+     goes lighter. The single translucent wash this replaced measured 1.06:1
+     against the plain light square: the square a piece had just moved to looked
+     like every other one. Both now sit at 2.4:1 against their own square. */
+  --last-on-light: #669aff;
+  --last-on-dark: #aadbff;
+  /* Pieces are filled glyphs coloured by side, each with the opposite edge:
+     the fill carries the piece on squares that contrast with it, the edge
+     carries it on squares that do not. Neither alone is enough — a white piece
+     is invisible on a pale square without its dark edge, and a black one
+     disappears on a dark square without its light edge. */
+  --piece-white: #f7f9fe;
+  --piece-white-edge: #10131c;
+  --piece-black: #10131c;
+  --piece-black-edge: #eef2fb;
+  --accent: #1b3fad;
 }
 
 @media (prefers-color-scheme: dark) {
   :root {
-    --bg: #17181a;
-    --fg: #eceded;
-    --line: #33363a;
-    --light-sq: #7d7566;
-    --dark-sq: #4c4036;
-    --accent: #7fd0a4;
+    --bg: #0b0d12;
+    --fg: #ececee;
+    --line: #232833;
+    /* The dark scheme was the worst of it: 18% and 29% saturation, two muddy
+       greys 2.2:1 apart, with a piece on the dark square at 1.85:1 — the board
+       barely read as a board and the pieces barely read at all. Same wood
+       family as the light scheme, dimmed rather than desaturated. */
+    /* Same hue, dimmed. piece/light 8.7:1, piece/dark 3.2:1, square/square
+       2.7:1 — the dark square is deliberately kept above 0.5 lightness so a
+       dark piece still reads on it. */
+    --light-sq: #a5aec2;
+    --dark-sq: #526386;
+    /* Both squares are dark here, so one warm highlight clears both easily
+       (4.1:1 and 9.1:1) and the two squares of a move match exactly. */
+    --last-on-light: #e5f9ff;
+    --last-on-dark: #7ca2f6;
+    --piece-white: #f7f9fe;
+    --piece-white-edge: #10131c;
+    --piece-black: #10131c;
+    --piece-black-edge: #dfe6f5;
+    /* The site's dark-scheme primary. */
+    --accent: #5285ff;
   }
 }
 
@@ -97,8 +137,13 @@ code {
   grid-template-rows: repeat(8, 1fr);
   aspect-ratio: 1;
   border: 1px solid var(--line);
-  border-radius: 6px;
+  border-radius: 10px;
   overflow: hidden;
+  /* A soft lift so the board reads as a surface rather than a table of cells,
+     matching the card treatment used across the site. */
+  box-shadow:
+    0 1px 2px rgb(0 0 0 / 0.05),
+    0 8px 24px -12px rgb(0 0 0 / 0.25);
 }
 
 .rank {
@@ -144,8 +189,26 @@ code {
 
 .piece {
   pointer-events: none;
-  color: #16130f;
-  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35);
+}
+
+/* One ring per side, drawn with four offsets so the glyph is outlined on every
+   edge rather than merely lifted off the square by a drop shadow. */
+.piece[data-side="w"] {
+  color: var(--piece-white);
+  text-shadow:
+    0 1px 0 var(--piece-white-edge),
+    0 -1px 0 var(--piece-white-edge),
+    1px 0 0 var(--piece-white-edge),
+    -1px 0 0 var(--piece-white-edge);
+}
+
+.piece[data-side="b"] {
+  color: var(--piece-black);
+  text-shadow:
+    0 1px 0 var(--piece-black-edge),
+    0 -1px 0 var(--piece-black-edge),
+    1px 0 0 var(--piece-black-edge),
+    -1px 0 0 var(--piece-black-edge);
 }
 
 /* Highlights — one attribute, many rules. */
@@ -153,12 +216,16 @@ code {
   box-shadow: inset 0 0 0 4px var(--accent);
 }
 
-.sq[data-marks~="last"]::after {
-  content: "";
-  position: absolute;
-  inset: 0;
-  background: rgba(255, 214, 102, 0.38);
-  pointer-events: none;
+/* The last move recolours the square itself rather than laying a translucent
+   film over it. A wash inherits the square underneath, which is exactly why the
+   old one vanished on light squares; an opaque colour per square type does not.
+   Both keep the piece well clear of the background (7.5:1 and 13.2:1). */
+.sq.light[data-marks~="last"] {
+  background: var(--last-on-light);
+}
+
+.sq.dark[data-marks~="last"] {
+  background: var(--last-on-dark);
 }
 
 .sq[data-marks~="legal"]::before {
@@ -182,6 +249,37 @@ code {
   background: #c2452f;
 }
 
+/* Captured pieces, coloured by whose they were.
+   Both sides draw from the same filled glyph set, so a captured white pawn and
+   a captured black one are the same character — without this they were the same
+   symbol in the same colour, and the trays said nothing. The pieces listed under
+   "Taken by White" are by definition BLACK pieces, and vice versa. */
+.tray[data-ref="captured-w"] {
+  color: var(--piece-black);
+  text-shadow:
+    0 1px 0 var(--piece-black-edge),
+    0 -1px 0 var(--piece-black-edge),
+    1px 0 0 var(--piece-black-edge),
+    -1px 0 0 var(--piece-black-edge);
+}
+
+.tray[data-ref="captured-b"] {
+  color: var(--piece-white);
+  text-shadow:
+    0 1px 0 var(--piece-white-edge),
+    0 -1px 0 var(--piece-white-edge),
+    1px 0 0 var(--piece-white-edge),
+    -1px 0 0 var(--piece-white-edge);
+}
+
+/* An empty tray shows the word "none", not pieces. It inherits the surrounding
+   text colour and drops the outline — a ring drawn around a word reads as a
+   rendering fault, not as emphasis. */
+.tray[data-empty="true"] {
+  color: inherit;
+  text-shadow: none;
+}
+
 /* --- trays, controls, history ------------------------------------------- */
 
 .trays {
diff --git a/examples/chess/index.html b/examples/chess/index.html
index ed7be01..9b0596a 100644
--- a/examples/chess/index.html
+++ b/examples/chess/index.html
@@ -10,17 +10,8 @@
     <main>
       <h1>Chess as a reactive island</h1>
       <p class="lede">
-        Every square below is <strong>server HTML</strong>. It is in the page before a
-        line of JavaScript runs, and SibuJS never rebuilds it — it attaches bindings to
-        the 64 buttons that are already there. The move list underneath is the opposite
-        case: the server cannot know how many rows there will be, so that one region is
-        <code>mount()</code>ed. One island owns both.
-      </p>
-      <p class="lede">
-        The rules come from <code>chess.js</code>. SibuJS owns the DOM, the reactivity and
-        the lifecycle; it does not know what a knight is. Read
-        <a href="./chess-island.js"><code>chess-island.js</code></a> — that file is the
-        whole application.
+        Every square is server HTML — already in the page before any JavaScript runs, and
+        never rebuilt. SibuJS only attaches bindings to the buttons that are already there.
       </p>
 
       <div class="boards">
@@ -32,24 +23,24 @@ <h1>Chess as a reactive island</h1>
 
         <div class="board" data-ref="board" role="grid" aria-label="Board one, 8 by 8 grid">
           <div class="rank" role="row">
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a8" data-marks="" tabindex="0" aria-label="a8, Black rook"><span class="piece" data-ref="piece">♜</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b8" data-marks="" tabindex="-1" aria-label="b8, Black knight"><span class="piece" data-ref="piece">♞</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c8" data-marks="" tabindex="-1" aria-label="c8, Black bishop"><span class="piece" data-ref="piece">♝</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d8" data-marks="" tabindex="-1" aria-label="d8, Black queen"><span class="piece" data-ref="piece">♛</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e8" data-marks="" tabindex="-1" aria-label="e8, Black king"><span class="piece" data-ref="piece">♚</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f8" data-marks="" tabindex="-1" aria-label="f8, Black bishop"><span class="piece" data-ref="piece">♝</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g8" data-marks="" tabindex="-1" aria-label="g8, Black knight"><span class="piece" data-ref="piece">♞</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h8" data-marks="" tabindex="-1" aria-label="h8, Black rook"><span class="piece" data-ref="piece">♜</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a8" data-marks="" tabindex="0" aria-label="a8, Black rook"><span class="piece" data-ref="piece" data-side="b">♜</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b8" data-marks="" tabindex="-1" aria-label="b8, Black knight"><span class="piece" data-ref="piece" data-side="b">♞</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c8" data-marks="" tabindex="-1" aria-label="c8, Black bishop"><span class="piece" data-ref="piece" data-side="b">♝</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d8" data-marks="" tabindex="-1" aria-label="d8, Black queen"><span class="piece" data-ref="piece" data-side="b">♛</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e8" data-marks="" tabindex="-1" aria-label="e8, Black king"><span class="piece" data-ref="piece" data-side="b">♚</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f8" data-marks="" tabindex="-1" aria-label="f8, Black bishop"><span class="piece" data-ref="piece" data-side="b">♝</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g8" data-marks="" tabindex="-1" aria-label="g8, Black knight"><span class="piece" data-ref="piece" data-side="b">♞</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h8" data-marks="" tabindex="-1" aria-label="h8, Black rook"><span class="piece" data-ref="piece" data-side="b">♜</span></button>
           </div>
           <div class="rank" role="row">
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a7" data-marks="" tabindex="-1" aria-label="a7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b7" data-marks="" tabindex="-1" aria-label="b7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c7" data-marks="" tabindex="-1" aria-label="c7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d7" data-marks="" tabindex="-1" aria-label="d7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e7" data-marks="" tabindex="-1" aria-label="e7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f7" data-marks="" tabindex="-1" aria-label="f7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g7" data-marks="" tabindex="-1" aria-label="g7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h7" data-marks="" tabindex="-1" aria-label="h7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a7" data-marks="" tabindex="-1" aria-label="a7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b7" data-marks="" tabindex="-1" aria-label="b7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c7" data-marks="" tabindex="-1" aria-label="c7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d7" data-marks="" tabindex="-1" aria-label="d7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e7" data-marks="" tabindex="-1" aria-label="e7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f7" data-marks="" tabindex="-1" aria-label="f7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g7" data-marks="" tabindex="-1" aria-label="g7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h7" data-marks="" tabindex="-1" aria-label="h7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
           </div>
           <div class="rank" role="row">
             <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a6" data-marks="" tabindex="-1" aria-label="a6, empty"><span class="piece" data-ref="piece"></span></button>
@@ -92,30 +83,30 @@ <h1>Chess as a reactive island</h1>
             <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h3" data-marks="" tabindex="-1" aria-label="h3, empty"><span class="piece" data-ref="piece"></span></button>
           </div>
           <div class="rank" role="row">
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a2" data-marks="" tabindex="-1" aria-label="a2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b2" data-marks="" tabindex="-1" aria-label="b2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c2" data-marks="" tabindex="-1" aria-label="c2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d2" data-marks="" tabindex="-1" aria-label="d2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e2" data-marks="" tabindex="-1" aria-label="e2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f2" data-marks="" tabindex="-1" aria-label="f2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g2" data-marks="" tabindex="-1" aria-label="g2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h2" data-marks="" tabindex="-1" aria-label="h2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a2" data-marks="" tabindex="-1" aria-label="a2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b2" data-marks="" tabindex="-1" aria-label="b2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c2" data-marks="" tabindex="-1" aria-label="c2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d2" data-marks="" tabindex="-1" aria-label="d2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e2" data-marks="" tabindex="-1" aria-label="e2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f2" data-marks="" tabindex="-1" aria-label="f2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g2" data-marks="" tabindex="-1" aria-label="g2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h2" data-marks="" tabindex="-1" aria-label="h2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
           </div>
           <div class="rank" role="row">
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a1" data-marks="" tabindex="-1" aria-label="a1, White rook"><span class="piece" data-ref="piece">♖</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b1" data-marks="" tabindex="-1" aria-label="b1, White knight"><span class="piece" data-ref="piece">♘</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c1" data-marks="" tabindex="-1" aria-label="c1, White bishop"><span class="piece" data-ref="piece">♗</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d1" data-marks="" tabindex="-1" aria-label="d1, White queen"><span class="piece" data-ref="piece">♕</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e1" data-marks="" tabindex="-1" aria-label="e1, White king"><span class="piece" data-ref="piece">♔</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f1" data-marks="" tabindex="-1" aria-label="f1, White bishop"><span class="piece" data-ref="piece">♗</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g1" data-marks="" tabindex="-1" aria-label="g1, White knight"><span class="piece" data-ref="piece">♘</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h1" data-marks="" tabindex="-1" aria-label="h1, White rook"><span class="piece" data-ref="piece">♖</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a1" data-marks="" tabindex="-1" aria-label="a1, White rook"><span class="piece" data-ref="piece" data-side="w">♜</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b1" data-marks="" tabindex="-1" aria-label="b1, White knight"><span class="piece" data-ref="piece" data-side="w">♞</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c1" data-marks="" tabindex="-1" aria-label="c1, White bishop"><span class="piece" data-ref="piece" data-side="w">♝</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d1" data-marks="" tabindex="-1" aria-label="d1, White queen"><span class="piece" data-ref="piece" data-side="w">♛</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e1" data-marks="" tabindex="-1" aria-label="e1, White king"><span class="piece" data-ref="piece" data-side="w">♚</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f1" data-marks="" tabindex="-1" aria-label="f1, White bishop"><span class="piece" data-ref="piece" data-side="w">♝</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g1" data-marks="" tabindex="-1" aria-label="g1, White knight"><span class="piece" data-ref="piece" data-side="w">♞</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h1" data-marks="" tabindex="-1" aria-label="h1, White rook"><span class="piece" data-ref="piece" data-side="w">♜</span></button>
           </div>
         </div>
 
         <div class="trays">
-          <p><b>Taken by White</b> <span class="tray" data-ref="captured-w">none</span></p>
-          <p><b>Taken by Black</b> <span class="tray" data-ref="captured-b">none</span></p>
+          <p><b>Taken by White</b> <span class="tray" data-ref="captured-w" data-empty="true">none</span></p>
+          <p><b>Taken by Black</b> <span class="tray" data-ref="captured-b" data-empty="true">none</span></p>
         </div>
 
         <div class="controls">
@@ -149,24 +140,24 @@ <h2 data-ref="promotion-title">Promote your pawn</h2>
 
         <div class="board" data-ref="board" role="grid" aria-label="Board two, 8 by 8 grid">
           <div class="rank" role="row">
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a8" data-marks="" tabindex="0" aria-label="a8, Black rook"><span class="piece" data-ref="piece">♜</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b8" data-marks="" tabindex="-1" aria-label="b8, Black knight"><span class="piece" data-ref="piece">♞</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c8" data-marks="" tabindex="-1" aria-label="c8, Black bishop"><span class="piece" data-ref="piece">♝</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d8" data-marks="" tabindex="-1" aria-label="d8, Black queen"><span class="piece" data-ref="piece">♛</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e8" data-marks="" tabindex="-1" aria-label="e8, Black king"><span class="piece" data-ref="piece">♚</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f8" data-marks="" tabindex="-1" aria-label="f8, Black bishop"><span class="piece" data-ref="piece">♝</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g8" data-marks="" tabindex="-1" aria-label="g8, Black knight"><span class="piece" data-ref="piece">♞</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h8" data-marks="" tabindex="-1" aria-label="h8, Black rook"><span class="piece" data-ref="piece">♜</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a8" data-marks="" tabindex="0" aria-label="a8, Black rook"><span class="piece" data-ref="piece" data-side="b">♜</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b8" data-marks="" tabindex="-1" aria-label="b8, Black knight"><span class="piece" data-ref="piece" data-side="b">♞</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c8" data-marks="" tabindex="-1" aria-label="c8, Black bishop"><span class="piece" data-ref="piece" data-side="b">♝</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d8" data-marks="" tabindex="-1" aria-label="d8, Black queen"><span class="piece" data-ref="piece" data-side="b">♛</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e8" data-marks="" tabindex="-1" aria-label="e8, Black king"><span class="piece" data-ref="piece" data-side="b">♚</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f8" data-marks="" tabindex="-1" aria-label="f8, Black bishop"><span class="piece" data-ref="piece" data-side="b">♝</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g8" data-marks="" tabindex="-1" aria-label="g8, Black knight"><span class="piece" data-ref="piece" data-side="b">♞</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h8" data-marks="" tabindex="-1" aria-label="h8, Black rook"><span class="piece" data-ref="piece" data-side="b">♜</span></button>
           </div>
           <div class="rank" role="row">
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a7" data-marks="" tabindex="-1" aria-label="a7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b7" data-marks="" tabindex="-1" aria-label="b7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c7" data-marks="" tabindex="-1" aria-label="c7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d7" data-marks="" tabindex="-1" aria-label="d7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e7" data-marks="" tabindex="-1" aria-label="e7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f7" data-marks="" tabindex="-1" aria-label="f7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g7" data-marks="" tabindex="-1" aria-label="g7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h7" data-marks="" tabindex="-1" aria-label="h7, Black pawn"><span class="piece" data-ref="piece">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a7" data-marks="" tabindex="-1" aria-label="a7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b7" data-marks="" tabindex="-1" aria-label="b7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c7" data-marks="" tabindex="-1" aria-label="c7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d7" data-marks="" tabindex="-1" aria-label="d7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e7" data-marks="" tabindex="-1" aria-label="e7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f7" data-marks="" tabindex="-1" aria-label="f7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g7" data-marks="" tabindex="-1" aria-label="g7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h7" data-marks="" tabindex="-1" aria-label="h7, Black pawn"><span class="piece" data-ref="piece" data-side="b">♟</span></button>
           </div>
           <div class="rank" role="row">
             <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a6" data-marks="" tabindex="-1" aria-label="a6, empty"><span class="piece" data-ref="piece"></span></button>
@@ -209,30 +200,30 @@ <h2 data-ref="promotion-title">Promote your pawn</h2>
             <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h3" data-marks="" tabindex="-1" aria-label="h3, empty"><span class="piece" data-ref="piece"></span></button>
           </div>
           <div class="rank" role="row">
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a2" data-marks="" tabindex="-1" aria-label="a2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b2" data-marks="" tabindex="-1" aria-label="b2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c2" data-marks="" tabindex="-1" aria-label="c2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d2" data-marks="" tabindex="-1" aria-label="d2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e2" data-marks="" tabindex="-1" aria-label="e2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f2" data-marks="" tabindex="-1" aria-label="f2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g2" data-marks="" tabindex="-1" aria-label="g2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h2" data-marks="" tabindex="-1" aria-label="h2, White pawn"><span class="piece" data-ref="piece">♙</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="a2" data-marks="" tabindex="-1" aria-label="a2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="b2" data-marks="" tabindex="-1" aria-label="b2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="c2" data-marks="" tabindex="-1" aria-label="c2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="d2" data-marks="" tabindex="-1" aria-label="d2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="e2" data-marks="" tabindex="-1" aria-label="e2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="f2" data-marks="" tabindex="-1" aria-label="f2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="g2" data-marks="" tabindex="-1" aria-label="g2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="h2" data-marks="" tabindex="-1" aria-label="h2, White pawn"><span class="piece" data-ref="piece" data-side="w">♟</span></button>
           </div>
           <div class="rank" role="row">
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a1" data-marks="" tabindex="-1" aria-label="a1, White rook"><span class="piece" data-ref="piece">♖</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b1" data-marks="" tabindex="-1" aria-label="b1, White knight"><span class="piece" data-ref="piece">♘</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c1" data-marks="" tabindex="-1" aria-label="c1, White bishop"><span class="piece" data-ref="piece">♗</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d1" data-marks="" tabindex="-1" aria-label="d1, White queen"><span class="piece" data-ref="piece">♕</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e1" data-marks="" tabindex="-1" aria-label="e1, White king"><span class="piece" data-ref="piece">♔</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f1" data-marks="" tabindex="-1" aria-label="f1, White bishop"><span class="piece" data-ref="piece">♗</span></button>
-            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g1" data-marks="" tabindex="-1" aria-label="g1, White knight"><span class="piece" data-ref="piece">♘</span></button>
-            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h1" data-marks="" tabindex="-1" aria-label="h1, White rook"><span class="piece" data-ref="piece">♖</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="a1" data-marks="" tabindex="-1" aria-label="a1, White rook"><span class="piece" data-ref="piece" data-side="w">♜</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="b1" data-marks="" tabindex="-1" aria-label="b1, White knight"><span class="piece" data-ref="piece" data-side="w">♞</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="c1" data-marks="" tabindex="-1" aria-label="c1, White bishop"><span class="piece" data-ref="piece" data-side="w">♝</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="d1" data-marks="" tabindex="-1" aria-label="d1, White queen"><span class="piece" data-ref="piece" data-side="w">♛</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="e1" data-marks="" tabindex="-1" aria-label="e1, White king"><span class="piece" data-ref="piece" data-side="w">♚</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="f1" data-marks="" tabindex="-1" aria-label="f1, White bishop"><span class="piece" data-ref="piece" data-side="w">♝</span></button>
+            <button type="button" class="sq dark" role="gridcell" data-ref="square" data-square="g1" data-marks="" tabindex="-1" aria-label="g1, White knight"><span class="piece" data-ref="piece" data-side="w">♞</span></button>
+            <button type="button" class="sq light" role="gridcell" data-ref="square" data-square="h1" data-marks="" tabindex="-1" aria-label="h1, White rook"><span class="piece" data-ref="piece" data-side="w">♜</span></button>
           </div>
         </div>
 
         <div class="trays">
-          <p><b>Taken by White</b> <span class="tray" data-ref="captured-w">none</span></p>
-          <p><b>Taken by Black</b> <span class="tray" data-ref="captured-b">none</span></p>
+          <p><b>Taken by White</b> <span class="tray" data-ref="captured-w" data-empty="true">none</span></p>
+          <p><b>Taken by Black</b> <span class="tray" data-ref="captured-b" data-empty="true">none</span></p>
         </div>
 
         <div class="controls">
@@ -269,6 +260,12 @@ <h2>Failure isolation</h2>
       </section>
     </main>
 
+    <!-- The runtime, from the CDN. `cdn.full.global.js` rather than
+         `cdn.global.js` because this island uses `machine`, which lives in the
+         patterns half of the library; the default bundle is core only. A
+         classic script, so it runs before the deferred module below. Swap in
+         cdn.full.dev.global.js for SibuJS's warnings while working on it. -->
+    <script src="https://unpkg.com/sibujs@latest/dist/cdn.full.global.js"></script>
     <script type="module" src="./chess-island.js"></script>
   </body>
 </html>
diff --git a/package-lock.json b/package-lock.json
index 4f1516f..cafed5e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "sibujs",
-  "version": "4.3.0",
+  "version": "4.4.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "sibujs",
-      "version": "4.3.0",
+      "version": "4.4.0",
       "license": "MIT",
       "devDependencies": {
         "@biomejs/biome": "2.4.7",
diff --git a/package.json b/package.json
index 9948daf..1d24cf6 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "sibujs",
-  "version": "4.3.0",
+  "version": "4.4.0",
   "description": "A lightweight, function-based frontend framework that combines the best of React, Svelte, and Vue — with zero VDOM and maximum simplicity. Designed for developers who want fine-grained reactivity and full control without compilation or magic.",
   "keywords": [
     "frontend",
@@ -133,6 +133,12 @@
     },
     "./cdn-dev": {
       "default": "./dist/cdn.dev.global.js"
+    },
+    "./cdn-full": {
+      "default": "./dist/cdn.full.global.js"
+    },
+    "./cdn-full-dev": {
+      "default": "./dist/cdn.full.dev.global.js"
     }
   },
   "publishConfig": {
diff --git a/src/patterns/contracts.ts b/src/patterns/contracts.ts
index 6acb732..5198d50 100644
--- a/src/patterns/contracts.ts
+++ b/src/patterns/contracts.ts
@@ -1,9 +1,31 @@
 /**
  * Runtime prop validation and strict typing contracts for SibuJS.
  * Provides runtime type checking for component props in development mode.
+ *
+ * Both diagnostics here gate on `DEV`, the same foldable flag the rest of the
+ * framework uses, so a `__SIBU_DEV__: false` define removes them and their
+ * message text entirely. They used to test `process.env.NODE_ENV` directly,
+ * which is not a `define` target and does not exist in a browser at all — so
+ * every browser build treated itself as development: `validateProps` ran and
+ * warned, `assertType` threw, and the strings shipped. That went unnoticed
+ * while these functions were reachable only through a bundler; putting
+ * `patterns` on the CDN made them a production artifact.
  */
 
-declare var process: { env?: { NODE_ENV?: string } } | undefined;
+import { DEV, devWarn } from "../core/dev";
+
+declare const __SIBU_DEV__: boolean | undefined;
+
+// The gate is written INLINE at both call sites below, not hoisted into a
+// const, and it leads with the BARE `__SIBU_DEV__`.
+//
+// Only a bare identifier is a `define` target, and a define is substituted
+// early — before dead-code elimination runs. The imported `DEV` const is
+// inlined LATE: esbuild folded it to `!1` and then left `if (!1) { … }`
+// standing, so the whole assertion body and its message shipped in the
+// production CDN bundle behind a condition that could never be true. `devWarn`
+// has used this shape for the same reason; `tests/dist-artifacts.test.ts` now
+// asserts the result on the published bytes.
 
 // ─── Type Validators ────────────────────────────────────────────────────────
 
@@ -90,48 +112,85 @@ export type PropSchema<Props> = {
 // ─── validateProps ──────────────────────────────────────────────────────────
 
 /**
- * Validate props against a schema. Returns validated props with defaults applied.
- * In production mode (process.env.NODE_ENV === 'production'), validation is skipped
- * and only defaults are applied for performance.
+ * Validate props against a schema, returning the props with defaults applied.
+ *
+ * Defaults are production behaviour; the checking is development-only and is
+ * compiled out of production builds. The two are not interchangeable when the
+ * schema's callbacks touch outside state: a validator that runs in development
+ * and not in production can leave a later property's default factory reading
+ * different state. Keep defaults and validators free of side effects if the
+ * two modes must agree exactly.
+ *
+ * @param props - The props to validate. Not mutated.
+ * @param schema - Per-property definitions, in either the shorthand
+ *   (a bare {@link Validator}) or object form.
+ * @returns A new object: the props, plus any defaults that applied.
  */
 export function validateProps<Props extends object>(props: Partial<Props>, schema: PropSchema<Props>): Props {
   const result = { ...props } as Record<string, unknown>;
-  const errors: string[] = [];
-  const isDev = typeof process === "undefined" || process?.env?.NODE_ENV !== "production";
-
-  for (const [key, def] of Object.entries(schema)) {
-    const propDef: PropDef = typeof def === "function" ? { type: def as Validator } : (def as PropDef);
 
-    // Apply defaults
-    if (result[key] == null && propDef.default !== undefined) {
-      result[key] = typeof propDef.default === "function" ? (propDef.default as () => unknown)() : propDef.default;
-    }
+  // TWO WHOLE LOOPS, one per mode, with no shared helper between them.
+  //
+  // Ordering is observable: defaults and validators are user callbacks that may
+  // read or write outside state, so each property is finished — normalize,
+  // default, validate — before the next begins. Running all defaults and then
+  // all validators would reorder those calls.
+  //
+  // Everything development-only lives inside the branch, INCLUDING the `errors`
+  // array and the normalization. Both leaked out of production once: the array
+  // by being hoisted above a shared loop, the normalization by living in a
+  // helper both branches called. A shared helper is also where an allocation
+  // hides from a test that reads `validateProps.toString()`, which is why the
+  // duplication below is deliberate.
+  if (typeof __SIBU_DEV__ !== "undefined" ? __SIBU_DEV__ : DEV) {
+    const errors: string[] = [];
+
+    for (const [key, def] of Object.entries(schema)) {
+      const propDef: PropDef = typeof def === "function" ? { type: def as Validator } : (def as PropDef);
+
+      if (result[key] == null && propDef.default !== undefined) {
+        result[key] = typeof propDef.default === "function" ? (propDef.default as () => unknown)() : propDef.default;
+      }
 
-    if (!isDev) continue; // Skip validation in production
+      if (propDef.required && result[key] == null) {
+        errors.push(`Prop '${key}' is required`);
+        continue;
+      }
 
-    // Check required
-    if (propDef.required && result[key] == null) {
-      errors.push(`Prop '${key}' is required`);
-      continue;
-    }
+      if (result[key] == null) continue;
 
-    if (result[key] == null) continue;
+      if (propDef.type) {
+        const typeResult = propDef.type(result[key], key);
+        if (typeResult !== true) errors.push(typeResult);
+      }
 
-    // Type validation
-    if (propDef.type) {
-      const typeResult = propDef.type(result[key], key);
-      if (typeResult !== true) errors.push(typeResult);
+      if (propDef.validator) {
+        const validResult = propDef.validator(result[key], key);
+        if (validResult !== true) errors.push(validResult);
+      }
     }
 
-    // Custom validator
-    if (propDef.validator) {
-      const validResult = propDef.validator(result[key], key);
-      if (validResult !== true) errors.push(validResult);
+    if (errors.length > 0) {
+      devWarn(`Prop validation errors:\n${errors.map((e) => `  - ${e}`).join("\n")}`);
     }
+
+    return result as Props;
   }
 
-  if (errors.length > 0 && isDev) {
-    console.warn(`[SibuJS] Prop validation errors:\n${errors.map((e) => `  - ${e}`).join("\n")}`);
+  // Production: defaults only, in the same order. It still allocates the
+  // returned copy and whatever `Object.entries` builds — both are required to
+  // do the job. What is gone is every allocation that existed only to support
+  // validation: the `errors` array and the normalized `{ type: def }`.
+  for (const [key, def] of Object.entries(schema)) {
+    // The shorthand form IS a bare validator, so it carries no default and
+    // there is nothing to do. Normalizing it to `{ type: def }` would allocate
+    // an object per entry for validation that does not run here.
+    if (typeof def === "function") continue;
+
+    const fallback = (def as PropDef).default;
+    if (result[key] == null && fallback !== undefined) {
+      result[key] = typeof fallback === "function" ? (fallback as () => unknown)() : fallback;
+    }
   }
 
   return result as Props;
@@ -158,13 +217,19 @@ export function defineStrictComponent<Props extends object>(config: {
 
 /**
  * Assert that a value satisfies a contract at runtime.
- * No-op in production builds.
+ *
+ * No-op in production builds — genuinely, now. The previous guard returned early
+ * only when `process` existed, so in a browser it fell through and threw.
  */
 export function assertType<T>(value: unknown, validator: Validator<T>, label?: string): asserts value is T {
-  if (typeof process !== "undefined" && process?.env?.NODE_ENV === "production") return;
-  const result = validator(value as T, label || "value");
-  if (result !== true) {
-    throw new TypeError(`[SibuJS Contract] ${result}`);
+  // Wrapped rather than an early `return` for the same reason as the loop
+  // above: code after an unconditional return is unreachable, not deleted, so
+  // the assertion body and its message shipped in production.
+  if (typeof __SIBU_DEV__ !== "undefined" ? __SIBU_DEV__ : DEV) {
+    const result = validator(value as T, label || "value");
+    if (result !== true) {
+      throw new TypeError(`[SibuJS Contract] ${result}`);
+    }
   }
 }
 
diff --git a/tests-browser/cdn-full.spec.ts b/tests-browser/cdn-full.spec.ts
new file mode 100644
index 0000000..660e151
--- /dev/null
+++ b/tests-browser/cdn-full.spec.ts
@@ -0,0 +1,135 @@
+import { readFileSync } from "node:fs";
+import { dirname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { expect, test } from "@playwright/test";
+
+// ---------------------------------------------------------------------------
+// Real-browser coverage for the published CDN artifacts.
+//
+// These run the built IIFEs the way a no-build page does — a <script> tag in a
+// real browser — rather than in a Node vm. The vm tests in
+// `tests/dist-artifacts.test.ts` cover the same surface and are the faster
+// guard; what they cannot show is that the bundle works in the environment it
+// exists for, which is the only environment it will ever run in.
+//
+// The chess example cannot cover `cdn.full.global.js` yet: it loads
+// `sibujs@latest` from unpkg, and the full bundle does not exist on the CDN
+// until this release publishes. Once it does, the example is the better home
+// for this and `machine` there can come from `Sibu` instead of a local copy.
+// ---------------------------------------------------------------------------
+
+const DIST = resolve(dirname(fileURLToPath(import.meta.url)), "..", "dist");
+const script = (file: string) => readFileSync(resolve(DIST, file), "utf8");
+
+test("cdn.full.global.js exposes patterns and drives core reactivity", async ({ page }) => {
+  await page.goto("about:blank");
+  await page.addScriptTag({ content: script("cdn.full.global.js") });
+
+  const result = await page.evaluate(() => {
+    const Sibu = (window as unknown as { Sibu: Record<string, never> }).Sibu;
+    const machine = Sibu.machine as unknown as (c: unknown) => { matches(s: string): boolean; send(e: string): void };
+    const signal = Sibu.signal as unknown as <T>(v: T) => [() => T, (v: T) => void];
+    const effect = Sibu.effect as unknown as (fn: () => void) => void;
+
+    const flow = machine({
+      initial: "idle",
+      states: { idle: { on: { GO: "busy" } }, busy: { on: { DONE: "idle" } } },
+    });
+
+    // The point of the test: `machine` comes from the patterns half of the
+    // bundle and its signal must be seen by an effect from the core half. Two
+    // runtimes in one file would render once and then never update.
+    const seen: boolean[] = [];
+    effect(() => seen.push(flow.matches("busy")));
+    flow.send("GO");
+
+    // An event the current state does not declare is ignored, not a crash.
+    flow.send("GO");
+
+    const [n, setN] = signal(0);
+    const nums: number[] = [];
+    effect(() => nums.push(n()));
+    setN(1);
+
+    return {
+      machineType: typeof Sibu.machine,
+      namespace: typeof (Sibu.patterns as Record<string, unknown>).machine,
+      transitions: seen,
+      coreReactivity: nums,
+      state: flow.matches("busy"),
+    };
+  });
+
+  expect(result.machineType).toBe("function");
+  expect(result.namespace).toBe("function");
+  // Ran once at registration (idle), then again on the transition.
+  expect(result.transitions).toEqual([false, true]);
+  expect(result.coreReactivity).toEqual([0, 1]);
+  expect(result.state).toBe(true);
+});
+
+test("cdn.global.js is the core bundle and carries no patterns", async ({ page }) => {
+  // The other half of the split, asserted in a browser: the default artifact
+  // every no-build page downloads must not have grown the patterns surface.
+  await page.goto("about:blank");
+  await page.addScriptTag({ content: script("cdn.global.js") });
+
+  const surface = await page.evaluate(() => {
+    const Sibu = (window as unknown as { Sibu: Record<string, unknown> }).Sibu;
+    return {
+      signal: typeof Sibu.signal,
+      machine: typeof Sibu.machine,
+      patterns: typeof Sibu.patterns,
+    };
+  });
+
+  expect(surface.signal).toBe("function");
+  expect(surface.machine).toBe("undefined");
+  expect(surface.patterns).toBe("undefined");
+});
+
+test("neither production bundle validates props or asserts contracts", async ({ page }) => {
+  // The diagnostics gate on a bare `__SIBU_DEV__` so a define folds them out
+  // entirely. Verified here as BEHAVIOUR in a browser, because the artifact
+  // tests' marker list is hand-maintained and missed this once already.
+  await page.goto("about:blank");
+  await page.addScriptTag({ content: script("cdn.full.global.js") });
+
+  const warnings: string[] = [];
+  page.on("console", (m) => {
+    if (m.type() === "warning") warnings.push(m.text());
+  });
+
+  const outcome = await page.evaluate(() => {
+    const Sibu = (window as unknown as { Sibu: Record<string, never> }).Sibu;
+    const validators = Sibu.validators as unknown as Record<string, unknown>;
+
+    // A spy rather than a real validator: this proves the validation branch was
+    // never entered, where "it did not warn" would also pass if it had run and
+    // stayed quiet.
+    let calls = 0;
+    const spy = () => {
+      calls += 1;
+      return "always invalid";
+    };
+    (Sibu.validateProps as unknown as (p: object, s: object) => unknown)({ n: 1 }, { n: { type: spy, required: true } });
+
+    const out = (Sibu.validateProps as unknown as (p: object, s: object) => Record<string, unknown>)(
+      { n: "not a number" },
+      { n: { type: validators.number, required: true } },
+    );
+    let threw = false;
+    try {
+      (Sibu.assertType as unknown as (v: unknown, val: unknown, l?: string) => void)("nope", validators.number, "n");
+    } catch {
+      threw = true;
+    }
+    return { value: out.n, threw, calls };
+  });
+
+  // Defaults still applied and the value untouched: only the checking is gone.
+  expect(outcome.calls, "a validator ran in the production bundle").toBe(0);
+  expect(outcome.value).toBe("not a number");
+  expect(outcome.threw).toBe(false);
+  expect(warnings).toEqual([]);
+});
diff --git a/tests-browser/chess.spec.ts b/tests-browser/chess.spec.ts
index 842e2fd..e01cc74 100644
--- a/tests-browser/chess.spec.ts
+++ b/tests-browser/chess.spec.ts
@@ -1,3 +1,6 @@
+import { readFileSync } from "node:fs";
+import { dirname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
 import { expect, test } from "@playwright/test";
 
 // ---------------------------------------------------------------------------
@@ -27,11 +30,90 @@ const TO_PROMOTION: Array<[string, string]> = [
   ["b7", "b6"],
 ];
 
+// The example page loads SibuJS from unpkg, which is right for a demo someone
+// opens from a checkout and wrong for this suite twice over: it would make
+// these tests depend on a network service, and it would run the LAST PUBLISHED
+// release instead of the working tree — so a regression in `dist/` would sail
+// through green. Every request for the CDN tag is answered with the local
+// build, which is the code under test.
+// The spec is ESM, so `__dirname` does not exist here.
+const DIST = resolve(dirname(fileURLToPath(import.meta.url)), "..", "dist");
+
+/** The exact artifact the example is expected to request, and only this one. */
+const EXPECTED_CDN = "https://unpkg.com/sibujs@latest/dist/cdn.full.global.js";
+
+/** The four CDN artifacts this package publishes. Anything else is a mistake. */
+const ALLOWED_CDN_FILES = new Set(["cdn.global.js", "cdn.dev.global.js", "cdn.full.global.js", "cdn.full.dev.global.js"]);
+
 test.beforeEach(async ({ page }) => {
+  // EVERY CDN request is recorded, not just the last one. A scalar would let a
+  // page that downloads two runtimes pass whenever the expected one happened to
+  // come second — which is precisely the bundle-size regression this project
+  // spent a release avoiding.
+  //
+  // Each is answered with the local build of the SAME NAME, for two reasons:
+  //
+  //   1. the suite tests the working tree. Left alone the example fetches
+  //      `@latest` from unpkg, so these tests would exercise the last published
+  //      release and a regression in `dist/` would sail through green;
+  //   2. the artifact is pinned. The example needs `machine`, which only the
+  //      full bundle carries — a silent switch to `cdn.global.js` would install
+  //      `Sibu` and leave `machine` undefined, failing far from the cause.
+  const requestedCdnUrls: string[] = [];
+
+  await page.route("**unpkg.com/**/cdn*.global.js", async (route) => {
+    const requestedUrl = route.request().url();
+    requestedCdnUrls.push(requestedUrl);
+
+    // The filename becomes a filesystem path, so it is checked against a fixed
+    // set rather than trusted: a URL this glob matched is still not proof of a
+    // name this repository builds.
+    const filename = new URL(requestedUrl).pathname.split("/").pop();
+    if (!filename || !ALLOWED_CDN_FILES.has(filename)) {
+      throw new Error(`Unexpected CDN artifact request: ${requestedUrl}`);
+    }
+
+    await route.fulfill({
+      status: 200,
+      contentType: "text/javascript; charset=utf-8",
+      body: readFileSync(resolve(DIST, filename), "utf8"),
+    });
+  });
+
   await page.goto(PAGE);
+
+  // The WHOLE collection, exactly. `toContain` would accept a second runtime
+  // alongside the right one; `toEqual` accepts one request and no others, which
+  // separates all four artifacts and rejects duplicates.
+  expect(
+    requestedCdnUrls,
+    "the chess example must request exactly one CDN runtime: the full production artifact",
+  ).toEqual([EXPECTED_CDN]);
   await expect(page.locator(`${board(1)}[data-sibu-enhanced="true"]`)).toHaveCount(1);
 });
 
+/**
+ * Assert that a square holds a given piece, of a given colour.
+ *
+ * Both sides render the SAME solid glyph and are told apart by `data-side`,
+ * which is what the stylesheet colours. The outline set (♙♘♗♖♕♔) used to
+ * mark white, but those glyphs are hollow — they show the square underneath, so
+ * a white piece only looked white on a pale square. Asserting the glyph alone
+ * would no longer distinguish a white knight from a black one, which is exactly
+ * what the promotion test turns on, so both halves are checked.
+ */
+async function expectPiece(
+  page: import("@playwright/test").Page,
+  n: 1 | 2,
+  sq: string,
+  side: "w" | "b",
+  glyph: string,
+) {
+  const piece = page.locator(`${square(n, sq)} .piece`);
+  await expect(piece).toHaveText(glyph);
+  await expect(piece).toHaveAttribute("data-side", side);
+}
+
 /**
  * Play the fixture moves that get a test to an interesting position.
  *
@@ -59,7 +141,7 @@ test("a mouse move updates only the squares involved, and keeps every node", asy
   await expect(page.locator(square(1, "e4"))).toHaveAttribute("data-marks", "legal");
 
   await page.click(square(1, "e4"));
-  await expect(page.locator(`${square(1, "e4")} .piece`)).toHaveText("♙");
+  await expectPiece(page, 1, "e4", "w", "♟");
   await expect(page.locator(`${square(1, "e2")} .piece`)).toHaveText("");
   await expect(page.locator(`${board(1)} [data-ref="status"]`)).toContainText("Black to move");
 
@@ -90,7 +172,7 @@ test("keyboard: arrows navigate the grid and Enter/Space play the move", async (
   await expect(page.locator(square(1, "d2"))).toHaveAttribute("data-marks", "selected");
   await page.locator(square(1, "d4")).focus();
   await page.keyboard.press(" ");
-  await expect(page.locator(`${square(1, "d4")} .piece`)).toHaveText("♙");
+  await expectPiece(page, 1, "d4", "w", "♟");
   await expect(page.locator(`${board(1)} [data-ref="moves"] li`)).toHaveText(["1. d4"]);
 });
 
@@ -123,7 +205,7 @@ test("focus is preserved across a reactive update", async ({ page }) => {
     b.querySelector<HTMLButtonElement>('[data-square="e2"]')?.click();
     b.querySelector<HTMLButtonElement>('[data-square="e4"]')?.click();
   });
-  await expect(page.locator(`${square(1, "e4")} .piece`)).toHaveText("♙");
+  await expectPiece(page, 1, "e4", "w", "♟");
   await expect(page.locator(square(1, "g1"))).toBeFocused();
 });
 
@@ -176,7 +258,7 @@ test("promotion: Escape cancels, commits nothing and restores focus to the board
   await expect(dialog).toBeHidden();
   await expect(page.locator(square(1, "g8"))).toBeFocused();
   // Nothing was played: the pawn is still on h7 and the move list is unchanged.
-  await expect(page.locator(`${square(1, "h7")} .piece`)).toHaveText("♙");
+  await expectPiece(page, 1, "h7", "w", "♟");
   await expect(page.locator(`${board(1)} [data-ref="moves"] li`)).toHaveCount(4);
 });
 
@@ -190,7 +272,7 @@ test("promotion: choosing a piece commits exactly one move and returns focus", a
 
   await expect(dialog).toBeHidden();
   await expect(page.locator(square(1, "g8"))).toBeFocused();
-  await expect(page.locator(`${square(1, "g8")} .piece`)).toHaveText("♘");
+  await expectPiece(page, 1, "g8", "w", "♞");
   await expect(page.locator(`${board(1)} [data-ref="moves"] li`).last()).toHaveText("5. hxg8=N");
 });
 
@@ -225,7 +307,7 @@ test("a broken island beside them changes nothing", async ({ page }) => {
   await expect(page.locator('[data-sibu-island="broken"]')).not.toHaveAttribute("data-sibu-enhanced", "true");
   await page.click(square(1, "e2"));
   await page.click(square(1, "e4"));
-  await expect(page.locator(`${square(1, "e4")} .piece`)).toHaveText("♙");
+  await expectPiece(page, 1, "e4", "w", "♟");
 });
 
 test("disposing the island stops it and leaves the server markup in place", async ({ page }) => {
diff --git a/tests/contracts.test.ts b/tests/contracts.test.ts
index 7ef2b29..a3af10f 100644
--- a/tests/contracts.test.ts
+++ b/tests/contracts.test.ts
@@ -179,6 +179,41 @@ describe("validators", () => {
 // ===========================================================================
 
 describe("validateProps", () => {
+  it("interleaves per-property: each default and validation run before the next key", () => {
+    // Defaults and validators are USER CALLBACKS, so the order they run in is
+    // observable whenever either touches outside state. Schema entries are
+    // processed in insertion order, and each property is finished — normalize,
+    // default, validate — before the next one starts.
+    //
+    // Splitting this into "all defaults, then all validators" silently reorders
+    // those callbacks: `b`'s factory would read `state` before `a`'s validator
+    // had set it.
+    const order: string[] = [];
+    let state = 0;
+
+    const result = validateProps<{ a: number; b: number }>(
+      { a: 1 },
+      {
+        a: {
+          validator: () => {
+            order.push("validate a");
+            state = 1;
+            return true;
+          },
+        },
+        b: {
+          default: () => {
+            order.push("default b");
+            return state;
+          },
+        },
+      },
+    );
+
+    expect(order).toEqual(["validate a", "default b"]);
+    expect(result.b).toBe(1);
+  });
+
   it("should pass through valid props unchanged", () => {
     const schema: PropSchema<{ name: string; age: number }> = {
       name: { type: validators.string },
diff --git a/tests/dist-artifacts.test.ts b/tests/dist-artifacts.test.ts
index 518a552..d4d66d4 100644
--- a/tests/dist-artifacts.test.ts
+++ b/tests/dist-artifacts.test.ts
@@ -4,6 +4,8 @@
 
 import { existsSync, readFileSync, statSync } from "node:fs";
 import { resolve } from "node:path";
+import { createContext, runInContext } from "node:vm";
+import { gzipSync } from "node:zlib";
 import { describe, expect, it } from "vitest";
 
 // ---------------------------------------------------------------------------
@@ -28,6 +30,8 @@ import { describe, expect, it } from "vitest";
 const ROOT = resolve(__dirname, "..");
 const PROD_CDN = resolve(ROOT, "dist/cdn.global.js");
 const DEV_CDN = resolve(ROOT, "dist/cdn.dev.global.js");
+const FULL_CDN = resolve(ROOT, "dist/cdn.full.global.js");
+const FULL_DEV_CDN = resolve(ROOT, "dist/cdn.full.dev.global.js");
 
 // Every diagnostic, identified by a literal only it emits, which survives
 // minification verbatim. Keep in step with the marker list in
@@ -47,6 +51,24 @@ const DIAGNOSTIC_MARKERS = {
   "setup rejection explanation": "the promise returned by the setup also rejected",
 } as const;
 
+// Diagnostics that live in `sibujs/patterns`, so they only appear in the
+// bundles that carry it. `validateProps` gated on `process.env.NODE_ENV`
+// until 4.4.0 — not a `define` target, and absent in a browser, so the check
+// ran and warned in every browser build. Nothing caught it because this list
+// is hand-maintained; the behavioural tests below are the real guard.
+const PATTERNS_DIAGNOSTIC_MARKERS = {
+  "prop validation errors": "Prop validation errors",
+  // The assertion body, which survived the first fix: gating on the imported
+  // `DEV` const folded the condition to `!1` but left `if (!1) { … }` standing,
+  // because the const is substituted after dead-code elimination has run.
+  "contract assertion": "[SibuJS Contract]",
+} as const;
+
+// NOT markers, and worth saying so: `validators.required` and `validators.oneOf`
+// build the strings "… is required" and "… must be one of:" as their RETURN
+// VALUES. They are exported API that runs in production, so those strings must
+// ship. Asserting their absence would be asserting the library is broken.
+
 // `dist/` only exists after `npm run build`. Skipping locally keeps a plain
 // `vitest` run working on a fresh clone; on CI a missing artifact is a failure,
 // because CI always builds first and a silent skip there would hide exactly the
@@ -108,3 +130,217 @@ describe.skipIf(!built && !onCI)("published CDN artifacts", () => {
     expect(source).toContain("Sibu");
   });
 });
+
+// ---------------------------------------------------------------------------
+// What each CDN global actually carries, and where the boundary sits.
+//
+// `cdn.ts` used to re-export `./index` and nothing else, which made the
+// no-build story quietly incomplete: islands are sold as "one script tag, no
+// bundler", but an island reaching for `machine` found it missing, because it
+// lives in the `sibujs/patterns` entry point that only a bundler can resolve.
+//
+// `sibujs/ui` is deliberately NOT in that bundle. It is the framework's
+// UI-behaviour layer — forms, a11y primitives, virtual lists, transitions —
+// which most pages never touch, and it stays bundler-only. These tests pin that
+// boundary from the core side so a future merge has to be deliberate. These tests pin the boundary in both directions: the
+// helpers that belong in core are present, and the ui surface is absent.
+//
+// They execute the published IIFEs and inspect the objects installed, rather
+// than grepping for names — a string can survive minification while the export
+// it belongs to does not.
+// ---------------------------------------------------------------------------
+
+/**
+ * Run a published CDN bundle and return the global object it installs.
+ *
+ * The context object IS the global and `window` points back at it, matching a
+ * browser where `window === globalThis`. That equivalence is the entire point:
+ * an IIFE built with esbuild's `globalName` emits `var Sibu = <the module's
+ * export namespace>` AFTER the module body has run. Against a separate `window`
+ * stand-in the two land in different slots, so the test passes while the browser
+ * gets the namespace instead of what the body installed — which is exactly the
+ * bug this shape was written to catch.
+ */
+function loadCdnGlobal(file: string): Record<string, unknown> {
+  const context = createContext({ console }) as Record<string, unknown>;
+  context.window = context;
+  runInContext(readFileSync(file, "utf8"), context);
+  return context.Sibu as Record<string, unknown>;
+}
+
+const fullBuilt = existsSync(FULL_CDN) && existsSync(FULL_DEV_CDN);
+
+describe.skipIf(!built && !onCI)("the default CDN global", () => {
+  it("self-registers an object on window", () => {
+    expect(typeof loadCdnGlobal(PROD_CDN)).toBe("object");
+  });
+
+  it("carries core and nothing else", () => {
+    // This is the file every no-build page downloads, so anything merged in is
+    // paid for by consumers who never call it. `patterns` cost +13% gzip on its
+    // own, which is why it ships as `cdn.full.global.js` instead.
+    const Sibu = loadCdnGlobal(PROD_CDN);
+    expect(typeof Sibu.signal).toBe("function");
+    expect(Sibu.machine).toBeUndefined();
+    expect(Sibu.patterns).toBeUndefined();
+    expect(Sibu.ui).toBeUndefined();
+    expect(Sibu.createDialogAria).toBeUndefined();
+  });
+
+  it("stays within its byte budget, over the wire and on disk", () => {
+    // 80,202 B raw / 26,330 B gzip was the size before patterns was merged in
+    // and then split back out. The default bundle must not drift above that
+    // without someone deciding to; a review caught exactly that drift once.
+    //
+    // GZIP IS THE ONE THAT MATTERS, and it is not implied by the raw number:
+    // bytes that compress badly can push the transfer size up while the file
+    // on disk stays flat or shrinks. Level 9 keeps this deterministic, and the
+    // 2% tolerance absorbs differences between zlib builds rather than real
+    // growth — it is far tighter than the 13% regression this guards against.
+    const raw = statSync(PROD_CDN).size;
+    const gzip = gzipSync(readFileSync(PROD_CDN), { level: 9 }).length;
+    expect(raw, `raw ${raw} B`).toBeLessThanOrEqual(80_202);
+    expect(gzip, `gzip ${gzip} B`).toBeLessThanOrEqual(Math.round(26_330 * 1.02));
+  });
+});
+
+describe.skipIf(!fullBuilt && !onCI)("the core + patterns CDN global", () => {
+  it("both full bundles exist (run `npm run build` first)", () => {
+    expect(existsSync(FULL_CDN), `missing ${FULL_CDN}`).toBe(true);
+    expect(existsSync(FULL_DEV_CDN), `missing ${FULL_DEV_CDN}`).toBe(true);
+  });
+
+  it("carries the patterns surface a no-build page cannot otherwise reach", () => {
+    const Sibu = loadCdnGlobal(FULL_CDN);
+    expect(typeof Sibu.machine).toBe("function");
+    expect(typeof (Sibu.patterns as Record<string, unknown>).machine).toBe("function");
+    expect(typeof Sibu.signal).toBe("function");
+  });
+
+  it("lets core win every name collision", async () => {
+    // Identified by arity rather than by calling them: a tag factory needs a
+    // DOM, and identity comparison is meaningless across a separate bundle.
+    // Minification preserves parameter count.
+    const Sibu = loadCdnGlobal(FULL_CDN);
+    const core = (await import("../dist/index.js")) as unknown as Record<string, () => void>;
+    const ui = (await import("../dist/ui.js")) as unknown as Record<string, () => void>;
+
+    // The premise this test rests on, asserted rather than assumed.
+    expect(ui.dialog).not.toBe(core.dialog);
+    expect(core.dialog.length).not.toBe(ui.dialog.length);
+
+    expect((Sibu.dialog as () => void).length).toBe(core.dialog.length);
+    expect((Sibu.form as () => void).length).toBe(core.form.length);
+  });
+
+  it("compiles the patterns diagnostics out of production", () => {
+    const prod = readFileSync(FULL_CDN, "utf8");
+    const dev = readFileSync(FULL_DEV_CDN, "utf8");
+    for (const [name, marker] of Object.entries(PATTERNS_DIAGNOSTIC_MARKERS)) {
+      expect(prod, `${name} survived into the production bundle`).not.toContain(marker);
+      expect(dev, `${name} is missing from the development bundle`).toContain(marker);
+    }
+  });
+
+  // The tests that actually matter: the marker list above is hand-maintained
+  // and missed this for a whole release. These run the published bytes.
+  it("validateProps neither validates nor warns in production", () => {
+    const warnings: string[] = [];
+    const context = createContext({
+      console: { warn: (...a: unknown[]) => warnings.push(a.join(" ")), error() {}, log() {} },
+    }) as Record<string, unknown>;
+    context.window = context;
+    runInContext(readFileSync(FULL_CDN, "utf8"), context);
+    const Sibu = context.Sibu as Record<string, never>;
+    const validators = Sibu.validators as unknown as Record<string, unknown>;
+
+    const out = (Sibu.validateProps as unknown as (p: object, s: object) => Record<string, unknown>)(
+      { n: "not a number" },
+      { n: { type: validators.number, required: true } },
+    );
+
+    expect(warnings).toEqual([]);
+    // Defaults still applied, value untouched: only the checking disappears.
+    expect(out.n).toBe("not a number");
+  });
+
+  it("validateProps does warn in the development bundle", () => {
+    // The negative above is only meaningful if the positive holds.
+    const warnings: string[] = [];
+    const context = createContext({
+      console: { warn: (...a: unknown[]) => warnings.push(a.join(" ")), error() {}, log() {} },
+    }) as Record<string, unknown>;
+    context.window = context;
+    runInContext(readFileSync(FULL_DEV_CDN, "utf8"), context);
+    const Sibu = context.Sibu as Record<string, never>;
+    const validators = Sibu.validators as unknown as Record<string, unknown>;
+
+    (Sibu.validateProps as unknown as (p: object, s: object) => unknown)(
+      { n: "not a number" },
+      { n: { type: validators.number, required: true } },
+    );
+
+    expect(warnings.join(" ")).toContain("Prop validation errors");
+  });
+
+  it("validateProps does not invoke validators at all in production", () => {
+    // Stronger than "it did not warn": a spy proves the validation branch never
+    // ran, rather than running silently. Silence would still mean the work and
+    // the code were shipped.
+    const calls = { prod: 0, dev: 0 };
+    const spy = (where: "prod" | "dev") => () => {
+      calls[where] += 1;
+      return "always invalid" as const;
+    };
+
+    const run = (file: string, where: "prod" | "dev") => {
+      const Sibu = loadCdnGlobal(file);
+      (Sibu.validateProps as unknown as (p: object, s: object) => unknown)(
+        { n: 1 },
+        { n: { type: spy(where), required: true } },
+      );
+    };
+
+    run(FULL_CDN, "prod");
+    run(FULL_DEV_CDN, "dev");
+
+    expect(calls.prod, "a validator ran in the production bundle").toBe(0);
+    // The positive control: without it, a `validateProps` that silently did
+    // nothing anywhere would pass the assertion above.
+    expect(calls.dev, "no validator ran in the development bundle").toBeGreaterThan(0);
+  });
+
+  it("validateProps makes no validation-only allocations in production", () => {
+    // The dev-only `errors` array used to be declared above the loop that fills
+    // it, which is outside the foldable branch — so the branch stripped cleanly
+    // and left `let r = []` allocated on every production call, forever unread.
+    //
+    // Asserted against the SHIPPED function rather than the source, because
+    // this is a property of what the minifier emitted, not of what was written.
+    //
+    // Reading `toString()` only sees this function's own body, so it is only a
+    // sufficient guard while both paths are inlined here. A shared helper hid a
+    // `{ type: def }` normalization from exactly this assertion once — hence
+    // the second check, and the comment in `contracts.ts` saying why the
+    // duplication there is deliberate.
+    const Sibu = loadCdnGlobal(FULL_CDN);
+    const source = (Sibu.validateProps as unknown as () => void).toString();
+    // The props copy and the `Object.entries` iteration remain — they are the
+    // work itself. What must be absent is anything that exists only to feed
+    // validation.
+    expect(source, `production validateProps allocates an errors array: ${source}`).not.toMatch(/\[\s*\]/);
+    expect(source, `production validateProps normalizes for validation: ${source}`).not.toContain("type:");
+  });
+
+  it("assertType is a no-op in production and throws in development", () => {
+    const call = (file: string) => {
+      const Sibu = loadCdnGlobal(file);
+      const validators = Sibu.validators as Record<string, unknown>;
+      (Sibu.assertType as (v: unknown, val: unknown, l?: string) => void)("nope", validators.number, "n");
+    };
+    // It guarded on `process.env.NODE_ENV`, which does not exist in a browser,
+    // so the early return never fired and this threw on every CDN page.
+    expect(() => call(FULL_CDN)).not.toThrow();
+    expect(() => call(FULL_DEV_CDN)).toThrow(/Contract/);
+  });
+});
diff --git a/tests/example-chess-smoke.test.ts b/tests/example-chess-smoke.test.ts
index d19bc7d..ac1df4b 100644
--- a/tests/example-chess-smoke.test.ts
+++ b/tests/example-chess-smoke.test.ts
@@ -65,6 +65,115 @@ function moduleSpecifiers(source: string): string[] {
   return out;
 }
 
+/**
+ * Strip HTML comments before any markup is inspected.
+ *
+ * A commented-out tag is not markup. Without this, a document whose runtime
+ * <script> has been commented out still reports the runtime as present — the
+ * same class of false positive as matching a filename in prose, one level up.
+ */
+function withoutHtmlComments(html: string): string {
+  return html.replace(/<!--[\s\S]*?-->/g, "");
+}
+
+/**
+ * The `src` of every LIVE classic script in a document, in source order.
+ *
+ * Attribute-level and comment-free, not substring: `html.indexOf("cdn.global.js")`
+ * once matched the explanatory comment above the tag and reported a passing test
+ * while the page loaded a different artifact entirely.
+ *
+ * Module scripts are excluded so the runtime tag and the island can be told
+ * apart, and so `type="module"` written on the CDN tag would fail rather than
+ * quietly change its loading semantics.
+ */
+function classicScriptSources(html: string): string[] {
+  const source = withoutHtmlComments(html);
+  return [...source.matchAll(/<script\b([^>]*)>/gi)]
+    .filter((match) => !/\btype\s*=\s*["']module["']/i.test(match[1]))
+    .map((match) => match[1].match(/\bsrc\s*=\s*["']([^"']+)["']/i)?.[1])
+    .filter((src): src is string => src !== undefined);
+}
+
+/**
+ * The index of the first LIVE script tag whose `src` is exactly `src`, or -1.
+ *
+ * Indices come from the comment-stripped string, so callers must compare only
+ * indices produced by this function — mixing one with an offset taken from the
+ * original HTML would compare positions in two different documents.
+ */
+function scriptTagIndex(html: string, src: string): number {
+  const source = withoutHtmlComments(html);
+  for (const match of source.matchAll(/<script\b[^>]*>/gi)) {
+    const found = match[0].match(/\bsrc\s*=\s*["']([^"']+)["']/i)?.[1];
+    if (found === src) return match.index ?? -1;
+  }
+  return -1;
+}
+
+const FULL_CDN_SRC = "https://unpkg.com/sibujs@latest/dist/cdn.full.global.js";
+const CORE_CDN_SRC = "https://unpkg.com/sibujs@latest/dist/cdn.global.js";
+
+// ---------------------------------------------------------------------------
+// The extractors themselves, against synthetic documents.
+//
+// These need no server and no build, so they run on every checkout — which
+// matters, because every false positive found in this file so far has been in
+// the extraction, not in the page.
+// ---------------------------------------------------------------------------
+describe("script tag extraction", () => {
+  const island = '<script type="module" src="./chess-island.js"></script>';
+
+  it("finds a live classic script", () => {
+    const live = `<script src="${FULL_CDN_SRC}"></script>${island}`;
+    expect(classicScriptSources(live)).toContain(FULL_CDN_SRC);
+    expect(scriptTagIndex(live, FULL_CDN_SRC)).toBeGreaterThan(-1);
+  });
+
+  it("ignores a script commented out across several lines", () => {
+    const multiline = `
+  <!--
+    <script src="${FULL_CDN_SRC}"></script>
+  -->
+  ${island}
+`;
+    expect(classicScriptSources(multiline)).not.toContain(FULL_CDN_SRC);
+    expect(scriptTagIndex(multiline, FULL_CDN_SRC)).toBe(-1);
+  });
+
+  it("ignores a script commented out on one line", () => {
+    const singleLine = `
+  <!-- <script src="${FULL_CDN_SRC}"></script> -->
+  ${island}
+`;
+    expect(classicScriptSources(singleLine)).not.toContain(FULL_CDN_SRC);
+    expect(scriptTagIndex(singleLine, FULL_CDN_SRC)).toBe(-1);
+  });
+
+  it("ignores a filename mentioned in ordinary comment prose", () => {
+    const prose = `<!-- use cdn.full.global.js, not cdn.global.js -->${island}`;
+    expect(classicScriptSources(prose)).toEqual([]);
+    expect(scriptTagIndex(prose, FULL_CDN_SRC)).toBe(-1);
+  });
+
+  it("excludes module scripts from the classic list", () => {
+    expect(classicScriptSources(island)).toEqual([]);
+  });
+
+  it("detects a live core-only tag, which the page assertion then rejects", () => {
+    const core = `<script src="${CORE_CDN_SRC}"></script>${island}`;
+    expect(classicScriptSources(core)).toEqual([CORE_CDN_SRC]);
+  });
+
+  it("orders a live runtime tag before the island, and a commented one not at all", () => {
+    const live = `<script src="${FULL_CDN_SRC}"></script>${island}`;
+    expect(scriptTagIndex(live, FULL_CDN_SRC)).toBeLessThan(scriptTagIndex(live, "./chess-island.js"));
+
+    const commented = `<!-- <script src="${FULL_CDN_SRC}"></script> -->${island}`;
+    expect(scriptTagIndex(commented, FULL_CDN_SRC)).toBe(-1);
+  });
+});
+
 describe.skipIf(!distBuilt || !vendorBuilt)("chess example — production output is servable", () => {
   it("serves the directory URL as the example page", async () => {
     // The classic deployment failure: `/examples/chess/` resolving to a
@@ -125,11 +234,56 @@ describe.skipIf(!distBuilt || !vendorBuilt)("chess example — production output
     }
 
     expect(failures).toEqual([]);
-    // The graph really was walked: the island, the vendored engine and the
-    // package's own entry points.
-    expect(seen.size).toBeGreaterThan(3);
+    // The graph really was walked: the island and the vendored engine.
+    expect(seen.size).toBeGreaterThan(1);
     expect([...seen].some((u) => u.endsWith("/vendor/chess.js"))).toBe(true);
-    expect([...seen].some((u) => u.includes("/dist/index.js"))).toBe(true);
+
+    // And the framework is NOT in it. The example takes SibuJS from the
+    // <script> tag in index.html, so its module graph is the island plus the
+    // engine and nothing else. An import of `../../dist/*` reappearing here
+    // would mean the example silently needs `npm run build` again — a build
+    // step in the one demo whose whole subject is that islands need none.
+    expect([...seen].some((u) => u.includes("/dist/"))).toBe(false);
+  }, 30_000);
+
+  it("loads the FULL runtime bundle from a real script tag, not the core-only one", async () => {
+    const html = await (await fetch(`${BASE}/examples/chess/index.html`)).text();
+    const sources = classicScriptSources(html);
+
+    // The island destructures `machine`, which lives in the patterns half of
+    // the library. The core-only bundle would install `Sibu` and leave
+    // `machine` undefined — a failure well away from the tag that caused it.
+    expect(sources, `classic scripts were: ${JSON.stringify(sources)}`).toContain(FULL_CDN_SRC);
+    expect(sources).not.toContain(CORE_CDN_SRC);
+  }, 30_000);
+
+  it("puts the runtime tag ahead of the deferred island module", async () => {
+    const html = await (await fetch(`${BASE}/examples/chess/index.html`)).text();
+
+    // Positions of the real TAGS, not of filename substrings found anywhere.
+    const runtime = scriptTagIndex(html, FULL_CDN_SRC);
+    const island = scriptTagIndex(html, "./chess-island.js");
+
+    expect(runtime, "no classic script loads the full CDN bundle").toBeGreaterThan(-1);
+    expect(island, "no module script loads the island").toBeGreaterThan(-1);
+    // The island is a module and therefore deferred, so a classic script
+    // anywhere in the document beats it — but ordering them the way a reader
+    // would write them keeps the example honest.
+    expect(runtime).toBeLessThan(island);
+  }, 30_000);
+
+  it("tells a reader who is missing the runtime to load the FULL bundle", async () => {
+    // The guard throws when `globalThis.Sibu` is absent. Naming the core-only
+    // bundle there sends the reader to a file that installs `Sibu` and still
+    // leaves `machine` undefined, so the error would be followed by a second,
+    // stranger failure.
+    const source = await (await fetch(`${BASE}/examples/chess/chess-island.js`)).text();
+
+    // Scoped to the throw, so an explanatory comment elsewhere cannot satisfy
+    // it: everything between `new Error(` and its closing paren.
+    const thrown = source.slice(source.indexOf("new Error("), source.indexOf("chess example] SibuJS") + 400);
+    expect(thrown).toContain("cdn.full.global.js");
+    expect(thrown.replace(/cdn\.full\.global\.js/g, "")).not.toContain("cdn.global.js");
   }, 30_000);
 
   it("does not 404 on the vendored engine, whose build step is easy to forget", async () => {
diff --git a/tsup.cdn.config.ts b/tsup.cdn.config.ts
index 1b13076..4e572e4 100644
--- a/tsup.cdn.config.ts
+++ b/tsup.cdn.config.ts
@@ -33,9 +33,21 @@ const { version } = JSON.parse(readFileSync(new URL("./package.json", import.met
   version: string;
 };
 
+// NO `globalName`, deliberately — and this is a trap worth naming, because
+// adding it back looks like an obvious improvement.
+//
+// `globalName: "Sibu"` makes esbuild emit `var Sibu = (() => { … })()`, and
+// that assignment lands AFTER the module body has finished. `cdn.ts` installs a
+// MERGED object (core + patterns + ui) from inside the body, so the wrapper
+// would immediately overwrite it with the module's own export namespace —
+// which is `export * from "./index"` and therefore core only. The merge would
+// vanish with no error, no warning, and a bundle that still defines `Sibu`.
+//
+// `cdn.ts` assigns the global itself instead. `tests/dist-artifacts.test.ts`
+// executes the built IIFE in a context where `window === globalThis`, the way a
+// browser has it, and asserts the merged surface survives.
 const shared = {
   format: ["iife"] as const,
-  globalName: "Sibu",
   outDir: "dist",
   dts: false,
   minify: true,
@@ -61,4 +73,23 @@ export default defineConfig([
       __SIBU_VERSION__: JSON.stringify(version),
     },
   },
+  // core + patterns, for no-build pages that want `machine`. A separate file so
+  // the default bundle above keeps its byte budget: patterns cost +13% gzip,
+  // and most pages never call any of it.
+  {
+    ...shared,
+    entry: { "cdn.full": "cdn.full.ts" },
+    define: {
+      __SIBU_DEV__: "false",
+      __SIBU_VERSION__: JSON.stringify(version),
+    },
+  },
+  {
+    ...shared,
+    entry: { "cdn.full.dev": "cdn.full.ts" },
+    define: {
+      __SIBU_DEV__: "true",
+      __SIBU_VERSION__: JSON.stringify(version),
+    },
+  },
 ]);