@omniharmonic/openspace-cli 0.1.14 → 0.1.16

package/dist/{chunk-TDLUJHWB.js → chunk-JDVCOOGD.js}

@@ -22,14 +22,16 @@ import {
   platformLabel,
   sectionsFrom,
   sectionsFromLayoutHtml,
+  signupAsksName,
   sitePath,
   socialNetwork,
   stripSuffix,
   stripTags,
+  subscribersAdvice,
   text,
   themeFromCss,
   videoUrl
-} from "./chunk-N7WFQYFE.js";
+} from "./chunk-YAPLQ4OA.js";
 import {
   BREAKPOINT_INFO,
   BUTTON_STYLES,
@@ -130,6 +132,8 @@ import {
   parseColor,
   parseComponentPreviewPath,
   parseCss,
+  phoneColumns,
+  phonePadding,
   plainText,
   presetCatalog,
   presetSampleStrings,
@@ -147,7 +151,7 @@ import {
   toHex,
   toJsonSchema,
   toMarkdown
-} from "./chunk-SY5NDWS2.js";
+} from "./chunk-GMKHKHUR.js";
 import {
   __commonJS,
   __export,
@@ -7788,10 +7792,10 @@ function withPages(doc, pages) {
 // ../schema/src/secrets.ts
 function shannonEntropy(value) {
   if (!value) return 0;
-  const counts = /* @__PURE__ */ new Map();
-  for (const c of value) counts.set(c, (counts.get(c) ?? 0) + 1);
+  const counts2 = /* @__PURE__ */ new Map();
+  for (const c of value) counts2.set(c, (counts2.get(c) ?? 0) + 1);
   let h = 0;
-  for (const n of counts.values()) {
+  for (const n of counts2.values()) {
     const p = n / value.length;
     h -= p * Math.log2(p);
   }
@@ -12600,7 +12604,15 @@ function autoMobileLayout(section, options = {}) {
     }
   };
   for (const pl of [...placed]) placeLayered(pl.id);
-  for (const { id, rect: d } of readingOrder(pending.filter((it) => !hostOf.has(it.id)))) {
+  let stacking = readingOrder(pending.filter((it) => !hostOf.has(it.id)));
+  if (options.textFirst) {
+    const isText2 = (id) => {
+      const b = blocks2.get(id);
+      return !!b && isTextBlock(b);
+    };
+    stacking = [...stacking.filter((i) => isText2(i.id)), ...stacking.filter((i) => !isText2(i.id))];
+  }
+  for (const { id, rect: d } of stacking) {
     if (placedById.has(id)) continue;
     const block4 = blocks2.get(id);
     const m = { x: 1, y: cursor, w: cols, h: mobileHeight(block4, d, width) };
@@ -12641,6 +12653,690 @@ function autoMobileLayoutOps(doc, page, sectionId, options = {}) {
   return ops;
 }
 
+// ../lint/src/phone.ts
+var PHONE = 360;
+var GLYPH = 0.48;
+var GLYPH_CAPS = 0.62;
+function* sectionsOf2(doc, pageId) {
+  const pages = pageId ? [doc.pages[pageId]].filter((p) => !!p) : Object.values(doc.pages);
+  for (const p of pages)
+    for (const s2 of p.sections) if (!s2.hidden) yield { page: p.id, section: s2 };
+  yield { page: FOOTER, section: doc.site.footer };
+}
+function phonePx(value) {
+  if (!value) return void 0;
+  const v = value.trim();
+  const m = /^clamp\(\s*([\d.]+)(rem|px)/.exec(v) ?? /^([\d.]+)(rem|px)$/.exec(v);
+  if (!m) return void 0;
+  return Number(m[1]) * (m[2] === "rem" ? 16 : 1);
+}
+var words2 = (s2) => s2.match(/[\p{L}\p{N}]{2,}/gu)?.length ?? 0;
+var PhoneCtx = class {
+  constructor(doc, options) {
+    this.doc = doc;
+    this.options = options;
+    this.meta = opMeta(options);
+    this.root = compileStyles(doc.styles).tokens.vars.root;
+    const density = doc.styles.choices.density;
+    this.space = SPACE_SCALES[density ?? "comfortable"] ?? SPACE_SCALES.comfortable;
+    this.gutter = phonePx(this.root["--os-section-gutter"]) ?? 24;
+  }
+  doc;
+  options;
+  issues = [];
+  meta;
+  root;
+  space;
+  gutter;
+  add(i) {
+    this.issues.push(issue(i));
+  }
+  section({ page, section }) {
+    if (section.layout.mode === "stack") this.columns(page, section);
+    else this.grid(page, section, section.layout);
+    this.padding(page, section);
+    this.tallPhoto(page, section);
+    for (const b of section.blocks) if (!b.hidden) this.headingWords(page, section, b);
+  }
+  /** Text columns kept side by side on phones (an explicit phone column setting). */
+  columns(page, section) {
+    const layout = section.layout;
+    if (layout.mode !== "stack") return;
+    const cols = phoneColumns(layout.columns);
+    if (cols.length < 2) return;
+    const content3 = PHONE - 2 * this.gutter;
+    const squeezed = cols.some((span, i) => {
+      const longest = section.blocks.filter((b) => !b.hidden && (b.column ?? 0) === i && isTextBlock(b)).reduce((n, b) => Math.max(n, words2(blockText(b))), 0);
+      return longest >= 25 && span / STACK_UNITS * content3 < 170;
+    });
+    if (!squeezed) return;
+    this.add({
+      rule: "phone-columns",
+      severity: "warning",
+      page,
+      section: section.id,
+      message: `On phones this section keeps ${cols.length} columns side by side, so its text is squeezed into a narrow strip.`,
+      fix: "Stack the columns on phones (one under the other).",
+      autofix: {
+        label: "Stack the columns on phones",
+        ops: [
+          {
+            op: "section.update",
+            ...this.meta(),
+            page,
+            section: section.id,
+            set: { "layout.columns.m": [STACK_UNITS] }
+          }
+        ]
+      }
+    });
+  }
+  /** Grid sections: missing or partial phone layouts, text squeezed into narrow phone columns. */
+  grid(page, section, layout) {
+    const items = Object.entries(layout.items);
+    if (!items.length) return;
+    const placed = items.filter(([, i]) => i.m).length;
+    const blocks2 = new Map(section.blocks.map((b) => [b.id, b]));
+    const fill = () => autoMobileLayoutOps(this.doc, page, section.id, this.options);
+    if (placed > 0 && placed < items.length) {
+      this.add({
+        rule: "phone-layout-missing",
+        severity: "warning",
+        page,
+        section: section.id,
+        message: `${items.length - placed === 1 ? "A block was" : `${items.length - placed} blocks were`} added on desktop but not placed for phones, so on a phone ${items.length - placed === 1 ? "it shows" : "they show"} at the bottom of the section.`,
+        fix: "Place the new blocks in reading order on phones (your other phone placements stay).",
+        autofix: { label: "Place them for phones", ops: fill() }
+      });
+    } else if (placed === 0 && items.length > 1) {
+      const fallback2 = fallbackMobileRects(layout);
+      const stacked = Object.entries(fallback2).sort(([, a], [, b]) => a.y - b.y).map(([id]) => id);
+      const reading = readingOrder(items.map(([id, i]) => ({ id, rect: i.d }))).map((i) => i.id);
+      if (stacked.join() !== reading.join())
+        this.add({
+          rule: "phone-layout-order",
+          severity: "warning",
+          page,
+          section: section.id,
+          message: "On phones this section's blocks would stack in a confusing order (by where each one starts, not how the section reads).",
+          fix: "Lay the section out for phones in reading order.",
+          autofix: { label: "Lay it out for phones", ops: fill() }
+        });
+    }
+    for (const [id, item2] of items) {
+      const b = blocks2.get(id);
+      if (!item2.m || !b || b.hidden || !isTextBlock(b)) continue;
+      const n = words2(blockText(b));
+      const width = item2.m.w / 8 * (PHONE - 2 * this.gutter);
+      if (n < 8 || width >= 150 || width >= 120 && n < 25) continue;
+      const restack = autoMobileLayout(section, { reset: true });
+      this.add({
+        rule: "phone-narrow-text",
+        severity: "warning",
+        page,
+        section: section.id,
+        block: id,
+        message: `On phones this ${b.type} block is only about ${Math.round(width)}px wide, so its text is squeezed into a narrow strip.`,
+        fix: "Re-stack the section for phones so every block is full width.",
+        ...restack ? {
+          autofix: { label: "Re-stack for phones", ops: this.placeOps(page, section, restack) }
+        } : {}
+      });
+    }
+  }
+  placeOps(page, section, items) {
+    return Object.entries(items).flatMap(
+      ([block4, item2]) => item2.m ? [
+        {
+          op: "grid.place",
+          ...this.meta(),
+          page,
+          section: section.id,
+          block: block4,
+          bp: "m",
+          rect: item2.m
+        }
+      ] : []
+    );
+  }
+  /** A phone padding so large the screen is mostly empty space. */
+  padding(page, section) {
+    const pad3 = section.style.padding;
+    if (!pad3) return;
+    const token = phonePadding(pad3);
+    const px3 = this.space[token] ?? 0;
+    if (px3 <= 100) return;
+    this.add({
+      rule: "phone-padding",
+      severity: "warning",
+      page,
+      section: section.id,
+      message: `On phones this section has ${px3}px of empty space above and below it, which pushes its content off the screen.`,
+      fix: "Use less padding on phones (your desktop spacing stays).",
+      autofix: {
+        label: "Tighten the spacing on phones",
+        ops: [
+          {
+            op: "section.update",
+            ...this.meta(),
+            page,
+            section: section.id,
+            set: { "style.padding.m": "lg" }
+          }
+        ]
+      }
+    });
+  }
+  /** A photo section taller than most of a phone screen (the words and button get pushed down). */
+  tallPhoto(page, section) {
+    const bg = section.style.background;
+    const mh = section.style.minHeight;
+    if (!mh || !bg || bg.type !== "image" && bg.type !== "video") return;
+    const m = mh.m ?? mh.t ?? mh.d;
+    const vh = /^(\d+)(?:vh|svh|dvh|lvh)$/.exec(m);
+    const px3 = /^(\d+)px$/.exec(m);
+    if (!(vh && Number(vh[1]) > 75) && !(px3 && Number(px3[1]) > 640)) return;
+    this.add({
+      rule: "phone-tall-photo",
+      severity: "warning",
+      page,
+      section: section.id,
+      message: `On phones this photo section is at least ${m} tall, so the photo fills most of the screen and pushes everything else down.`,
+      fix: "Make it a little shorter on phones (70% of the screen); desktop keeps its height.",
+      autofix: {
+        label: "Shorten it on phones",
+        ops: [
+          {
+            op: "section.update",
+            ...this.meta(),
+            page,
+            section: section.id,
+            set: { "style.minHeight.m": "70svh" }
+          }
+        ]
+      }
+    });
+  }
+  /** Heading words that can't fit on one phone line at the heading's phone size. */
+  headingWords(page, section, b) {
+    if (b.type !== "heading") return;
+    const fields = b.fields;
+    const size2 = fields.phoneSize && fields.phoneSize !== "auto" ? fields.phoneSize : b.style?.typography?.heading ?? (fields.size && fields.size !== "auto" ? fields.size : fields.level ?? "h2");
+    const px3 = this.typePx(size2);
+    if (!px3) return;
+    const width = PHONE - 2 * this.gutter - this.blockPad(b);
+    const caps = this.root[`--os-type-${size2}-text-transform`] === "uppercase";
+    const longest = (fields.text ?? "").split(/[\s\-‐–—/]+/).reduce((a, w) => w.length > a.length ? w : a, "");
+    const est = longest.length * px3 * (caps || longest === longest.toUpperCase() ? GLYPH_CAPS : GLYPH);
+    if (est <= width * 1.1) return;
+    const smaller = this.fittingSize(longest, width, caps);
+    this.add({
+      rule: "phone-long-word",
+      severity: "warning",
+      page,
+      section: section.id,
+      block: b.id,
+      message: `\u201C${longest}\u201D is too long to fit on one line of a phone at this heading size, so it would break in the middle of the word.`,
+      fix: smaller ? "Use a smaller heading size on phones (desktop keeps its size), or a shorter word." : "Use a shorter word or phrase.",
+      ...smaller ? {
+        autofix: {
+          label: "Use a smaller size on phones",
+          ops: [
+            {
+              op: "block.update",
+              ...this.meta(),
+              page,
+              block: b.id,
+              set: { phoneSize: smaller }
+            }
+          ]
+        }
+      } : {}
+    });
+  }
+  typePx(preset) {
+    const px3 = phonePx(this.root[`--os-type-${preset}-font-size`]);
+    if (!px3) return void 0;
+    const content3 = PHONE - 2 * this.gutter;
+    if (preset === "display") return Math.min(px3, 0.16 * content3);
+    if (preset === "h1") return Math.min(px3, 0.12 * content3);
+    return px3;
+  }
+  blockPad(b) {
+    const pad3 = b.style?.padding;
+    const token = pad3 ? pad3.m ?? pad3.t ?? pad3.d : b.style?.colorTheme ? "md" : void 0;
+    return token ? 2 * (this.space[token] ?? 0) : 0;
+  }
+  fittingSize(word, width, caps) {
+    for (const s2 of ["h1", "h2", "h3", "h4"]) {
+      const px3 = this.typePx(s2);
+      if (px3 && word.length * px3 * (caps ? GLYPH_CAPS : GLYPH) <= width) return s2;
+    }
+    return void 0;
+  }
+  /** A header logo that leaves no room for the menu button on phones. */
+  header() {
+    const h = this.doc.site.header.logoHeight;
+    if (!h) return;
+    const m = h.m ?? h.t ?? h.d;
+    if (m <= 64) return;
+    this.add({
+      rule: "phone-logo",
+      severity: "warning",
+      message: `The logo is ${m}px tall on phones, which makes the header take up a big part of a phone screen.`,
+      fix: "Use a smaller logo on phones (around 40px; desktop keeps its size).",
+      autofix: {
+        label: "Use a 40px logo on phones",
+        ops: [{ op: "site.update", ...this.meta(), set: { "header.logoHeight.m": 40 } }]
+      }
+    });
+  }
+  /** Custom CSS or components that fix something wider than a phone. */
+  css() {
+    const sources = [];
+    if (this.doc.site.customCss)
+      sources.push({ css: this.doc.site.customCss, where: "Your custom CSS" });
+    for (const [name, c] of Object.entries(this.doc.components ?? {}))
+      if (c.css) sources.push({ css: c.css, where: `The \u201C${name}\u201D component`, component: name });
+    for (const s2 of sources) {
+      const wide = wideRules(s2.css);
+      if (!wide.length) continue;
+      this.add({
+        rule: "phone-fixed-width",
+        severity: "warning",
+        key: s2.component ?? "custom-css",
+        message: `${s2.where} sets a fixed width (${wide.slice(0, 2).join(", ")}) that is wider than a phone screen, so the page may scroll sideways or be cut off on phones.`,
+        fix: "Use max-width (or a percentage) instead of a fixed width, or add a phone rule (@media (max-width: 767px))."
+      });
+    }
+  }
+};
+function wideRules(css) {
+  let plain3 = css;
+  for (let guard = 0; guard < 50; guard++) {
+    const m = /@media[^{]*min-width\s*:\s*(\d+)/i.exec(plain3);
+    if (!m || Number(m[1]) < 400) break;
+    const start = plain3.indexOf("{", m.index);
+    let depth = 0;
+    let end = start;
+    for (; end < plain3.length; end++) {
+      if (plain3[end] === "{") depth++;
+      else if (plain3[end] === "}" && --depth === 0) break;
+    }
+    plain3 = plain3.slice(0, m.index) + plain3.slice(end + 1);
+  }
+  const out = [];
+  for (const m of plain3.matchAll(/(?:^|[;{\s])((?:min-)?width)\s*:\s*([\d.]+)(px|rem|em)\b/gi)) {
+    const px3 = Number(m[2]) * (m[3]?.toLowerCase() === "px" ? 1 : 16);
+    if (px3 > 340) out.push(`${m[1]}: ${m[2]}${m[3]}`);
+  }
+  return out;
+}
+function phoneCheck(doc, pageId, options = {}) {
+  const ctx = new PhoneCtx(doc, options);
+  for (const w of sectionsOf2(doc, pageId)) ctx.section(w);
+  ctx.header();
+  ctx.css();
+  return sortIssues(ctx.issues);
+}
+var SEVERITY = {
+  "page-overflow": "error",
+  "cut-off": "error",
+  overlap: "error",
+  "photo-contrast": "error",
+  "low-contrast": "error",
+  "broken-word": "warning",
+  "big-heading": "warning",
+  "small-text": "warning",
+  "tiny-text": "warning",
+  "narrow-text": "warning",
+  "tap-target": "warning",
+  "edge-text": "warning",
+  "header-crowded": "warning",
+  "loose-padding": "warning",
+  "tall-image": "info",
+  "heavy-crop": "info",
+  "long-footer": "info",
+  "cta-below-fold": "warning"
+};
+var MESSAGE = {
+  "page-overflow": (_f, w) => [
+    `On phones the page is wider than the screen, so it scrolls sideways${w}.`,
+    "Something has a fixed width wider than a phone. Re-stack the section for phones or make the element narrower."
+  ],
+  "cut-off": (_f, w) => [
+    `On phones something${w} is cut off at the edge of the screen.`,
+    "Re-stack the section for phones, or make the element narrower."
+  ],
+  overlap: (_f, w) => [
+    `On phones two pieces of text${w} are drawn on top of each other, so neither can be read.`,
+    "Re-stack the section for phones so the blocks sit one under the other."
+  ],
+  "photo-contrast": (f, w) => [
+    `On phones the text \u201C${f.text ?? ""}\u201D${w} sits on a photo where it can drop to ${f.value}:1 contrast (it needs ${f.limit}:1), so it is hard to read on bright or dark parts of the photo.`,
+    "Darken (or lighten) the photo overlay, or put the text on a solid panel."
+  ],
+  "low-contrast": (f, w) => [
+    `On phones the text \u201C${f.text ?? ""}\u201D${w} has only ${f.value}:1 contrast with its background (it needs ${f.limit}:1).`,
+    "Use a color theme instead of a custom color, or a darker/lighter text color."
+  ],
+  "broken-word": (f, w) => [
+    `On phones a word in the heading \u201C${f.text ?? ""}\u201D${w} doesn't fit on one line and breaks in the middle.`,
+    "Use a smaller heading size on phones, or a shorter word."
+  ],
+  "big-heading": (f, w) => [
+    `On phones the heading \u201C${f.text ?? ""}\u201D${w} is so large it fills most of the screen.`,
+    "Use a smaller heading size on phones, or a shorter heading."
+  ],
+  "small-text": (f, w) => [
+    `On phones the text${w} is ${f.value}px \u2014 too small to read comfortably (${f.limit === 14 ? "14px is the minimum for small print" : "16px is the minimum for reading text"}).`,
+    f.limit === 14 ? "Use the body text style for it, or shorten it to a note." : "Use the body text style for paragraphs instead of the small style."
+  ],
+  "tiny-text": (f, w) => [
+    `On phones the label \u201C${f.text ?? ""}\u201D${w} is only ${f.value}px tall, too small to read.`,
+    "Make it at least 12px."
+  ],
+  "narrow-text": (_f, w) => [
+    `On phones the text${w} is squeezed into a very narrow column.`,
+    "Stack the columns on phones so the text is full width."
+  ],
+  "tap-target": (f, w) => [
+    `On phones the link or button \u201C${f.text ?? ""}\u201D${w} is small and close to another one, so it's easy to tap the wrong one.`,
+    "Make it a button, or put more space around it."
+  ],
+  "edge-text": (_f, w) => [
+    `On phones the text${w} touches the edge of the screen.`,
+    "Keep text inside the page margins (don't let text blocks bleed to the edge)."
+  ],
+  "header-crowded": () => [
+    "On phones the header is crowded: its logo, title and buttons overlap or wrap.",
+    "Use a smaller logo on phones or a shorter site title."
+  ],
+  "loose-padding": (f, w) => [
+    `On phones there is ${f.value}px of empty space above or below${w || " a section"}.`,
+    "Use less padding on phones."
+  ],
+  "tall-image": (_f, w) => [
+    `On phones an image${w} is taller than the whole screen.`,
+    "Crop it to a landscape or square shape, or set a focus point."
+  ],
+  "heavy-crop": (_f, w) => [
+    `On phones most of a photo${w} is cropped away.`,
+    "Set the photo's focus point so the important part stays in view on phones."
+  ],
+  "cta-below-fold": (f) => [
+    `On phones the main button (\u201C${f.text ?? ""}\u201D) is about ${Math.round(f.value ?? 0)}px down the page, below the first screen \u2014 visitors have to scroll before they see what to do.`,
+    "Put the words and button first on phones (photos after them), or use a shorter headline."
+  ],
+  "long-footer": () => [
+    "On phones the footer is several screens long.",
+    "Keep the footer to the essentials (a few links, contact details, social icons)."
+  ]
+};
+function locate(doc, pageId, f) {
+  const lookup = (id) => {
+    if (!id) return void 0;
+    const pages = [pageId, FOOTER];
+    for (const p of pages) {
+      const hit = findSection(doc, p, id);
+      if (hit) return { page: p, section: hit.section };
+    }
+    return void 0;
+  };
+  const sec = lookup(f.section);
+  if (sec) {
+    const block4 = f.block ? sec.section.blocks.find((b) => b.id === f.block) : void 0;
+    return { page: sec.page, section: sec.section, ...block4 ? { block: block4 } : {} };
+  }
+  if (f.area === "footer") return { page: FOOTER, section: doc.site.footer };
+  return { page: pageId };
+}
+function fixFor(at, f, meta) {
+  const { section, block: block4, page } = at;
+  if (!section) return void 0;
+  const restack = (label) => {
+    if (section.layout.mode === "grid") {
+      const items = autoMobileLayout(section, { reset: true });
+      if (!items) return void 0;
+      const ops = Object.entries(items).flatMap(
+        ([b, item2]) => item2.m ? [
+          {
+            op: "grid.place",
+            ...meta(),
+            page,
+            section: section.id,
+            block: b,
+            bp: "m",
+            rect: item2.m
+          }
+        ] : []
+      );
+      return ops.length ? { label, ops } : void 0;
+    }
+    if (phoneColumns(section.layout.columns).length > 1)
+      return {
+        label: "Stack the columns on phones",
+        ops: [
+          {
+            op: "section.update",
+            ...meta(),
+            page,
+            section: section.id,
+            set: { "layout.columns.m": [STACK_UNITS] }
+          }
+        ]
+      };
+    return void 0;
+  };
+  switch (f.kind) {
+    case "overlap":
+    case "cut-off":
+    case "page-overflow":
+    case "narrow-text":
+    case "edge-text":
+      return f.component ? void 0 : restack("Re-stack for phones");
+    case "photo-contrast": {
+      const bg = section.style.background;
+      if (bg && (bg.type === "image" || bg.type === "video")) {
+        const now = bg.overlay?.opacity ?? 0;
+        if (now >= 0.85) break;
+        const target = Math.min(0.85, Math.ceil((now + 0.15) * 20) / 20);
+        return {
+          label: `Raise the photo overlay to ${Math.round(target * 100)}%`,
+          ops: [
+            {
+              op: "section.update",
+              ...meta(),
+              page,
+              section: section.id,
+              set: {
+                "style.background.overlay": {
+                  color: bg.overlay?.color ?? "background",
+                  opacity: target
+                }
+              }
+            }
+          ]
+        };
+      }
+      if (block4 && isTextBlock(block4) && !block4.style?.colorTheme)
+        return {
+          label: "Put the text on a panel",
+          ops: [
+            {
+              op: "block.update",
+              ...meta(),
+              page,
+              block: block4.id,
+              style: {
+                ...block4.style ?? {},
+                colorTheme: section.style.colorTheme ?? "light",
+                padding: block4.style?.padding ?? { d: "lg", m: "md" }
+              }
+            }
+          ]
+        };
+      return void 0;
+    }
+    case "broken-word":
+    case "big-heading": {
+      if (block4?.type !== "heading") return void 0;
+      const fields = block4.fields;
+      const order = ["display", "h1", "h2", "h3", "h4"];
+      const current2 = fields.phoneSize && fields.phoneSize !== "auto" ? fields.phoneSize : fields.size && fields.size !== "auto" ? fields.size : fields.level ?? "h2";
+      const next = order[order.indexOf(current2) + 1];
+      if (!next) return void 0;
+      return {
+        label: "Use a smaller size on phones",
+        ops: [
+          {
+            op: "block.update",
+            ...meta(),
+            page,
+            block: block4.id,
+            set: { phoneSize: next }
+          }
+        ]
+      };
+    }
+    case "cta-below-fold": {
+      if (section.layout.mode === "grid") {
+        const items = autoMobileLayout(section, { reset: true, textFirst: true });
+        if (!items) return void 0;
+        return {
+          label: "Put the words first on phones",
+          ops: Object.entries(items).flatMap(
+            ([b, item2]) => item2.m ? [
+              {
+                op: "grid.place",
+                ...meta(),
+                page,
+                section: section.id,
+                block: b,
+                bp: "m",
+                rect: item2.m
+              }
+            ] : []
+          )
+        };
+      }
+      const col = section.blocks.find((b) => b.type === "button")?.column ?? 0;
+      const count2 = section.layout.columns.d.length;
+      if (count2 < 2 || col === 0) return void 0;
+      const order = [col, ...Array.from({ length: count2 }, (_, i) => i).filter((i) => i !== col)];
+      return {
+        label: "Put the words first on phones",
+        ops: [
+          {
+            op: "section.update",
+            ...meta(),
+            page,
+            section: section.id,
+            set: { "layout.order.m": order }
+          }
+        ]
+      };
+    }
+    case "loose-padding":
+      return {
+        label: "Tighten the spacing on phones",
+        ops: [
+          {
+            op: "section.update",
+            ...meta(),
+            page,
+            section: section.id,
+            set: { "style.padding.m": "lg" }
+          }
+        ]
+      };
+    default:
+      return void 0;
+  }
+  return void 0;
+}
+function phoneIssuesFromProbe(doc, pageId, results, options = {}) {
+  const meta = opMeta(options);
+  const out = /* @__PURE__ */ new Map();
+  const sorted = [...results].sort((a, b) => a.width - b.width);
+  for (const r of sorted)
+    for (const f of r.findings) {
+      const at = locate(doc, pageId, f);
+      if (f.kind === "cta-below-fold" && at.section?.preset && !at.section.preset.startsWith("hero/"))
+        continue;
+      const sectionName = at.section && at.page !== FOOTER ? " in this section" : at.page === FOOTER ? " in the footer" : "";
+      const where2 = f.component ? ` in the \u201C${f.component}\u201D component` : sectionName;
+      const [message, fix] = MESSAGE[f.kind](f, where2);
+      const key2 = `${f.kind}:${at.block?.id ?? f.block ?? ""}:${f.kind === "tap-target" || f.kind === "photo-contrast" ? f.text ?? "" : ""}`;
+      const i = issue({
+        rule: `phone-${f.kind}`,
+        severity: SEVERITY[f.kind],
+        page: at.page,
+        ...at.section ? { section: at.section.id } : {},
+        ...at.block ? { block: at.block.id } : {},
+        key: `${r.width}`,
+        message,
+        fix
+      });
+      const id = `${i.rule}:${i.page}:${i.section ?? ""}:${key2}`;
+      if (out.has(id)) continue;
+      const autofix = fixFor(at, f, meta);
+      out.set(id, { ...i, id: id.replace(/:+$/, ""), ...autofix ? { autofix } : {} });
+    }
+  return sortIssues([...out.values()]);
+}
+function fixForPhones(doc, opts = {}) {
+  let registry3;
+  const getRegistry = () => {
+    registry3 ??= blocksRegistry();
+    return registry3;
+  };
+  const apply2 = opts.validateOp ?? ((d, op2) => {
+    const r = validate(d, op2, { trusted: true, registry: getRegistry() });
+    return r.ok ? r.doc : null;
+  });
+  let cur = doc;
+  const ops = [];
+  const fixed = [];
+  const tried = /* @__PURE__ */ new Set();
+  const run2 = (i) => {
+    if (!i.autofix || tried.has(i.id)) return;
+    tried.add(i.id);
+    let work = cur;
+    for (const op2 of i.autofix.ops) {
+      const next = apply2(work, op2);
+      if (!next) return;
+      work = next;
+    }
+    cur = work;
+    ops.push(...i.autofix.ops);
+    fixed.push({ id: i.id, label: i.autofix.label });
+  };
+  for (let guard = 0; guard < 200; guard++) {
+    const next = phoneCheck(cur, opts.pageId, opts).find((i) => i.autofix && !tried.has(i.id));
+    if (!next) break;
+    run2(next);
+  }
+  const restacked = /* @__PURE__ */ new Set();
+  for (const i of opts.rendered ?? []) {
+    if (!i.autofix) continue;
+    const key2 = `${i.section}:${i.autofix.label}`;
+    if (restacked.has(key2)) {
+      tried.add(i.id);
+      fixed.push({ id: i.id, label: i.autofix.label });
+      continue;
+    }
+    const before = fixed.length;
+    run2(i);
+    if (fixed.length > before) restacked.add(key2);
+  }
+  const remaining = [
+    ...phoneCheck(cur, opts.pageId, opts),
+    ...(opts.rendered ?? []).filter((i) => !tried.has(i.id))
+  ];
+  return { ops, fixed, doc: cur, remaining };
+}
+
 // ../lint/src/photo-contrast.ts
 var SOLID_PRIMARY = /* @__PURE__ */ new Set(["solid", "pill-solid"]);
 function richChecks(doc, out) {
@@ -12679,6 +13375,11 @@ function photoTextChecks(block4, buttons) {
       if (f.note) out.push({ role: "text-muted", label: "Button note", min: 4.5 });
       break;
     }
+    case "quote":
+    case "countdown":
+      out.push({ role: "text", label: "Text", min: 4.5 });
+      out.push({ role: "text-muted", label: "Secondary text", min: 4.5 });
+      break;
     default:
       out.push({ role: "text", label: "Text", min: 4.5 });
   }
@@ -12732,6 +13433,7 @@ function designCheck(doc, pageId, options = {}) {
   ctx.container(FOOTER, [doc.site.footer], { footer: true });
   ctx.issues.push(...linkIssues(doc, pageId, options, ctx.meta));
   ctx.issues.push(...componentIssues(doc, pageId));
+  ctx.issues.push(...phoneCheck(doc, pageId, options));
   for (const w of hostingWarnings(doc, pageId))
     ctx.issues.push(
       issue({
@@ -13407,9 +14109,25 @@ var Ctx = class {
       return this.tokens.palette[m[1]][Number(m[2])];
     return /^(?:#|oklch|oklab|rgb|hsl|lab|lch)/.test(value) ? value : void 0;
   }
+  /**
+   * A custom component (an imported or uploaded design) whose template draws a button from a
+   * filled link field: that's a call to action too (wave 4: "no clear call to action" on a hero
+   * with two buttons).
+   */
+  componentHasButton(b) {
+    if (!b.type.startsWith("component/")) return false;
+    const def = this.doc.components?.[b.type.slice("component/".length)];
+    if (!def || !/\{\{\s*(?:button|#link)\s/.test(def.template)) return false;
+    const fields = b.fields;
+    return Object.entries(def.fields).some(
+      ([k, f]) => f.kind === "link" && fields[k] !== void 0 && fields[k] !== null
+    );
+  }
   cta(page, sections) {
     if (sections.length === 0) return;
-    const has3 = sections.some((s2) => s2.blocks.some((b) => ACTION_BLOCKS.has(b.type)));
+    const has3 = sections.some(
+      (s2) => s2.blocks.some((b) => ACTION_BLOCKS.has(b.type) || this.componentHasButton(b))
+    );
     const navButton = this.doc.site.nav.some((n) => n.type === "button" && !n.hidden);
     if (has3 || navButton) return;
     this.add({
@@ -13483,6 +14201,457 @@ function plain(node2) {
   return parts.join("");
 }
 
+// ../lint/src/phone-probe.ts
+var PHONE_LIMITS = {
+  /** Apple HIG / Material: 44 CSS px square. */
+  tapTarget: 44,
+  /** Nothing smaller than this, however isolated. */
+  tapTargetMin: 16,
+  /** Reading text (paragraphs, lists, quotes). */
+  bodyText: 16,
+  /** Any text (labels, eyebrows, captions). */
+  anyText: 12,
+  /** Text never closer than this to the screen edge. */
+  edge: 12,
+  /** Heading font size as a share of the viewport width. */
+  headingShare: 0.16,
+  /** Heading block height as a share of the viewport height. */
+  headingScreen: 0.6,
+  /** Images taller than this share of the viewport height. */
+  imageScreen: 1.05,
+  /** Section padding (each side) above which a phone shows "a lot of empty space". */
+  loosePadding: 128,
+  /** Text columns narrower than this (px) with more than a few words. */
+  narrowColumn: 130,
+  /** Visible share of a photo below which it counts as heavily cropped. */
+  crop: 0.34
+};
+var PHONE_WIDTHS = [360, 390];
+var PHONE_HEIGHT = 780;
+var PHONE_PROBE_SCRIPT = `(async () => {
+  const L = ${JSON.stringify(PHONE_LIMITS)};
+  const vw = document.documentElement.clientWidth || window.innerWidth;
+  // The phone screen's height (an editor canvas may be as tall as the page: it says so here).
+  const vh = Number(window.__osPhoneScreenHeight) || window.innerHeight;
+  const viewH = window.innerHeight;
+  const findings = [];
+  const seen = new Set();
+  const style = document.createElement("style");
+  // elementsFromPoint skips pointer-events:none layers (photo backgrounds, overlays).
+  style.textContent = "*,*::before,*::after{pointer-events:auto!important;scroll-behavior:auto!important}";
+  document.head.appendChild(style);
+  const cs = (el) => getComputedStyle(el);
+  const txt = (el) => (el.textContent || "").replace(/\\s+/g, " ").trim();
+  const short = (s) => (s.length > 60 ? s.slice(0, 59) + "\u2026" : s);
+  const where = (el) => {
+    const out = {};
+    const blk = el.closest("[data-os-block]");
+    const sec = el.closest("[data-os-section]");
+    if (blk && blk.getAttribute("data-os-id")) out.block = blk.getAttribute("data-os-id");
+    if (sec && sec.getAttribute("data-os-id")) out.section = sec.getAttribute("data-os-id");
+    const comp = el.closest("[data-os-component]");
+    if (comp) out.component = comp.getAttribute("data-os-component") || "component";
+    out.area = el.closest(".os-menu") ? "menu" : el.closest("[data-os-header],.os-header,.os-announcement") ? "header" : el.closest(".os-footer,footer") ? "footer" : el.closest(".os-popup,dialog") ? "other" : "main";
+    return out;
+  };
+  const add = (kind, el, extra) => {
+    const w = where(el);
+    const key = kind + "|" + (w.block || "") + "|" + (w.section || "") + "|" + (extra && extra.key ? extra.key : "") + "|" + (w.block || w.section ? "" : el.tagName + txt(el).slice(0, 30));
+    if (seen.has(key)) return;
+    seen.add(key);
+    const f = { kind, ...w, tag: el.tagName.toLowerCase() };
+    const cls = (e) => (e && typeof e.className === "string" ? e.className.split(/\\s+/).filter((c) => c.startsWith("os-") && !/^os-(theme|align|talign|malign)/.test(c)).slice(0, 2).join(".") : "");
+    const where2 = [cls(el), cls(el.parentElement), cls(el.parentElement && el.parentElement.parentElement)].filter(Boolean).join(" < ");
+    if (where2) f.path = where2.slice(0, 120);
+    const t = txt(el);
+    if (t) f.text = short(t);
+    if (extra) { if (extra.value !== undefined) f.value = Math.round(extra.value * 100) / 100; if (extra.limit !== undefined) f.limit = extra.limit; }
+    findings.push(f);
+  };
+  const hiddenByStyle = (el) => {
+    for (let e = el; e && e !== document.documentElement; e = e.parentElement) {
+      const s = cs(e);
+      if (s.display === "none" || s.visibility === "hidden" || s.visibility === "collapse" || Number(s.opacity) === 0) return true;
+      if (e.hasAttribute("hidden") || e.getAttribute("aria-hidden") === "true") return true;
+      if (e.classList && (e.classList.contains("os-visually-hidden") || e.classList.contains("os-skip-link") || e.classList.contains("os-hp") || e.classList.contains("os-empty"))) return true;
+      // Editor-only notes and Studio's own canvas chrome are not part of the published page.
+      if (e.hasAttribute && e.hasAttribute("data-os-editor")) return true;
+      if (e.tagName === "DIALOG" && !e.open) return true;
+      if (e.tagName === "DETAILS" && !e.open && e !== el && !(el.closest("summary") && el.closest("summary").parentElement === e)) return true;
+    }
+    return false;
+  };
+  const visible = (el) => {
+    const r = el.getBoundingClientRect();
+    if (r.width < 1 || r.height < 1) return false;
+    return !hiddenByStyle(el);
+  };
+  /** Inside something that scrolls sideways on purpose (carousels, tab bars, marquees, code). */
+  const inScroller = (el) => {
+    for (let e = el.parentElement; e && e !== document.body; e = e.parentElement) {
+      const ox = cs(e).overflowX;
+      if (ox === "auto" || ox === "scroll") return true;
+      if (e.classList.contains("os-marquee") || e.classList.contains("os-carousel")) return true;
+    }
+    return false;
+  };
+  /** The nearest ancestor that clips horizontally (overflow hidden/clip), if any. */
+  const clipper = (el) => {
+    for (let e = el.parentElement; e && e !== document.body; e = e.parentElement) {
+      const ox = cs(e).overflowX;
+      if (ox === "hidden" || ox === "clip") return e;
+    }
+    return null;
+  };
+  /** Bounding box of an element's own text (not hidden child spans). */
+  const ownRect = (el) => {
+    let l = Infinity, t = Infinity, r = -Infinity, b = -Infinity;
+    for (const n of el.childNodes) {
+      if (n.nodeType !== 3 || !n.textContent.trim()) continue;
+      const range = document.createRange();
+      range.selectNodeContents(n);
+      for (const x of range.getClientRects()) {
+        if (x.width < 0.5) continue;
+        l = Math.min(l, x.left); t = Math.min(t, x.top); r = Math.max(r, x.right); b = Math.max(b, x.bottom);
+      }
+    }
+    return l === Infinity ? { left: 0, top: 0, right: 0, bottom: 0, width: 0, height: 0 } : { left: l, top: t, right: r, bottom: b, width: r - l, height: b - t };
+  };
+  const ownText = (el) => { let s = ""; for (const n of el.childNodes) if (n.nodeType === 3) s += n.textContent; return s.replace(/\\s+/g, " ").trim(); };
+  const decorative = (el) => !!el.closest(".os-section__bg,.os-img,.os-section__overlay,[aria-hidden=true],.os-marquee,.os-header__cart-count");
+
+  // Text leaves: elements with their own (non-blank) text.
+  const all = Array.from(document.body.querySelectorAll("*"));
+  const SKIP = new Set(["SCRIPT","STYLE","NOSCRIPT","TEMPLATE","SVG","PATH","OPTION","HEAD","TITLE","META","LINK","BR"]);
+  const leaves = [];
+  const leafSet = new Set();
+  for (const el of all) {
+    if (SKIP.has(el.tagName.toUpperCase())) continue;
+    let own = "";
+    for (const n of el.childNodes) if (n.nodeType === 3) own += n.textContent;
+    if (!own.trim()) continue;
+    if (!visible(el)) continue;
+    leaves.push(el);
+    leafSet.add(el);
+  }
+
+  // --- sideways scrolling and cut-off content ---------------------------------------------
+  const scrollWidth = Math.max(document.documentElement.scrollWidth, document.body ? document.body.scrollWidth : 0);
+  const content = all.filter((el) => {
+    const t = el.tagName;
+    return (t === "IMG" || t === "IFRAME" || t === "VIDEO" || t === "TABLE" || t === "PRE" || t === "INPUT" || t === "SELECT" || t === "TEXTAREA" || t === "BUTTON" || t === "A" || t === "svg" || t === "SVG" || el.classList.contains("os-img") || el.classList.contains("os-block") || leafSet.has(el));
+  });
+  let overflowCulprit = null;
+  for (const el of content) {
+    if (el.tagName === "IMG" || el.tagName === "svg" || el.tagName === "SVG") continue; // cropped by their frame on purpose
+    if (!visible(el) || decorative(el) && !el.classList.contains("os-img") || inScroller(el)) continue;
+    if (el.classList.contains("os-img") && el.closest(".os-section__bg")) continue;
+    const r = leafSet.has(el) && !el.classList.contains("os-block") ? ownRect(el) : el.getBoundingClientRect();
+    if (r.width < 1) continue;
+    const over = Math.max(r.right - vw, -r.left);
+    if (over <= 2) continue;
+    // Full-bleed media is drawn edge to edge on purpose.
+    if ((el.tagName === "IMG" || el.classList.contains("os-img") || el.tagName === "VIDEO") && r.left >= -2 && r.right <= vw + 2) continue;
+    const clip = clipper(el);
+    const clipRect = clip ? clip.getBoundingClientRect() : null;
+    if (clipRect && clipRect.left >= -2 && clipRect.right <= vw + 2) {
+      // Clipped by a box inside the screen: is the element cut by it?
+      if (r.right > clipRect.right + 2 || r.left < clipRect.left - 2) {
+        add("cut-off", el, { value: over, key: el.tagName });
+      }
+    } else if (!overflowCulprit || r.right > overflowCulprit.getBoundingClientRect().right) overflowCulprit = el;
+  }
+  if (scrollWidth > vw + 1) add("page-overflow", overflowCulprit || document.body, { value: scrollWidth - vw });
+
+  // --- headings: broken words and huge sizes ------------------------------------------------
+  const heads = all.filter((el) => /^H[1-6]$/.test(el.tagName) || el.classList.contains("os-type-display") || el.classList.contains("os-type-h1") || el.classList.contains("os-header__title"));
+  for (const h of heads) {
+    if (!visible(h)) continue;
+    const s = cs(h);
+    const size = parseFloat(s.fontSize);
+    const r = h.getBoundingClientRect();
+    if (size > vw * L.headingShare || r.height > vh * L.headingScreen) add("big-heading", h, { value: size, limit: Math.round(vw * L.headingShare) });
+    // A word broken across lines: one word, more than one line box.
+    const walker = document.createTreeWalker(h, NodeFilter.SHOW_TEXT);
+    let broken = false;
+    for (let n = walker.nextNode(); n && !broken; n = walker.nextNode()) {
+      const text = n.textContent || "";
+      const re = /[^\\s\\-\u2010\u2013\u2014/]+/g;
+      let m;
+      while ((m = re.exec(text)) && !broken) {
+        if (m[0].length < 4) continue;
+        const range = document.createRange();
+        range.setStart(n, m.index);
+        range.setEnd(n, m.index + m[0].length);
+        const rects = Array.from(range.getClientRects()).filter((x) => x.width > 0.5);
+        const tops = new Set(rects.map((x) => Math.round(x.top)));
+        if (tops.size > 1) broken = true;
+        else if (rects.length && h.getBoundingClientRect().right + 1 < Math.max(...rects.map((x) => x.right))) broken = true;
+      }
+    }
+    if (broken) add("broken-word", h, { value: size });
+  }
+
+  // --- text size, narrow columns, edges ------------------------------------------------------
+  const READING = new Set(["P","LI","DD","BLOCKQUOTE","TD","FIGCAPTION"]);
+  // The site's small-print size (notes, captions), measured once.
+  const smallProbe = document.createElement("span");
+  smallProbe.className = "os-type-small";
+  smallProbe.textContent = "x";
+  smallProbe.style.cssText = "position:absolute;visibility:hidden";
+  (document.querySelector("main") || document.body).appendChild(smallProbe);
+  const smallPx = parseFloat(cs(smallProbe).fontSize) || 14;
+  smallProbe.remove();
+  for (const el of leaves) {
+    if (decorative(el) && !el.closest(".os-img figcaption")) continue;
+    const s = cs(el);
+    const size = parseFloat(s.fontSize);
+    const t = ownText(el);
+    // Reading text: block-level paragraphs and list items (inline code or links are part of them).
+    const inline = s.display.startsWith("inline");
+    const reading = !inline && (READING.has(el.tagName) || (!!el.closest(".os-rich") && !el.closest("h1,h2,h3,h4,h5,h6,.os-type-eyebrow,small,label,button,.os-button")));
+    // Body text must be 16px. Text styled as small print (notes, captions) may be 14px.
+    const smallPrint = !!el.closest(".os-type-small,small,figcaption,.os-muted") || Math.abs(size - smallPx) < 0.5;
+    if (reading && t.length >= 60 && (smallPrint ? size < 13.5 : size < L.bodyText - 0.5)) add("small-text", el, { value: size, limit: smallPrint ? 14 : L.bodyText });
+    else if (size < L.anyText - 0.5 && t.length > 1) add("tiny-text", el, { value: size, limit: L.anyText });
+    const r = el.getBoundingClientRect();
+    if (!el.closest("h1,h2,h3,h4,h5,h6") && (t.match(/[A-Za-z\\u00C0-\\uFFFF]{2,}/g) || []).length >= 6 && r.width < L.narrowColumn && !inScroller(el)) add("narrow-text", el, { value: r.width, limit: L.narrowColumn });
+    if (!inScroller(el) && r.right <= vw + 2 && r.left >= -2) {
+      // The text itself (not its box) against the screen edges.
+      const tr = ownRect(el);
+      if (tr.width > 0 && (tr.left < L.edge - 0.5 || tr.right > vw - L.edge + 0.5) && !el.closest(".os-announcement")) add("edge-text", el, { value: Math.min(tr.left, vw - tr.right), limit: L.edge });
+    }
+  }
+
+  // --- tap targets ---------------------------------------------------------------------------
+  // (A map's legal attribution link is exempt: it's required, tiny by convention and rarely tapped.)
+  const targets = all.filter((el) => el.matches("a[href],button,input:not([type=hidden]),select,textarea,summary,[role=button],[role=tab]") && visible(el) && !el.closest(".os-hp,.os-map__attribution"));
+  const proseLink = (el) => el.tagName === "A" && !el.classList.contains("os-button") && !!el.parentElement && el.parentElement.closest("p,li,dd,blockquote,td,figcaption") && txt(el.parentElement.closest("p,li,dd,blockquote,td,figcaption")).length > txt(el).length + 10;
+  /** A "stretched" link (an absolutely positioned ::after) is as big as the card it covers. */
+  const hitRect = (el) => {
+    const after = getComputedStyle(el, "::after");
+    if (after && after.content && after.content !== "none" && after.position === "absolute") {
+      for (let e = el.parentElement; e && e !== document.body; e = e.parentElement)
+        if (cs(e).position !== "static") return e.getBoundingClientRect();
+    }
+    return el.getBoundingClientRect();
+  };
+  const rects = targets.map(hitRect);
+  // What a neighbour visibly occupies (its padding is tap area, not something to collide with).
+  const inner = targets.map((el, i) => {
+    const r = rects[i], st = cs(el), b = el.getBoundingClientRect();
+    if (Math.abs(r.width - b.width) > 0.5 || Math.abs(r.height - b.height) > 0.5) return r; // a stretched link
+    const pt = parseFloat(st.paddingTop) || 0, pb = parseFloat(st.paddingBottom) || 0;
+    return { left: r.left, right: r.right, top: r.top + pt, bottom: r.bottom - pb };
+  });
+  targets.forEach((el, i) => {
+    if (proseLink(el)) return;
+    if (el.type === "checkbox" || el.type === "radio") { const lab = el.closest("label"); if (lab) return; }
+    const r = rects[i];
+    if (r.width >= L.tapTarget - 0.5 && r.height >= L.tapTarget - 0.5) return;
+    // Too short to tap reliably (44px), or so narrow and close to another target that it's easy to miss.
+    const tiny = r.height < L.tapTarget - 0.5 || r.width < L.tapTargetMin - 0.5;
+    // Tall enough: is it so narrow that a neighbour on the same line sits inside its 44px-wide zone?
+    const cx = r.left + r.width / 2, half = L.tapTarget / 2;
+    const zone = { left: cx - half, right: cx + half, top: r.top + r.height * 0.25, bottom: r.bottom - r.height * 0.25 };
+    let crowded = false;
+    targets.forEach((o, j) => {
+      if (j === i || crowded || o.contains(el) || el.contains(o)) return;
+      const q = inner[j];
+      if (q.left < zone.right && q.right > zone.left && q.top < zone.bottom && q.bottom > zone.top) crowded = true;
+    });
+    if (tiny || crowded) add("tap-target", el, { value: Math.min(r.width, r.height), limit: L.tapTarget, key: txt(el).slice(0, 20) || el.getAttribute("aria-label") || String(i) });
+  });
+
+  // --- text over text --------------------------------------------------------------------------
+  const blockOf = (el) => el.closest("[data-os-block]") || el.closest("[data-os-id]");
+  /** Line boxes of an element's own text (a drop cap or a tall first letter stays within its line). */
+  const lineRects = (el) => {
+    const out = [];
+    for (const n of el.childNodes) {
+      if (n.nodeType !== 3 || !n.textContent.trim()) continue;
+      const range = document.createRange();
+      range.selectNodeContents(n);
+      for (const x of range.getClientRects()) if (x.width >= 0.5) out.push(x);
+    }
+    return out;
+  };
+  const boxes = leaves.filter((el) => !decorative(el) && ownText(el).length > 1).map((el) => ({ el, r: ownRect(el), lines: lineRects(el), b: blockOf(el) }));
+  const linesMeet = (a, b) => a.lines.some((x) => b.lines.some((y) => Math.min(x.right, y.right) - Math.max(x.left, y.left) > 4 && Math.min(x.bottom, y.bottom) - Math.max(x.top, y.top) > Math.max(8, 0.3 * Math.min(x.height, y.height))));
+  for (let i = 0; i < boxes.length; i++)
+    for (let j = i + 1; j < boxes.length; j++) {
+      const a = boxes[i], b = boxes[j];
+      if (!a.b || !b.b || a.b === b.b || a.b.contains(b.b) || b.b.contains(a.b)) continue;
+      const w = Math.min(a.r.right, b.r.right) - Math.max(a.r.left, b.r.left);
+      const hgt = Math.min(a.r.bottom, b.r.bottom) - Math.max(a.r.top, b.r.top);
+      if (w > 4 && hgt > 4 && linesMeet(a, b)) add("overlap", b.el, { key: a.b.getAttribute("data-os-id") || String(i) });
+    }
+
+  // --- contrast (text over photos and on solid colors) ---------------------------------------
+  const canvas = document.createElement("canvas");
+  canvas.width = canvas.height = 1;
+  const ctx2d = canvas.getContext("2d", { willReadFrequently: true });
+  const colors = new Map();
+  /** Any CSS color (rgb, color(), oklab, color-mix results\u2026) as 0\u2013255 RGB + alpha. */
+  const parse = (c) => {
+    if (!c || c === "transparent") return null;
+    if (colors.has(c)) return colors.get(c);
+    let out = null;
+    const m = /^rgba?\\(([^)]+)\\)$/.exec(c);
+    if (m) {
+      const p = m[1].split(/[ ,/]+/).filter(Boolean).map(Number);
+      out = { r: p[0], g: p[1], b: p[2], a: p.length > 3 ? p[3] : 1 };
+    } else if (ctx2d) {
+      const a = /\\/\\s*([\\d.]+)(%?)\\s*\\)$/.exec(c);
+      const alpha = a ? Number(a[1]) / (a[2] ? 100 : 1) : 1;
+      ctx2d.clearRect(0, 0, 1, 1);
+      ctx2d.fillStyle = "#000";
+      ctx2d.fillStyle = c.replace(/\\/\\s*[\\d.]+%?\\s*\\)$/, ")");
+      ctx2d.fillRect(0, 0, 1, 1);
+      const d = ctx2d.getImageData(0, 0, 1, 1).data;
+      out = { r: d[0], g: d[1], b: d[2], a: alpha };
+    }
+    colors.set(c, out);
+    return out;
+  };
+  const lin = (v) => { v /= 255; return v <= 0.04045 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4); };
+  const lum = (c) => 0.2126 * lin(c.r) + 0.7152 * lin(c.g) + 0.0722 * lin(c.b);
+  const ratio = (a, b) => { const x = lum(a), y = lum(b); return (Math.max(x, y) + 0.05) / (Math.min(x, y) + 0.05); };
+  const over = (top, base) => ({ r: top.r * top.a + base.r * (1 - top.a), g: top.g * top.a + base.g * (1 - top.a), b: top.b * top.a + base.b * (1 - top.a), a: 1 });
+  const opacityOf = (el) => { let o = 1; for (let e = el; e && e !== document.documentElement; e = e.parentElement) o *= Number(cs(e).opacity); return o; };
+  const PHOTO = new Set(["IMG","VIDEO","CANVAS","PICTURE","IFRAME"]);
+  const pageBg = parse(cs(document.body).backgroundColor) || { r: 255, g: 255, b: 255, a: 1 };
+  const checkPoint = (el, x, y) => {
+    const stack = document.elementsFromPoint(x, y);
+    const at = stack.indexOf(el);
+    if (at < 0) return null;
+    const layers = [];
+    let photo = false, base = null;
+    for (const e of stack.slice(at)) {
+      if (PHOTO.has(e.tagName)) { photo = true; break; }
+      const s = cs(e);
+      if (/url\\(/.test(s.backgroundImage)) { photo = true; break; }
+      if (s.backgroundImage && s.backgroundImage !== "none") return null; // gradients: checked from the document
+      const bg = parse(s.backgroundColor);
+      if (bg && bg.a > 0) {
+        const a = bg.a * opacityOf(e);
+        if (a >= 0.98) { base = { ...bg, a: 1 }; break; }
+        layers.push({ ...bg, a });
+      }
+    }
+    return { photo, base: base || (photo ? null : pageBg), layers };
+  };
+  for (const el of leaves) {
+    if (decorative(el) || ownText(el).length < 2) continue;
+    const s = cs(el);
+    const fg = parse(s.color);
+    if (!fg || fg.a === 0) continue;
+    const size = parseFloat(s.fontSize);
+    const bold = Number(s.fontWeight) >= 700;
+    const need = size >= 24 || (bold && size >= 18.66) ? 3 : 4.5;
+    const r = ownRect(el);
+    if (r.width < 1) continue;
+    const sy = window.scrollY;
+    const pts = [[r.left + Math.min(8, r.width / 2), r.top + sy + r.height / 2], [r.left + r.width / 2, r.top + sy + r.height / 2]];
+    let worst = Infinity, photo = false;
+    for (const [px, docY] of pts) {
+      if (docY < window.scrollY + 80 || docY > window.scrollY + viewH - 20) window.scrollTo(0, Math.max(0, docY - viewH / 2));
+      const py = docY - window.scrollY;
+      if (py < 0 || py > viewH) continue;
+      const hit = checkPoint(el, Math.max(0, Math.min(vw - 1, px)), py);
+      if (!hit) continue;
+      const bases = hit.photo ? [{ r: 0, g: 0, b: 0, a: 1 }, { r: 255, g: 255, b: 255, a: 1 }] : [hit.base];
+      for (const b0 of bases) {
+        let c = b0;
+        for (const l of hit.layers.slice().reverse()) c = over(l, c);
+        const text = fg.a < 1 ? over(fg, c) : fg;
+        worst = Math.min(worst, ratio(text, c));
+      }
+      photo = photo || hit.photo;
+    }
+    if (worst < need - 0.05) add(photo ? "photo-contrast" : "low-contrast", el, { value: worst, limit: need });
+  }
+  window.scrollTo(0, 0);
+
+  // --- images --------------------------------------------------------------------------------
+  for (const box of document.querySelectorAll(".os-img,iframe,video")) {
+    if (!visible(box) || box.closest(".os-section__bg,.os-header,.os-lightbox,.os-carousel__track,.os-marquee")) continue;
+    const r = box.getBoundingClientRect();
+    if (r.height > vh * L.imageScreen) add("tall-image", box, { value: r.height, limit: Math.round(vh * L.imageScreen) });
+    const img = box.querySelector && box.querySelector("img");
+    if (img && img.naturalWidth > 0 && cs(img).objectFit === "cover") {
+      const ir = img.getBoundingClientRect();
+      const nat = img.naturalWidth / img.naturalHeight, shown = ir.width / Math.max(1, ir.height);
+      const share = Math.min(nat / shown, shown / nat);
+      if (share < L.crop && !box.style.getPropertyValue("--focal") && !img.style.getPropertyValue("--focal")) add("heavy-crop", box, { value: share, limit: L.crop });
+    }
+  }
+  for (const bg of document.querySelectorAll(".os-section__bg img")) {
+    const sec = bg.closest("[data-os-section]");
+    if (!sec || !visible(sec) || bg.naturalWidth === 0) continue;
+    const r = sec.getBoundingClientRect();
+    const nat = bg.naturalWidth / bg.naturalHeight, shown = r.width / Math.max(1, r.height);
+    const share = Math.min(nat / shown, shown / nat);
+    const focal = (bg.getAttribute("style") || "") + (bg.closest("[style*='--focal']") ? "focal" : "");
+    if (share < L.crop && !/--focal|focal/.test(focal)) add("heavy-crop", sec, { value: share, limit: L.crop, key: "bg" });
+  }
+
+  // --- section rhythm, header, footer ---------------------------------------------------------
+  for (const sec of document.querySelectorAll("main [data-os-section]")) {
+    if (!visible(sec)) continue;
+    const s = cs(sec);
+    const pad = Math.max(parseFloat(s.paddingTop), parseFloat(s.paddingBottom));
+    const header = document.querySelector(".os-header");
+    const overlayExtra = sec.classList.contains("os-section--first") && document.querySelector(".has-overlay-header") && header ? header.getBoundingClientRect().height : 0;
+    const top = parseFloat(s.paddingTop) - overlayExtra, bottom = parseFloat(s.paddingBottom);
+    const minh = parseFloat(s.minHeight) || 0;
+    if (Math.max(top, bottom) > L.loosePadding && minh < vh * 0.5) add("loose-padding", sec, { value: Math.max(top, bottom), limit: L.loosePadding });
+    void pad;
+  }
+  const bar = document.querySelector(".os-header__bar");
+  if (bar && visible(bar)) {
+    const parts = Array.from(bar.children).filter(visible);
+    let crowded = bar.getBoundingClientRect().height > 120;
+    for (let i = 0; i < parts.length && !crowded; i++)
+      for (let j = i + 1; j < parts.length; j++) {
+        const a = parts[i].getBoundingClientRect(), b = parts[j].getBoundingClientRect();
+        if (Math.min(a.right, b.right) - Math.max(a.left, b.left) > 2 && Math.min(a.bottom, b.bottom) - Math.max(a.top, b.top) > 2) { crowded = true; break; }
+      }
+    if (bar.scrollWidth > bar.clientWidth + 2) crowded = true;
+    if (crowded) add("header-crowded", bar, { value: bar.getBoundingClientRect().height });
+  }
+  // The first section's main action: visible without scrolling?
+  const first = Array.from(document.querySelectorAll("main [data-os-section]")).find(visible);
+  // Only a first section with photos or video (a hero) can push its words and button down.
+  if (first && first.querySelector("img,video,.os-section__bg")) {
+    // A form's own submit button sits at its end, wherever that is; look at call-to-action buttons.
+    const cta = Array.from(first.querySelectorAll(".os-button--primary")).find((b) => visible(b) && !b.closest("form,.os-form,.os-newsletter"));
+    if (cta) {
+      const top = cta.getBoundingClientRect().top + window.scrollY;
+      if (top + Math.min(44, cta.getBoundingClientRect().height) > vh) add("cta-below-fold", cta, { value: top, limit: vh });
+    }
+  }
+  const footer = document.querySelector(".os-footer");
+  if (footer && visible(footer) && footer.getBoundingClientRect().height > vh * 2.5) add("long-footer", footer, { value: footer.getBoundingClientRect().height, limit: Math.round(vh * 2.5) });
+
+  style.remove();
+  return { width: vw, height: vh, scrollWidth, findings };
+})()`;
+var PHONE_PREPARE_SCRIPT = `(async () => {
+  for (const img of Array.from(document.images)) { img.loading = "eager"; img.decoding = "sync"; }
+  document.documentElement.classList.remove("os-reveal-ready");
+  const step = Math.max(300, Math.floor(window.innerHeight * 0.8));
+  for (let y = 0, i = 0; y < document.documentElement.scrollHeight && i < 80; y += step, i++) {
+    window.scrollTo(0, y);
+    await new Promise((r) => setTimeout(r, 25));
+  }
+  window.scrollTo(0, 0);
+  const done = Promise.all(Array.from(document.images).map((img) => img.complete ? null :
+    new Promise((r) => { img.addEventListener("load", r, { once: true }); img.addEventListener("error", r, { once: true }); })));
+  await Promise.race([done, new Promise((r) => setTimeout(r, 5000))]);
+  if (document.fonts) await Promise.race([document.fonts.ready, new Promise((r) => setTimeout(r, 3000))]);
+})()`;
+
 // ../lint/src/seo.ts
 function seoCheck(page, doc, options = {}) {
   const meta = opMeta(options);
@@ -13575,12 +14744,12 @@ function seoCheck(page, doc, options = {}) {
       } : {}
     });
   }
-  const words3 = blocks2.map(blockText).join(" ").split(/\s+/).filter(Boolean).length;
-  if (!page.seo?.noindex && words3 < 80) {
+  const words4 = blocks2.map(blockText).join(" ").split(/\s+/).filter(Boolean).length;
+  if (!page.seo?.noindex && words4 < 80) {
     add({
       rule: "seo-thin-content",
       severity: "info",
-      message: `The page has about ${words3} words of text; search engines have little to go on.`,
+      message: `The page has about ${words4} words of text; search engines have little to go on.`,
       fix: "Add a short paragraph that explains what's on the page in your own words."
     });
   }
@@ -14206,6 +15375,20 @@ async function runCheck(root, options = {}) {
         });
     }
   }
+  if (doc) {
+    try {
+      for (const i of phoneCheck(doc)) {
+        if (i.severity === "info") continue;
+        add({
+          severity: "warning",
+          rule: "phone",
+          file: i.page && i.page !== "footer" ? pageFiles2[i.page] ?? PAGES_DIR : i.page === "footer" ? SITE_FILE : SITE_FILE,
+          message: `${i.message} ${i.autofix ? `Fix: \`openspace check --phone --fix\` (${i.autofix.label.toLowerCase()}).` : i.fix}`
+        });
+      }
+    } catch {
+    }
+  }
   const mediaOnDisk = /* @__PURE__ */ new Map();
   for (const rel of await listFiles(root, "media")) {
     const bytes = (await stat(join2(root, rel))).size;
@@ -14515,7 +15698,7 @@ function setupChecklist(sq, build) {
       id: "newsletter",
       kind: "newsletter",
       title: "Bring your newsletter subscribers",
-      detail: `Sign-up forms came across, but subscribers stay with ${from}. Export them there and import them here.`,
+      detail: subscribersAdvice(sq.platform),
       where: newsletter.where,
       status: "todo"
     });
@@ -15654,13 +16837,50 @@ var PROBE_SCRIPT = String.raw`(async () => {
       res.textLeft = Math.round(Math.min(...measures.map((x) => x.left)));
     }
     // Columns: text items whose vertical spans overlap, at distinct left edges.
-    const items = [...sec.querySelectorAll(textSel + ", h2, img")].filter((e) => visible(e) && (e.tagName === "IMG" ? e.getBoundingClientRect().width > 60 : ownText(e).length >= 12)).map(rect);
-    for (const a of items) {
-      const mid = a.top + Math.min(a.height, 40) / 2;
-      const lefts = [];
-      for (const b of items) if (b.top <= mid && b.bottom >= mid && !lefts.some((l) => Math.abs(l - b.left) < 40)) lefts.push(b.left);
-      res.columns = Math.max(res.columns, Math.min(6, lefts.length));
+    const itemEls = [...sec.querySelectorAll(textSel + ", h2, img")].filter((e) => visible(e) && (e.tagName === "IMG" ? e.getBoundingClientRect().width > 60 : ownText(e).length >= 12));
+    const columnsOf = (items) => {
+      let n = 1;
+      for (const a of items) {
+        const mid = a.top + Math.min(a.height, 40) / 2;
+        const lefts = [];
+        for (const b of items) if (b.top <= mid && b.bottom >= mid && !lefts.some((l) => Math.abs(l - b.left) < 40)) lefts.push(b.left);
+        n = Math.max(n, Math.min(6, lefts.length));
+      }
+      return n;
+    };
+    res.columns = columnsOf(itemEls.map(rect));
+    // Corrected score only (the strict v3 count above is kept): columns a visitor can see.
+    // A box that clips content running sideways out of it (a scroll-snap slideshow, a map's
+    // tiles) is one picture on screen, however many slides or tiles it holds; anything else
+    // counts when at least half of it (or half the viewport's width) is inside the viewport.
+    // (A clearfix row with
+    // overflow: hidden doesn't overflow sideways, so its columns stay columns.)
+    const clipBox = (el) => {
+      for (let e = el.parentElement; e && e !== document.body && e !== doc; e = e.parentElement) {
+        const st = cs(e);
+        if ((st.overflowX !== "visible" || st.overflow !== "visible") && e.scrollWidth > e.clientWidth + 2) return e;
+      }
+      return null;
+    };
+    const shownRects = [];
+    const boxes = new Set();
+    for (const el of itemEls) {
+      const box = clipBox(el);
+      if (box) {
+        if (boxes.has(box)) continue;
+        boxes.add(box);
+        const br = rect(box);
+        const L = Math.max(0, br.left), R = Math.min(vw, br.right);
+        if (R - L > 2) shownRects.push({ ...br, left: L, right: R, width: R - L });
+        continue;
+      }
+      const r = el.getBoundingClientRect();
+      const L = Math.max(0, r.left), R = Math.min(vw, r.right);
+      // Half of it on screen — or half the screen (a wide cover photo cropped at both sides).
+      if (R - L >= Math.min(r.width, vw) * 0.5) shownRects.push(rect(el));
     }
+    const shown = columnsOf(shownRects);
+    if (shown !== res.columns) res.columnsOnScreen = shown;
     // The section's parts and where they sit (to recreate it as a component when needed).
     if (!sec.querySelector("form, input, textarea, select, iframe, video, canvas, embed, object")) {
       const parts = [];
@@ -15756,6 +16976,8 @@ var PROBE_SCRIPT = String.raw`(async () => {
   const inMain = (el) => !chrome(el) && !el.closest("footer, .os-footer");
   const styleOfAll = (sel) => [...document.querySelectorAll(sel)].filter((e) => visible(e) && inMain(e) && ownText(e).length > 1).map(textOf);
   const presets = {};
+  // Measurements only the corrected score uses (the strict v3 ones above stay as they were).
+  const corrections = {};
   const h1s = styleOfAll("h1");
   if (h1s.length) presets.h1 = h1s.sort((a, b) => b.size - a.size)[0];
   const h2 = median(styleOfAll("h2"));
@@ -15806,6 +17028,21 @@ var PROBE_SCRIPT = String.raw`(async () => {
     if (!links.length) links = [...header.querySelectorAll("a")].filter(linkOk);
     const mid = links[Math.floor(links.length / 2)];
     if (mid) presets.nav = textOf(mid);
+    else {
+      // Corrected score only: "[class*=brand]" above is meant for logo boxes, but it also
+      // matches a header's colour theme (OpenSpace's "os-theme-brand" sidebar). A class naming a
+      // theme isn't a logo box: look again without it.
+      const logoBox = (a) => {
+        for (let e = a; e && e.nodeType === 1; e = e.parentElement)
+          if ([...e.classList].some((c) => /brand/i.test(c) && !/theme[-_]?brand/i.test(c))) return true;
+        return false;
+      };
+      const linkOk2 = (a) => visible(a) && ownText(a).length > 1 && ownText(a).length < 30 && toHex(cs(a).backgroundColor) === undefined && !a.matches(".os-header__brand, .os-button, [rel=home]") && !a.closest(".os-header__brand, [class*=site-title]") && !logoBox(a) && !homeLink(a);
+      let again = navEl ? [...navEl.querySelectorAll("a")].filter(linkOk2) : [];
+      if (!again.length) again = [...header.querySelectorAll("a")].filter(linkOk2);
+      const mid2 = again[Math.floor(again.length / 2)];
+      if (mid2) corrections.nav = textOf(mid2);
+    }
     // The site title set as text (a wordmark), not a logo image.
     // The innermost element holding the title text (an OpenSpace title span, not its link).
     const brandOk = (e) => visible(e) && ownText(e).length > 1 && ownText(e).length <= 40 && !e.querySelector("img, svg");
@@ -15915,6 +17152,7 @@ var PROBE_SCRIPT = String.raw`(async () => {
     ...(buttons ? { buttons } : {}),
     ...(eyebrows.length ? { eyebrowRule: out.filter((s) => s.rule).length >= Math.max(1, eyebrows.length / 2) } : {}),
     layout,
+    ...(Object.keys(corrections).length ? { corrections } : {}),
     sections: out,
     height: doc.scrollHeight,
     fonts,
@@ -19648,15 +20886,15 @@ function truncate(v, l = 50, o = "...") {
     return v;
   return str5.substring(0, l - o.length) + o;
 }
-function truncatewords(v, words3 = 15, o = "...") {
+function truncatewords(v, words4 = 15, o = "...") {
   const str5 = stringify(v);
   o = stringify(o);
   this.context.memoryLimit.use(str5.length + o.length);
   const arr = str5.split(/\s+/);
-  if (words3 <= 0)
-    words3 = 1;
-  let ret = arr.slice(0, words3).join(" ");
-  if (arr.length >= words3)
+  if (words4 <= 0)
+    words4 = 1;
+  let ret = arr.slice(0, words4).join(" ");
+  if (arr.length >= words4)
     ret += o;
   return ret;
 }
@@ -28493,28 +29731,28 @@ function gfmFootnoteHtml(options) {
       },
       gfmFootnoteCallString(token) {
         let calls = this.getData("gfmFootnoteCallOrder");
-        let counts = this.getData("gfmFootnoteCallCounts");
+        let counts2 = this.getData("gfmFootnoteCallCounts");
         const id = normalizeIdentifier(this.sliceSerialize(token));
         let counter;
         this.resume();
         if (!calls) this.setData("gfmFootnoteCallOrder", calls = []);
-        if (!counts) this.setData("gfmFootnoteCallCounts", counts = {});
+        if (!counts2) this.setData("gfmFootnoteCallCounts", counts2 = {});
         const index = calls.indexOf(id);
         const safeId = sanitizeUri(id.toLowerCase());
         if (index === -1) {
           calls.push(id);
-          counts[id] = 1;
+          counts2[id] = 1;
           counter = calls.length;
         } else {
-          counts[id]++;
+          counts2[id]++;
           counter = index + 1;
         }
-        const reuseCounter = counts[id];
+        const reuseCounter = counts2[id];
         this.tag('<sup><a href="#' + clobberPrefix + "fn-" + safeId + '" id="' + clobberPrefix + "fnref-" + safeId + (reuseCounter > 1 ? "-" + reuseCounter : "") + '" data-footnote-ref="" aria-describedby="footnote-label">' + String(counter) + "</a></sup>");
       },
       null() {
         const calls = this.getData("gfmFootnoteCallOrder") || [];
-        const counts = this.getData("gfmFootnoteCallCounts") || {};
+        const counts2 = this.getData("gfmFootnoteCallCounts") || {};
         const definitions = this.getData("gfmFootnoteDefinitions") || {};
         let index = -1;
         if (calls.length > 0) {
@@ -28530,7 +29768,7 @@ function gfmFootnoteHtml(options) {
           const safeId = sanitizeUri(id.toLowerCase());
           let referenceIndex = 0;
           const references = [];
-          while (++referenceIndex <= counts[id]) {
+          while (++referenceIndex <= counts2[id]) {
             references.push('<a href="#' + clobberPrefix + "fnref-" + safeId + (referenceIndex > 1 ? "-" + referenceIndex : "") + '" data-footnote-backref="" aria-label="' + this.encode(typeof backLabel === "string" ? backLabel : backLabel(index, referenceIndex)) + '" class="data-footnote-backref">\u21A9' + (referenceIndex > 1 ? "<sup>" + referenceIndex + "</sup>" : "") + "</a>");
           }
           const reference = references.join(" ");
@@ -30947,7 +32185,7 @@ var typeOf = (o) => {
   for (const k of TYPE_KEYS) if (typeof o[k] === "string") return o[k];
   return void 0;
 };
-function sectionsOf2(o) {
+function sectionsOf3(o) {
   if (!isObj3(o)) return void 0;
   for (const k of SECTION_KEYS) {
     const v = o[k];
@@ -30978,7 +32216,7 @@ async function findStructuredPages(source, files) {
       data = p.data;
       body = p.body;
     }
-    if (sectionsOf2(data)) out.push({ path: f, data, ...body ? { body } : {} });
+    if (sectionsOf3(data)) out.push({ path: f, data, ...body ? { body } : {} });
   }
   return out;
 }
@@ -31094,6 +32332,7 @@ function formFrom(v, ctx) {
   if (signupOnly)
     return {
       kind: "newsletter",
+      ...fields.some((f) => f.type !== "email") ? { askName: true } : {},
       ...button ? { buttonLabel: plain2(button) } : {},
       ...str3(v.email_placeholder) ? { placeholder: str3(v.email_placeholder) } : {},
       ...filled(v.success_message) ? { success: filled(v.success_message) } : {}
@@ -31545,7 +32784,7 @@ ${siteBg ? `body{background-color:${siteBg};}` : ""}`
       placeholders,
       fg: fgFor
     };
-    const raw2 = sectionsOf2(file.data) ?? [];
+    const raw2 = sectionsOf3(file.data) ?? [];
     const sections = [];
     for (const s2 of raw2) {
       typesSeen.set(typeOf(s2) ?? "?", (typesSeen.get(typeOf(s2) ?? "?") ?? 0) + 1);
@@ -41057,13 +42296,14 @@ function fontCredit(a, b, o, i) {
   const d = metricDistance(ma, mb);
   return d <= 0.04 ? 0.85 : d <= 0.07 ? 0.7 : d <= 0.11 ? 0.5 : d <= 0.16 ? 0.25 : 0;
 }
+var SCORER = "v3.1-corrected";
 var norm3 = (s2) => (s2 ?? "").toLowerCase().replace(/[^a-z0-9]/g, "");
-var words2 = (s2) => new Set(
+var words3 = (s2) => new Set(
   s2.toLowerCase().replace(/[^a-z0-9\s]/g, " ").split(/\s+/).filter((w) => w.length > 2)
 );
 var jaccard = (a, b) => {
-  const A = words2(a);
-  const B = words2(b);
+  const A = words3(a);
+  const B = words3(b);
   if (!A.size || !B.size) return 0;
   let n = 0;
   for (const w of A) if (B.has(w)) n++;
@@ -41104,7 +42344,12 @@ var ROLE_OF = {
   nav: "label",
   wordmark: "label"
 };
-function typeChecks(o, i, tol) {
+function presetOf(p, k, mode) {
+  const v = p.presets[k];
+  if (v || mode === "strict" || k !== "nav") return v;
+  return p.corrections?.nav;
+}
+function typeChecks(o, i, tol, mode = "corrected") {
   const out = [];
   const mobile = o.viewport < 700;
   const sizeKey = mobile ? "sizeMobile" : "size";
@@ -41120,8 +42365,8 @@ function typeChecks(o, i, tol) {
     "nav",
     "wordmark"
   ]) {
-    const a = o.presets[k];
-    const b = i.presets[k];
+    const a = presetOf(o, k, mode);
+    const b = presetOf(i, k, mode);
     if (!a) continue;
     if (k === "nav" && mobile) continue;
     if ((k === "h1" || k === "h2" || k === "h3") && a.case === "uppercase" && a.size < 16) continue;
@@ -41266,12 +42511,12 @@ function matchSections(o, i) {
   });
   o.forEach((s2, k) => {
     if (out[k] !== void 0) return;
-    const A = words2(`${s2.heading?.text ?? ""} ${s2.words ?? s2.text}`);
+    const A = words3(`${s2.heading?.text ?? ""} ${s2.words ?? s2.text}`);
     if (A.size < 4) return;
     let best = -1;
     let score = 0.6;
     i.forEach((t, n) => {
-      const B = words2(`${t.heading?.text ?? ""} ${t.words ?? t.text}`);
+      const B = words3(`${t.heading?.text ?? ""} ${t.words ?? t.text}`);
       let hit = 0;
       for (const w of A) if (B.has(w)) hit++;
       if (hit / A.size > score) {
@@ -41299,7 +42544,10 @@ function matchSections(o, i) {
   });
   return out;
 }
-function sectionChecks(a, b, tol, o, i) {
+var columnsOf2 = (s2, mode) => mode === "corrected" ? s2.columnsOnScreen ?? s2.columns : s2.columns;
+function sectionChecks(a0, b0, tol, o, i, mode = "corrected") {
+  const a = { ...a0, columns: columnsOf2(a0, mode) };
+  const b = { ...b0, columns: columnsOf2(b0, mode) };
   const out = [];
   const add = (c) => out.push({ area: "section", ...c });
   if (a.background && b.background && !a.backgroundImage) {
@@ -41436,56 +42684,159 @@ function withVisual(p, visual) {
   const base = p.exact ?? structure;
   const v = Math.max(0, Math.min(1, visual));
   const exact = (1 - VISUAL_WEIGHT) * base + VISUAL_WEIGHT * 100 * v;
+  const strictExact = p.strict ? (1 - VISUAL_WEIGHT) * p.strict.checks + VISUAL_WEIGHT * 100 * v : void 0;
   return {
     ...p,
     structure,
     visual: Math.round(v * 1e3) / 1e3,
     exact,
-    score: Math.round(exact)
-  };
+    score: Math.round(exact),
+    ...p.strict && strictExact !== void 0 ? { strict: { ...p.strict, exact: strictExact, score: Math.round(strictExact) } } : {}
+  };
+}
+var pictureOnly = (s2) => !s2.heading && (s2.text ?? "").replace(/\s+/g, "").length < 3 && Boolean(s2.image || s2.backgroundImage);
+function pictureHost(k, match, o, i) {
+  let pk = k - 1;
+  while (pk >= 0 && match[pk] === void 0) pk--;
+  let nk = k + 1;
+  while (nk < match.length && match[nk] === void 0) nk++;
+  const lo = pk >= 0 ? match[pk] : 0;
+  const hi = nk < match.length ? match[nk] : i.sections.length - 1;
+  const at = (o.sections[k]?.top ?? 0) / Math.max(1, o.height);
+  let best;
+  let gap = Number.POSITIVE_INFINITY;
+  for (let n = Math.min(lo, hi); n <= Math.max(lo, hi); n++) {
+    const t = i.sections[n];
+    if (!t || !(t.image || t.backgroundImage)) continue;
+    const d = Math.abs(t.top / Math.max(1, i.height) - at);
+    if (d < gap) {
+      gap = d;
+      best = n;
+    }
+  }
+  return best;
 }
-function compareLooks(original, imported, path2, opts = {}) {
-  const tol = opts.sizeTolerance ?? 0.12;
-  const checks = [...typeChecks(original, imported, tol), ...layoutChecks(original, imported)];
+function comparePage(original, imported, tol, mode, notes) {
+  const checks = [
+    ...typeChecks(original, imported, tol, mode),
+    ...layoutChecks(original, imported)
+  ];
+  if (notes && original.viewport >= 700 && !original.presets.nav !== !presetOf(original, "nav", mode))
+    notes.push(`The original's navigation sits in a header themed "brand": read as navigation.`);
+  if (notes && !imported.presets.nav && presetOf(imported, "nav", mode) && original.viewport >= 700)
+    notes.push(
+      `The new site's navigation sits in a header themed "brand" (os-theme-brand): read as navigation, not as a logo.`
+    );
   const match = matchSections(original.sections, imported.sections);
+  const phone = original.viewport < 700;
   const sections = original.sections.map((s2, k) => {
     const j = match[k];
     const other = j === void 0 ? void 0 : imported.sections[j];
-    const c = other ? sectionChecks(s2, other, tol, original, imported) : [
-      {
-        area: "section",
-        what: "Present",
-        original: s2.heading?.text ?? s2.text.slice(0, 40),
-        imported: "no matching section",
-        ok: false,
-        fix: "Bring this section across (or check it was merged into another).",
-        weight: 4
+    let c;
+    let shared;
+    if (other) {
+      c = sectionChecks(s2, other, tol, original, imported, mode);
+      if (notes && mode === "corrected") {
+        const was = [s2.columns, other.columns];
+        const now = [columnsOf2(s2, mode), columnsOf2(other, mode)];
+        if (was[0] !== was[1] !== (now[0] !== now[1]))
+          notes.push(
+            `Section ${k + 1}: columns counted on screen only (${was[0]} \u2192 ${was[1]} counted as ${now[0]} \u2192 ${now[1]}; what's off screen or inside one slideshow or map isn't a column).`
+          );
       }
-    ];
+    } else if (mode === "corrected" && phone && pictureOnly(s2)) {
+      shared = pictureHost(k, match, original, imported);
+      c = [];
+    } else c = [];
+    if (shared !== void 0) {
+      const host = imported.sections[shared];
+      notes?.push(
+        `Section ${k + 1} (a picture alone on a phone) is the picture of section ${shared + 1}, which holds it with its words.`
+      );
+      c = [
+        {
+          area: "section",
+          what: "Present",
+          original: "(a picture)",
+          imported: `with its words in section ${shared + 1}`,
+          ok: true,
+          weight: 4
+        }
+      ];
+      const sa = s2.image?.aspect;
+      const sb = host.image?.aspect;
+      if (sa && sb) {
+        const r = sb / sa;
+        const same = r > 0.85 && r < 1.18;
+        c.push({
+          area: "section",
+          what: "Image crop",
+          original: `${sa}:1`,
+          imported: `${sb}:1`,
+          ok: same,
+          ...same ? {} : { fix: "Use the original's image proportions (the block's aspect ratio)." },
+          weight: 1
+        });
+      }
+    } else if (!other)
+      c = [
+        {
+          area: "section",
+          what: "Present",
+          original: s2.heading?.text ?? s2.text.slice(0, 40),
+          imported: "no matching section",
+          ok: false,
+          fix: "Bring this section across (or check it was merged into another).",
+          weight: 4
+        }
+      ];
+    const at = j ?? shared;
     return {
       index: k,
       ...s2.heading ? { heading: s2.heading.text } : {},
-      ...j !== void 0 ? { importedIndex: j } : {},
+      ...at !== void 0 ? { importedIndex: at } : {},
       checks: c,
       score: scoreOf(c)
     };
   });
   const all = [...checks, ...sections.flatMap((s2) => s2.checks)];
+  return { checks, sections, exact: exactScore(all) };
+}
+function compareLooks(original, imported, path2, opts = {}) {
+  const tol = opts.sizeTolerance ?? 0.12;
+  const notes = [];
+  const page = comparePage(original, imported, tol, "corrected", notes);
+  const strict = comparePage(original, imported, tol, "strict");
   return {
     path: path2,
     original: original.url,
     imported: imported.url,
     viewport: original.viewport,
-    score: scoreOf(all),
-    structure: scoreOf(all),
-    exact: exactScore(all),
-    checks,
-    sections
+    score: Math.round(page.exact),
+    structure: Math.round(page.exact),
+    exact: page.exact,
+    checks: page.checks,
+    sections: page.sections,
+    strict: {
+      score: Math.round(strict.exact),
+      exact: strict.exact,
+      structure: Math.round(strict.exact),
+      checks: strict.exact
+    },
+    ...notes.length ? { corrections: notes } : {}
   };
 }
 function fidelityReport(pages) {
-  const exact = pages.length ? pages.reduce((n, p) => n + (p.exact ?? p.score), 0) / pages.length : 100;
-  return { score: Math.round(exact), exact: Math.round(exact * 100) / 100, pages };
+  const mean = (f) => pages.length ? pages.reduce((n, p) => n + f(p), 0) / pages.length : 100;
+  const exact = mean((p) => p.exact ?? p.score);
+  const strict = mean((p) => p.strict?.exact ?? p.exact ?? p.score);
+  return {
+    score: Math.round(exact),
+    exact: Math.round(exact * 100) / 100,
+    strict: { score: Math.round(strict), exact: Math.round(strict * 100) / 100 },
+    scorer: SCORER,
+    pages
+  };
 }
 var cell = (s2) => s2.replace(/\|/g, "\\|").replace(/\n/g, " ");
 function fidelityMarkdown(report, opts = {}) {
@@ -41493,7 +42844,11 @@ function fidelityMarkdown(report, opts = {}) {
     "# Visual fidelity",
     "",
     `Overall match: **${report.score}/100** \u2014 fonts, type sizes, spacing and each section measured in a browser on both sites (75%), and how alike the pages look as pictures (25%). How it's scored: docs/qa/import-fidelity.md.`,
-    ""
+    "",
+    ...report.strict ? [
+      `Scored two ways, side by side: **${report.score}/100 corrected**, ${report.strict.score}/100 by the strict v3 scorer. The corrected score reads three things the strict one gets wrong (navigation in a header themed "brand", off-screen slides counted as columns, a picture-only band on a phone); the pages below list where it did.`,
+      ""
+    ] : []
   ];
   if (opts.tuning) {
     lines.push(
@@ -41508,7 +42863,12 @@ function fidelityMarkdown(report, opts = {}) {
     );
   }
   for (const p of report.pages) {
-    lines.push(`## ${p.path} at ${p.viewport}px \u2014 ${p.score}/100`, "");
+    lines.push(
+      `## ${p.path} at ${p.viewport}px \u2014 ${p.score}/100${p.strict && p.strict.score !== p.score ? ` (strict v3: ${p.strict.score}/100)` : ""}`,
+      ""
+    );
+    if (p.corrections?.length)
+      lines.push("Corrected scoring on this page:", "", ...p.corrections.map((c) => `- ${c}`), "");
     if (p.visual !== void 0)
       lines.push(
         `Checks ${p.structure ?? p.score}/100 \xB7 looks alike ${Math.round(p.visual * 100)}/100 (screenshots compared).`,
@@ -41795,9 +43155,9 @@ function htmlToRichText(html, rewrite2 = (h) => h) {
       )
     });
   }
-  const counts = /* @__PURE__ */ new Map();
-  for (const a of ctx.aligns) counts.set(a, (counts.get(a) ?? 0) + 1);
-  const top = [...counts.entries()].sort((a, b) => b[1] - a[1])[0]?.[0];
+  const counts2 = /* @__PURE__ */ new Map();
+  for (const a of ctx.aligns) counts2.set(a, (counts2.get(a) ?? 0) + 1);
+  const top = [...counts2.entries()].sort((a, b) => b[1] - a[1])[0]?.[0];
   return {
     doc,
     ...top === "center" ? { align: "center" } : top === "right" ? { align: "end" } : {}
@@ -42266,7 +43626,7 @@ async function mapBlock(ctx, sq, opts = {}) {
       ctx.notices.push({
         kind: "form",
         where: ctx.where,
-        message: ctx.platform && ctx.platform !== "Squarespace" ? `Newsletter signup recreated. Subscribers are not moved: export your list from ${ctx.platform} (or your email service) and import it in the Hub.` : "Newsletter signup recreated. Squarespace Email Campaigns / Mailchimp subscribers are not moved: export your list from Squarespace and import it in the Hub."
+        message: ctx.platform && /^(?:GitHub Pages|Jekyll|Hugo|Eleventy|the original site)/.test(ctx.platform) ? "Newsletter signup recreated. The old site didn't keep a subscriber list itself: if its form sent sign-ups to an email service, export the list there and import it in the Hub." : ctx.platform && ctx.platform !== "Squarespace" ? `Newsletter signup recreated. Subscribers are not moved: export your list from ${ctx.platform} (or your email service) and import it in the Hub.` : "Newsletter signup recreated. Squarespace Email Campaigns / Mailchimp subscribers are not moved: export your list from Squarespace and import it in the Hub."
       });
       return one(
         makeBlock(
@@ -42275,6 +43635,7 @@ async function mapBlock(ctx, sq, opts = {}) {
           {
             ...sq.heading ? { heading: clip2(sq.heading, 80) } : {},
             ...sq.description ? { description: clip2(sq.description, 240) } : {},
+            ...sq.askName ? { askName: true } : {},
             ...sq.buttonLabel ? { buttonLabel: clip2(sq.buttonLabel, 30) } : {},
             ...sq.placeholder ? { placeholder: clip2(sq.placeholder, 60) } : {},
             ...sq.success ? { successMessage: clip2(sq.success, 200) } : {}
@@ -43913,13 +45274,24 @@ var ToolContext = class {
     const allowed = await this.allowedSites();
     if (input) {
       if (allowed.includes(input)) return input;
+      const wanted = input.trim().toLowerCase();
+      const named = (await this.store.listSites()).filter(
+        (s2) => allowed.includes(s2.id) && s2.title.trim().toLowerCase() === wanted
+      );
+      if (named.length === 1 && named[0]) return named[0].id;
+      const explained = await this.store.explainUnreachable?.(input);
+      if (explained) throw explained;
       throw new ToolError(
         `This connection can't reach site "${input}". Sites available: ${allowed.join(", ") || "none"}.`,
         "forbidden"
       );
     }
     if (allowed.length === 1) return allowed[0];
-    if (!allowed.length) throw new ToolError("This connection has no sites.", "forbidden");
+    if (!allowed.length) {
+      const explained = await this.store.explainUnreachable?.(void 0);
+      if (explained) throw explained;
+      throw new ToolError("This connection has no sites.", "forbidden");
+    }
     throw new ToolError(
       `Several sites are available; pass "site" (one of: ${allowed.join(", ")}).`,
       "invalid_arguments"
@@ -44048,7 +45420,7 @@ The same rules power Studio's built-in Design check. Follow them so pages look d
 6. **Two typefaces maximum.** Change the pairing in Site Styles rather than per block.
 7. **Never invent facts, testimonials, prices or credentials.** Ask the owner.
 8. **Alt text describes the image's purpose,** not just its contents; decorative images are marked decorative.
-9. **Check mobile.** After any grid change, review the mobile placement.
+9. **Great on phones, every time.** Most visitors use a phone. Before any publish run phone_check (it measures every page as a phone at 360 and 390 px where a browser is available), then fix_for_phones (phone-only fixes; desktop stays as designed), until there are zero phone errors and warnings. The bar: the hero's headline and main button on the first screen, no sideways scrolling or overlapping text, reading text 16px or larger, tap targets 44px or larger, text never squeezed into narrow columns, blocks in reading order, readable text over photos, no photo taller than the screen.
 10. **Prefer fewer, stronger sections** over many thin ones.
 11. **Custom components for bespoke moments only.** When no preset can express a distinctive section (an editorial hero, a layered collage, a horizontal story), use a custom component (list_components \u2192 create_component or insert_component from the Designer components library). Expose every word, image and link as a field (owners edit fields, never code), style only with theme tokens (var(--os-color-\u2026), var(--os-font-\u2026), var(--os-space-\u2026)), use the 767/768/1199/1200 breakpoints, honour reduced motion, and look at it with preview_component before showing the owner.
 
@@ -44067,12 +45439,12 @@ var ITERATION_GUIDANCE = `# Design iteration loop
 Repeat until the page is right, keeping each pass small:
 
 1. **Inspect** \u2014 get_page (detail "outline") for ids and copy; get_styles for the current look.
-2. **Check** \u2014 design_check on the page. Fix errors first (apply_fix for autofixable issues), then warnings that matter.
+2. **Check** \u2014 design_check and phone_check on the page. Fix errors first (apply_fix for autofixable issues, fix_for_phones for phone issues), then warnings that matter.
 3. **Edit** \u2014 one intent per pass: replace demo copy (update_block), swap a section for a better preset (insert_section + delete_section), adjust a section's color theme for rhythm (update_section colorTheme), or restyle globally (set_styles / apply_template_look).
 4. **Look** \u2014 screenshot the page (or just the section you changed) at desktop and mobile; use render_page when screenshots are unavailable.
 5. **Judge** \u2014 hierarchy (one H1, clear headline), one primary action per screen, rhythm of themes, copy within preset ranges, images consistent, nothing cramped on mobile. Then go back to 2.
 
-Finish with design_check showing zero errors and get_draft_diff to summarise the work for the owner.
+Finish with design_check showing zero errors, phone_check showing zero phone errors and warnings, and get_draft_diff to summarise the work for the owner.
 `;
 
 // ../mcp-tools/src/images.ts
@@ -44454,11 +45826,11 @@ ${ITERATION_GUIDANCE}
 Do at most five passes, and after each pass say in one line what you changed and what you saw in the screenshot. Stop when design_check shows no errors and the page reads clearly on desktop and mobile.`
   }
 ];
-function getPrompt(name, args = {}) {
-  const p = PROMPTS.find((x) => x.name === name);
+function getPrompt(name, args = {}, prompts = PROMPTS) {
+  const p = prompts.find((x) => x.name === name);
   if (!p)
     throw new ToolError(
-      `Unknown prompt "${name}". Prompts: ${PROMPTS.map((x) => x.name).join(", ")}.`,
+      `Unknown prompt "${name}". Prompts: ${prompts.map((x) => x.name).join(", ")}.`,
       "not_found"
     );
   const missing = p.arguments.filter((x) => x.required && !args[x.name]?.trim()).map((x) => x.name);
@@ -44492,7 +45864,7 @@ function renderPreviewHtml(doc, pageId, opts = {}) {
   const html = renderPageHtml({
     doc,
     pageId: target,
-    mode: "preview",
+    mode: opts.production ? "production" : "preview",
     basePath: opts.basePath ?? "",
     behaviorsUrl: opts.behaviorsUrl,
     extraHead: blocksStyleTag()
@@ -45650,10 +47022,10 @@ var listSectionPresets = defineTool({
     let list5 = presetCatalog.slice();
     if (input.category) list5 = list5.filter((p) => p.category === input.category);
     if (input.query) {
-      const words3 = input.query.toLowerCase().split(/\s+/).filter(Boolean);
+      const words4 = input.query.toLowerCase().split(/\s+/).filter(Boolean);
       list5 = list5.filter((p) => {
         const hay = `${p.id} ${p.label} ${p.description} ${p.tags.join(" ")} ${p.ai.whenToUse}`.toLowerCase();
-        return words3.every((w) => hay.includes(w));
+        return words4.every((w) => hay.includes(w));
       });
     }
     const full = input.detail === "full";
@@ -46012,12 +47384,12 @@ var designCheckTool = defineTool({
     const issues = runChecks(doc, pageId, input.checks ?? CHECKS, ctx.now()).filter(
       (i) => RANK[i.severity] <= min
     );
-    const counts = { error: 0, warning: 0, info: 0 };
-    for (const i of issues) counts[i.severity]++;
+    const counts2 = { error: 0, warning: 0, info: 0 };
+    for (const i of issues) counts2[i.severity]++;
     return {
       data: {
         ...pageId ? { page: pageId } : {},
-        counts,
+        counts: counts2,
         issues: issues.map((i) => ({
           id: i.id,
           rule: i.rule,
@@ -46078,9 +47450,9 @@ var applyFix = defineTool({
           });
     }
     const remaining = runChecks(doc, pageId, CHECKS, ctx.now());
-    const counts = { error: 0, warning: 0, info: 0 };
-    for (const i of remaining) counts[i.severity]++;
-    return { data: { applied, skipped, remaining: counts } };
+    const counts2 = { error: 0, warning: 0, info: 0 };
+    for (const i of remaining) counts2[i.severity]++;
+    return { data: { applied, skipped, remaining: counts2 } };
   }
 });
 var preview = defineTool({
@@ -47206,6 +48578,143 @@ var pageTools = [
   listPosts
 ];
 
+// ../mcp-tools/src/tools/phone.ts
+var PHONE_PAGE_LIMIT = 12;
+var stripMeta2 = (op2) => {
+  const { id: _i, actor: _a3, ts: _t, ...body } = op2;
+  return body;
+};
+async function measure(ctx, siteId, doc, pages, wantRendered) {
+  const now = ctx.now();
+  const statics = phoneCheck(doc, pages.length === 1 ? pages[0]?.id : void 0, {
+    actor: "phone-check",
+    now
+  });
+  const store = ctx.store;
+  if (!wantRendered || !store.capabilities.canMeasurePhone || !store.measurePhone)
+    return {
+      issues: statics,
+      rendered: false,
+      measuredPages: [],
+      ...wantRendered ? {
+        note: store.capabilities.publishNote?.includes("git") ? "Only the rules that don't need a browser ran. For the full phone check install Playwright next to the CLI (npm i -D playwright && npx playwright install chromium) and restart the MCP server." : "Only the rules that don't need a browser ran here; screenshot the page on mobile to look it over."
+      } : {}
+    };
+  const measured = pages.slice(0, PHONE_PAGE_LIMIT);
+  const rendered2 = [];
+  let note;
+  for (const page of measured) {
+    const html = renderPreviewHtml(doc, page.id, { production: true });
+    const results = [];
+    try {
+      for (const width of PHONE_WIDTHS)
+        results.push(await store.measurePhone(siteId, { pageId: page.id, width, html }));
+    } catch (e) {
+      note = `The browser check stopped at \u201C${page.title}\u201D: ${e instanceof Error ? e.message : String(e)}`;
+      break;
+    }
+    rendered2.push(...phoneIssuesFromProbe(doc, page.id, results, { actor: "phone-check", now }));
+  }
+  if (!note && pages.length > measured.length)
+    note = `Measured the first ${measured.length} of ${pages.length} pages; run phone_check with page for the others.`;
+  const seen = /* @__PURE__ */ new Set();
+  const deduped = rendered2.filter((i) => {
+    if (i.page !== "footer") return true;
+    const key2 = `${i.rule}|${i.message}`;
+    if (seen.has(key2)) return false;
+    seen.add(key2);
+    return true;
+  });
+  return {
+    issues: sortIssues([...statics, ...deduped]),
+    rendered: true,
+    measuredPages: measured.map((p) => p.id),
+    ...note ? { note } : {}
+  };
+}
+var pagesFor = (doc, page) => page ? [resolvePage(doc, page).page] : Object.values(doc.pages);
+var describe2 = (i) => ({
+  id: i.id,
+  rule: i.rule,
+  severity: i.severity,
+  ...i.page ? { page: i.page } : {},
+  ...i.section ? { section: i.section } : {},
+  ...i.block ? { block: i.block } : {},
+  message: i.message,
+  fix: i.fix,
+  autofix: i.autofix?.label ?? null
+});
+var counts = (issues) => {
+  const c = { error: 0, warning: 0, info: 0 };
+  for (const i of issues) c[i.severity]++;
+  return c;
+};
+var phoneCheckTool = defineTool({
+  name: "phone_check",
+  title: "Phone check",
+  description: "Check how the site works on phones: the rules that need no browser (sections not laid out for phones, columns squeezed side by side, padding that empties the screen, heading words too long for a phone line, tall photo sections, fixed widths in custom CSS) plus, where a browser is available, a real phone layout at 360 and 390 px (sideways scrolling, cut-off or overlapping text, text too small, buttons too small to tap, text over photos, the main button below the first screen). Run it before every publish; fix with fix_for_phones. Aim for zero errors and warnings.",
+  input: external_exports.object({
+    site: siteArg,
+    page: external_exports.string().optional().describe("Page id/slug/title (default: every page)."),
+    rendered: external_exports.boolean().optional().describe("Measure in a real browser when available (default true).")
+  }),
+  annotations: { readOnlyHint: true },
+  async handler(ctx, input) {
+    const siteId = await ctx.siteId(input.site);
+    const doc = await ctx.doc(siteId);
+    const r = await measure(ctx, siteId, doc, pagesFor(doc, input.page), input.rendered !== false);
+    const c = counts(r.issues);
+    return {
+      data: {
+        rendered: r.rendered,
+        ...r.note ? { note: r.note } : {},
+        counts: c,
+        issues: r.issues.map(describe2),
+        next: c.error + c.warning === 0 ? "Looks great on phones." : r.issues.some((i) => i.autofix) ? "Run fix_for_phones to fix everything that can be fixed automatically, then phone_check again; handle the rest by editing." : "Edit the content as each fix says, then run phone_check again."
+      }
+    };
+  }
+});
+var fixForPhonesTool = defineTool({
+  name: "fix_for_phones",
+  title: "Fix everything for phones",
+  description: "Apply every automatic phone fix in one change (phone-only settings: phone layouts in reading order, words first in heroes, stacked columns, lighter phone padding, shorter photo sections, smaller phone heading sizes, stronger photo overlays). Desktop stays as designed. Re-measures and returns what's left.",
+  input: external_exports.object({
+    site: siteArg,
+    page: external_exports.string().optional().describe("Limit to a page (default: every page).")
+  }),
+  annotations: {},
+  async handler(ctx, input) {
+    const siteId = await ctx.siteId(input.site);
+    let doc = await ctx.doc(siteId);
+    const pages = pagesFor(doc, input.page);
+    const before = await measure(ctx, siteId, doc, pages, true);
+    const r = fixForPhones(doc, {
+      ...input.page ? { pageId: pages[0]?.id } : {},
+      actor: "phone-check",
+      now: ctx.now(),
+      rendered: before.issues
+    });
+    if (r.ops.length) {
+      const applied = await ctx.apply(siteId, r.ops.map(stripMeta2));
+      doc = applied.doc;
+    }
+    const after = await measure(ctx, siteId, doc, pagesFor(doc, input.page), true);
+    const labels = /* @__PURE__ */ new Map();
+    for (const f of r.fixed) labels.set(f.label, (labels.get(f.label) ?? 0) + 1);
+    return {
+      data: {
+        fixed: [...labels].map(([label, n]) => n > 1 ? `${label} (${n}\xD7)` : label),
+        rendered: after.rendered,
+        remaining: counts(after.issues),
+        issues: after.issues.filter((i) => i.severity !== "info").map(describe2),
+        next: after.issues.filter((i) => i.severity !== "info").length === 0 ? "Looks great on phones." : "These need an edit (no automatic fix): follow each fix, then run phone_check again."
+      }
+    };
+  }
+});
+var phoneTools = [phoneCheckTool, fixForPhonesTool];
+
 // ../mcp-tools/src/tools/publish.ts
 var getDraftDiff = defineTool({
   name: "get_draft_diff",
@@ -47351,6 +48860,7 @@ var ALL_TOOLS = [
   ...pageTools,
   ...designSystemTools,
   ...designTools,
+  ...phoneTools,
   ...componentTools,
   ...publishTools
 ];
@@ -47396,14 +48906,21 @@ var OpenSpaceMcpServer = class {
     this.initialized = Boolean(options.assumeInitialized);
     for (const t of ALL_TOOLS) this.tools.set(t.name, t);
     for (const t of options.tools ?? []) this.tools.set(t.name, t);
+    const extra = options.prompts ?? [];
+    this.prompts = [...PROMPTS.filter((p) => !extra.some((e) => e.name === p.name)), ...extra];
   }
   options;
   ctx;
   tools = /* @__PURE__ */ new Map();
+  prompts;
   clientName;
   initialized;
   protocolVersion;
   closed = false;
+  /** Prompts served by this instance. */
+  promptList() {
+    return [...this.prompts];
+  }
   /** Tool definitions served by this instance. */
   toolList() {
     return [...this.tools.values()];
@@ -47525,7 +49042,7 @@ var OpenSpaceMcpServer = class {
       }
       case "prompts/list":
         return {
-          prompts: PROMPTS.map((p) => ({
+          prompts: this.prompts.map((p) => ({
             name: p.name,
             title: p.title,
             description: p.description,
@@ -47536,7 +49053,7 @@ var OpenSpaceMcpServer = class {
         if (typeof params.name !== "string")
           throw new RpcError(ErrorCode.InvalidParams, "name is required");
         const args = isRecord5(params.arguments) ? Object.fromEntries(Object.entries(params.arguments).map(([k, v]) => [k, String(v)])) : {};
-        return getPrompt(params.name, args);
+        return getPrompt(params.name, args, this.prompts);
       }
       case "completion/complete":
         return { completion: { values: [], hasMore: false } };
@@ -47564,7 +49081,7 @@ var OpenSpaceMcpServer = class {
         logging: {}
       },
       serverInfo: { name: SERVER_NAME, title: "OpenSpace", version: SERVER_VERSION },
-      instructions: SERVER_INSTRUCTIONS
+      instructions: this.options.instructions ?? SERVER_INSTRUCTIONS
     };
   }
   /** Name the client reported in `initialize`. */
@@ -48142,6 +49659,25 @@ function squarespaceRenditions(u, width, height, canResize = true) {
   ];
 }
 
+// ../import/src/phone.ts
+function phoneReady(result) {
+  let fixed;
+  try {
+    fixed = fixForPhones(result.doc, { actor: "import", now: 0 });
+  } catch {
+    return result;
+  }
+  if (!fixed.ops.length) return result;
+  const labels = [...new Set(fixed.fixed.map((f) => f.label.toLowerCase()))];
+  const line = `
+## Phones
+
+Made ${fixed.fixed.length} phone-only adjustment${fixed.fixed.length === 1 ? "" : "s"} so the site reads well on phones (${labels.join(", ")}). The desktop design is unchanged.
+`;
+  return { ...result, doc: fixed.doc, report: `${result.report.trimEnd()}
+${line}` };
+}
+
 // ../import/src/report.ts
 var NOTICE_TITLES = {
   "unsupported-block": "Blocks that need a look",
@@ -48277,17 +49813,17 @@ function renderReport(r) {
     any = true;
     L2.push(`### ${NOTICE_TITLES[kind]}`);
     L2.push("");
-    const counts = /* @__PURE__ */ new Map();
+    const counts2 = /* @__PURE__ */ new Map();
     for (const n of list5) {
-      const e = counts.get(n.message) ?? { n: 0, where: /* @__PURE__ */ new Set() };
+      const e = counts2.get(n.message) ?? { n: 0, where: /* @__PURE__ */ new Set() };
       e.n++;
       e.where.add(n.where);
-      counts.set(n.message, e);
+      counts2.set(n.message, e);
     }
     let shown = 0;
-    for (const [message, e] of counts) {
+    for (const [message, e] of counts2) {
       if (++shown > 15) {
-        L2.push(`- \u2026 and ${counts.size - 15} more like these.`);
+        L2.push(`- \u2026 and ${counts2.size - 15} more like these.`);
         break;
       }
       const where2 = [...e.where];
@@ -48680,7 +50216,7 @@ async function crawlWordPress(opts) {
         ...it.excerptHtml ? { caption: it.excerptHtml } : {}
       });
   const entries = [];
-  const pathOf = (link2, fallback2) => (link2 ? sitePath(link2, base) : void 0) ?? fallback2;
+  const pathOf2 = (link2, fallback2) => (link2 ? sitePath(link2, base) : void 0) ?? fallback2;
   if (rest) {
     const [pages2, posts] = [
       await listAll("wp/v2/pages", "_embed=1&orderby=menu_order&order=asc"),
@@ -48707,7 +50243,7 @@ async function crawlWordPress(opts) {
         }
         entries.push({
           type,
-          path: pathOf(link2, `/${slug}`),
+          path: pathOf2(link2, `/${slug}`),
           slug,
           title: decodeEntities2(rendered(p.title)) || slug || "Untitled",
           html: rendered(p.content),
@@ -48774,7 +50310,7 @@ async function crawlWordPress(opts) {
     });
   }
   if (!rest && !wxr && home) {
-    const { crawlGeneric: crawlGeneric2 } = await import("./crawl-YPDLNAN7.js");
+    const { crawlGeneric: crawlGeneric2 } = await import("./crawl-WQQDFI7W.js");
     const site2 = await crawlGeneric2({
       url: base,
       fetcher: f,
@@ -49058,6 +50594,7 @@ function componentFromBlueprint(input) {
     ".gx__img picture, .gx__img img { display: block; width: 100%; height: 100%; object-fit: cover; }"
   ];
   const phone = [];
+  const named = [];
   let headingSeen = false;
   const role = (family) => {
     if (norm5(family) && norm5(family) === norm5(input.roles.label)) return "label";
@@ -49123,6 +50660,7 @@ function componentFromBlueprint(input) {
       const key3 = `image${n}`;
       fields[key3] = { kind: "image", label: `Picture ${n}` };
       values[key3] = { src: it.src, alt: (it.alt ?? "").slice(0, 300) };
+      named.push({ role: "picture", text: it.alt ?? "", keys: [key3] });
       parts.push(
         `<div class="${cls} gx__img">{{image ${key3} sizes="(max-width: 767px) 100vw, ${Math.max(10, Math.round(it.box.w / 1440 * 100))}vw"}}</div>`
       );
@@ -49141,6 +50679,7 @@ function componentFromBlueprint(input) {
       };
       values[label] = (it.text ?? "").slice(0, 60);
       if (!target) {
+        named.push({ role: it.kind, text: it.text ?? "", keys: [label] });
         parts.push(`<p class="${cls}">{{${label}}}</p>`);
       } else {
         const lk = `link${n}`;
@@ -49149,6 +50688,7 @@ function componentFromBlueprint(input) {
           label: `${it.kind === "button" ? "Button" : "Link"} ${n} goes to`
         };
         values[lk] = target;
+        named.push({ role: it.kind, text: it.text ?? "", keys: [label, lk] });
         parts.push(
           it.kind === "button" ? `<div class="${cls}">{{button ${lk} label=${label} variant="primary"}}</div>` : `<p class="${cls}">{{#link ${lk}}}{{${label}}}{{/link}}</p>`
         );
@@ -49170,6 +50710,7 @@ function componentFromBlueprint(input) {
         maxLength: 3e3
       };
       values[key2] = doc;
+      named.push({ role: textRole(it), text: it.text ?? "", keys: [key2] });
       parts.push(`<div class="${cls}">{{rich ${key2}}}</div>`);
       css.push(`.gx__i${n} { ${place}; ${typeCss(it.style, false)}; }`);
       phone.push(`.gx__i${n} { ${typeCss(it.style, true)}; }`);
@@ -49183,6 +50724,7 @@ function componentFromBlueprint(input) {
       ...it.kind === "text" ? { multiline: true } : {}
     };
     values[key2] = text7;
+    named.push({ role: it.kind === "heading" ? "heading" : textRole(it), text: text7, keys: [key2] });
     const tag = it.kind === "heading" ? headingSeen ? "h3" : "h2" : "p";
     if (it.kind === "heading") headingSeen = true;
     parts.push(`<${tag} class="${cls}">{{${key2}}}</${tag}>`);
@@ -49190,6 +50732,14 @@ function componentFromBlueprint(input) {
     phone.push(`.gx__i${n} { ${typeCss(it.style, true)}; }`);
   });
   if (!parts.length) return void 0;
+  for (const [i, label] of partLabels(named).entries()) {
+    const part = named[i];
+    const [first2, second] = part.keys;
+    const f = fields[first2];
+    if (f) fields[first2] = { ...f, label };
+    const l = second ? fields[second] : void 0;
+    if (second && l) fields[second] = { ...l, label: `${label} goes to` };
+  }
   css.push(
     `@media (max-width: 767px) {
   .gx { display: flex; flex-direction: column; gap: var(--os-space-sm); }
@@ -49212,6 +50762,53 @@ ${parts.map((p) => `  ${p}`).join("\n")}
   };
   return { def, fields: values };
 }
+function textRole(it) {
+  const words4 = (it.text ?? "").trim().split(/\s+/).filter(Boolean).length;
+  const caps = it.style?.case === "uppercase" || /^[^a-z]*[A-Z][^a-z]*$/.test(it.text ?? "");
+  return words4 <= 5 && (caps || (it.style?.size ?? 16) <= 14) ? "small" : "paragraph";
+}
+var ROLE_LABEL = {
+  heading: "Heading",
+  small: "Small label",
+  paragraph: "Paragraph",
+  picture: "Picture",
+  button: "Button",
+  link: "Link"
+};
+function snippet(text7) {
+  const words4 = text7.replace(/\s+/g, " ").trim().split(" ").filter(Boolean);
+  let out = "";
+  for (const w of words4) {
+    if (`${out} ${w}`.trim().length > 24) break;
+    out = `${out} ${w}`.trim();
+  }
+  if (!out && words4[0]) out = words4[0].slice(0, 22);
+  if (!out) return "";
+  const cased = /[a-z]/.test(out) ? out : out.charAt(0) + out.slice(1).toLowerCase();
+  return `${cased}${out.length < text7.trim().length ? "\u2026" : ""}`;
+}
+function partLabels(parts) {
+  const counts2 = /* @__PURE__ */ new Map();
+  for (const p of parts) counts2.set(p.role, (counts2.get(p.role) ?? 0) + 1);
+  const used = /* @__PURE__ */ new Set();
+  const seen = /* @__PURE__ */ new Map();
+  return parts.map((p) => {
+    const nth = (seen.get(p.role) ?? 0) + 1;
+    seen.set(p.role, nth);
+    const base = ROLE_LABEL[p.role];
+    let label;
+    if ((counts2.get(p.role) ?? 0) === 1) label = base;
+    else if (p.role === "button" && nth === 1) label = "Main button";
+    else {
+      const words4 = p.role === "picture" ? "" : snippet(p.text);
+      label = words4 ? `${base} \u201C${words4}\u201D` : `${base} ${nth}`;
+    }
+    let unique = label;
+    for (let k = 2; used.has(unique); k++) unique = `${label} ${k}`;
+    used.add(unique);
+    return unique.slice(0, 60);
+  });
+}
 function richDoc(runs, origin) {
   if (!runs?.length) return void 0;
   const content3 = [];
@@ -49742,8 +51339,8 @@ function tuneRound(input, measured, groups = TUNE_GROUPS, opts = {}) {
             if (b.type !== "text" || done) continue;
             const doc2 = b.fields.content;
             for (const node2 of doc2?.content ?? []) {
-              const words3 = (node2.content ?? []).map((x) => x.text ?? "").join("");
-              if (node2.type !== "heading" || norm6(words3) !== norm6(i.text)) continue;
+              const words4 = (node2.content ?? []).map((x) => x.text ?? "").join("");
+              if (node2.type !== "heading" || norm6(words4) !== norm6(i.text)) continue;
               if (pick === "lead" || node2.attrs?.preset === pick) break;
               node2.attrs = { ...node2.attrs ?? {}, preset: pick };
               done = true;
@@ -49896,7 +51493,12 @@ function tuneRound(input, measured, groups = TUNE_GROUPS, opts = {}) {
         const theme = themes?.[old.style.colorTheme ?? "light"];
         const gen = componentFromBlueprint({
           name,
-          label: `${s2.heading ?? "Section"} (as on the original)`.slice(0, 60),
+          label: sectionLabel(
+            s2.heading ?? o.heading?.text,
+            o.blueprint,
+            page.title || (page.slug ? page.slug : "Home"),
+            s2.index + 1
+          ),
           section: o,
           roles,
           ...theme ? {
@@ -49957,6 +51559,14 @@ function setRole(doc, theme, role, value) {
   doc.styles.overrides = overrides;
   return true;
 }
+function sectionLabel(heading2, blueprint, pageTitle, n) {
+  const first2 = heading2?.trim() || blueprint?.find((i) => i.kind === "heading" && i.text?.trim())?.text || blueprint?.find((i) => i.kind === "text" && i.text?.trim())?.text;
+  const words4 = (first2 ?? "").replace(/\s+/g, " ").trim();
+  if (!words4) return `${pageTitle} section ${n}`.slice(0, 60);
+  const short = words4.length > 40 ? `${words4.slice(0, 40).replace(/\s+\S*$/, "")}\u2026` : words4;
+  const cased = /[a-z]/.test(short) ? short : short.charAt(0) + short.slice(1).toLowerCase();
+  return cased.slice(0, 60);
+}
 
 // ../import/src/index.ts
 var REPORT_FILE = "IMPORT-REPORT.md";
@@ -50166,6 +51776,9 @@ async function detectSite(url, opts = {}) {
   return { ...detectPlatform(r.text, { "content-type": r.contentType }), url: r.url || base };
 }
 async function importSite(opts) {
+  return phoneReady(await importAnySite(opts));
+}
+async function importAnySite(opts) {
   let detection;
   let platform;
   if (opts.repoDir) return importGitHub(opts);
@@ -50228,7 +51841,7 @@ async function renderAgentsMd(root, siteTitle) {
     } catch {
     }
   }
-  const { generateAgentsMd: generateAgentsMd2 } = await import("./agents-md-63S3T7CX.js");
+  const { generateAgentsMd: generateAgentsMd2 } = await import("./agents-md-OWDSHBGF.js");
   return generateAgentsMd2(title ? { siteTitle: title } : {});
 }
 async function writeAgentsMd(root, siteTitle) {
@@ -50507,7 +52120,7 @@ function compareFidelityTool(opts) {
           [],
           "Install Playwright next to the CLI (npm i -D playwright && npx playwright install chromium) and restart the MCP server."
         );
-      const widths = input.device === "desktop" ? [DESKTOP] : input.device === "mobile" ? [PHONE] : [DESKTOP, PHONE];
+      const widths = input.device === "desktop" ? [DESKTOP] : input.device === "mobile" ? [PHONE2] : [DESKTOP, PHONE2];
       const run2 = opts.compare ?? runCompare;
       const r = await run2(u.toString(), opts.siteRoot, {
         ...input.pages?.length ? { pages: input.pages } : {},
@@ -50710,8 +52323,8 @@ var DEFAULTS = {
   products: []
 };
 var FILE = {
-  rss: { file: "rss.xml", label: "RSS", mime: "application/rss+xml" },
-  atom: { file: "atom.xml", label: "Atom", mime: "application/atom+xml" },
+  rss: { file: "rss.xml", label: "RSS feed", mime: "application/rss+xml" },
+  atom: { file: "atom.xml", label: "Atom feed", mime: "application/atom+xml" },
   ical: { file: "calendar.ics", label: "Add to calendar (iCal)", mime: "text/calendar" },
   podcast: { file: "podcast.xml", label: "Podcast feed", mime: "application/rss+xml" }
 };
@@ -51526,7 +53139,11 @@ async function startPreviewServer(root, load, opts = {}) {
           page = Object.values(view.pages).find((p) => p.slug === slug);
         }
         if (page) {
-          const html = renderPreviewHtml(view, page.id, { behaviorsUrl: "/_os/behaviors" });
+          const html = renderPreviewHtml(view, page.id, {
+            behaviorsUrl: "/_os/behaviors",
+            // `?os_mode=production`: exactly as published (the Phone check measures this).
+            production: url.searchParams.get("os_mode") === "production"
+          });
           res.writeHead(200, {
             "content-type": "text/html; charset=utf-8",
             "cache-control": "no-store"
@@ -51590,6 +53207,7 @@ var FileSiteStore = class _FileSiteStore {
       canPublish: store.hasGit,
       canRollback: store.hasGit,
       canScreenshot: Boolean(options.screenshotter),
+      canMeasurePhone: Boolean(options.screenshotter),
       publishNote: store.hasGit ? "Local site in git: publishing commits content/ and media/ on the current branch; push it to deploy." : "Local site without git: edits are saved to the files; there is no publish step."
     };
     return store;
@@ -51898,6 +53516,16 @@ Unpublished work saved as ${tag}`,
     const url = await this.previewUrl(siteId, path2);
     return this.options.screenshotter.capture(url, request);
   }
+  async measurePhone(siteId, request) {
+    this.check(siteId);
+    if (!this.options.screenshotter)
+      throw new ToolError("The browser phone check is not available.", "unsupported");
+    const doc = await loadSiteDocument(this.root);
+    const page = doc.pages[request.pageId];
+    const path2 = page?.slug ? `/${page.slug}/` : "/";
+    const url = await this.previewUrl(siteId, `${path2}?os_mode=production`);
+    return this.options.screenshotter.measure(url, request.width);
+  }
   async agentsMd() {
     try {
       return await readFile9(join11(this.root, "AGENTS.md"), "utf8");
@@ -52013,6 +53641,32 @@ function createScreenshotter(chromium) {
         await page.close().catch(() => void 0);
       }
     },
+    async measure(url, width) {
+      browser ??= launch2();
+      let b;
+      try {
+        b = await browser;
+      } catch (e) {
+        browser = void 0;
+        throw e;
+      }
+      const context = await b.newContext({
+        viewport: { width, height: PHONE_HEIGHT },
+        deviceScaleFactor: 2,
+        isMobile: true,
+        hasTouch: true,
+        reducedMotion: "reduce"
+      });
+      const page = await context.newPage();
+      try {
+        await page.goto(url, { waitUntil: "load", timeout: 3e4 });
+        await page.waitForLoadState("networkidle", { timeout: 5e3 }).catch(() => void 0);
+        await page.evaluate(PHONE_PREPARE_SCRIPT).catch(() => void 0);
+        return await page.evaluate(PHONE_PROBE_SCRIPT);
+      } finally {
+        await context.close().catch(() => void 0);
+      }
+    },
     async close() {
       if (!browser) return;
       const b = await browser.catch(() => void 0);
@@ -52232,6 +53886,147 @@ function rebrand(value, from, to) {
   return changed ? out : null;
 }
 
+// src/phone.ts
+var pathOf = (p) => p.slug ? `/${p.slug}/` : "/";
+async function measureSite(root, load, doc, shooter, pages, widths, now) {
+  const server = await startPreviewServer(root, load);
+  const out = /* @__PURE__ */ new Map();
+  try {
+    for (const page of pages) {
+      const results = [];
+      for (const w of widths)
+        results.push(await shooter.measure(`${server.url}${pathOf(page)}?os_mode=production`, w));
+      out.set(page.id, phoneIssuesFromProbe(doc, page.id, results, { now, actor: "phone-check" }));
+    }
+  } finally {
+    await server.close();
+  }
+  return out;
+}
+async function runPhoneCheck(root, opts = {}) {
+  const now = opts.now ?? Date.now();
+  const widths = opts.widths ?? PHONE_WIDTHS;
+  let doc = await loadSiteDocument(root);
+  const pick = (d) => Object.values(d.pages).filter(
+    (p) => !opts.pages?.length || opts.pages.includes(p.id) || opts.pages.includes(p.slug)
+  );
+  let shooter = opts.screenshotter;
+  let note;
+  let owned = false;
+  if (!shooter && opts.rendered !== false) {
+    const pw = await loadPlaywright();
+    if ("error" in pw)
+      note = "The browser check needs Playwright: run `npm i -D playwright && npx playwright install chromium` in the site folder. Only the rules that don't need a browser ran.";
+    else {
+      shooter = createScreenshotter(pw.chromium);
+      owned = true;
+    }
+  }
+  let current2 = doc;
+  const load = async () => current2;
+  const measure2 = async () => shooter && opts.rendered !== false ? measureSite(root, load, current2, shooter, pick(current2), widths, now).catch((e) => {
+    note = `The browser check couldn't run: ${e instanceof Error ? e.message.split("\n")[0] : String(e)}`;
+    return /* @__PURE__ */ new Map();
+  }) : /* @__PURE__ */ new Map();
+  try {
+    let rendered2 = await measure2();
+    const fixed = [];
+    const written = [];
+    if (opts.fix) {
+      const r = fixForPhones(doc, {
+        now,
+        actor: "phone-check",
+        rendered: [...rendered2.values()].flat()
+      });
+      if (r.ops.length) {
+        doc = r.doc;
+        current2 = doc;
+        const w = await writeSiteDocument(root, doc);
+        written.push(...w.written);
+        fixed.push(...r.fixed);
+        rendered2 = await measure2();
+      }
+    }
+    const statics = phoneCheck(doc, void 0, { now, actor: "phone-check" });
+    const pages = pick(doc).map((p) => ({
+      page: p.id,
+      title: p.title,
+      path: pathOf(p),
+      issues: sortIssues([
+        ...statics.filter((i) => i.page === p.id),
+        ...(rendered2.get(p.id) ?? []).filter((i) => i.page === p.id)
+      ])
+    }));
+    const elsewhere = [
+      ...statics.filter((i) => !i.page || !doc.pages[i.page]),
+      // Footer findings repeat on every page: report each once.
+      ...dedupe([...rendered2.values()].flat().filter((i) => i.page === "footer"))
+    ];
+    const issues = sortIssues([...elsewhere, ...pages.flatMap((p) => p.issues)]);
+    const counts2 = { error: 0, warning: 0, info: 0 };
+    for (const i of issues) counts2[i.severity]++;
+    return {
+      rendered: !!shooter && opts.rendered !== false && !note,
+      ...note ? { note } : {},
+      issues,
+      pages,
+      counts: counts2,
+      fixed,
+      written
+    };
+  } finally {
+    if (owned) await shooter?.close();
+  }
+}
+function dedupe(issues) {
+  const seen = /* @__PURE__ */ new Set();
+  return issues.filter((i) => {
+    const key2 = `${i.rule}|${i.message}`;
+    if (seen.has(key2)) return false;
+    seen.add(key2);
+    return true;
+  });
+}
+function formatPhoneReport(r, paint2) {
+  const lines = [];
+  lines.push(paint2(1, r.rendered ? "Phone check (measured at 360 and 390 px)" : "Phone check"));
+  if (r.note) lines.push(paint2(33, r.note));
+  if (r.fixed.length) {
+    lines.push(
+      paint2(32, `Fixed for phones: ${r.fixed.length} change${r.fixed.length === 1 ? "" : "s"}.`)
+    );
+    for (const f of uniqueLabels(r.fixed)) lines.push(`  \u2713 ${f}`);
+  }
+  const groups = /* @__PURE__ */ new Map();
+  for (const i of r.issues) {
+    const page = r.pages.find((p) => p.page === i.page);
+    const key2 = page ? `${page.title} (${page.path})` : i.page === "footer" ? "Footer" : "Whole site";
+    groups.set(key2, [...groups.get(key2) ?? [], i]);
+  }
+  for (const [where2, list5] of groups) {
+    lines.push("", paint2(1, where2));
+    for (const i of list5) {
+      const sev = i.severity === "error" ? paint2(31, "error  ") : i.severity === "warning" ? paint2(33, "warning") : "info   ";
+      lines.push(`  ${sev} ${i.message}`);
+      lines.push(`          ${i.autofix ? `Fix for phones: ${i.autofix.label}.` : i.fix}`);
+    }
+  }
+  const { error: error2, warning, info } = r.counts;
+  lines.push("");
+  lines.push(
+    error2 + warning === 0 ? paint2(
+      32,
+      `Looks great on phones${info ? ` (${info} suggestion${info === 1 ? "" : "s"})` : ""}.`
+    ) : `${error2} error${error2 === 1 ? "" : "s"}, ${warning} warning${warning === 1 ? "" : "s"} on phones.${r.issues.some((i) => i.autofix) && !r.fixed.length ? " Run `openspace check --phone --fix` to fix what can be fixed automatically." : ""}`
+  );
+  return lines.join("\n");
+}
+function uniqueLabels(fixed) {
+  const counts2 = /* @__PURE__ */ new Map();
+  for (const f of fixed) counts2.set(f.label, (counts2.get(f.label) ?? 0) + 1);
+  return [...counts2].map(([l, n]) => n > 1 ? `${l} (${n}\xD7)` : l);
+}
+
 // src/wow-first.ts
 var WOW_FIRST_MESSAGE = "New and imported sites always start on free GitHub Pages, so the first version goes live without any extra accounts. Shops, donations, member areas and password pages show a friendly \u201Copening soon\u201D note until you switch them on in Studio \u2192 Finish setting up (it moves the site to Cloudflare for you, with no downtime).";
 function assertGitHubPagesStart(target) {
@@ -52410,6 +54205,7 @@ async function runImportSite(io, url, dirArg, opts = {}) {
       await writeShell(dir, existing.deploy?.target ?? "github-pages", slug);
     await writeImport(dir, result);
     await writeAgentsMd(dir, result.doc.site.title);
+    await phoneFixRendered(dir, opts, io);
     const check2 = await runCheck(dir);
     const r2 = { dir, result, check: check2 };
     if (opts.summary) await writeSummary(resolve6(io.cwd, opts.summary), r2);
@@ -52427,11 +54223,21 @@ async function runImportSite(io, url, dirArg, opts = {}) {
         await rm6(join15(dir, entry), { recursive: true, force: true });
     throw e;
   }
+  await phoneFixRendered(dir, opts, io);
   const check = await runCheck(dir);
   const r = { dir, result, check };
   if (opts.summary) await writeSummary(resolve6(io.cwd, opts.summary), r);
   return r;
 }
+async function phoneFixRendered(dir, opts, io) {
+  if (!opts.render) return;
+  try {
+    const r = await runPhoneCheck(dir, { fix: true });
+    if (r.fixed.length) io.err(`  Fixed ${r.fixed.length} thing(s) for phones.`);
+  } catch (e) {
+    io.err(`  Couldn't check the pages on a phone: ${e.message.split("\n")[0]}`);
+  }
+}
 function importCounts(r) {
   const { result, check } = r;
   return {
@@ -56698,8 +58504,8 @@ var escapeText3 = (s2) => s2.replace(/&/g, "&amp;").replace(/</g, "&lt;").replac
 var escapeAttr2 = (s2) => s2.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/\{\{/g, "&#123;&#123;");
 var UTILITY = /^(?:display|italic|muted|measure|body|lead|text|small|large|wrap|wrapper|inner|container|row|col|cols|grid|flex|block|inline|content|section|item|items|list|link|links|mt|mb|my|mx|px|py|pt|pb|pl|pr|ml|mr|m|p|d|g|is|has|js|u|sr|visually|astro|w|h|max|min|font|bg|color|center|left|right|hidden|show|active|reveal|fade|animate|anim|in|out|copy|art|wf|w|elementor|wp|x|y|z|lg|md|sm|xl|xs|xxl|space|gap|align|justify|order|relative|absolute|fixed|sticky|overflow|shadow|rounded|border|ring|opacity|transition|duration|ease|delay|transform|scale|rotate|translate|uppercase|lowercase|capitalize|tracking|leading|truncate|break|whitespace|select|cursor|pointer|z)$/;
 function camel(s2) {
-  const words3 = s2.replace(/([a-z0-9])([A-Z])/g, "$1 $2").split(/[^A-Za-z0-9]+/).filter(Boolean).map((w) => w.toLowerCase());
-  const out = words3.map((w, i) => i === 0 ? w : w.charAt(0).toUpperCase() + w.slice(1)).join("").replace(/^[^a-z]+/, "");
+  const words4 = s2.replace(/([a-z0-9])([A-Z])/g, "$1 $2").split(/[^A-Za-z0-9]+/).filter(Boolean).map((w) => w.toLowerCase());
+  const out = words4.map((w, i) => i === 0 ? w : w.charAt(0).toUpperCase() + w.slice(1)).join("").replace(/^[^a-z]+/, "");
   return out.slice(0, 32);
 }
 function semanticName(el) {
@@ -56742,9 +58548,34 @@ function nameFor(el, fallback2 = "text") {
   if (!el) return fallback2;
   return semanticName(el) ?? TAG_NAME[tagOf(el)] ?? fallback2;
 }
-function humanize2(key2) {
-  const words3 = key2.replace(/([a-z])([A-Z0-9])/g, "$1 $2").toLowerCase();
-  return (words3.charAt(0).toUpperCase() + words3.slice(1)).slice(0, 60);
+var PLAIN_WORDS = {
+  cta: "button",
+  btn: "button",
+  img: "picture",
+  image: "picture",
+  pic: "picture",
+  photo: "picture",
+  desc: "description",
+  txt: "text",
+  href: "link",
+  url: "link",
+  kicker: "small label",
+  eyebrow: "small label",
+  overline: "small label",
+  lede: "intro",
+  lead: "intro",
+  subhead: "subheading",
+  bg: "background",
+  nav: "menu"
+};
+function humanize2(key2, kind) {
+  const words4 = key2.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/([A-Za-z])(\d)/g, "$1 $2").replace(/(\d)([A-Za-z])/g, "$1 $2").toLowerCase().split(/[\s_-]+/).filter(Boolean).map((w) => PLAIN_WORDS[w] ?? w);
+  const linky = words4.some((w) => w === "button" || w === "link");
+  if (linky && words4.length > 1 && words4[words4.length - 1] === "label")
+    words4[words4.length - 1] = "text";
+  if (kind === "link" && words4[words4.length - 1] !== "link") words4.push("goes to");
+  const out = words4.join(" ") || "text";
+  return (out.charAt(0).toUpperCase() + out.slice(1)).slice(0, 60);
 }
 var RESERVED2 = /* @__PURE__ */ new Set([
   "rich",
@@ -56786,7 +58617,7 @@ var FieldScope = class {
   }
   add(base, spec, value) {
     const key2 = this.key(base);
-    const label = humanize2(key2);
+    const label = humanize2(key2, spec.kind);
     this.fields[key2] = { ...spec, label };
     this.values[key2] = value;
     return key2;
@@ -57061,10 +58892,10 @@ var SectionConverter = class {
   async shapes(els, w) {
     const map2 = /* @__PURE__ */ new Map();
     const sig = (e) => `${tagOf(e)}.${classes(e).sort().join(".")}`;
-    const counts = /* @__PURE__ */ new Map();
-    for (const e of els) counts.set(sig(e), (counts.get(sig(e)) ?? 0) + 1);
+    const counts2 = /* @__PURE__ */ new Map();
+    for (const e of els) counts2.set(sig(e), (counts2.get(sig(e)) ?? 0) + 1);
     for (const e of els) {
-      if ((counts.get(sig(e)) ?? 0) < 2) continue;
+      if ((counts2.get(sig(e)) ?? 0) < 2) continue;
       const scope = new FieldScope();
       const tpl = await this.gen(e, scope, { ...w, listDepth: w.listDepth + 1 });
       const kinds = Object.entries(scope.fields).map(([k, f]) => `${k}:${f.kind}`).join(",");
@@ -58028,7 +59859,11 @@ function tokensFromPage(css, fontLinks) {
   const btn = step(/class:(?:btn|button)\b/i);
   if (btn) type.button = btn;
   if (Object.keys(type).length) tokens.type = type;
-  return { tokens, notes: read?.notes ?? [], families };
+  const nColors = Object.keys(tokens.colors ?? {}).length;
+  const nType = Object.keys(tokens.type ?? {}).length;
+  const pl = (k, w) => `${k} ${w}${k === 1 ? "" : "s"}`;
+  const note = `Read your page\u2019s styles: ${pl(nColors, "colour")}${families.length ? `, its fonts (${families.slice(0, 4).join(", ")})` : ""}${nType ? ` and ${pl(nType, "text style")}` : ""}.`;
+  return { tokens, notes: [note], families };
 }
 function linkFamilies(hrefs) {
   const out = [];
@@ -58074,6 +59909,9 @@ function siteHref(bundle, fromPath, href, pagePaths) {
   return resolved;
 }
 async function importHtmlBundle(bundle, opts) {
+  return phoneReady(await importBundle(bundle, opts));
+}
+async function importBundle(bundle, opts) {
   const progress = opts.onProgress ?? (() => void 0);
   const now = opts.now ?? /* @__PURE__ */ new Date();
   const notices = [];
@@ -58234,7 +60072,7 @@ ${await r.text()}`;
   }
   const docTitle = text(find(home.root, (e) => e.tagName === "title"));
   const wordmark = brand ? text(brand).replace(/\s+/g, " ").trim() : "";
-  const siteTitle = (opts.title ?? homePage.siteName ?? (wordmark && wordmark.length <= 60 ? titleCase(wordmark) : void 0) ?? (docTitle.split(/\s+[|·—–-]\s+/)[0] || "My site")).slice(0, 120);
+  const siteTitle = ((wordmark && wordmark.length <= 60 ? titleCase(wordmark) : void 0) ?? opts.title ?? homePage.siteName ?? (docTitle.split(/\s+[|·—–-]\s+/)[0] || "My site")).slice(0, 120);
   const logoImg = brand ? find(brand, (e) => e.tagName === "img") : void 0;
   const logoRef = logoImg ? resolveRef(bundle, attr(logoImg, "src") ?? "", home.path) : void 0;
   const segsByPage = /* @__PURE__ */ new Map();
@@ -58298,6 +60136,7 @@ ${await r.text()}`;
           const placeholder = email ? attr(email, "placeholder") : void 0;
           blocks2.push({
             kind: "newsletter",
+            ...signupAsksName(f) ? { askName: true } : {},
             ...label3 ? { buttonLabel: label3.slice(0, 40) } : {},
             ...placeholder ? { placeholder } : {}
           });
@@ -58661,8 +60500,8 @@ function componentNameFor(el, pagePath2) {
     )
   );
   const heading2 = find(el, (e) => /^h[1-3]$/.test(e.tagName));
-  const words3 = text(heading2).split(/\s+/).slice(0, 3).join(" ");
-  const raw2 = (id && id.length > 2 && !/^(?:top|main|content|section\d*)$/i.test(id) ? id : void 0) ?? cls ?? (words3 || el.tagName);
+  const words4 = text(heading2).split(/\s+/).slice(0, 3).join(" ");
+  const raw2 = (id && id.length > 2 && !/^(?:top|main|content|section\d*)$/i.test(id) ? id : void 0) ?? cls ?? (words4 || el.tagName);
   const slug = raw2.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "").replace(/^(\d)/, "s-$1").slice(0, 30).replace(/-+$/, "");
   const prefix = pagePath2 === "/" ? "" : `${pagePath2.split("/").filter(Boolean).pop()}-`;
   return `${prefix}${slug || "section"}`.replace(/^[^a-z]+/, "s-").slice(0, 36).replace(/-+$/, "");
@@ -59302,7 +61141,7 @@ async function runMcp(io, dir, opts = {}) {
 // src/fidelity.ts
 var DESKTOP = 1440;
 var COMPONENT_RETRY_BELOW = 75;
-var PHONE = 390;
+var PHONE2 = 390;
 async function launch() {
   const pw = await loadPlaywright();
   if ("error" in pw) throw new CliError(pw.error);
@@ -59345,7 +61184,7 @@ async function lookProber() {
       const out = {};
       for (const [key2, width] of [
         ["desktop", DESKTOP],
-        ["mobile", PHONE]
+        ["mobile", PHONE2]
       ]) {
         const page = await open(browser, url, width);
         try {
@@ -59494,7 +61333,7 @@ async function runCompare(original, dir, opts = {}, log = () => void 0) {
   await mkdir8(out, { recursive: true });
   if (!opts.out) await writeFile10(join18(out, ".gitignore"), "*\n");
   const pages = (opts.pages?.length ? opts.pages : defaultPages(doc)).map((p) => `/${slugOf2(p)}`);
-  const widths = opts.widths ?? [DESKTOP, PHONE];
+  const widths = opts.widths ?? [DESKTOP, PHONE2];
   const server = await startPreviewServer(root, () => loadSiteDocument(root));
   const browser = await launch();
   const oldPath = /* @__PURE__ */ new Map();
@@ -59514,7 +61353,7 @@ async function runCompare(original, dir, opts = {}, log = () => void 0) {
       await page.close().catch(() => void 0);
     }
   };
-  const measure = async () => {
+  const measure2 = async () => {
     const comparisons = [];
     const measured = [];
     const shots = /* @__PURE__ */ new Map();
@@ -59559,7 +61398,7 @@ async function runCompare(original, dir, opts = {}, log = () => void 0) {
   let best;
   let tuning;
   try {
-    best = await measure();
+    best = await measure2();
     const first2 = fidelityReport(best.comparisons);
     const rounds = Math.max(0, Math.min(5, opts.tune ?? 0));
     if (rounds && best.measured.length) {
@@ -59610,7 +61449,7 @@ async function runCompare(original, dir, opts = {}, log = () => void 0) {
             await writeSiteDocument(root, bestDoc);
             continue;
           }
-          const next = await measure();
+          const next = await measure2();
           const score = fidelityReport(next.comparisons).exact ?? 0;
           const better = score > bestScore + 0.1;
           log(
@@ -59728,10 +61567,17 @@ function fidelitySummary(report, tuning, thumbs) {
   const before = new Map(
     (tuning?.before.pages ?? []).map((p) => [`${p.path}@${p.viewport}`, p.score])
   );
+  const strictBefore = new Map(
+    (tuning?.before.pages ?? []).map((p) => [`${p.path}@${p.viewport}`, p.strict?.score])
+  );
   return {
     version: 1,
     score: report.score,
+    // The same pages by the strict v3 scorer, side by side (additive: older readers ignore it).
+    ...report.strict ? { strict: report.strict.score } : {},
+    ...report.scorer ? { scorer: report.scorer } : {},
     ...tuning ? { before: tuning.before.score, changes: tuning.changes.slice(0, 40) } : {},
+    ...tuning?.before.strict ? { strictBefore: tuning.before.strict.score } : {},
     ...tuning?.withoutComponents !== void 0 ? {
       withoutComponents: tuning.withoutComponents,
       ...tuning.withComponents !== void 0 ? { withComponents: tuning.withComponents } : {}
@@ -59740,11 +61586,15 @@ function fidelitySummary(report, tuning, thumbs) {
       const key2 = `${p.path}@${p.viewport}`;
       const b = before.get(key2);
       const worst = [...p.checks, ...p.sections.flatMap((s2) => s2.checks)].filter((c) => !c.ok && !c.credit).sort((x, y) => y.weight - x.weight).slice(0, 3).map((c) => c.what);
+      const sb = strictBefore.get(key2);
       return {
         path: p.path,
         device: p.viewport < 700 ? "phone" : "desktop",
         score: p.score,
+        ...p.strict ? { strict: p.strict.score } : {},
+        ...p.corrections?.length ? { corrections: p.corrections.slice(0, 6) } : {},
         ...b !== void 0 ? { before: b } : {},
+        ...sb !== void 0 ? { strictBefore: sb } : {},
         ...thumbs[key2] ? { image: thumbs[key2] } : {},
         ...worst.length ? { differs: worst } : {}
       };
@@ -59788,6 +61638,7 @@ async function addFidelityToSummary(file, r) {
     const summary = JSON.parse(await readFile14(file, "utf8"));
     summary.fidelity = {
       score: r.report.score,
+      ...r.report.strict ? { strict: r.report.strict.score } : {},
       ...r.tuning ? { before: r.tuning.before.score } : {}
     };
     await writeFile10(file, `${JSON.stringify(summary, null, 2)}
@@ -59796,8 +61647,9 @@ async function addFidelityToSummary(file, r) {
   }
 }
 function compareSummary(r) {
+  const strict = r.report.strict ? r.tuning?.before.strict ? ` Strict v3 scorer: ${r.tuning.before.strict.score}/100 \u2192 ${r.report.strict.score}/100 (the corrected score reads three things v3 gets wrong; see FIDELITY-REPORT.md).` : ` Strict v3 scorer: ${r.report.strict.score}/100 (the corrected score reads three things v3 gets wrong; see FIDELITY-REPORT.md).` : "";
   const lines = [
-    r.tuning ? `Visual match with the original: ${r.tuning.before.score}/100 \u2192 ${r.report.score}/100 after ${r.tuning.rounds} tuning round(s)${r.tuning.withoutComponents !== void 0 ? ` (${r.tuning.withoutComponents}/100 before recreating sections as custom components${r.tuning.withComponents !== void 0 ? "" : "; none kept"})` : ""}.` : `Visual match with the original: ${r.report.score}/100.`
+    r.tuning ? `Visual match with the original: ${r.tuning.before.score}/100 \u2192 ${r.report.score}/100 after ${r.tuning.rounds} tuning round(s)${r.tuning.withoutComponents !== void 0 ? ` (${r.tuning.withoutComponents}/100 before recreating sections as custom components${r.tuning.withComponents !== void 0 ? "" : "; none kept"})` : ""}.${strict}` : `Visual match with the original: ${r.report.score}/100.${strict}`
   ];
   for (const p of r.report.pages) {
     const off = [
@@ -59805,7 +61657,7 @@ function compareSummary(r) {
       ...p.sections.filter((s2) => s2.score < 80).map((s2) => `section ${s2.index + 1}${s2.heading ? ` "${s2.heading.slice(0, 30)}"` : ""}`)
     ];
     lines.push(
-      `  ${p.path} ${p.viewport}px: ${p.score}/100${off.length ? ` \u2014 differs: ${off.slice(0, 6).join(", ")}${off.length > 6 ? "\u2026" : ""}` : ""}`
+      `  ${p.path} ${p.viewport}px: ${p.score}/100${p.strict && p.strict.score !== p.score ? ` (strict v3 ${p.strict.score})` : ""}${off.length ? ` \u2014 differs: ${off.slice(0, 6).join(", ")}${off.length > 6 ? "\u2026" : ""}` : ""}`
     );
   }
   lines.push(`  Report and side-by-side images: ${join18(r.out, "FIDELITY-REPORT.md")}`);
@@ -60025,14 +61877,23 @@ async function runMigrate(root, opts = {}) {
 var VERSION = "0.1.0";
 function createProgram(io, setExit, deps = {}) {
   const program = new Command("openspace").description("Check, preview, migrate, scaffold and serve OpenSpace sites to Claude (MCP).").version(VERSION).configureOutput({ writeOut: (s2) => io.out(s2.trimEnd()), writeErr: (s2) => io.err(s2.trimEnd()) }).exitOverride();
-  program.command("check").argument("[dir]", "site folder (default: the current folder)").description("Validate content: schemas, links, images, size budgets and secrets.").option("--ci", "CI mode: also print GitHub Actions annotations").option("--json", "print the report as JSON").option("--media-warn-mb <n>", "media folder warning threshold in MB", Number).option("--media-fail-mb <n>", "media folder failure threshold in MB", Number).action(
+  program.command("check").argument("[dir]", "site folder (default: the current folder)").description("Validate content: schemas, links, images, size budgets and secrets.").option("--ci", "CI mode: also print GitHub Actions annotations").option("--json", "print the report as JSON").option("--media-warn-mb <n>", "media folder warning threshold in MB", Number).option("--media-fail-mb <n>", "media folder failure threshold in MB", Number).option("--phone", "also run the Phone check in a real browser (Playwright) at 360 and 390 px").option("--fix", "with --phone: fix everything for phones (writes the content files)").action(
     async (dir, opts) => {
+      let phone;
+      if (opts.phone || opts.fix) {
+        phone = await runPhoneCheck(resolve10(io.cwd, dir ?? "."), { fix: opts.fix });
+        if (!opts.json) {
+          io.out(formatPhoneReport(phone, (code3, s2) => paint(colorEnabled(io), code3, s2)));
+          io.out("");
+        }
+        if (phone.counts.error) setExit(1);
+      }
       const budgets = {};
       if (opts.mediaWarnMb !== void 0) budgets.mediaWarnBytes = opts.mediaWarnMb * 1024 * 1024;
       if (opts.mediaFailMb !== void 0) budgets.mediaFailBytes = opts.mediaFailMb * 1024 * 1024;
       const report = await runCheck(resolve10(io.cwd, dir ?? "."), { budgets });
       if (opts.json) {
-        io.out(JSON.stringify(report, null, 2));
+        io.out(JSON.stringify(phone ? { ...report, phone } : report, null, 2));
       } else {
         if (opts.ci) for (const line of githubAnnotations(report)) io.out(line);
         const color = colorEnabled(io);
@@ -60388,4 +62249,4 @@ export {
   createProgram,
   run
 };
-//# sourceMappingURL=chunk-TDLUJHWB.js.map
+//# sourceMappingURL=chunk-JDVCOOGD.js.map