gutterpress 0.10.5-beta.1 → 0.10.6-beta.1

package/dist/api/index.js

@@ -106,7 +106,7 @@ import {
   syncProject,
   testRemoteAccess,
   validateProjectPlugins
-} from "../index-3xv7vwv2.js";
+} from "../index-aqxnmfzx.js";
 import {
   BuildError,
   DEFAULT_PRINT_OPTS,

package/dist/{audit-9pf96y1w.js → audit-j57qptj6.js}

@@ -1,15 +1,15 @@
 import {
   executeAndReport
-} from "./cli-5w9y6r2f.js";
+} from "./cli-55rdak96.js";
 import {
   log
-} from "./cli-nb902265.js";
+} from "./cli-622k3vky.js";
 import {
   UsageError,
   rejectExtraPositionals,
   rejectUnknownFlags
-} from "./cli-xewqry0j.js";
-import"./cli-0t4zfevc.js";
+} from "./cli-969n6fcc.js";
+import"./cli-bwbs3qm4.js";
 import"./cli-c41yr7he.js";
 import {
   EXIT_CODES

package/dist/{build-jw9kynts.js → build-1dkfbqrn.js}

@@ -1,10 +1,10 @@
 import {
   runBuild,
   splitOutPath
-} from "./cli-5w9y6r2f.js";
+} from "./cli-55rdak96.js";
 import {
   log
-} from "./cli-nb902265.js";
+} from "./cli-622k3vky.js";
 import {
   UsageError,
   parseEngine,
@@ -12,8 +12,8 @@ import {
   parsePdfxFlavor,
   rejectExtraPositionals,
   rejectUnknownFlags
-} from "./cli-xewqry0j.js";
-import"./cli-0t4zfevc.js";
+} from "./cli-969n6fcc.js";
+import"./cli-bwbs3qm4.js";
 import"./cli-c41yr7he.js";
 import {
   BuildError

package/dist/{cli-5w9y6r2f.js → cli-55rdak96.js}

@@ -13,12 +13,12 @@ import {
   stampCreator,
   stripAnnotations,
   warn
-} from "./cli-nb902265.js";
+} from "./cli-622k3vky.js";
 import {
   DEBOUNCE,
   UsageError,
   resolvePort
-} from "./cli-xewqry0j.js";
+} from "./cli-969n6fcc.js";
 import {
   MARGIN_BOX_IGNORED_PROPERTIES,
   RENDER_TIMEOUT_MS,
@@ -27,7 +27,7 @@ import {
   getAssetPath,
   getBrowser,
   prewarmBrowser
-} from "./cli-0t4zfevc.js";
+} from "./cli-bwbs3qm4.js";
 import {
   INSTALL_HINTS,
   execCapture,
@@ -1671,26 +1671,33 @@ function getTextPass(doc) {
     p = (async () => {
       const textByPage = [];
       const positions = [];
+      const runsByPage = [];
       for (let i = 1;i <= doc.numPages; i++) {
         try {
           const page = await doc.getPage(i);
           const tc = await page.getTextContent();
           let pageText = "";
+          const runs = [];
           for (const item of tc.items) {
             const it = item;
             if (typeof it.str !== "string")
               continue;
             pageText += it.str;
             if (it.transform && it.str.trim().length > 0) {
-              positions.push({ x: it.transform[4], y: it.transform[5] });
+              const x = it.transform[4];
+              const y = it.transform[5];
+              positions.push({ x, y });
+              runs.push({ s: it.str, x, y, w: it.width ?? 0, h: it.height ?? 0 });
             }
           }
           textByPage.push(pageText);
+          runsByPage.push(runs);
         } catch {
           textByPage.push("");
+          runsByPage.push([]);
         }
       }
-      return { textByPage, positions };
+      return { textByPage, positions, runsByPage };
     })();
     textCache.set(doc, p);
   }
@@ -1754,6 +1761,8 @@ function getOpPass(doc) {
               name,
               placedW: Math.hypot(ctm[0], ctm[1]),
               placedH: Math.hypot(ctm[2], ctm[3]),
+              x: ctm[4],
+              y: ctm[5],
               page: i
             });
           } else if (fn === OPS.setFont) {
@@ -3707,22 +3716,329 @@ body { margin: 0; }
 :where(h1,h2,h3,h4,h5,h6) { break-after: avoid; }
 :where(img, svg, video) { max-width: 100%; }
 :where(p > img:only-child, figure > img) { width: fit-content; max-width: 100%; height: auto; vertical-align: bottom; }
+:where(p) > :where(img:not([class])) { max-height: calc(var(--gp-content-h) - 4px); object-fit: contain; }
+:where(figure) { break-inside: avoid; }
 :where(.section, figure) > :where(:first-child) { break-before: avoid; }
 
 `;
 
+// src/lib/markdown/gutterpress-css.ts
+var GUTTERPRESS_CSS = `
+/* gp-* author image/block vocabulary. One vocabulary, gp-* only — the
+   pre-vocabulary utility names (.center/.float-left/.float-right/
+   .full-width/.full-bleed) were REMOVED when gp-* shipped; books rename
+   the classes in their markdown (see the migration note). Source ORDER is
+   the contract — see the doctrine comment above. */
+
+/* flow positions */
+.gp-left {
+  float: left;
+  margin: 0 var(--gp-gap, 1em) var(--gp-gap, 1em) 0;
+  max-width: 50%;
+}
+.gp-right {
+  float: right;
+  margin: 0 0 var(--gp-gap, 1em) var(--gp-gap, 1em);
+  max-width: 50%;
+}
+.gp-center {
+  display: block;
+  float: none;
+  margin-left: auto;
+  margin-right: auto;
+  max-width: 100%;
+}
+.gp-full {
+  display: block;
+  float: none;
+  width: 100%;
+  max-width: 100%;
+}
+@page gp-full-bleed { margin-left: 0; margin-right: 0; }
+.gp-bleed {
+  display: block;
+  float: none;
+  break-before: page;
+  page: gp-full-bleed;
+  max-width: none;
+  width: 100%;
+  margin-left: 0;
+  margin-right: 0;
+}
+
+/* sizes — AFTER the flow positions so max-width:100% lifts the floats' 50%
+   cap at equal specificity */
+.gp-small { width: 25%; max-width: 100%; }
+.gp-medium { width: 50%; max-width: 100%; }
+.gp-large { width: 75%; max-width: 100%; }
+
+/* float clearance presets — consumed by var(--gp-gap) in the float rules
+   above and by .gp-shape's shape-margin below; --gp-gap itself is
+   author-settable CSS */
+.gp-tight { --gp-gap: 0.5em; }
+.gp-loose { --gp-gap: 2em; }
+
+/* column runs — plain CSS Multi-column, exposed as author vocabulary so
+   "put this in two columns" does not require borrowing a styled container
+   from the book's own component layer. That borrowing is what this exists
+   to prevent: a book whose theme paints .section chrome by default gives
+   every author who opens a section just to start a column run a panel they
+   did not ask for, and the book then needs a reset rule to take it back.
+   With a neutral primitive the author opts into columns and nothing else.
+
+   Permanent vocabulary, not a shim: Chromium implements multicol natively
+   and these rules are the standard properties verbatim, so there is no
+   spec gap here to remove later. Deliberately minimal — column-fill is
+   NOT set, because the correct value depends on whether the run fragments
+   across pages (auto packs each page's columns; the CSS initial balance is
+   right for a run that fits on one page) and only the author knows which.
+   --gp-column-gap is author-settable. */
+.gp-columns-2 { columns: 2; column-gap: var(--gp-column-gap, 1.5em); }
+.gp-columns-3 { columns: 3; column-gap: var(--gp-column-gap, 1.5em); }
+
+/* the per-shape decisions the paragraph above deliberately leaves to the
+   author, named instead of left as raw CSS every book was reinventing
+   (2026-09-01 CSS architecture review, findings C1/C7 — CLAUDE.md §0:
+   "behavior broadly useful to non-technical authors belongs in core").
+   Permanent vocabulary, standard properties verbatim — same rationale as
+   the column/grid runs above. One name each, no aliases:
+     .gp-columns-all       column-span: all      a heading or block that
+                                                  spans every column in the
+                                                  run it sits inside.
+     .gp-columns-flow      column-fill: auto     a run that FRAGMENTS across
+                                                  pages — every page's
+                                                  columns fill instead of
+                                                  only the last one
+                                                  balancing (the dead-column
+                                                  collapse the build's
+                                                  engine.multicol.dead-column
+                                                  warning names this fix
+                                                  for).
+     .gp-columns-balanced  column-fill: balance  a run that fits on ONE
+                                                  page (the CSS initial
+                                                  value — ragged columns
+                                                  would be wrong here). */
+.gp-columns-all { column-span: all; }
+.gp-columns-flow { column-fill: auto; }
+.gp-columns-balanced { column-fill: balance; }
+
+/* grid runs — the SLOTTED counterpart to the column runs above. Grid places
+   each child into the next cell, across then down (deterministic slots: card
+   layouts, stat blocks, image-plus-caption pairs); columns FLOW one text run
+   down then across. Same neutral-primitive rationale as .gp-columns-*, and
+   permanent vocabulary for the same reason: standard CSS Grid verbatim, no
+   spec gap to remove later. MEASURED (Chromium 151, gp-grid evidence pack):
+   grid rows fragment across sheets with EXACT print/viewer parity — 2- and
+   3-col, unequal item heights, mid-row cuts, multi-sheet overflow,
+   break-inside:avoid, gap geometry — so a grid taller than the page is safe,
+   no fit-one-page constraint. Two things to know, not fix:
+     - on a min-height page root (MARKER_CSS), default align-content
+       stretches rows apart to fill the page — identically in both engines.
+       Authors wanting packed rows set align-content: start.
+     - a @page-break / @column-break marker DIRECTLY inside a grid container
+       becomes a grid item and corrupts placement (the one measured parity
+       break); markers.js diagnoses it (break_inside_grid).
+   --gp-grid-gap is author-settable. */
+.gp-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gp-grid-gap, 1.5em); }
+.gp-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gp-grid-gap, 1.5em); }
+
+/* fragmentation controls — generic pagination utilities for any element,
+   independent of the column/grid vocabulary above (a book reached for
+   these just as often outside a multicol run: keeping a card whole,
+   forcing a section to start a fresh page). Standard properties only —
+   this project is Chromium-only (CLAUDE.md), so there are no legacy
+   page-break-* twins to also emit. One name each. */
+.gp-no-break { break-inside: avoid; }
+.gp-break-before { break-before: page; }
+
+/* shape wrap — text follows the image's alpha silhouette instead of its
+   rectangular box. shape-outside only applies to floats, so this is inert
+   without .gp-left/.gp-right (and under .gp-pin, which un-floats). The
+   shape URL cannot be written in CSS (url() contexts can't read attr()),
+   so the image renderer rule (images.ts) mirrors the src into an inline
+   --gp-shape:url(...) custom property whenever it sees this class --
+   authors only ever type the class. threshold 0.2 ignores near-transparent
+   anti-aliasing halos; shape-margin shares the float-gap vocabulary. */
+img.gp-shape {
+  shape-outside: var(--gp-shape);
+  shape-image-threshold: 0.2;
+  shape-margin: var(--gp-gap, 1em);
+}
+
+/* pin — within the nearest positioned ancestor (.page/.spread, rule above).
+   inset:0 and the explicit centers are load-bearing; see doctrine comment. */
+.gp-pin {
+  position: absolute;
+  inset: 0;
+  align-self: center;
+  justify-self: center;
+  margin: 0;
+  max-width: 100%;
+}
+
+/* pin edge modifiers — AFTER .gp-pin to beat its center defaults;
+   justify-self is inert on in-flow floats, so gp-left/gp-right safely do
+   double duty as flow float + pin edge */
+.gp-top { align-self: start; }
+.gp-bottom { align-self: end; }
+.gp-left { justify-self: start; }
+.gp-right { justify-self: end; }
+
+/* wrapper-margin neutralization (same pattern and rationale as the
+   .gp-bleed paragraph-margin note in the doctrine comment; for pin, the
+   emptied paragraph would otherwise leave a phantom margin gap in flow) */
+:where(p:has(> img.gp-bleed:only-child)) { margin: 0; }
+:where(p:has(> img.gp-pin:only-child)) { margin: 0; }
+
+/* depth — a named ladder for z-index, so books stop hand-tuning bare
+   integers. A real book measured 21 z-index declarations using only four
+   distinct values (-1, 0, 1, 2), each written literally at its use site.
+   The custom properties are the author-settable surface (a book needing a
+   deeper stack raises them once); the classes are the shorthand.
+
+   NOT named "layer": CSS Paged Media 3 §3.1 already defines "page layers"
+   (page background, canvas, borders, contents, margin boxes) and those are
+   parts of the PAGE BOX, not a z-ladder for content. Reusing the word for a
+   different concept would collide with the spec vocabulary this project
+   tracks. The pin EDGE modifiers already own .gp-top/.gp-bottom, so the
+   ladder avoids those words too.
+
+   .gp-behind is the one that earns its place: it puts a pinned image UNDER
+   the page's text, which is otherwise impossible to express without a bare
+   negative z-index. "Above" needs no class — an out-of-flow pin already
+   paints above in-flow content.
+
+   Two things silently defeat .gp-behind, neither visible at the use site:
+     - a stacking context on the .page/.spread ancestor (z-index, isolation,
+       opacity, filter, transform on it traps the negative layer inside).
+       Core keeps .page/.spread at 'position: relative; z-index: auto'
+       precisely so they are not stacking contexts.
+     - a clipping ancestor (overflow other than visible) — but only where
+       the art actually overhangs that ancestor's clip box on a clipped
+       axis: the overhang is cut off, the same mechanism that clips a
+       .gp-bleed plate back to the wrapper's width. Clipping never reorders
+       layers — within-bounds art under a clipping .page prints whole and
+       still behind (measured; see the build audit's comment in
+       engine/compiler/build.ts), and a static wrapper's overflow never
+       binds an abspos .gp-pin at all.
+   The build-time engine.layer.trapped audit reports both against the live
+   ancestor chain. printsafe/page-containment is only an early source hint for
+   declarations written directly on .page/.spread. */
+:root {
+  --gp-z-behind: -1;
+  --gp-z-base: 0;
+  --gp-z-raised: 1;
+  --gp-z-front: 2;
+}
+.gp-behind { z-index: var(--gp-z-behind); }
+.gp-base   { z-index: var(--gp-z-base); }
+.gp-raised { z-index: var(--gp-z-raised); }
+.gp-front  { z-index: var(--gp-z-front); }
+`;
+var GP_CLASSES = new Set([
+  "gp-left",
+  "gp-right",
+  "gp-center",
+  "gp-full",
+  "gp-bleed",
+  "gp-small",
+  "gp-medium",
+  "gp-large",
+  "gp-tight",
+  "gp-loose",
+  "gp-columns-2",
+  "gp-columns-3",
+  "gp-columns-all",
+  "gp-columns-flow",
+  "gp-columns-balanced",
+  "gp-no-break",
+  "gp-break-before",
+  "gp-grid-2",
+  "gp-grid-3",
+  "gp-shape",
+  "gp-pin",
+  "gp-top",
+  "gp-bottom",
+  "gp-behind",
+  "gp-base",
+  "gp-raised",
+  "gp-front",
+  "gp-page-break",
+  "gp-column-break",
+  "gp-continued",
+  "gp-flush"
+]);
+
 // src/lib/markdown/gp-pin-scope.js
 function warn3(env, line, type, message, marker) {
   if (!env.layoutWarnings)
     env.layoutWarnings = [];
   env.layoutWarnings.push({ line, type, message, marker });
 }
+function editDistance2(a, b) {
+  let prev = Array.from({ length: b.length + 1 }, (_, j) => j);
+  for (let i = 1;i <= a.length; i++) {
+    const cur = [i];
+    for (let j = 1;j <= b.length; j++) {
+      cur[j] = Math.min(prev[j] + 1, cur[j - 1] + 1, prev[j - 1] + (a[i - 1] === b[j - 1] ? 0 : 1));
+    }
+    prev = cur;
+  }
+  return prev[b.length];
+}
+function nearestGpClass(cls) {
+  const threshold = Math.max(2, Math.floor(cls.length / 3));
+  let best = null;
+  let bestDistance = Infinity;
+  for (const known of GP_CLASSES) {
+    const d = editDistance2(cls, known);
+    if (d < bestDistance) {
+      bestDistance = d;
+      best = known;
+    }
+  }
+  return best !== null && bestDistance > 0 && bestDistance <= threshold ? best : null;
+}
+function hasPinClass(token) {
+  const cls = token.attrGet && token.attrGet("class");
+  return typeof cls === "string" && cls.split(/\s+/).includes("gp-pin");
+}
+function elementNameFor(token) {
+  switch (token.type) {
+    case "layout_chapter_open":
+      return "@chapter";
+    case "layout_spread_open":
+      return "@spread";
+    case "layout_page_open":
+      return "@page";
+    case "layout_section_open":
+      return "@section";
+    case "image":
+      return "an image";
+    case "heading_open":
+      return "a heading";
+    case "paragraph_open":
+      return "a paragraph";
+    case "link_open":
+      return "a link";
+    default:
+      return token.tag ? `a <${token.tag}>` : "an element";
+  }
+}
+function checkUnknownGpClasses(token, env, line) {
+  const cls = token.attrGet && token.attrGet("class");
+  if (typeof cls !== "string" || !cls)
+    return;
+  for (const c of cls.split(/\s+/)) {
+    if (!c.startsWith("gp-") || GP_CLASSES.has(c))
+      continue;
+    const suggestion = nearestGpClass(c);
+    const base = `Unknown class "${c}" on ${elementNameFor(token)}.`;
+    warn3(env, line, "unknown_gp_class", suggestion ? `${base} Did you mean "${suggestion}"?` : base);
+  }
+}
 function gpPinScope(md) {
   const PIN_OUTSIDE_PAGE_MSG = "A .gp-pin element is not inside any @page or @spread, so it is pinned to the whole document instead of the page it sits on — it can print on a completely different sheet. Move it inside an @page or @spread block, or remove .gp-pin.";
-  function hasPinClass(token) {
-    const cls = token.attrGet && token.attrGet("class");
-    return typeof cls === "string" && cls.split(/\s+/).includes("gp-pin");
-  }
   md.core.ruler.push("gp_pin_scope_check", function(state) {
     let depth = 0;
     for (const token of state.tokens) {
@@ -3741,6 +4057,13 @@ function gpPinScope(md) {
           warn3(state.env, (token.map?.[0] ?? 0) + 1, "pin_outside_page", PIN_OUTSIDE_PAGE_MSG);
         }
       }
+      const line = (token.map?.[0] ?? 0) + 1;
+      checkUnknownGpClasses(token, state.env, line);
+      if (token.type === "inline" && token.children) {
+        for (const child of token.children) {
+          checkUnknownGpClasses(child, state.env, line);
+        }
+      }
     }
   });
 }
@@ -5115,7 +5438,7 @@ import { readFile as readFile14 } from "node:fs/promises";
 var check22 = {
   id: "source.markdown.layout-markers",
   name: "Layout Markers",
-  description: "Reports @page/@section/@chapter marker arguments Gutterpress could not understand",
+  description: "Reports @page/@section/@chapter marker arguments Gutterpress could not understand, plus any unknown gp-* class",
   category: "source",
   phase: "pre-build",
   async run(ctx) {
@@ -6063,185 +6386,6 @@ function canonicalChapterId(p) {
   return s;
 }
 
-// src/lib/markdown/gutterpress-css.ts
-var GUTTERPRESS_CSS = `
-/* gp-* author image/block vocabulary. One vocabulary, gp-* only — the
-   pre-vocabulary utility names (.center/.float-left/.float-right/
-   .full-width/.full-bleed) were REMOVED when gp-* shipped; books rename
-   the classes in their markdown (see the migration note). Source ORDER is
-   the contract — see the doctrine comment above. */
-
-/* flow positions */
-.gp-left {
-  float: left;
-  margin: 0 var(--gp-gap, 1em) var(--gp-gap, 1em) 0;
-  max-width: 50%;
-}
-.gp-right {
-  float: right;
-  margin: 0 0 var(--gp-gap, 1em) var(--gp-gap, 1em);
-  max-width: 50%;
-}
-.gp-center {
-  display: block;
-  float: none;
-  margin-left: auto;
-  margin-right: auto;
-  max-width: 100%;
-}
-.gp-full {
-  display: block;
-  float: none;
-  width: 100%;
-  max-width: 100%;
-}
-@page gp-full-bleed { margin-left: 0; margin-right: 0; }
-.gp-bleed {
-  display: block;
-  float: none;
-  break-before: page;
-  page: gp-full-bleed;
-  max-width: none;
-  width: 100%;
-  margin-left: 0;
-  margin-right: 0;
-}
-
-/* sizes — AFTER the flow positions so max-width:100% lifts the floats' 50%
-   cap at equal specificity */
-.gp-small { width: 25%; max-width: 100%; }
-.gp-medium { width: 50%; max-width: 100%; }
-.gp-large { width: 75%; max-width: 100%; }
-
-/* float clearance presets — consumed by var(--gp-gap) in the float rules
-   above and by .gp-shape's shape-margin below; --gp-gap itself is
-   author-settable CSS */
-.gp-tight { --gp-gap: 0.5em; }
-.gp-loose { --gp-gap: 2em; }
-
-/* column runs — plain CSS Multi-column, exposed as author vocabulary so
-   "put this in two columns" does not require borrowing a styled container
-   from the book's own component layer. That borrowing is what this exists
-   to prevent: a book whose theme paints .section chrome by default gives
-   every author who opens a section just to start a column run a panel they
-   did not ask for, and the book then needs a reset rule to take it back.
-   With a neutral primitive the author opts into columns and nothing else.
-
-   Permanent vocabulary, not a shim: Chromium implements multicol natively
-   and these rules are the standard properties verbatim, so there is no
-   spec gap here to remove later. Deliberately minimal — column-fill is
-   NOT set, because the correct value depends on whether the run fragments
-   across pages (auto packs each page's columns; the CSS initial balance is
-   right for a run that fits on one page) and only the author knows which.
-   --gp-column-gap is author-settable. */
-.gp-columns-2 { columns: 2; column-gap: var(--gp-column-gap, 1.5em); }
-.gp-columns-3 { columns: 3; column-gap: var(--gp-column-gap, 1.5em); }
-
-/* grid runs — the SLOTTED counterpart to the column runs above. Grid places
-   each child into the next cell, across then down (deterministic slots: card
-   layouts, stat blocks, image-plus-caption pairs); columns FLOW one text run
-   down then across. Same neutral-primitive rationale as .gp-columns-*, and
-   permanent vocabulary for the same reason: standard CSS Grid verbatim, no
-   spec gap to remove later. MEASURED (Chromium 151, gp-grid evidence pack):
-   grid rows fragment across sheets with EXACT print/viewer parity — 2- and
-   3-col, unequal item heights, mid-row cuts, multi-sheet overflow,
-   break-inside:avoid, gap geometry — so a grid taller than the page is safe,
-   no fit-one-page constraint. Two things to know, not fix:
-     - on a min-height page root (MARKER_CSS), default align-content
-       stretches rows apart to fill the page — identically in both engines.
-       Authors wanting packed rows set align-content: start.
-     - a @page-break / @column-break marker DIRECTLY inside a grid container
-       becomes a grid item and corrupts placement (the one measured parity
-       break); markers.js diagnoses it (break_inside_grid).
-   --gp-grid-gap is author-settable. */
-.gp-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gp-grid-gap, 1.5em); }
-.gp-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gp-grid-gap, 1.5em); }
-
-/* shape wrap — text follows the image's alpha silhouette instead of its
-   rectangular box. shape-outside only applies to floats, so this is inert
-   without .gp-left/.gp-right (and under .gp-pin, which un-floats). The
-   shape URL cannot be written in CSS (url() contexts can't read attr()),
-   so the image renderer rule (images.ts) mirrors the src into an inline
-   --gp-shape:url(...) custom property whenever it sees this class --
-   authors only ever type the class. threshold 0.2 ignores near-transparent
-   anti-aliasing halos; shape-margin shares the float-gap vocabulary. */
-img.gp-shape {
-  shape-outside: var(--gp-shape);
-  shape-image-threshold: 0.2;
-  shape-margin: var(--gp-gap, 1em);
-}
-
-/* pin — within the nearest positioned ancestor (.page/.spread, rule above).
-   inset:0 and the explicit centers are load-bearing; see doctrine comment. */
-.gp-pin {
-  position: absolute;
-  inset: 0;
-  align-self: center;
-  justify-self: center;
-  margin: 0;
-  max-width: 100%;
-}
-
-/* pin edge modifiers — AFTER .gp-pin to beat its center defaults;
-   justify-self is inert on in-flow floats, so gp-left/gp-right safely do
-   double duty as flow float + pin edge */
-.gp-top { align-self: start; }
-.gp-bottom { align-self: end; }
-.gp-left { justify-self: start; }
-.gp-right { justify-self: end; }
-
-/* wrapper-margin neutralization (same pattern and rationale as the
-   .gp-bleed paragraph-margin note in the doctrine comment; for pin, the
-   emptied paragraph would otherwise leave a phantom margin gap in flow) */
-:where(p:has(> img.gp-bleed:only-child)) { margin: 0; }
-:where(p:has(> img.gp-pin:only-child)) { margin: 0; }
-
-/* depth — a named ladder for z-index, so books stop hand-tuning bare
-   integers. A real book measured 21 z-index declarations using only four
-   distinct values (-1, 0, 1, 2), each written literally at its use site.
-   The custom properties are the author-settable surface (a book needing a
-   deeper stack raises them once); the classes are the shorthand.
-
-   NOT named "layer": CSS Paged Media 3 §3.1 already defines "page layers"
-   (page background, canvas, borders, contents, margin boxes) and those are
-   parts of the PAGE BOX, not a z-ladder for content. Reusing the word for a
-   different concept would collide with the spec vocabulary this project
-   tracks. The pin EDGE modifiers already own .gp-top/.gp-bottom, so the
-   ladder avoids those words too.
-
-   .gp-behind is the one that earns its place: it puts a pinned image UNDER
-   the page's text, which is otherwise impossible to express without a bare
-   negative z-index. "Above" needs no class — an out-of-flow pin already
-   paints above in-flow content.
-
-   Two things silently defeat .gp-behind, neither visible at the use site:
-     - a stacking context on the .page/.spread ancestor (z-index, isolation,
-       opacity, filter, transform on it traps the negative layer inside).
-       Core keeps .page/.spread at 'position: relative; z-index: auto'
-       precisely so they are not stacking contexts.
-     - a clipping ancestor (overflow other than visible) — but only where
-       the art actually overhangs that ancestor's clip box on a clipped
-       axis: the overhang is cut off, the same mechanism that clips a
-       .gp-bleed plate back to the wrapper's width. Clipping never reorders
-       layers — within-bounds art under a clipping .page prints whole and
-       still behind (measured; see the build audit's comment in
-       engine/compiler/build.ts), and a static wrapper's overflow never
-       binds an abspos .gp-pin at all.
-   The build-time engine.layer.trapped audit reports both against the live
-   ancestor chain. printsafe/page-containment is only an early source hint for
-   declarations written directly on .page/.spread. */
-:root {
-  --gp-z-behind: -1;
-  --gp-z-base: 0;
-  --gp-z-raised: 1;
-  --gp-z-front: 2;
-}
-.gp-behind { z-index: var(--gp-z-behind); }
-.gp-base   { z-index: var(--gp-z-base); }
-.gp-raised { z-index: var(--gp-z-raised); }
-.gp-front  { z-index: var(--gp-z-front); }
-`;
-
 // src/lib/markdown/assemble.ts
 async function assembleBookHtml(opts) {
   const title = opts.title ?? "Document";
@@ -6289,10 +6433,15 @@ ${rendered}
     opts.onImageRefs([...imageRefs]);
   }
   const inlineCss = [
+    "@layer gp.marker, gp.vocab;",
     `/* gutterpress markers */
-${MARKER_CSS.trim()}`,
+@layer gp.marker {
+${MARKER_CSS.trim()}
+}`,
     `/* gutterpress */
-${GUTTERPRESS_CSS.trim()}`,
+@layer gp.vocab {
+${GUTTERPRESS_CSS.trim()}
+}`,
     pluginCss ? `/* user plugin css */
 ${pluginCss.trim()}` : null,
     projectCss ? `/* project css */
@@ -7537,7 +7686,7 @@ class PdfOutput {
       const rawPdf = pdfxMode ? path8.join(stage, "raw.pdf") : path8.resolve(pdfFile);
       await fsp2.mkdir(path8.dirname(path8.resolve(pdfFile)), { recursive: true });
       log.info("Rendering HTML to PDF via the Gutterpress engine (native Chromium pagination)");
-      const { buildNativePdf } = await import("./engine-fwe8djyn.js");
+      const { buildNativePdf } = await import("./engine-bhhcne06.js");
       const engineDiagnostics = await buildNativePdf(htmlFile, rawPdf, {
         title: config.title,
         author: config.authors.length > 0 ? config.authors.join(", ") : undefined,