@voithos-labs/aragonite 0.10.2 → 0.10.3

package/dist/selection/drag-pointer.js

@@ -3,7 +3,8 @@
  * `createPointerDragSession`, whose document-level listeners deliver events even after the
  * pointer leaves the originating block.
  */
-import { applyCollapsedCaret } from './native-bridge';
+import { applyCollapsedCaret, applySingleBlockRange, clearNativeSelection } from './native-bridge';
+import { isWholeBlockEndpoint } from './primitives';
 import { comparePaths } from './path-math';
 import { createPointerDragSession } from './pointer-session';
 import { blockNearPoint } from './nearest-block';
@@ -18,24 +19,74 @@ export function installDragListener(ctx, anchorPoint, down) {
         if (!near)
             return;
         if (comparePaths(near.path, anchorPoint.path) === 0) {
+            if (!('offset' in anchorPoint)) {
+                if (ctx.paintSameBlock)
+                    takeAnchorBlockWhole();
+                return;
+            }
             if (ctx.selection.isCrossBlock) {
                 // Pointer returned to the anchor block: collapse so the overlay stops painting a
                 // stale remote range. The browser's drag has been extending the native selection
                 // underneath all along, so handing back gives the right single-block highlight.
                 ctx.selection.collapse();
             }
+            if (ctx.paintSameBlock)
+                paintSameBlockRange(near.endpointHere());
             return;
         }
         const focusPoint = near.endpointHere();
         if (!focusPoint)
             return;
-        if (!ctx.selection.isCrossBlock) {
+        if (isWholeBlockEndpoint(focusPoint) && !reachedCentreLine(near.path, clientY))
+            return;
+        // A whole unit re-enters rather than extends: its anchor's side is resolved against the
+        // new focus by the entry, where an extend would keep the unit's start as the anchor.
+        if (!ctx.selection.isCrossBlock || ctx.selection.wholeUnitPath) {
             ctx.selection.enterCrossBlock(anchorPoint, focusPoint);
         }
         else {
             ctx.selection.extendFocus(focusPoint);
         }
     }
+    // A block with no positions inside it is in or out as a unit, and the unit joins the range
+    // once the pointer has crossed its centre line coming from the anchor's side: a sweep that
+    // merely touched its edge has not asked for it. Not reached, the last focus stands, so the
+    // range grows to the block only when the pointer commits to it.
+    function reachedCentreLine(path, clientY) {
+        const box = ctx.getBlockElByPath(path)?.getBoundingClientRect();
+        if (!box)
+            return true;
+        const middle = box.top + box.height / 2;
+        return comparePaths(anchorPoint.path, path) < 0 ? clientY >= middle : clientY <= middle;
+    }
+    // A whole-block anchor (a table, an equation) has nothing to paint natively either, and a range
+    // that only appears once the pointer reaches ANOTHER block reads as a drag that does nothing.
+    // The block is taken whole the moment the pointer moves, as the unit the state stores and the
+    // overlay paints (`wholeUnitPath`); a pointer returning from outside takes it whole again.
+    function takeAnchorBlockWhole() {
+        if (ctx.selection.wholeUnitPath)
+            return;
+        // Both ends whole: the pointer's position INSIDE the block is not a rectangle to grow (a
+        // press beside a table dragged up over it would otherwise select the rows below the
+        // pointer, the opposite of the sweep). The block is the unit until the drag leaves it.
+        ctx.selection.enterCrossBlock(anchorPoint, {
+            path: anchorPoint.path.slice(),
+            wholeBlock: true
+        });
+    }
+    // A margin-started drag has no native selection under it, so the range inside the anchor
+    // block is written here, and the block takes focus so the range is live for the next key.
+    function paintSameBlockRange(focusPoint) {
+        if (!focusPoint || !('offset' in focusPoint) || !('offset' in anchorPoint))
+            return;
+        const blockEl = ctx.getBlockElByPath(anchorPoint.path);
+        if (!blockEl)
+            return;
+        // A no-op once it holds focus; the range is a DOM Range, so it is written low-to-high (a
+        // drag from the right margin leftward would otherwise collapse it).
+        blockEl.focus({ preventScroll: true });
+        applySingleBlockRange(blockEl, Math.min(anchorPoint.offset, focusPoint.offset), Math.max(anchorPoint.offset, focusPoint.offset));
+    }
     // Pointer may land on a scrollable element directly (the table's `.table-block` edge), so
     // search from `target` itself, not its parent.
     function scrollableSelfOrAncestor(target) {
@@ -79,6 +130,14 @@ function parkCaretInFocusBlock(ctx) {
     const focus = ctx.selection.focus;
     if (!focus)
         return;
+    // A whole unit has no text node for a caret: focus parks on the editor root, whose keydown
+    // and clipboard arms serve a custom range (as they do for a windowed-out block), with no
+    // native range left behind for the browser to act on.
+    if (ctx.selection.wholeUnitPath) {
+        clearNativeSelection();
+        ctx.editorRoot.focus({ preventScroll: true });
+        return;
+    }
     // A drag ending inside a table leaves a focus addressing the table block by cell index; the
     // landing is the cell that actually holds a caret.
     const landing = ctx.selection.cellLandingFor(focus);

package/dist/selection/gap-caret.js

@@ -4,7 +4,7 @@
  * in, boolean out; `tryGapStop` is the one seam that turns it into an arrival.
  * The gap is deliberately not a `SelectionPoint`: it is never a cross-block endpoint.
  */
-import { isBlockNode, nodeAt } from '../tree-operations/node-ops';
+import { isBlockNode, nodeAt } from '../tree-operations/node-primitives';
 import { tryGetBlockKindDescriptor } from '../schema/block-kind-descriptor';
 import { isReadingMode } from '../presentation-mode';
 import { placeGapCaret } from './caret-doors';

package/dist/selection/keyboard-extend.js

@@ -3,7 +3,7 @@ import { isVerticallyTransparentNode } from '../core/inline/transparency';
 import { readNativeCaretInBlock, applyCollapsedCaret, focusCollapsedCaret, applySingleBlockRange, clearNativeSelection } from './native-bridge';
 import { offsetFromViewportPoint } from '../cursor/point-offset';
 import { nextPath, previousPath, firstPath, lastPath, firstLeafAtOrAfter, lastLeafAtOrBefore, findCellPathForElement } from './path-lookup';
-import { nodeAt } from '../tree-operations/node-ops';
+import { nodeAt } from '../tree-operations/node-primitives';
 import { comparePaths, isStrictAncestorOf, pathsEqual } from './path-math';
 import { displayLength } from '../core/lines';
 // ── Enter / Collapse / Scroll ──────────────────────────────────────────────

package/dist/selection/path-lookup.js

@@ -1,5 +1,5 @@
 /** Document-tree path navigation. Pure functions over a Document + path. */
-import { nodeAt } from '../tree-operations/node-ops';
+import { nodeAt } from '../tree-operations/node-primitives';
 /** Block immediately after `path` in doc order (children before siblings), else null. */
 export function nextPath(doc, path) {
     const node = nodeAt(doc, path);

package/dist/selection/range-delete-ceremony.js

@@ -10,8 +10,10 @@ import { charOffsetOf, walkBetween } from './primitives';
 import { comparePaths, isStrictAncestorOf, isPathSubtreeBetween, lowestCommonAncestor, pathHasPrefix, pathsEqual } from './path-math';
 import { cascadeCleanupEmptyAncestors } from '../tree-operations/cleanup';
 import { deleteAtPath, replaceAtPath } from '../tree-operations/path-mutate';
-import { blockNodeAt, cleanJoinedRaw, emptyParagraph, nodeAt, normalizeOwnRaw } from '../tree-operations/node-ops';
-import { ensureUnsharedPath, rebuildUnsharedAncestry, rebuildUnsharedChain } from '../tree-operations/unshare';
+import { blockNodeAt, emptyParagraph, nodeAt, normalizeOwnRaw } from '../tree-operations/node-primitives';
+import { cleanJoinedRaw } from '../tree-operations/node-ops';
+import { ensureUnsharedPath } from '../tree-operations/unshare';
+import { rebuildUnsharedAncestry, rebuildUnsharedChain } from '../tree-operations/chain-rebuild';
 // Wall primitives live with the chrome branch, which imports the atoms below back. The
 // resulting cycle is function-body-only (resolved at call time, never at module load), so it
 // is safe.

package/dist/selection/range-delete-chrome.js

@@ -7,7 +7,8 @@
 import { displayLength } from '../core/lines';
 import { comparePaths, pathsEqual } from './path-math';
 import { resolveEndWall, planCrossBlockDeletion, applyPlannedDeletion, truncateEndInPlace, truncateStartInPlace } from './range-delete-ceremony';
-import { ensureUnsharedPath, rebuildUnsharedChain } from '../tree-operations/unshare';
+import { ensureUnsharedPath } from '../tree-operations/unshare';
+import { rebuildUnsharedChain } from '../tree-operations/chain-rebuild';
 import { reservedChromeKindOf, isReservedChromeChild } from '../schema/reserved-chrome';
 // ── Public API ──────────────────────────────────────────────────────────────
 /**

package/dist/selection/range-delete-table-coverage.js

@@ -5,7 +5,8 @@
  */
 import { deleteSnapshot } from './primitives';
 import { metadataOf } from '../core/nodes';
-import { deleteNode, emptyParagraph } from '../tree-operations/node-ops';
+import { emptyParagraph } from '../tree-operations/node-primitives';
+import { deleteNode } from '../tree-operations/settle';
 import { trailingLineEnding } from '../core/lines';
 import { expectStateForNode, getStateForNode } from '../reactivity/state-registry';
 import { deleteRow as mutDeleteRow, deleteColumn as mutDeleteColumn, canDeleteRow, canDeleteColumn } from '../tree-operations/table-mutations';

package/dist/selection/range-delete-table.js

@@ -11,8 +11,9 @@ import { cellRowCol } from '../cursor/coordinate-spaces';
 import { cellIndexOf } from './primitives';
 import { resolveEndWall, planCrossBlockDeletion, applyPlannedDeletion, rebuildSharedAncestries, truncateEndInPlace, truncateStartInPlace } from './range-delete-ceremony';
 import { comparePaths } from './path-math';
-import { blockNodeAt, emptyParagraph } from '../tree-operations/node-ops';
-import { ensureUnsharedNode, ensureUnsharedPath, ensureUnsharedSubtree, rebuildOwnedContainer, rebuildUnsharedAncestry } from '../tree-operations/unshare';
+import { blockNodeAt, emptyParagraph } from '../tree-operations/node-primitives';
+import { ensureUnsharedNode, ensureUnsharedPath, ensureUnsharedSubtree, rebuildOwnedContainer } from '../tree-operations/unshare';
+import { rebuildUnsharedAncestry } from '../tree-operations/chain-rebuild';
 import { rebuildTableRowRaw } from '../schema/container-rebuilders';
 import { isCollapsedContainer } from '../schema/reserved-chrome';
 import { nearestChromeContainer, isChromeChild } from './range-delete-chrome';

package/dist/selection/range-delete.js

@@ -7,11 +7,30 @@ import { metadataOf } from '../core/nodes';
 import { walkBetween, charOffsetOf } from './primitives';
 import { comparePaths, lowestCommonAncestor, isPathSubtreeBetween } from './path-math';
 import { firstLeafAtOrAfter } from './path-lookup';
-import { blockNodeAt, cleanJoinedRaw, nodeAt, normalizeBodyWrite, normalizeOwnRaw, settleSeparatorOnBlank, writeOwnRaw } from '../tree-operations/node-ops';
+import { blockNodeAt, nodeAt, normalizeBodyWrite, normalizeOwnRaw, writeOwnRaw } from '../tree-operations/node-primitives';
+import { settleSeparatorOnBlank } from '../tree-operations/settle';
+import { isBlankParagraph } from '../core/parser';
+import { displayLength } from '../core/lines';
+import { deleteAtPath } from '../tree-operations/path-mutate';
+import { cleanJoinedRaw } from '../tree-operations/node-ops';
 import { deleteSubtreesIdentityGated, installTruncatedEndpoint, reparseTruncatedEndpoint } from './range-delete-ceremony';
-import { ensureUnsharedNode, ensureUnsharedPath, rebuildUnsharedAncestry, rebuildUnsharedChain } from '../tree-operations/unshare';
+import { ensureUnsharedNode, ensureUnsharedPath } from '../tree-operations/unshare';
+import { rebuildUnsharedAncestry, rebuildUnsharedChain } from '../tree-operations/chain-rebuild';
 import { involvesTable, tableAwareRangeDelete } from './range-delete-table';
 import { involvesReservedChrome, chromeAwareRangeDelete } from './range-delete-chrome';
+/** Whoever takes the slot gets the caret, at its start; the block above when nothing does. */
+function deleteWholeUnit(doc, path, sharing, grammar) {
+    const parentPath = path.slice(0, -1);
+    const index = path[path.length - 1];
+    // The path-addressed door, so the commit's id ledger sees the slot go.
+    const chain = ensureUnsharedPath(doc, parentPath, sharing);
+    deleteAtPath(doc, path, sharing);
+    if (chain.length > 0)
+        rebuildUnsharedChain(doc, chain, sharing, null, grammar);
+    const survivors = (chain.length > 0 ? chain[chain.length - 1] : doc).children ?? [];
+    const landing = Math.max(0, Math.min(index, survivors.length - 1));
+    return { newDoc: doc, collapsedCaret: { path: [...parentPath, landing], offset: 0 } };
+}
 /**
  * Delete [start, end] in place, merge at start's position with its container context preserved,
  * cascade-clean empty ancestors, rebuild container raws. Copy-path-on-write: every spliced or
@@ -38,6 +57,15 @@ export function rangeDelete(doc, start, end, sharing, grammar, presentationMode,
     const endRaw = endBlock.raw;
     const startOffset = charOffsetOf(start, 'rangeDelete:prose-merge-start');
     const endOffset = charOffsetOf(end, 'rangeDelete:prose-merge-end');
+    // The range holds one block whole, so none of its own bytes survive: the byte arm below would
+    // keep a husk holding a bare line ending, which no reload reads as that kind. A paragraph is
+    // the one kind that survives empty, because a blank one IS the separating line below it.
+    if (sameBlock &&
+        startOffset === 0 &&
+        endOffset >= displayLength(startRaw) &&
+        !isBlankParagraph({ kind: startBlock.kind, raw: '' })) {
+        return deleteWholeUnit(doc, start.path, sharing, grammar);
+    }
     // The end slice answers to the END block's rule before the join: start's rule below speaks
     // only for start's bytes, so a truncation from the end block's head strands its closer. A
     // same-block merge is one block's bytes and takes that rule once, whole, on the arm below.

package/dist/selection/selection-restore.js

@@ -5,7 +5,7 @@
  * can't be carried by only one. A gap caret takes {@link restoreGapCaret}, the same road minus
  * the endpoint pair.
  */
-import { isBlockNode, nodeAt } from '../tree-operations/node-ops';
+import { isBlockNode, nodeAt } from '../tree-operations/node-primitives';
 import { applySelectionToDom } from './native-bridge';
 import { placeGapCaret } from './caret-doors';
 import { gapScopeChildren } from './gap-caret';

package/dist/selection/selection-state.svelte.d.ts

@@ -34,6 +34,12 @@ export interface SelectionState {
     readonly selectAllCount: number;
     /** The third mode: a collapsed caret in a between-blocks boundary (`gap-caret.ts`). */
     readonly gapCaret: GapCaretPosition | null;
+    /**
+     * One block taken whole as the entire range — a press on a surface-less leaf (an equation)
+     * dragged inside it. The stored pair spans the block's bytes on a shared path, which the
+     * same-path guard would otherwise refuse, so the overlay reads this to paint it as a unit.
+     */
+    readonly wholeUnitPath: number[] | null;
     enterCrossBlock(anchor: SelectionEndpoint, focus: SelectionEndpoint): void;
     extendFocus(point: SelectionEndpoint): void;
     collapse(): void;

package/dist/selection/selection-state.svelte.js

@@ -4,11 +4,12 @@
  * native browser selection rules, and the two are mutually exclusive here rather than at any
  * call site. Transitions: `docs/design/editor.md` § Cross-block selection.
  */
-import { nodeAt } from '../tree-operations/node-ops';
+import { nodeAt } from '../tree-operations/node-primitives';
 import { isWholeBlockEndpoint, normalize } from './primitives';
 import { cellEndpointDeepPath, normalizeTableEndpoint, snapCrossBlockTableEndpoints } from './table-endpoint-snap';
 import { normalizeCharEndpoint } from './char-endpoint-snap';
 import { pathsEqual } from './path-math';
+import { displayLength } from '../core/lines';
 import { assertInvariant } from '../assert';
 import { checkCrossBlockEndpointCoordinates } from '../invariants/selection-endpoints';
 export function createSelectionState(options) {
@@ -19,6 +20,7 @@ class SelectionStateImpl {
     #anchor = $state(null);
     #focus = $state(null);
     #gapCaret = $state(null);
+    #wholeUnit = $state(null);
     #selectAllCount = $state(0);
     #onChange;
     #getDoc;
@@ -63,6 +65,9 @@ class SelectionStateImpl {
     get isCrossBlock() {
         return this.#anchor !== null && this.#focus !== null;
     }
+    get wholeUnitPath() {
+        return this.#wholeUnit?.slice() ?? null;
+    }
     get isCustomRendered() {
         const getDoc = this.#getDoc;
         if (!getDoc)
@@ -71,6 +76,8 @@ class SelectionStateImpl {
         const focus = this.#focus;
         if (!anchor || !focus)
             return false;
+        if (this.#wholeUnit)
+            return true;
         if (!pathsEqual(anchor.path, focus.path))
             return true;
         if (anchor.offset === focus.offset)
@@ -102,6 +109,19 @@ class SelectionStateImpl {
     }
     enterCrossBlock(anchor, focus) {
         this.#gapCaret = null;
+        // Both ends the same surface-less block: the unit itself is the range, stored as its full
+        // byte span and flagged, since below a same-path pair is refused as prose.
+        if (isWholeBlockEndpoint(anchor) &&
+            isWholeBlockEndpoint(focus) &&
+            pathsEqual(anchor.path, focus.path)) {
+            const path = anchor.path.slice();
+            this.#anchor = { path, offset: 0 };
+            this.#focus = { path: path.slice(), offset: this.#byteLengthAt(path) };
+            this.#wholeUnit = path.slice();
+            this.#notify();
+            return;
+        }
+        this.#wholeUnit = null;
         const a = this.#normalizePoint(anchor, focus.path);
         const f = this.#normalizePoint(focus, anchor.path);
         // A same-path prose pair is a single-block range the browser owns; storing it mints an
@@ -124,6 +144,13 @@ class SelectionStateImpl {
             throw new Error('SelectionState.extendFocus called without an anchor');
         }
         this.#gapCaret = null;
+        // Leaving a whole unit: its anchor is the block as a whole again, so the side it means
+        // (start below the new focus, end above it) is resolved afresh rather than kept at 0.
+        if (this.#wholeUnit) {
+            const unit = { path: this.#wholeUnit, wholeBlock: true };
+            this.#anchor = this.#normalizePoint(unit, point.path);
+            this.#wholeUnit = null;
+        }
         const f = this.#normalizePoint(point, this.#anchor.path);
         // A focus back on the anchor's prose leaf contracts to a single-block range. No
         // `offset !== offset` guard, unlike #isSamePathProseRange: extendFocus never seeds, so
@@ -142,6 +169,11 @@ class SelectionStateImpl {
     }
     // G1.29 at the storing seam, the belt behind #normalizePoint: both entries carry it because
     // both store an endpoint pair.
+    #byteLengthAt(path) {
+        const doc = this.#getDoc?.();
+        const node = doc ? nodeAt(doc, path) : null;
+        return node && 'raw' in node ? displayLength(node.raw) : 0;
+    }
     #assertEndpointCoordinates(anchor, focus) {
         const getDoc = this.#getDoc;
         if (!getDoc)
@@ -177,6 +209,7 @@ class SelectionStateImpl {
         this.#anchor = null;
         this.#focus = null;
         this.#gapCaret = null;
+        this.#wholeUnit = null;
         this.#notify();
     }
     clear() {
@@ -185,6 +218,7 @@ class SelectionStateImpl {
         this.#anchor = null;
         this.#focus = null;
         this.#gapCaret = null;
+        this.#wholeUnit = null;
         this.#selectAllCount = 0;
         this.#notify();
     }
@@ -198,6 +232,7 @@ class SelectionStateImpl {
     setGapCaret(pos) {
         this.#anchor = null;
         this.#focus = null;
+        this.#wholeUnit = null;
         this.#gapCaret = { parentPath: pos.parentPath.slice(), index: pos.index };
         this.#notify();
     }

package/dist/selection/table-endpoint-snap.js

@@ -5,7 +5,7 @@
  * An intra-table pair is deliberately left unsnapped, so rectangular sub-cell selection survives.
  */
 import { metadataOf } from '../core/nodes';
-import { isBlockNode, nodeAt } from '../tree-operations/node-ops';
+import { isBlockNode, nodeAt } from '../tree-operations/node-primitives';
 import { cellIndexOf } from './primitives';
 import { asCellIndex, cellRowCol } from '../cursor/coordinate-spaces';
 import { comparePaths, pathHasPrefix } from './path-math';

package/dist/selection/table-rect-extend.js

@@ -5,7 +5,7 @@
  * horizontal extension clamps at the column edges, since a rectangle has no sideways exit.
  */
 import { metadataOf } from '../core/nodes';
-import { isBlockNode, nodeAt } from '../tree-operations/node-ops';
+import { isBlockNode, nodeAt } from '../tree-operations/node-primitives';
 import { cellRowCol } from '../cursor/coordinate-spaces';
 import { pathsEqual } from './path-math';
 /**

package/dist/styles/editor-theme.css

@@ -9,40 +9,51 @@
 /* ── Host-chrome tier: the consumer's vocabulary, defaults behind the class ── */
 
 :where(.aragonite-editor-theme) {
+	/* Two faces, because they answer different questions. `--font-editor` is the SURFACE
+	   face — prose, headings, markers — and a host may legitimately set it proportional.
+	   `--font-code` is what must stay monospace whatever that choice is: code blocks, code
+	   spans, raw HTML, revealed source. Defaulted to the same stack, so a consumer that
+	   never names the second one sees exactly what it saw before. */
 	--font-editor: 'Cascadia Code', 'Cascadia Mono', 'Consolas', ui-monospace, monospace;
+	--font-code: 'Cascadia Code', 'Cascadia Mono', 'Consolas', ui-monospace, monospace;
+	/* The menus' and popovers' face: the host's own UI font where it names one. */
+	--font-ui: 'Inter', system-ui, sans-serif;
 	/* Type-scale root: headings, code and markers are all `em`-relative, so one override
 	   scales the surface. A themed host sets it on any ancestor instead. */
 	--editor-font-size: 1rem;
 
 	/* Corner radii by role: small controls (buttons, inputs, chips) and elevated surfaces
 	   (overlays, popovers). Chrome whose corner is neither keeps its own literal. */
-	--radius-ui: 3px;
+	--radius-ui: 4px;
 	--radius-surface: 8px;
 
-	--color-surface: #1b1c21;
-	--color-text-secondary: #d6d9e0;
-	--color-text-primary: #ffffff;
-	--color-border: #3d4047;
-	--color-ui-muted: #a4a4a4;
-	--color-ui-dulled: #afb1b3;
-	/* Split per mode: no single value clears AA on both a near-black and a white surface. */
-	--color-accent: #6c9d83;
+	/* The page ground, which the menus and the image toolbar paint on. */
+	--color-bg: #2c2c2a;
+	--color-surface: #1a1a19;
+	--color-text-secondary: #cfcfca;
+	--color-text-primary: #e8e8e5;
+	--color-border: #3e3e3b;
+	--color-ui-muted: #8f8f89;
+	--color-ui-dulled: #a3a39d;
+	--color-accent: #567b67;
 	/* Base the selection, search-match and reorder washes derive from, so one declaration
-	   moves all of them; the washes themselves stay editor-owned. */
-	--color-selection: #6496ff;
-	--color-error: #e06c75;
+	   moves all of them; the washes themselves stay editor-owned. Tracking the accent means
+	   a host that recolors one recolors all four. */
+	--color-selection: var(--color-accent, #567b67);
+	--color-error: #ff5f57;
 }
 
 :where(.aragonite-editor-theme)[data-editor-theme='light'] {
-	--color-surface: #ffffff;
-	--color-text-secondary: #1f2328;
-	--color-text-primary: #000000;
-	--color-border: #d0d7de;
-	--color-ui-muted: #6e7781;
-	--color-ui-dulled: #8c959f;
-	--color-accent: #496e5b;
-	--color-selection: #6496ff;
-	--color-error: #cf222e;
+	--color-bg: #dfddd7;
+	--color-surface: #efeee9;
+	--color-text-secondary: #4a4a45;
+	--color-text-primary: #2a2a27;
+	--color-border: #c9c7c0;
+	--color-ui-muted: #83837b;
+	--color-ui-dulled: #71716a;
+	--color-accent: #567b67;
+	--color-selection: var(--color-accent, #567b67);
+	--color-error: #d03025;
 }
 
 /* ── Editor-owned tier: defaults on `.editor`, so they hold with or without the class ── */
@@ -69,7 +80,10 @@
 	--syntax-code: currentColor;
 	--syntax-comment: currentColor;
 	--syntax-list: currentColor;
-	--syntax-separator: var(--color-ui-muted, #a4a4a4);
+	/* The rendered rule's colour, and its ONLY consumer. A divider separates rather than
+	   announces, so it defaults to the border token; mid-grey at this weight competed with
+	   the text either side. A host that wants a louder rule still names this token. */
+	--syntax-separator: var(--color-border, #3e3e3b);
 	--syntax-task: currentColor;
 	--syntax-task-done: rgba(128, 128, 128, 0.7);
 
@@ -114,35 +128,50 @@
 	--reorder-scope-bg: color-mix(in srgb, var(--color-selection, #6496ff) 14%, transparent);
 	--syntax-marker-dim: 0.65;
 
+	/* Menu/popout elevation, per mode: a shadow tuned for a near-black surface is invisible
+	   over a white one. Editor-owned rather than host-family, since a host palette names
+	   colors, not elevation. */
+	--menu-shadow: 0 12px 32px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.35);
+	/* The rest of the host app's menu family, so a menu here is the host's menu to the pixel. */
+	--menu-item-hover: rgba(255, 255, 255, 0.07);
+	--menu-search-divider: rgba(255, 255, 255, 0.08);
+	--menu-scrollbar-thumb: rgba(255, 255, 255, 0.18);
+	--menu-scrollbar-thumb-hover: rgba(255, 255, 255, 0.3);
+
 	/* Placeholder tint behind off-window content (VR-8), so a spacer that outruns the
 	   window recompute reads as "loading" rather than a white tear. */
 	--vr-spacer-bg: rgba(255, 255, 255, 0.025);
 }
 
 :where(.editor, .aragonite-editor-theme)[data-editor-theme='light'] {
-	--color-bg-secondary: rgba(0, 0, 0, 0.05);
+	--color-bg-secondary: rgba(0, 0, 0, 0.035);
 	--color-bg-elevated: #f5f6f8;
 	--color-bg-muted: #eaeaea;
 	--color-text-muted: #57606a;
 	--color-ui-faint: rgba(0, 0, 0, 0.06);
+	--menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.06);
+	--menu-item-hover: rgba(0, 0, 0, 0.05);
+	--menu-search-divider: rgba(0, 0, 0, 0.07);
+	--menu-scrollbar-thumb: rgba(0, 0, 0, 0.2);
+	--menu-scrollbar-thumb-hover: rgba(0, 0, 0, 0.32);
 
 	/* --syntax-* tokens are mode-independent — no light overrides. */
 
 	/* Code block syntax highlighting — GitHub Light-inspired palette */
-	--code-tok-keyword: #cf222e;
+	--code-tok-keyword: #c1202b;
 	--code-tok-string: #0a3069;
 	--code-tok-number: #0550ae;
 	--code-tok-literal: #0550ae;
-	--code-tok-comment: #666f79;
+	--code-tok-comment: #5c646d;
 	--code-tok-type: #953800;
-	--code-tok-function: #8250df;
-	--code-tok-operator: #cf222e;
+	--code-tok-function: #7447c6;
+	--code-tok-operator: #c1202b;
 	--code-tok-meta: #953800;
 	--code-tok-attr: #116329;
 	--code-tok-regexp: #116329;
 	--code-tok-symbol: #0550ae;
 	--code-tok-added: #116329;
-	--code-tok-removed: #cf222e;
+	--code-tok-removed: #c1202b;
 	--code-tok-heading: #0550ae;
 	--code-tok-link: #0550ae;