rapier-markdown-kit 1.2.3 → 1.2.6

package/dist/packages/rapier-diff/walk.mjs

@@ -0,0 +1,219 @@
+// SPDX-License-Identifier: MIT
+import {words, letter, within, prev, next} from './tokens.mjs';
+
+// Exact source records for a range: lines, then words, then characters, or structural parts when supplied.
+export function walker(c) {
+  const {before, after, spend, safe, budget, raw, chars, code, segmenter, tokens, matches} = c;
+  function record(a0, a1, b0, b1, unit, part, coarse = false) {
+    if (a1 - a0 === b1 - b0 && before.slice(a0, a1) === after.slice(b0, b1)) return;
+    // Internal records: before, after, coarse, concern, transported fragments.
+    c.result.push([[a0, a1], [b0, b1], coarse, [a0 === a1 ? 2 : b0 === b1 ? 0 : 1, part?.kind || unit, part?.name]]);
+  }
+
+  // A line deletion or insertion holding whole named parts and only blank text besides is one record per part,
+  // cut at line starts, so each keeps its own name (and its callers' breaks).
+  function name(from, ownersA, ownersB) {
+    for (let r = from; r < c.result.length; r++) {
+      const [[a0, a1], [b0, b1]] = c.result[r], side = a0 === a1 ? 1 : b0 === b1 ? 0 : -1;
+      if (side < 0) continue;
+      const [s0, s1] = c.result[r][side], text = side ? after : before;
+      const parts = (side ? ownersB : ownersA).filter(part => part?.name && part.start >= s0 && part.end <= s1);
+      if (!parts.length || !spend(s1 - s0)) continue;
+      let blank = text.slice(s0, parts[0].start);
+      for (let k = 1; k <= parts.length; k++) blank += text.slice(parts[k - 1].end, parts[k]?.start ?? s1);
+      if (/\S/.test(blank)) continue;
+      const rows = parts.map((part, k) => {
+        const start = k ? Math.max(parts[k - 1].end, text.lastIndexOf('\n', part.start - 1) + 1) : s0;
+        return [start, part];
+      });
+      c.result.splice(r, 1, ...rows.map(([start, part], k) => {
+        const end = rows[k + 1]?.[0] ?? s1, here = [side ? [a0, a0] : [start, end], side ? [start, end] : [b0, b0]];
+        return [here[0], here[1], false, [side ? 2 : 0, part.kind, part.name]];
+      }));
+      r += rows.length - 1;
+    }
+  }
+
+  // A search step scans at most one fixed-size source chunk.
+  function common(a, b, end, step) {
+    let n = 0;
+    while (n < end && spend()) {
+      const stop = Math.min(end, n + 256);
+      while (n < stop && before.charCodeAt(a) === after.charCodeAt(b)) { n++; a += step; b += step; }
+      if (n < stop) break;
+    }
+    return n;
+  }
+
+  function walk(a0, a1, b0, b1, level, ap, bp, context) {
+    if (a1 - a0 === b1 - b0 && before.slice(a0, a1) === after.slice(b0, b1)) return;
+    if (!spend()) { record(a0, a1, b0, b1, 'block', context, true); return; }
+    const structural = level <= 0 && level > -128 && (ap?.length || bp?.length);
+    if (!structural && raw !== 'word') {
+      let n = common(a0, b0, Math.min(a1 - a0, b1 - b0), 1);
+      while (n && (!safe(before, a0 + n) || !safe(after, b0 + n) || !raw && level < 3 && (within(before, a0 + n) || within(after, b0 + n)))) {
+        if (!spend()) { n = 0; break; } n--;
+      }
+      if (level === 1 && n) {
+        const next = Math.max(0, before.lastIndexOf('\n', a0 + n - 1) + 1 - a0);
+        spend(Math.ceil((n - next) / 256)); n = next;
+      }
+      a0 += n; b0 += n;
+      n = common(a1 - 1, b1 - 1, Math.min(a1 - a0, b1 - b0), -1);
+      while (n && (!safe(before, a1 - n) || !safe(after, b1 - n) || !raw && level < 3 && (within(before, a1 - n) || within(after, b1 - n)))) {
+        if (!spend()) { n = 0; break; } n--;
+      }
+      if (level === 1) while (n && (before[a1 - n - 1] !== '\n' || after[b1 - n - 1] !== '\n' || before[a1 - n] === '\n' || after[b1 - n] === '\n')) { if (!spend()) { n = 0; break; } n--; }
+      a1 -= n; b1 -= n;
+      if (budget.left < 0) { record(a0, a1, b0, b1, 'block', context, true); return; }
+    }
+    let unit = level >= 3 ? 'char' : level === 2 ? 'word' : 'line';
+    if (!raw && level === 2 && a1 - a0 + b1 - b0 <= 4 && [...before.slice(a0, a1), ...after.slice(b0, b1)].length <= 2 &&
+    letter(prev(before, a0) || prev(after, b0)) && letter(next(before, a1) || next(after, b1))) unit = 'char';
+    if (!structural && (a0 === a1 || b0 === b1)) { record(a0, a1, b0, b1, unit, context); return; }
+    const left = tokens(before, a0, a1, structural ? 0 : Math.max(1, level), ap);
+    const right = tokens(after, b0, b1, structural ? 0 : Math.max(1, level), bp);
+    if (!left || !right) { record(a0, a1, b0, b1, unit, context, true); return; }
+    const [a, x, ownersA] = left, [b, y, ownersB] = right, pairs = matches(a, b);
+    let ai = 0, bi = 0;
+    for (let i = 0; i <= a.length; i++) {
+      const j = i === a.length ? b.length : pairs[i];
+      if (j === undefined) continue;
+      const x0 = x[ai], x1 = x[i], y0 = y[bi], y1 = y[j];
+      if (ai < i || bi < j) {
+        if (budget.left < 0 || pairs.coarse?.has(ai)) record(x0, x1, y0, y1, unit, context, true);
+        else if (structural && (ai === i || bi === j)) {
+          for (let k = ai; k < i; k++) record(x[k], x[k + 1], y0, y0, unit, ownersA[k] || context);
+          for (let k = bi; k < j; k++) record(x1, x1, y[k], y[k + 1], unit, ownersB[k] || context);
+        } else if (structural) {
+          const p = ownersA[ai], q = ownersB[bi];
+          if (i - ai === 1 && j - bi === 1 && p && q && p.kind === q.kind) walk(x0, x1, y0, y1, level - 1, p.children, q.children, q);
+          else {
+            const from = c.result.length;
+            walk(x0, x1, y0, y1, 1, null, null, context);
+            name(from, ownersA.slice(ai, i), ownersB.slice(bi, j));
+          }
+        } else if (level < 2 && raw !== 'line') lines(x.slice(ai, i + 1), y.slice(bi, j + 1), context);
+        else if (level === 2 && chars && !raw && i - ai <= 1 && j - bi <= 1 && x1 - x0 + y1 - y0 < 100) {
+          // A changed token is replaced whole unless the caller asks for the characters inside it.
+          walk(x0, x1, y0, y1, 3, null, null, context);
+        } else record(x0, x1, y0, y1, unit, context);
+      }
+      if (i < a.length) {
+        const p = ownersA[i], q = ownersB[j];
+        if ((p || q || level <= 1 && !raw) && before.slice(x[i], x[i + 1]) !== after.slice(y[j], y[j + 1]))
+          walk(x[i], x[i + 1], y[j], y[j + 1], p || q ? level - 1 : 3, p?.children, q?.children, q || p || context);
+      }
+      ai = i + 1; bi = j + 1;
+    }
+  }
+
+  // Unequal lines pair in order by shared words. A line sharing under a quarter of its words with every candidate is
+  // replaced whole: an inserted line never borrows a neighbor's words, and a rewrite never reads as stray fragments.
+  function lines(x, y, context) {
+    const n = x.length - 1, m = y.length - 1;
+    if (n * m > 4096 || !spend(n * m + x[n] - x[0] + y[m] - y[0])) return row(x[0], x[n], y[0], y[m], context);
+    // A renamed name's sites count as shared words.
+    if (!c.renames) {
+      c.renames = [[], []];
+      for (const [p, old] of c.aliases || []) if (before.slice(...old.nameAt) !== after.slice(...p.nameAt)) {
+        c.renames[0].push(old.nameAt, ...c.la.filter(l => l.key === old.key).map(l => l.at));
+        c.renames[1].push(p.nameAt, ...c.lb.filter(l => l.key === p.key).map(l => l.at));
+      }
+    }
+    const weight = (side, a, b) => {
+      const counts = new Map(), text = side ? after : before;
+      for (const [c, d] of words(segmenter, text.slice(a, b))) counts.set(text.slice(a + c, a + d), (counts.get(text.slice(a + c, a + d)) || 0) + d - c);
+      return [counts, [...counts.values()].reduce((n, v) => n + v, 0), c.renames[side].reduce((n, at) => n + Math.max(0, Math.min(b, at[1]) - Math.max(a, at[0])), 0)];
+    };
+    const left = x.slice(0, -1).map((at, k) => weight(0, at, x[k + 1])), right = y.slice(0, -1).map((at, k) => weight(1, at, y[k + 1]));
+    const best = Array.from({length: n + 1}, () => new Float64Array(m + 1)), pairs = [];
+    for (let k = 1; k <= n; k++) for (let l = 1; l <= m; l++) {
+      const [a, sa, ra] = left[k - 1], [b, sb, rb] = right[l - 1];
+      let shared = sa || sb ? Math.max(ra, rb) : 0.5;
+      for (const [key, v] of a) shared += Math.min(v, b.get(key) || 0);
+      best[k][l] = Math.max(best[k - 1][l], best[k][l - 1], shared * 4 > Math.max(sa, sb) && best[k - 1][l - 1] + shared);
+    }
+    for (let k = n, l = m; k && l;) {
+      if (best[k][l] === best[k - 1][l]) k--;
+      else if (best[k][l] === best[k][l - 1]) l--;
+      else pairs.unshift([--k, --l]);
+    }
+    let k = 0, l = 0;
+    for (const [p, q] of [...pairs, [n, m]]) {
+      // A merge compares one line against one line by character, whatever they share.
+      if (raw === 'char' && p - k === 1 && q - l === 1) row(x[k], x[p], y[l], y[q], context);
+      else if (k < p || l < q) record(x[k], x[p], y[l], y[q], 'line', context);
+      if (p < n) row(x[p], x[p + 1], y[q], y[q + 1], context);
+      k = p + 1; l = q + 1;
+    }
+  }
+
+  // A table row with the same number of cells on both sides changes cell by cell; a character diff stays in its line.
+  function row(a0, a1, b0, b1, context) {
+    if (raw === 'char') return walk(a0, a1, b0, b1, 3, null, null, context);
+    const cells = (text, a, b) => /^[ \t]*\|/.test(text.slice(a, b)) && [...text.slice(a, b).matchAll(/(?<!\\)\|/g)].map(m => a + m.index);
+    const p = !code && cells(before, a0, a1), q = p && cells(after, b0, b1);
+    if (!q || p.length !== q.length || !spend(p.length)) return walk(a0, a1, b0, b1, 2, null, null, context);
+    for (let k = 0; k <= p.length; k++) walk(k ? p[k - 1] + 1 : a0, p[k] ?? a1, k ? q[k - 1] + 1 : b0, q[k] ?? b1, 2, null, null, context);
+  }
+
+  // Surviving source pieces keep the occurrence witnessed by the host.
+  function operations(rows) {
+    if (!Array.isArray(rows)) return null;
+    const pieces = [[0, before.length]];
+    let length = before.length, steps = 1e7;
+    const verify = n => {
+      if ((steps -= n) >= 0) return true;
+      budget.left = -1; return false;
+    };
+    const split = at => {
+      let position = 0;
+      for (let i = 0; i < pieces.length; i++) {
+        const [start, end, text] = pieces[i], size = end - start;
+        if (position === at) return i;
+        if (position + size > at) {
+          const n = at - position;
+          pieces.splice(i, 1, [start, start + n, text], [start + n, end, text]);
+          return i + 1;
+        }
+        position += size;
+      }
+      return pieces.length;
+    };
+    for (const row of rows) {
+      if (!row || !Number.isSafeInteger(row.pos) || typeof row.removed !== 'string' || typeof row.inserted !== 'string' ||
+        row.pos < 0 || row.pos + row.removed.length > length || !verify(pieces.length * 2 + 1)) return null;
+      const left = split(row.pos), right = split(row.pos + row.removed.length);
+      let at = 0;
+      for (let i = left; i < right; i++) {
+        const [start, end, text = before] = pieces[i];
+        if (!row.removed.startsWith(text.slice(start, end), at)) return null;
+        at += end - start;
+      }
+      if (row.removed === row.inserted) continue;
+      pieces.splice(left, right - left, [0, row.inserted.length, row.inserted]);
+      length += row.inserted.length - row.removed.length;
+    }
+    if (length !== after.length) return null;
+    const spans = [];
+    let a = 0, b = 0, at = 0;
+    for (const [start, end, text] of pieces) {
+      const size = end - start;
+      if (!verify(1) || !after.startsWith((text ?? before).slice(start, end), at)) return null;
+      if (text === undefined) {
+        let x = start, y = at, tail = end;
+        while (x < tail && (!safe(before, x) || !safe(after, y))) { x++; y++; if (!verify(1)) return null; }
+        while (tail > x && (!safe(before, tail) || !safe(after, at + tail - start))) { tail--; if (!verify(1)) return null; }
+        if (tail > x) {
+          if (a !== x || b !== y) spans.push([a, x, b, y]);
+          a = tail; b = at + tail - start;
+        }
+      }
+      at += size;
+    }
+    if (a !== before.length || b !== after.length) spans.push([a, before.length, b, after.length]);
+    return spans;
+  }
+  return {record, name, walk, operations};
+}

package/dist/spec/html-blocks.mjs

@@ -73,8 +73,8 @@ export function htmlImageRecord(raw) {
     tokenEnd: raw.length, source: raw, placement: fence.layout, standalone: true, imageOnly: true};
 }
 
-// The editor's bounded worker splits before layout annotation. Join only the
-// exact adjacent marker proven by this same source grammar, preserving offsets.
+// The first phase of the editor's bounded worker splits before layout annotation. Join only
+// the exact adjacent marker proven by this same source grammar, preserving offsets.
 export function mergeHtmlObjectBlocks(blocks, source) {
   for (let index = 0; index + 1 < blocks.length; index++) {
     const block = blocks[index], next = blocks[index + 1];
@@ -104,7 +104,7 @@ export function htmlLayoutEdit(record, value) {
 }
 
 // Change only owned header tokens. Body, fence spelling, class/id and unrelated attributes stay exact.
-export function htmlInfoEdit(info, changes) {
+function htmlInfoEdit(info, changes) {
   let text = info;
   for (const [key, value] of Object.entries(changes)) {
     const pattern = new RegExp('(^|[\\s{])\\s*' + key + '=(?:"[^"]*"|\'[^\']*\'|[^\\s}]+)', 'g');

package/dist/spec/md-layout.mjs

@@ -167,7 +167,7 @@ export function wrapTextBlock(element) {
     element.textContent.trim() && !element.querySelector('img,table,pre,figure,math,.math-rendered') ? element : null;
 }
 
-// The one wrap-owner rule (layout/browser.js, layout/interchange.js, editor/share.js): text after, else before, skipping pictures,
+// The one wrap-owner rule (layout/browser.js, kit/render.mjs, editor/share.js): text after, else before, skipping pictures,
 // metadata and empty paragraphs; any other block is a barrier in that direction.
 export function wrapNeighbour(node, classify) {
   for (const step of [n => n && n.nextElementSibling, n => n && n.previousElementSibling]) {

package/dist/spec/md-marks.mjs

@@ -10,10 +10,10 @@ const inkReader = () => {
 	const COLOR_NAME_ALT = Object.keys(TEXT_COLOR_NAMES).join('|');
 	const COLOR_VALUE = '(?:#[0-9a-f]{6}|' + COLOR_NAME_ALT + ')';
 
-	// Ink (docs/markdown-standard.md, "Ink"): a pen stroke that stays with the words it marks, a paired comment with the colour span's shape. The
+	// Ink (docs/markdown-standard.md, "Ink"): a pen stroke that stays with the words it marks, a paired comment with the color span's shape. The
 	// opener holds the stroke:
 	//   <!--ink KIND [NUMBER] [COLOUR] [w=N] [box=W,H] [at=X,Y] [PATH]-->words<!--/ink-->
-	// KIND is the stroke's kind, decided once when it was lifted; COLOUR is exactly the colour span's value, red when absent; box is the frame's
+	// KIND is the stroke's kind, decided once when it was lifted; COLOUR is exactly the color span's value, red when absent; box is the frame's
 	// size when the stroke was drawn and at the frame's offset from the words' box, both in hundredths of an em; w is the pen's width as Draw
 	// counts a nib (2 to 24; 9 is the default and is never written): the stroke is drawn 0.11 em wide at 9 and in proportion to w otherwise; PATH
 	// is the stroke, its first point absolute in the frame and the rest as moves, hundredths of an em. One spelling: the fields in this order,
@@ -74,7 +74,7 @@ const TEXT_COLOR_HEX_TO_NAME = Object.freeze(
 );
 const PAGE_BREAK_MARKER = '<!--md-break:v1 page-->';
 
-export { TEXT_COLOR_NAMES, TEXT_COLOR_HEX_TO_NAME, PAGE_BREAK_MARKER };
+export { TEXT_COLOR_NAMES, PAGE_BREAK_MARKER };
 
 export function formatColorRun(hex, content) {
 	return typography.wrap({color: hex}, content);
@@ -338,7 +338,7 @@ export function formatInkOpen(mark) {
 	let colour = '';
 	if (mark.hex != null) {
 		const value = TEXT_COLOR_HEX_TO_NAME[mark.hex] || mark.hex;
-		if (!new RegExp('^' + COLOR_VALUE + '$').test(value)) throw new TypeError('ink: the colour is the colour span\'s value');
+		if (!new RegExp('^' + COLOR_VALUE + '$').test(value)) throw new TypeError('ink: the color is the color span\'s value');
 		colour = ' ' + value;
 	}
 	if (mark.width != null && (!Number.isInteger(mark.width) || mark.width < 2 || mark.width > 24)) throw new TypeError('ink: the width is an integer from 2 to 24, and 9 is spelled by leaving it out');
@@ -442,7 +442,7 @@ export function pairInkSpans(source, markers = null) {
 	return pairSpanMarkers(source, 'ink', markers);
 }
 
-// Colour keeps its first opener; ink pairs each closer with the innermost opener. The shared range
+// Color keeps its first opener; ink pairs each closer with the innermost opener. The shared range
 // shape lets custody owners keep every independent stroke, including strokes on identical words.
 export function pairMarkers(source, kind, markers = null) {
 	const paired = pairSpanMarkers(source, kind, markers);

package/dist/spec/md-source.mjs

@@ -28,6 +28,10 @@ export function markdownSourcePositions(source, parser) {
     }
     return matched;
   });
+  // A core rule may rewrite an inline token's content after its children were parsed (a task item drops
+  // its `[ ] `). Map rows from the text the inline rules read.
+  const read = new WeakMap();
+  inline.parse = function (text, md, env, children) { read.set(children, text); return parser.inline.parse.call(this, text, md, env, children); };
   const {tokens, cells} = markdownTableSources(body, owner, {}, lines);
   const readInline = (children, content, rawOffset) => {
     for (const child of children || []) {
@@ -68,26 +72,30 @@ export function markdownSourcePositions(source, parser) {
       }
       continue;
     }
-    if (token.type !== 'inline' || !token.content) continue;
+    const content = read.get(token.children) ?? token.content;
+    if (token.type !== 'inline' || !content) continue;
     let rawOffset;
     if (token.map) {
-      const offsets = [], starts = [], rows = token.content.split('\n');
+      const offsets = [], starts = [], spaces = [], rows = content.split('\n');
       let local = 0;
       for (let i = 0; i < rows.length; i++) {
-        const start = lineAt(token.map[0] + i), end = lineAt(token.map[0] + i + 1);
-        const at = source.slice(start, end).replace(/\0/g, '\ufffd').indexOf(rows[i]);
+        const start = lineAt(token.map[0] + i), end = lineAt(token.map[0] + i + 1), line = source.slice(start, end).replace(/\0/g, '\ufffd');
+        let at = line.indexOf(rows[i]), lead = 0;
+        // A container that consumes part of a tab leaves the rest as spaces the source does not hold.
+        // They all stand for that tab.
+        if (at < 0) { const rest = rows[i].replace(/^ +/, ''); lead = rows[i].length - rest.length; at = line.indexOf(rest); if (!lead || line[at - 1] !== '\t') at = -1; }
         if (at < 0) throw new Error('Markdown inline source mapping failed');
-        starts.push(local); offsets.push(start + at); local += rows[i].length + 1;
+        starts.push(local); spaces.push(lead); offsets.push(start + at - lead); local += rows[i].length + 1;
       }
       rawOffset = pos => {
         let row = starts.length - 1;
         while (row > 0 && starts[row] > pos) row--;
-        return offsets[row] + pos - starts[row];
+        return offsets[row] + Math.max(pos - starts[row], spaces[row] - 1);
       };
     } else if (cells.has(token)) {
       rawOffset = cells.get(token);
     } else continue;
-    readInline(token.children, token.content, rawOffset);
+    readInline(token.children, content, rawOffset);
   }
   literal.sort((a, b) => a.start - b.start || b.end - a.end);
   const merged = [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rapier-markdown-kit",
-  "version": "1.2.3",
+  "version": "1.2.6",
   "description": "Read, render and write Self-contained Markdown: one .md file that carries its pictures, drawings and layout, and that any Markdown app can read. HTML renderer, stylesheet, text layout, Will/1 agent permissions, and an edit history with authorship and offline merge. MIT, no dependencies.",
   "keywords": [
     "markdown",

package/style.css

@@ -267,9 +267,9 @@
 .md-render h2{font-size:calc(var(--md-text-body) * 1.9);line-height:calc(var(--md-line) * 1.5);font-weight:var(--md-fw-semibold)}
 .md-render h3{font-size:calc(var(--md-text-body) * 1.5);line-height:calc(var(--md-line) * 1.5);font-weight:var(--md-fw-semibold)}
 .md-render h4{font-size:calc(var(--md-text-body) * 1.25);font-weight:var(--md-fw-semibold)}
-/* h5/h6 complete the six-level hierarchy: modest but owned (explicit size/weight/colour), never
+/* h5/h6 complete the six-level hierarchy: modest but owned (explicit size/weight/color), never
    the browser default. Size stays strictly monotonic below h4; h6 sits at the body's own size and
-   firms up weight and dims colour, since its size alone would read as body text. */
+   firms up weight and dims color, since its size alone would read as body text. */
 .md-render h5{font-size:calc(var(--md-text-body) * 1.1);font-weight:var(--md-fw-semibold)}
 .md-render h6{font-size:var(--md-text-body);font-weight:var(--md-fw-semibold);color:var(--md-heading-muted-color)}
 .md-render p{margin:0 0 var(--md-gap-paragraph)}
@@ -300,9 +300,9 @@
 
 .md-render .task-list-item input[type="checkbox"] {
 	--md-task-box: clamp(14px, .92em, 24px);
-	/* A form control does not inherit colour on its own; the shell's own app sheet gives it one
+	/* A form control does not inherit color on its own; the shell's own app sheet gives it one
 	   (`input,textarea,select{...color:inherit}`) and an exported page does not carry that sheet, so
-	   it says so here. The drawn box names its own colours, so this changes no pixel today -- it
+	   it says so here. The drawn box names its own colors, so this changes no pixel today -- it
 	   stops the two surfaces disagreeing about a property, which is how the next rule that does
 	   depend on it would go wrong quietly. */
 	color: inherit;
@@ -321,10 +321,10 @@
 	touch-action: manipulation;
 }
 /* The box and its tick are Feather's square and check-square, with squared corners: drawn on Feather's
-   24-unit grid with its 2-unit stroke, the box's corners mitred square, and a ticked box opens at its
+   24-unit grid with its 2-unit stroke, the box's corners mitered square, and a ticked box opens at its
    top right where the tick breaks out through it. The grid is a third wider than the box itself (the
    box is units 3 to 21), so the painted square keeps exactly the place and size --rapier-task-box gave
-   it; the ink is --color-line through a mask, so the theme recolours it and an export needs nothing
+   it; the ink is --color-line through a mask, so the theme recolors it and an export needs nothing
    more than the data: images its policy already admits. The three glyphs are written here once, and a
    Notes card's check rows read these same three (rapier-notes.css: one SVG per icon across Rapier). */
 :root,.md-render {
@@ -367,7 +367,7 @@
 .md-render ol>li::before{
 	content:counter(rapier-ol);
 	position:absolute;
-	/* The circle is centred on the item's first line: the li's own padding, plus half of what the 2rem circle is taller than one line. */
+	/* The circle is centered on the item's first line: the li's own padding, plus half of what the 2rem circle is taller than one line. */
 	inset-inline-start:calc(-2.75 * var(--md-unit) + var(--md-marker, 0px)); top:calc(calc(0.15 * var(--md-unit)) + (var(--md-line) - calc(2 * var(--md-unit))) / 2);
 	width:calc(2 * var(--md-unit)); height:calc(2 * var(--md-unit));
 	display:flex; align-items:center; justify-content:center;
@@ -581,7 +581,7 @@
 }
 
 /* Page break: unobtrusive by design, the same weight as .section-fold-btn (rapier-editor.css) --
-	 muted colour and .37 opacity, never the stronger --color-line the horizontal-rule variants use.
+	 muted color and .37 opacity, never the stronger --color-line the horizontal-rule variants use.
 	 Invisible on paper: this sheet's print rule zeros this out and applies the actual break instead. */
 .md-render [data-md-break]{
 	position:relative;
@@ -642,7 +642,7 @@
 	font-size: var(--md-text-sm);
 	color: var(--md-color-text-secondary);
 }
-/* A view preference can keep embedded SVGs on their original light-paper colours. */
+/* A view preference can keep embedded SVGs on their original light-paper colors. */
 html[data-invert-image-alpha="off"] :is(img,.md-render svg.rapier-native-flowchart){color-scheme:light}
 .md-render img{
 	max-width:100%;height:auto;
@@ -675,9 +675,9 @@ html:not([data-layout="plain"]) .md-render img[data-rapier-image-geometry="auto"
 .md-render mark[data-rapier-highlight="blue"]{--md-highlight-color:#4f91f7}
 .md-render mark[data-rapier-highlight="yellow"]{--md-highlight-color:#e6b91e}
 .md-render mark[data-rapier-highlight="purple"]{--md-highlight-color:#9b6dea}
-/* Text colour: the canonical (light) hex and its OKLCH-derived dark pair both ship as inline
+/* Text color: the canonical (light) hex and its OKLCH-derived dark pair both ship as inline
 	 custom properties on the run itself (editor/engine.js, §b) — this just picks between them the
-	 same way as the document palette: the document colour scheme chooses the matching value. The five named swatches also carry a literal,
+	 same way as the document palette: the document color scheme chooses the matching value. The five named swatches also carry a literal,
 	 pre-computed --md-color-dark here, so the common case survives even a round-trip that kept
 	 data-md-color but dropped style, exactly like highlight's own swatch constants. */
 .md-render [data-md-color]{--md-color-dark:var(--md-color);color:light-dark(var(--md-color),var(--md-color-dark))}