diff --git a/src/lib/components/CanvasView.svelte b/src/lib/components/CanvasView.svelte
index f0ad3cb..0cfdd1f 100644
--- a/src/lib/components/CanvasView.svelte
+++ b/src/lib/components/CanvasView.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { onMount, untrack } from 'svelte';
+	import CirclePlusIcon from '@lucide/svelte/icons/circle-plus';
 	import DownloadIcon from '@lucide/svelte/icons/download';
 	import EllipsisIcon from '@lucide/svelte/icons/ellipsis';
 	import ArrowUpIcon from '@lucide/svelte/icons/arrow-up';
@@ -117,17 +118,6 @@
 		return rectBeside(a, slot.dir, s);
 	}
 
-	/** Hit area of the add-page bar: a strip hugging the anchor's free edge. */
-	function barRect(slot: Slot): Rect | null {
-		const a = doc.rectOf(slot.anchor);
-		if (!a) return null;
-		const t = 20 / viewport.scale;
-		if (slot.dir === 'right') return { x: a.x + a.width, y: a.y, width: t, height: a.height };
-		if (slot.dir === 'left') return { x: a.x - t, y: a.y, width: t, height: a.height };
-		if (slot.dir === 'down') return { x: a.x, y: a.y + a.height, width: a.width, height: t };
-		return { x: a.x, y: a.y - t, width: a.width, height: t };
-	}
-
 	/** Run a tree change without the anchor page jumping on screen. */
 	function keepAnchor(anchor: string, fn: () => void) {
 		const before = doc.rectOf(anchor);
@@ -237,7 +227,6 @@
 		| { kind: 'draw'; pointerId: number; pointerType: string; pageId: string; rec: StrokeRecorder }
 		| { kind: 'erase'; pointerId: number; pointerType: string; hits: Map<string, Set<string>> }
 		| { kind: 'pan'; pointerId: number; lastX: number; lastY: number; startX: number; startY: number; moved: boolean; tap: boolean }
-		| { kind: 'add'; pointerId: number; pointerType: string; startX: number; startY: number; slot: Slot }
 		| { kind: 'pinch' };
 
 	let gesture: Gesture | null = null;
@@ -291,10 +280,8 @@
 
 		// Fingers ink only when enabled and no pen has been used; otherwise they pan/zoom.
 		const fingerInks = tools.inking && settings.data.fingerDraw && !palm.penSeen;
-		// Taps on an add-page bar get the same palm policy as writing.
-		const bar = target.closest<HTMLElement>('.ghost');
 		if (e.pointerType === 'touch') {
-			const decision = palm.evaluate(e, fingerInks || bar ? 'draw' : 'navigate');
+			const decision = palm.evaluate(e, fingerInks ? 'draw' : 'navigate');
 			if (!decision.accept) return; // palm: ignore entirely
 			touches.set(e.pointerId, p);
 			if (touches.size >= 2) {
@@ -305,14 +292,6 @@
 			}
 		}
 
-		if (bar && e.button === 0) {
-			e.preventDefault();
-			const slot = { anchor: bar.dataset.anchor!, dir: bar.dataset.dir as Dir };
-			gesture = { kind: 'add', pointerId: e.pointerId, pointerType: e.pointerType, startX: p.x, startY: p.y, slot };
-			capture(e.pointerId);
-			return;
-		}
-
 		const onPage = pageAt(p.x, p.y);
 		const inEditor = !!target.closest('.cm-editor');
 		// Pressing anywhere outside the text leaves the editor (preventDefault
@@ -324,10 +303,10 @@
 			e.button === 1 ||
 			spaceDown ||
 			(e.pointerType === 'touch' && (!fingerInks || !onPage)) ||
-			(e.pointerType === 'mouse' && e.button === 0 && !onPage && !target.closest('.slot'));
+			(e.pointerType === 'mouse' && e.button === 0 && !onPage && !target.closest('.ghost, .slot'));
 		if (wantsPan) {
 			if (onPage && !inEditor) doc.activeId = onPage;
-			gesture = { kind: 'pan', pointerId: e.pointerId, lastX: p.x, lastY: p.y, startX: p.x, startY: p.y, moved: false, tap: inEditor || !!target.closest('.slot') };
+			gesture = { kind: 'pan', pointerId: e.pointerId, lastX: p.x, lastY: p.y, startX: p.x, startY: p.y, moved: false, tap: inEditor || !!target.closest('.ghost, .slot') };
 			if (e.pointerType !== 'touch' || !gesture.tap) {
 				if (e.pointerType !== 'touch') e.preventDefault();
 				capture(e.pointerId);
@@ -396,12 +375,6 @@
 			return;
 		}
 
-		if (gesture.kind === 'add') {
-			// Dragging off the bar is not a tap.
-			if (Math.hypot(p.x - gesture.startX, p.y - gesture.startY) > 12) gesture = null;
-			return;
-		}
-
 		if (gesture.kind === 'erase') {
 			eraseAt(e);
 			return;
@@ -429,9 +402,7 @@
 		if (!gesture || gesture.pointerId !== e.pointerId) return;
 		const g = gesture;
 		gesture = null;
-		if (g.kind === 'add') {
-			if (e.type === 'pointerup' && (g.pointerType !== 'touch' || palm.evaluate(e).accept)) addPage(g.slot.anchor, g.slot.dir);
-		} else if (g.kind === 'draw') {
+		if (g.kind === 'draw') {
 			live = null;
 			if (e.type === 'pointerup') doc.addStroke(g.pageId, g.rec.stroke);
 		} else if (g.kind === 'erase') {
@@ -593,17 +564,18 @@
 			{/each}
 
 			{#each ghostSlots as slot (slot.anchor + slot.dir)}
-				{@const r = barRect(slot)}
+				{@const r = slotRect(slot)}
 				{#if r}
-					<!-- Pointer taps go through the palm-checked gesture; onclick only serves the keyboard. -->
 					<button
 						class="ghost"
-						data-anchor={slot.anchor}
-						data-dir={slot.dir}
 						style="left:{r.x}px; top:{r.y}px; width:{r.width}px; height:{r.height}px"
 						title="Add page ({slot.dir})"
-						onclick={(e) => e.detail === 0 && addPage(slot.anchor, slot.dir)}
-					></button>
+						onclick={() => addPage(slot.anchor, slot.dir)}
+					>
+						<span class="plus" style="--icon: {Math.min(r.width, r.height) * 0.14}px">
+							<CirclePlusIcon size="100%" strokeWidth={1.25} />
+						</span>
+					</button>
 				{/if}
 			{/each}
 
@@ -724,49 +696,7 @@
 		top: 0;
 		transform-origin: 0 0;
 	}
-	.ghost {
-		position: absolute;
-		background: none;
-		border: 0;
-		padding: 0;
-		cursor: pointer;
-	}
-	/* The visible bar: 4 screen px thick, 6 px off the page edge. */
-	.ghost::before {
-		content: '';
-		position: absolute;
-		background: var(--ghost-border);
-		border-radius: calc(2px / var(--s));
-		transition: background 0.12s;
-	}
-	.ghost[data-dir='left']::before,
-	.ghost[data-dir='right']::before {
-		top: 0;
-		bottom: 0;
-		width: calc(4px / var(--s));
-	}
-	.ghost[data-dir='up']::before,
-	.ghost[data-dir='down']::before {
-		left: 0;
-		right: 0;
-		height: calc(4px / var(--s));
-	}
-	.ghost[data-dir='right']::before {
-		left: calc(6px / var(--s));
-	}
-	.ghost[data-dir='left']::before {
-		right: calc(6px / var(--s));
-	}
-	.ghost[data-dir='down']::before {
-		top: calc(6px / var(--s));
-	}
-	.ghost[data-dir='up']::before {
-		bottom: calc(6px / var(--s));
-	}
-	.ghost:hover::before,
-	.ghost:focus-visible::before {
-		background: var(--accent);
-	}
+	.ghost,
 	.slot {
 		position: absolute;
 		display: grid;
@@ -779,6 +709,7 @@
 		padding: 0;
 		transition: background 0.12s, color 0.12s;
 	}
+	.ghost:hover,
 	.slot:hover {
 		background: var(--accent-soft);
 		color: var(--accent);
@@ -789,6 +720,7 @@
 		color: var(--accent);
 		border-color: color-mix(in srgb, var(--accent) 50%, transparent);
 	}
+	.plus,
 	.arrow {
 		display: grid;
 		width: var(--icon);