clearotron 0.3.1-beta.2 → 0.3.1-beta.3

package/portal-ui/dist/assets/{index-D8ITW-aD.js → index-C-QysgZM.js}

@@ -11802,7 +11802,10 @@ function decodePerson(r) {
 			manage: asRecord(r["permissions"])["manage"] === true
 		},
 		access: decodeAccess(r),
-		dangling: asArray(r["dangling"]).filter((s) => typeof s === "string")
+		dangling: asArray(r["dangling"]).filter((s) => typeof s === "string"),
+		listed: r["listed"] !== false,
+		covered: r["covered"] === true,
+		keys: typeof r["keys"] === "number" && r["keys"] > 0 ? r["keys"] : 0
 	};
 }
 var api = {
@@ -12051,6 +12054,7 @@ var api = {
 		keyUrl: asString(b["keyUrl"]),
 		email: asString(b["email"]),
 		enabled: b["enabled"] === true,
+		aiConnected: typeof b["aiConnected"] === "boolean" ? b["aiConnected"] : null,
 		stdio: (() => {
 			const r = b["stdio"];
 			if (!r || typeof r !== "object") return null;
@@ -12218,7 +12222,8 @@ var api = {
 			} : null;
 		})(),
 		canAdd: b["canAdd"] === true,
-		localSignIn: b["localSignIn"] === true
+		localSignIn: b["localSignIn"] === true,
+		keysRevocable: b["keysRevocable"] === true
 	})),
 	addPerson: (body) => call("/portal/admin/people", (b) => ({
 		person: decodePerson(asRecord(b["person"])),
@@ -12227,6 +12232,32 @@ var api = {
 		method: "POST",
 		body: JSON.stringify(body)
 	}),
+	changePerson: (body) => call("/portal/admin/people/change", (b) => ({
+		person: decodePerson(asRecord(b["person"])),
+		switchesApplied: b["switchesApplied"] === true,
+		added: typeof b["added"] === "number" ? b["added"] : 0,
+		removed: typeof b["removed"] === "number" ? b["removed"] : 0
+	}), {
+		method: "POST",
+		body: JSON.stringify(body)
+	}),
+	removePerson: (body) => call("/portal/admin/people/remove", (b) => {
+		const k = asRecord(b["keys"]);
+		return {
+			removed: b["removed"] === "install" ? "install" : "organisations",
+			organisations: asStrings(b["organisations"]),
+			keys: {
+				checked: k["checked"] === true,
+				revoked: typeof k["revoked"] === "number" ? k["revoked"] : 0,
+				lateArm: k["lateArm"] === true,
+				failed: k["failed"] === true,
+				note: asString(k["note"])
+			}
+		};
+	}, {
+		method: "POST",
+		body: JSON.stringify(body)
+	}),
 	adminObserved: () => call("/portal/admin/observed", (b) => ({
 		available: b["available"] === true,
 		truncated: b["truncated"] === true,
@@ -12302,6 +12333,15 @@ var NAV = [
 		hidden: true,
 		scope: "account"
 	},
+	{
+		id: "people.modify",
+		label: "Modify access",
+		path: "/portal/people/modify",
+		icon: "users",
+		needs: "manage",
+		hidden: true,
+		scope: "account"
+	},
 	{
 		id: "new",
 		label: "New clearance",
@@ -12454,6 +12494,7 @@ function decode(segment) {
 }
 var PEOPLE = NAV.find((e) => e.id === "people");
 var ADD_PERSON = NAV.find((e) => e.id === "people.add");
+var MODIFY_PERSON = NAV.find((e) => e.id === "people.modify");
 //#endregion
 //#region ../node_modules/react/cjs/react-jsx-runtime.production.js
 var require_react_jsx_runtime_production = __commonJSMin(((exports) => {
@@ -12848,6 +12889,26 @@ function seesEverything(who) {
 	return who.allAccounts === true;
 }
 //#endregion
+//#region src/components/PageHeader.tsx
+function PageHeader({ title, lede, actions }) {
+	return (0, import_jsx_runtime.jsxs)("header", {
+		className: "page-header",
+		children: [(0, import_jsx_runtime.jsxs)("div", {
+			className: "page-header-text",
+			children: [(0, import_jsx_runtime.jsx)("h1", {
+				className: "page-title",
+				children: title
+			}), lede ? (0, import_jsx_runtime.jsx)("p", {
+				className: "page-lede",
+				children: lede
+			}) : null]
+		}), actions ? (0, import_jsx_runtime.jsx)("div", {
+			className: "page-header-actions",
+			children: actions
+		}) : null]
+	});
+}
+//#endregion
 //#region src/shell/CompanyPicker.tsx
 function CompanyCard({ row, onPick }) {
 	return (0, import_jsx_runtime.jsxs)("button", {
@@ -12907,51 +12968,26 @@ function CompanyCard({ row, onPick }) {
 		})]
 	});
 }
-function CompanyPicker({ eyebrow, heading, line, keys, orgOf, organisations, companyName, factsFor, onPick, onAdd }) {
+function CompanyPicker({ heading, line, keys, orgOf, organisations, companyName, factsFor, onPick, onAdd }) {
 	const { headings, groups } = pickerGroups(keys, orgOf, organisations, companyName, factsFor);
-	return (0, import_jsx_runtime.jsxs)("div", {
+	return (0, import_jsx_runtime.jsx)("div", {
 		className: "screen",
-		children: [(0, import_jsx_runtime.jsx)("div", {
-			className: "eyebrow",
-			children: eyebrow
-		}), (0, import_jsx_runtime.jsxs)("div", {
+		children: (0, import_jsx_runtime.jsxs)("div", {
 			className: "measure",
-			children: [(0, import_jsx_runtime.jsxs)("div", {
-				style: {
-					display: "flex",
-					alignItems: "flex-end",
-					gap: 20,
-					margin: "4px 0 18px"
-				},
-				children: [(0, import_jsx_runtime.jsxs)("div", {
-					style: { flex: 1 },
-					children: [(0, import_jsx_runtime.jsx)("h1", {
-						style: {
-							fontSize: 27,
-							margin: "0 0 4px",
-							color: "var(--text-strong)"
-						},
-						children: heading
-					}), (0, import_jsx_runtime.jsx)("p", {
-						style: {
-							margin: 0,
-							color: "var(--text-muted)",
-							fontSize: 14.5
-						},
-						children: line
-					})]
-				}), onAdd ? (0, import_jsx_runtime.jsx)("button", {
+			children: [(0, import_jsx_runtime.jsx)(PageHeader, {
+				title: heading,
+				lede: line,
+				actions: onAdd ? (0, import_jsx_runtime.jsx)("button", {
 					type: "button",
 					className: "start-pill",
 					onClick: onAdd,
 					style: {
-						flex: "none",
 						borderColor: "var(--accent-ink)",
 						color: "var(--text-accent)",
 						fontWeight: 700
 					},
 					children: "+ New company"
-				}) : null]
+				}) : null
 			}), groups.map((g, i) => (0, import_jsx_runtime.jsxs)("div", { children: [headings && g.org ? (0, import_jsx_runtime.jsx)("div", {
 				className: "eyebrow",
 				style: { margin: i === 0 ? "0 0 8px" : "16px 0 8px" },
@@ -12969,12 +13005,11 @@ function CompanyPicker({ eyebrow, heading, line, keys, orgOf, organisations, com
 					onPick: () => onPick(r.key)
 				}, r.key))
 			})] }, g.org?.key ?? ""))]
-		})]
+		})
 	});
 }
-function CompanyGate({ ctx, eyebrow, heading, line }) {
+function CompanyGate({ ctx, heading, line }) {
 	return (0, import_jsx_runtime.jsx)(CompanyPicker, {
-		eyebrow,
 		heading,
 		line,
 		keys: ctx.ownerKeys,
@@ -13859,23 +13894,18 @@ function Home({ ctx }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen home2",
 		children: [
-			(0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				children: "Home"
-			}),
-			(0, import_jsx_runtime.jsx)("h1", {
-				style: {
-					fontSize: 27,
-					margin: "4px 0 14px",
-					color: "var(--text-strong)"
-				},
-				children: "Now"
+			(0, import_jsx_runtime.jsx)(PageHeader, {
+				title: "Home",
+				actions: (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [(0, import_jsx_runtime.jsxs)("button", {
+					type: "button",
+					className: "btn-ghost home2-all",
+					onClick: () => ctx.go("/portal/clearances"),
+					children: [(0, import_jsx_runtime.jsx)(Icon, { name: "layers" }), (0, import_jsx_runtime.jsx)("span", { children: "All Clearances" })]
+				}), canRun(ctx.me) ? (0, import_jsx_runtime.jsx)(NewClearanceButton, { onNew: () => ctx.go("/portal/new") }) : null] })
 			}),
 			(0, import_jsx_runtime.jsx)(InFlightBand, {
 				count: cards.length + queue.length,
-				note: cards.length + queue.length === 0 ? `Nothing running right now.${canRun(ctx.me) ? " Start one with New clearance." : ""}` : slotNote(null, ctx.me.concurrentRuns),
-				onNew: canRun(ctx.me) ? () => ctx.go("/portal/new") : null,
-				onAll: () => ctx.go("/portal/clearances")
+				note: cards.length + queue.length === 0 ? `Nothing running right now.${canRun(ctx.me) ? " Start one with New clearance." : ""}` : slotNote(null, ctx.me.concurrentRuns)
 			}),
 			(0, import_jsx_runtime.jsx)("div", {
 				style: { margin: "0 0 18px" },
@@ -13950,7 +13980,15 @@ function Home({ ctx }) {
 		]
 	});
 }
-function InFlightBand({ count, note, onNew, onAll }) {
+function NewClearanceButton({ onNew }) {
+	return (0, import_jsx_runtime.jsxs)("button", {
+		type: "button",
+		className: "home2-new",
+		onClick: onNew,
+		children: [(0, import_jsx_runtime.jsx)(Icon, { name: "plus-circle" }), "New clearance"]
+	});
+}
+function InFlightBand({ count, note }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "home2-band",
 		children: [
@@ -13966,20 +14004,7 @@ function InFlightBand({ count, note, onNew, onAll }) {
 			(0, import_jsx_runtime.jsx)("span", {
 				className: "home2-band-note",
 				children: note
-			}),
-			(0, import_jsx_runtime.jsxs)("button", {
-				type: "button",
-				className: "btn-ghost home2-all",
-				onClick: onAll,
-				style: { marginRight: 8 },
-				children: [(0, import_jsx_runtime.jsx)(Icon, { name: "layers" }), (0, import_jsx_runtime.jsx)("span", { children: "All Clearances" })]
-			}),
-			onNew ? (0, import_jsx_runtime.jsxs)("button", {
-				type: "button",
-				className: "home2-new",
-				onClick: onNew,
-				children: [(0, import_jsx_runtime.jsx)(Icon, { name: "plus-circle" }), "New clearance"]
-			}) : null
+			})
 		]
 	});
 }
@@ -14774,24 +14799,12 @@ function Clearances({ ctx }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen",
 		children: [
-			(0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				children: "All Clearances"
-			}),
-			(0, import_jsx_runtime.jsx)("h1", {
-				style: {
-					fontSize: 27,
-					margin: "4px 0 6px",
-					color: "var(--text-strong)"
-				},
-				children: ownerFilter ? ctx.ownerName(ownerFilter) : "All Clearances"
-			}),
-			(0, import_jsx_runtime.jsx)("p", {
-				style: {
-					margin: 0,
-					color: "var(--text-muted)"
-				},
-				children: (0, import_jsx_runtime.jsx)(AllowanceLine, { account })
+			(0, import_jsx_runtime.jsx)(PageHeader, {
+				title: "All Clearances",
+				lede: (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [ownerFilter ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [(0, import_jsx_runtime.jsx)("span", {
+					"data-anon": "mark",
+					children: ctx.ownerName(ownerFilter)
+				}), " · "] }) : null, (0, import_jsx_runtime.jsx)(AllowanceLine, { account })] })
 			}),
 			(0, import_jsx_runtime.jsx)("div", {
 				className: "controls",
@@ -15784,16 +15797,48 @@ function frameCommand(command, value) {
 }
 //#endregion
 //#region src/contract/askAi.ts
-function askAiPrompt(runId, mark) {
-	const name = String(mark ?? "this mark").trim() || "this mark";
-	return runId ? `Brief me on trademark clearance run ${runId}.` : `Brief me on the ${name} trademark clearance.`;
-}
-function askAiOffer(runId, mark, access) {
+var MONTHS = [
+	"",
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
+];
+function readableDate(iso) {
+	const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(String(iso ?? "").trim());
+	if (!m) return null;
+	const month = MONTHS[Number(m[2])];
+	const day = Number(m[3]);
+	if (!month || !(day >= 1 && day <= 31)) return null;
+	return `${day} ${month}`;
+}
+function askAiPrompt(mark, date, kind = "clearance") {
+	const name = String(mark ?? "").trim() || "this mark";
+	const noun = kind === "knockout-batch" ? "knockout search" : "clearance";
+	const when = readableDate(date);
+	return when ? `Brief me on the ${name} ${noun} from ${when}.` : `Brief me on the ${name} ${noun}.`;
+}
+var ASSISTANTS = [{
+	label: "Ask Claude",
+	href: (q) => `https://claude.ai/new?q=${encodeURIComponent(q)}`
+}, {
+	label: "Ask ChatGPT",
+	href: (q) => `https://chatgpt.com/?q=${encodeURIComponent(q)}`
+}];
+var AI_SETUP_PATH = "/portal/ai";
+function askAiOffer(run, access) {
 	return {
-		question: askAiPrompt(runId, mark),
-		address: access?.enabled ? access.url : null,
-		instructionsPath: "/portal/ai",
-		stdio: access?.stdio ?? null
+		drawn: !!access && (!!(access.enabled && access.url) || !!access.stdio),
+		question: askAiPrompt(run.markName, run.date, run.kind),
+		connected: access?.aiConnected === true
 	};
 }
 //#endregion
@@ -15851,12 +15896,12 @@ function useReportFrame() {
 		clearFailed: () => setFailed(null)
 	};
 }
-function AskAiMenu({ runId, mark, ctx }) {
+function AskAiMenu({ run, ctx }) {
 	const [open, setOpen] = (0, import_react.useState)(false);
-	const [copied, setCopied] = (0, import_react.useState)(null);
+	const [askAnyway, setAskAnyway] = (0, import_react.useState)(false);
 	const box = (0, import_react.useRef)(null);
 	const { result } = useLoad(() => api.mcpAccess(), []);
-	const offer = askAiOffer(runId, mark, result?.kind === "ok" ? result.value : null);
+	const offer = askAiOffer(run, result?.kind === "ok" ? result.value : null);
 	(0, import_react.useEffect)(() => {
 		if (!open) return;
 		function onDown(e) {
@@ -15872,115 +15917,151 @@ function AskAiMenu({ runId, mark, ctx }) {
 			document.removeEventListener("keydown", onKey);
 		};
 	}, [open]);
-	const copy = (what, value) => {
-		(async () => {
-			try {
-				await navigator.clipboard?.writeText(value);
-				setCopied(what);
-			} catch {
-				setCopied(`${what}-failed`);
-			}
-		})();
+	if (!offer.drawn) return null;
+	const showMenu = offer.connected || askAnyway;
+	const ask = (href) => {
+		setOpen(false);
+		window.open(href, "_blank", "noopener,noreferrer");
 	};
-	const line = (label, value, key) => (0, import_jsx_runtime.jsxs)("div", {
-		style: { padding: "7px 10px" },
-		children: [(0, import_jsx_runtime.jsx)("div", {
-			style: {
-				fontSize: 11,
-				color: "var(--text-faint)",
-				marginBottom: 3
-			},
-			children: label
-		}), (0, import_jsx_runtime.jsxs)("div", {
-			style: {
-				display: "flex",
-				alignItems: "center",
-				gap: 8
-			},
-			children: [(0, import_jsx_runtime.jsx)("span", {
-				className: "mono",
+	return (0, import_jsx_runtime.jsxs)("div", {
+		ref: box,
+		style: { position: "relative" },
+		"data-ask-ai": showMenu ? "menu" : "connect",
+		children: [
+			(0, import_jsx_runtime.jsxs)("button", {
+				type: "button",
+				className: "nav-item",
+				"aria-haspopup": showMenu ? "menu" : "dialog",
+				"aria-expanded": open,
 				style: {
-					fontSize: 12,
-					color: "var(--text-strong)",
-					wordBreak: "break-all",
-					flex: 1
+					width: "auto",
+					margin: 0,
+					padding: "6px 11px",
+					border: "1px solid var(--border-hairline)"
 				},
-				children: value
-			}), (0, import_jsx_runtime.jsx)("button", {
-				type: "button",
-				className: "link-btn",
+				onClick: () => setOpen((v) => !v),
+				children: [(0, import_jsx_runtime.jsx)(Icon, {
+					name: "sparkles",
+					size: 14
+				}), (0, import_jsx_runtime.jsx)("span", { children: "Ask AI" })]
+			}),
+			open && showMenu ? (0, import_jsx_runtime.jsxs)("div", {
+				className: "float",
+				role: "menu",
 				style: {
-					fontSize: 12,
-					flex: "none"
+					position: "absolute",
+					right: 0,
+					top: 38,
+					width: 236,
+					padding: 6,
+					zIndex: 50
 				},
-				onClick: () => copy(key, value),
-				children: copied === key ? "Copied" : copied === `${key}-failed` ? "Copy failed" : "Copy"
-			})]
-		})]
-	});
-	return (0, import_jsx_runtime.jsxs)("div", {
-		ref: box,
-		style: { position: "relative" },
-		children: [(0, import_jsx_runtime.jsxs)("button", {
-			type: "button",
-			className: "nav-item",
-			"aria-haspopup": "menu",
-			"aria-expanded": open,
-			style: {
-				width: "auto",
-				margin: 0,
-				padding: "6px 11px",
-				border: "1px solid var(--border-hairline)"
-			},
-			onClick: () => setOpen((v) => !v),
-			children: [(0, import_jsx_runtime.jsx)(Icon, {
-				name: "sparkles",
-				size: 14
-			}), (0, import_jsx_runtime.jsx)("span", { children: "Ask AI" })]
-		}), open ? (0, import_jsx_runtime.jsxs)("div", {
-			className: "float",
-			role: "menu",
-			style: {
-				position: "absolute",
-				right: 0,
-				top: 38,
-				width: 320,
-				padding: 6,
-				zIndex: 50
-			},
-			children: [
-				line("Say this to your assistant", offer.question, "question"),
-				offer.address ? line("Connector address", offer.address, "address") : (0, import_jsx_runtime.jsxs)("p", {
-					style: {
-						margin: 0,
-						padding: "7px 10px",
-						fontSize: 12,
-						color: "var(--text-muted)",
-						lineHeight: 1.5
-					},
-					children: [offer.stdio ? "This deployment has no published address, but your assistant can connect to it directly. " : "No connector is set up on this deployment yet, so there is no address to paste. ", "The question above is what to ask once it is connected."]
-				}),
-				(0, import_jsx_runtime.jsx)("div", { style: {
-					height: 1,
-					background: "var(--border-hairline)",
-					margin: "5px 8px"
-				} }),
-				(0, import_jsx_runtime.jsx)("button", {
-					type: "button",
-					role: "menuitem",
-					className: "nav-item",
-					style: {
-						fontSize: 13,
-						padding: "7px 10px"
-					},
-					onClick: () => {
-						setOpen(false);
-						ctx.go(offer.instructionsPath);
-					},
-					children: "How to connect your assistant"
-				})
-			]
-		}) : null]
+				children: [
+					ASSISTANTS.map((a) => (0, import_jsx_runtime.jsxs)("button", {
+						type: "button",
+						role: "menuitem",
+						className: "nav-item",
+						style: {
+							fontSize: 13,
+							padding: "7px 10px",
+							margin: 0,
+							justifyContent: "space-between"
+						},
+						onClick: () => ask(a.href(offer.question)),
+						children: [(0, import_jsx_runtime.jsx)("span", { children: a.label }), (0, import_jsx_runtime.jsx)(Icon, {
+							name: "arrow-right",
+							size: 14
+						})]
+					}, a.label)),
+					(0, import_jsx_runtime.jsx)("div", { style: {
+						height: 1,
+						background: "var(--border-hairline)",
+						margin: "5px 8px"
+					} }),
+					(0, import_jsx_runtime.jsx)("button", {
+						type: "button",
+						role: "menuitem",
+						className: "nav-item",
+						style: {
+							fontSize: 13,
+							padding: "7px 10px",
+							margin: 0,
+							justifyContent: "space-between",
+							color: "var(--text-muted)"
+						},
+						onClick: () => {
+							setOpen(false);
+							ctx.go(AI_SETUP_PATH);
+						},
+						children: (0, import_jsx_runtime.jsx)("span", { children: "Connect another AI" })
+					})
+				]
+			}) : null,
+			open && !showMenu ? (0, import_jsx_runtime.jsxs)("div", {
+				className: "float",
+				role: "dialog",
+				"aria-label": "Connect your AI first",
+				style: {
+					position: "absolute",
+					right: 0,
+					top: 38,
+					width: 276,
+					padding: 12,
+					zIndex: 50,
+					display: "grid",
+					gap: 9
+				},
+				children: [
+					(0, import_jsx_runtime.jsx)("div", {
+						style: {
+							fontSize: 13.5,
+							fontWeight: 700,
+							color: "var(--text-strong)"
+						},
+						children: "Connect your AI first"
+					}),
+					(0, import_jsx_runtime.jsx)("p", {
+						style: {
+							margin: 0,
+							fontSize: 12.5,
+							color: "var(--text-muted)",
+							lineHeight: 1.5
+						},
+						children: "Connect Claude or ChatGPT once. After that, this button opens it with a question about this report typed in."
+					}),
+					(0, import_jsx_runtime.jsxs)("button", {
+						type: "button",
+						className: "btn-primary",
+						style: {
+							fontSize: 13,
+							padding: "6px 11px",
+							justifySelf: "start",
+							display: "inline-flex",
+							alignItems: "center",
+							gap: 6
+						},
+						onClick: () => {
+							setOpen(false);
+							ctx.go(AI_SETUP_PATH);
+						},
+						children: ["Set it up ", (0, import_jsx_runtime.jsx)(Icon, {
+							name: "arrow-right",
+							size: 14
+						})]
+					}),
+					(0, import_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "link-btn",
+						style: {
+							fontSize: 12.5,
+							justifySelf: "start"
+						},
+						onClick: () => setAskAnyway(true),
+						children: "Already connected? Ask anyway"
+					})
+				]
+			}) : null
+		]
 	});
 }
 function ExportMenu({ send, runId, offered }) {
@@ -16258,8 +16339,7 @@ function Result({ ctx, runId, markSlug }) {
 						}),
 						(0, import_jsx_runtime.jsx)("span", { style: { flex: 1 } }),
 						(0, import_jsx_runtime.jsx)(AskAiMenu, {
-							runId: run.runId,
-							mark: run.markName,
+							run,
 							ctx
 						}),
 						doc ? (0, import_jsx_runtime.jsx)(ExportMenu, {
@@ -17874,7 +17954,6 @@ function NewClearance({ ctx }) {
 	});
 	if (needsOwner || searches?.kind === "pickAccount") return (0, import_jsx_runtime.jsx)(CompanyGate, {
 		ctx,
-		eyebrow: "New clearance",
 		heading: "New clearance",
 		line: "Pick a company to run this clearance on."
 	});
@@ -17902,19 +17981,8 @@ function NewClearance({ ctx }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen",
 		children: [
-			(0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				children: editingSlug ? "Custom search" : "New clearance"
-			}),
 			(0, import_jsx_runtime.jsx)(CreatedStrip, {}),
-			(0, import_jsx_runtime.jsx)("h1", {
-				style: {
-					fontSize: 27,
-					margin: "4px 0 14px",
-					color: "var(--text-strong)"
-				},
-				children: editingSlug ? "Edit a custom search" : "New clearance"
-			}),
+			(0, import_jsx_runtime.jsx)(PageHeader, { title: editingSlug ? "Edit a custom search" : "New clearance" }),
 			editingSlug ? editingRes && editingRes.kind !== "ok" ? (0, import_jsx_runtime.jsxs)("div", {
 				className: "notice",
 				style: { borderColor: "var(--tone-high)" },
@@ -18565,7 +18633,7 @@ function NewClearance({ ctx }) {
 							nativeControl === "toggle" ? (0, import_jsx_runtime.jsx)("div", {
 								className: "sunken-block",
 								style: { marginTop: 12 },
-								children: (0, import_jsx_runtime.jsx)(Lever$1, {
+								children: (0, import_jsx_runtime.jsx)(Lever$2, {
 									label: "Native-language investigation",
 									hint: "Native marketplaces and native registers in the language of the countries you named. A clearance already searches the mark transliterated into the scripts its territories register marks in — this is the deeper read.",
 									on: draft.pick.nativeLanguage,
@@ -19277,7 +19345,7 @@ function SetupCommand({ route }) {
 		"from a copy of the source."
 	] });
 }
-function Lever$1({ label, hint, on, onToggle, coming }) {
+function Lever$2({ label, hint, on, onToggle, coming }) {
 	return (0, import_jsx_runtime.jsxs)("button", {
 		type: "button",
 		onClick: coming ? void 0 : onToggle,
@@ -19834,51 +19902,37 @@ function OptionsUnavailable({ kind, onRetry }) {
 function Submitted({ go, onAnother }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen",
-		children: [
-			(0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				children: "Queued"
-			}),
-			(0, import_jsx_runtime.jsx)("h1", {
-				style: {
-					fontSize: 27,
-					margin: "4px 0 14px",
-					color: "var(--text-strong)"
-				},
-				children: "Clearance started"
-			}),
-			(0, import_jsx_runtime.jsxs)("div", {
-				className: "notice prose",
-				children: [
-					(0, import_jsx_runtime.jsx)("b", { children: "It is in the queue" }),
-					(0, import_jsx_runtime.jsx)("p", {
-						style: {
-							margin: "6px 0 0",
-							color: "var(--text-muted)"
-						},
-						children: "It will appear in Clearances, and the entry there tracks it the whole way — including if it stops early."
-					}),
-					(0, import_jsx_runtime.jsxs)("div", {
-						style: {
-							marginTop: 14,
-							display: "flex",
-							gap: 10
-						},
-						children: [(0, import_jsx_runtime.jsx)("button", {
-							type: "button",
-							className: "btn-primary",
-							onClick: () => go("/portal/clearances"),
-							children: "View in Clearances"
-						}), (0, import_jsx_runtime.jsx)("button", {
-							type: "button",
-							className: "btn-ghost",
-							onClick: onAnother,
-							children: "Start another"
-						})]
-					})
-				]
-			})
-		]
+		children: [(0, import_jsx_runtime.jsx)(PageHeader, { title: "Clearance started" }), (0, import_jsx_runtime.jsxs)("div", {
+			className: "notice prose",
+			children: [
+				(0, import_jsx_runtime.jsx)("b", { children: "It is in the queue" }),
+				(0, import_jsx_runtime.jsx)("p", {
+					style: {
+						margin: "6px 0 0",
+						color: "var(--text-muted)"
+					},
+					children: "It will appear in Clearances, and the entry there tracks it the whole way — including if it stops early."
+				}),
+				(0, import_jsx_runtime.jsxs)("div", {
+					style: {
+						marginTop: 14,
+						display: "flex",
+						gap: 10
+					},
+					children: [(0, import_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "btn-primary",
+						onClick: () => go("/portal/clearances"),
+						children: "View in Clearances"
+					}), (0, import_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "btn-ghost",
+						onClick: onAnother,
+						children: "Start another"
+					})]
+				})
+			]
+		})]
 	});
 }
 function CreatedStrip() {
@@ -20515,29 +20569,14 @@ function NewCompany({ ctx }) {
 	const rejected = result && !isOk(result) && result.kind === "reject" ? result.errors : null;
 	const takenBy = result && !isOk(result) && result.kind === "reject" && result.detail?.code === "key_exists" ? result.detail.key : null;
 	const otherFailure = result && !isOk(result) && result.kind !== "reject" ? result : null;
-	return (0, import_jsx_runtime.jsxs)("div", {
+	return (0, import_jsx_runtime.jsx)("div", {
 		className: "screen",
-		children: [(0, import_jsx_runtime.jsx)("div", {
-			className: "eyebrow",
-			children: "Company"
-		}), (0, import_jsx_runtime.jsxs)("div", {
+		children: (0, import_jsx_runtime.jsxs)("div", {
 			className: "measure",
 			children: [
-				(0, import_jsx_runtime.jsx)("h1", {
-					style: {
-						fontSize: 27,
-						margin: "0 0 4px",
-						color: "var(--text-strong)"
-					},
-					children: "New company"
-				}),
-				(0, import_jsx_runtime.jsx)("p", {
-					style: {
-						margin: "0 0 18px",
-						color: "var(--text-muted)",
-						fontSize: 14.5
-					},
-					children: "The business whose names you are checking. Only the name is needed; everything else has a default you can change later."
+				(0, import_jsx_runtime.jsx)(PageHeader, {
+					title: "New company",
+					lede: "The business whose names you are checking. Only the name is needed; everything else has a default you can change later."
 				}),
 				orgsHeld.length > 1 ? (0, import_jsx_runtime.jsxs)("div", {
 					style: { marginBottom: 8 },
@@ -20684,7 +20723,7 @@ function NewCompany({ ctx }) {
 					}) : null]
 				})
 			]
-		})]
+		})
 	});
 }
 function KeyLine({ value, onChange }) {
@@ -21140,23 +21179,12 @@ function Empty({ onNew }) {
 function PickCompany({ ctx }) {
 	return (0, import_jsx_runtime.jsx)(CompanyGate, {
 		ctx,
-		eyebrow: "Company",
 		heading: "Custom searches",
 		line: "Pick a company to see its custom searches."
 	});
 }
 function Heading() {
-	return (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [(0, import_jsx_runtime.jsx)("div", {
-		className: "eyebrow",
-		children: "Custom searches"
-	}), (0, import_jsx_runtime.jsx)("h1", {
-		style: {
-			fontSize: 27,
-			margin: "4px 0 6px",
-			color: "var(--text-strong)"
-		},
-		children: "Custom searches"
-	})] });
+	return (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: (0, import_jsx_runtime.jsx)(PageHeader, { title: "Custom searches" }) });
 }
 //#endregion
 //#region src/screens/Preferences.tsx
@@ -21172,222 +21200,203 @@ function Preferences({ ctx }) {
 	};
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen",
-		children: [
-			(0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				children: "Settings"
-			}),
-			(0, import_jsx_runtime.jsx)("h1", {
-				style: {
-					fontSize: 27,
-					margin: "4px 0 6px",
-					color: "var(--text-strong)"
-				},
-				children: "Your preferences"
-			}),
-			(0, import_jsx_runtime.jsx)("p", {
-				className: "prose",
-				style: {
-					margin: 0,
-					color: "var(--text-muted)"
-				},
-				children: "Who you are signed in as, and how the portal looks on this computer."
-			}),
-			(0, import_jsx_runtime.jsxs)("div", {
-				className: "measure",
-				style: { "--screen-measure": "720px" },
-				children: [
-					(0, import_jsx_runtime.jsxs)(Section, {
-						title: "Your sign-in",
-						hint: `Held by ${operatorName(ctx.me.brand)}. Nothing here can be changed from this page.`,
-						children: [
-							(0, import_jsx_runtime.jsxs)("dl", {
-								style: {
-									margin: 0,
-									display: "grid",
-									gridTemplateColumns: "auto 1fr",
-									gap: "8px 18px",
-									fontSize: 14
-								},
-								children: [
-									(0, import_jsx_runtime.jsx)("dt", {
-										style: { color: "var(--text-muted)" },
-										children: "Address"
-									}),
-									(0, import_jsx_runtime.jsx)("dd", {
-										style: {
-											margin: 0,
-											color: "var(--text-strong)",
-											wordBreak: "break-all"
-										},
+		children: [(0, import_jsx_runtime.jsx)(PageHeader, {
+			title: "Your preferences",
+			lede: "Who you are signed in as, and how the portal looks on this computer."
+		}), (0, import_jsx_runtime.jsxs)("div", {
+			className: "measure",
+			style: { "--screen-measure": "720px" },
+			children: [
+				(0, import_jsx_runtime.jsxs)(Section, {
+					title: "Your sign-in",
+					hint: `Held by ${operatorName(ctx.me.brand)}. Nothing here can be changed from this page.`,
+					children: [
+						(0, import_jsx_runtime.jsxs)("dl", {
+							style: {
+								margin: 0,
+								display: "grid",
+								gridTemplateColumns: "auto 1fr",
+								gap: "8px 18px",
+								fontSize: 14
+							},
+							children: [
+								(0, import_jsx_runtime.jsx)("dt", {
+									style: { color: "var(--text-muted)" },
+									children: "Address"
+								}),
+								(0, import_jsx_runtime.jsx)("dd", {
+									style: {
+										margin: 0,
+										color: "var(--text-strong)",
+										wordBreak: "break-all"
+									},
+									"data-anon": "mark",
+									children: ctx.me.email || "—"
+								}),
+								(0, import_jsx_runtime.jsx)("dt", {
+									style: { color: "var(--text-muted)" },
+									children: "Permissions"
+								}),
+								(0, import_jsx_runtime.jsx)("dd", {
+									style: {
+										margin: 0,
+										color: "var(--text-strong)"
+									},
+									children: permissionsPhrase(ctx.me.permissions)
+								}),
+								(0, import_jsx_runtime.jsx)("dt", {
+									style: { color: "var(--text-muted)" },
+									children: "Access to"
+								}),
+								(0, import_jsx_runtime.jsx)("dd", {
+									style: {
+										margin: 0,
+										color: "var(--text-strong)"
+									},
+									children: ctx.me.access.length ? (0, import_jsx_runtime.jsx)("span", {
 										"data-anon": "mark",
-										children: ctx.me.email || "—"
-									}),
-									(0, import_jsx_runtime.jsx)("dt", {
-										style: { color: "var(--text-muted)" },
-										children: "Permissions"
-									}),
-									(0, import_jsx_runtime.jsx)("dd", {
-										style: {
-											margin: 0,
-											color: "var(--text-strong)"
-										},
-										children: permissionsPhrase(ctx.me.permissions)
-									}),
-									(0, import_jsx_runtime.jsx)("dt", {
+										children: accessChips(ctx.me.access).map((c) => c.label).join(", ")
+									}) : (0, import_jsx_runtime.jsx)("span", {
 										style: { color: "var(--text-muted)" },
-										children: "Access to"
-									}),
-									(0, import_jsx_runtime.jsx)("dd", {
-										style: {
-											margin: 0,
-											color: "var(--text-strong)"
-										},
-										children: ctx.me.access.length ? (0, import_jsx_runtime.jsx)("span", {
-											"data-anon": "mark",
-											children: accessChips(ctx.me.access).map((c) => c.label).join(", ")
-										}) : (0, import_jsx_runtime.jsx)("span", {
-											style: { color: "var(--text-muted)" },
-											children: "None recorded against this address."
-										})
+										children: "None recorded against this address."
 									})
-								]
-							}),
-							(0, import_jsx_runtime.jsxs)("p", {
-								style: {
-									margin: "14px 0 0",
-									fontSize: 13,
-									color: "var(--text-muted)"
-								},
-								children: [
-									"To change the address, the role or the companies on it, ask ",
-									operatorName(ctx.me.brand),
-									" — enrolment is done for you, not from this page."
-								]
-							}),
-							(0, import_jsx_runtime.jsx)("a", {
-								className: "pill",
-								href: "/portal/sign-out",
-								style: {
-									display: "inline-block",
-									marginTop: 12,
-									textDecoration: "none"
-								},
-								children: "Log out"
-							})
-						]
-					}),
-					(0, import_jsx_runtime.jsxs)(Section, {
-						title: "Appearance",
-						hint: "Applies straight away, and is remembered in this browser.",
-						children: [(0, import_jsx_runtime.jsxs)("div", {
-							style: {
-								display: "flex",
-								gap: 10,
-								flexWrap: "wrap"
-							},
-							children: [(0, import_jsx_runtime.jsx)(ThemeOption, {
-								label: "Light",
-								value: "light",
-								current: theme,
-								onPick: applyTheme
-							}), (0, import_jsx_runtime.jsx)(ThemeOption, {
-								label: "Dark",
-								value: "dark",
-								current: theme,
-								onPick: applyTheme
-							})]
-						}), (0, import_jsx_runtime.jsx)("p", {
+								})
+							]
+						}),
+						(0, import_jsx_runtime.jsxs)("p", {
 							style: {
-								margin: "12px 0 0",
+								margin: "14px 0 0",
 								fontSize: 13,
 								color: "var(--text-muted)"
 							},
-							children: "The same choice is on the top bar, under the circle icon — this page and that button set one and the same setting."
+							children: [
+								"To change the address, the role or the companies on it, ask ",
+								operatorName(ctx.me.brand),
+								" — enrolment is done for you, not from this page."
+							]
+						}),
+						(0, import_jsx_runtime.jsx)("a", {
+							className: "pill",
+							href: "/portal/sign-out",
+							style: {
+								display: "inline-block",
+								marginTop: 12,
+								textDecoration: "none"
+							},
+							children: "Log out"
+						})
+					]
+				}),
+				(0, import_jsx_runtime.jsxs)(Section, {
+					title: "Appearance",
+					hint: "Applies straight away, and is remembered in this browser.",
+					children: [(0, import_jsx_runtime.jsxs)("div", {
+						style: {
+							display: "flex",
+							gap: 10,
+							flexWrap: "wrap"
+						},
+						children: [(0, import_jsx_runtime.jsx)(ThemeOption, {
+							label: "Light",
+							value: "light",
+							current: theme,
+							onPick: applyTheme
+						}), (0, import_jsx_runtime.jsx)(ThemeOption, {
+							label: "Dark",
+							value: "dark",
+							current: theme,
+							onPick: applyTheme
 						})]
-					}),
-					(0, import_jsx_runtime.jsxs)(Section, {
-						title: "Blurring names while you share a screen",
-						hint: "There is one control for this, and it is on the top bar.",
-						children: [
-							(0, import_jsx_runtime.jsxs)("div", {
+					}), (0, import_jsx_runtime.jsx)("p", {
+						style: {
+							margin: "12px 0 0",
+							fontSize: 13,
+							color: "var(--text-muted)"
+						},
+						children: "The same choice is on the top bar, under the circle icon — this page and that button set one and the same setting."
+					})]
+				}),
+				(0, import_jsx_runtime.jsxs)(Section, {
+					title: "Blurring names while you share a screen",
+					hint: "There is one control for this, and it is on the top bar.",
+					children: [
+						(0, import_jsx_runtime.jsxs)("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								gap: 12
+							},
+							children: [(0, import_jsx_runtime.jsxs)("span", {
+								className: "pill",
 								style: {
-									display: "flex",
+									display: "inline-flex",
 									alignItems: "center",
-									gap: 12
-								},
-								children: [(0, import_jsx_runtime.jsxs)("span", {
-									className: "pill",
-									style: {
-										display: "inline-flex",
-										alignItems: "center",
-										gap: 7,
-										padding: "4px 11px"
-									},
-									children: [(0, import_jsx_runtime.jsx)(Icon, {
-										name: "eye",
-										size: 15
-									}), "Top bar"]
-								}), (0, import_jsx_runtime.jsx)("span", {
-									style: {
-										fontSize: 13.5,
-										color: "var(--text-muted)"
-									},
-									children: "The eye button, to the left of your initials."
-								})]
-							}),
-							(0, import_jsx_runtime.jsx)("p", {
-								style: {
-									margin: "12px 0 0",
-									color: "var(--text-muted)",
-									fontSize: 13.5
+									gap: 7,
+									padding: "4px 11px"
 								},
-								children: "Pressing it blurs every brand name, mark and company the portal puts on screen — in the lists, on this page, in the heading above a report, and the report itself — so you can put the portal on a call or a projector without showing whose names are in clearance. Nothing is hidden from you: the text is still there and still selectable by the page, it is only blurred on screen. Press the button again to bring the names back."
-							}),
-							(0, import_jsx_runtime.jsxs)("div", {
-								className: "notice",
+								children: [(0, import_jsx_runtime.jsx)(Icon, {
+									name: "eye",
+									size: 15
+								}), "Top bar"]
+							}), (0, import_jsx_runtime.jsx)("span", {
 								style: {
-									marginTop: 14,
-									borderLeftColor: "var(--tone-medium)"
+									fontSize: 13.5,
+									color: "var(--text-muted)"
 								},
-								children: [(0, import_jsx_runtime.jsx)("b", {
-									style: { color: "var(--text-strong)" },
-									children: "An open report blurs completely"
-								}), (0, import_jsx_runtime.jsx)("p", {
-									style: {
-										margin: "6px 0 0",
-										color: "var(--text-muted)"
-									},
-									children: "A report is a separate document held inside the page, and it can only be covered whole. With a report open, the button blurs all of it rather than just the names in it. That is deliberate — it is the safer way round for a screen you are sharing."
-								})]
-							}),
-							(0, import_jsx_runtime.jsx)("p", {
+								children: "The eye button, to the left of your initials."
+							})]
+						}),
+						(0, import_jsx_runtime.jsx)("p", {
+							style: {
+								margin: "12px 0 0",
+								color: "var(--text-muted)",
+								fontSize: 13.5
+							},
+							children: "Pressing it blurs every brand name, mark and company the portal puts on screen — in the lists, on this page, in the heading above a report, and the report itself — so you can put the portal on a call or a projector without showing whose names are in clearance. Nothing is hidden from you: the text is still there and still selectable by the page, it is only blurred on screen. Press the button again to bring the names back."
+						}),
+						(0, import_jsx_runtime.jsxs)("div", {
+							className: "notice",
+							style: {
+								marginTop: 14,
+								borderLeftColor: "var(--tone-medium)"
+							},
+							children: [(0, import_jsx_runtime.jsx)("b", {
+								style: { color: "var(--text-strong)" },
+								children: "An open report blurs completely"
+							}), (0, import_jsx_runtime.jsx)("p", {
 								style: {
-									margin: "10px 0 0",
-									color: "var(--text-muted)",
-									fontSize: 13.5
+									margin: "6px 0 0",
+									color: "var(--text-muted)"
 								},
-								children: "It starts switched off every time you open the portal, so reloading the page brings the names back whether you meant it to or not. Turn it on again before you share."
-							})
-						]
-					}),
-					(0, import_jsx_runtime.jsxs)("div", {
-						className: "notice quiet",
-						style: { marginTop: 26 },
-						children: [(0, import_jsx_runtime.jsx)("b", {
-							style: { color: "var(--text-strong)" },
-							children: "These two settings stay on this computer"
-						}), (0, import_jsx_runtime.jsxs)("p", {
+								children: "A report is a separate document held inside the page, and it can only be covered whole. With a report open, the button blurs all of it rather than just the names in it. That is deliberate — it is the safer way round for a screen you are sharing."
+							})]
+						}),
+						(0, import_jsx_runtime.jsx)("p", {
 							style: {
-								margin: "6px 0 0",
-								color: "var(--text-muted)"
+								margin: "10px 0 0",
+								color: "var(--text-muted)",
+								fontSize: 13.5
 							},
-							children: [operatorName(ctx.me.brand, { lead: true }), " does not store them against your account. The appearance choice is kept by this browser, so it holds for this computer and this browser only — sign in somewhere else, or use a different browser here, and you will get the light theme again until you set it. The screen-share blur is not kept at all: it lasts until you reload or close the page."]
-						})]
-					})
-				]
-			})
-		]
+							children: "It starts switched off every time you open the portal, so reloading the page brings the names back whether you meant it to or not. Turn it on again before you share."
+						})
+					]
+				}),
+				(0, import_jsx_runtime.jsxs)("div", {
+					className: "notice quiet",
+					style: { marginTop: 26 },
+					children: [(0, import_jsx_runtime.jsx)("b", {
+						style: { color: "var(--text-strong)" },
+						children: "These two settings stay on this computer"
+					}), (0, import_jsx_runtime.jsxs)("p", {
+						style: {
+							margin: "6px 0 0",
+							color: "var(--text-muted)"
+						},
+						children: [operatorName(ctx.me.brand, { lead: true }), " does not store them against your account. The appearance choice is kept by this browser, so it holds for this computer and this browser only — sign in somewhere else, or use a different browser here, and you will get the light theme again until you set it. The screen-share blur is not kept at all: it lasts until you reload or close the page."]
+					})]
+				})
+			]
+		})]
 	});
 }
 function ThemeOption({ label, value, current, onPick }) {
@@ -21664,17 +21673,9 @@ function UseYourAI({ ctx }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen ai-screen",
 		children: [
-			(0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				children: "Use your own AI"
-			}),
-			(0, import_jsx_runtime.jsx)("h1", {
-				className: "ai-title",
-				children: "Use your own AI"
-			}),
-			(0, import_jsx_runtime.jsx)("p", {
-				className: "ai-lead",
-				children: "Run and interrogate clearances from the assistant you already use — by voice, by email, or just by asking."
+			(0, import_jsx_runtime.jsx)(PageHeader, {
+				title: "Use your own AI",
+				lede: "Run and interrogate clearances from the assistant you already use — by voice, by email, or just by asking."
 			}),
 			(0, import_jsx_runtime.jsxs)("section", {
 				className: "ctx-card ai-can",
@@ -21920,7 +21921,6 @@ function Profile({ ctx }) {
 	useUnsaved(dirty);
 	if (needsOwner || result?.kind === "pickAccount") return (0, import_jsx_runtime.jsx)(CompanyGate, {
 		ctx,
-		eyebrow: "Company",
 		heading: "Profile",
 		line: "Pick a company to see its profile."
 	});
@@ -22472,7 +22472,6 @@ function Projects({ ctx }) {
 	const projects = result?.kind === "ok" ? result.value : [];
 	if (needsOwner || result?.kind === "pickAccount") return (0, import_jsx_runtime.jsx)(CompanyGate, {
 		ctx,
-		eyebrow: "Company",
 		heading: "Projects",
 		line: "Pick a company to see its projects."
 	});
@@ -23685,54 +23684,29 @@ function PeopleAccess({ ctx }) {
 	const v = result.value;
 	const broken = v.people.filter((p) => p.dangling.length > 0);
 	const where = ctx.organisations.length === 1 ? `at ${ctx.organisations[0]?.name ?? ""}` : "here";
-	return (0, import_jsx_runtime.jsxs)("div", {
+	return (0, import_jsx_runtime.jsx)("div", {
 		className: "screen",
-		children: [(0, import_jsx_runtime.jsx)("div", {
-			className: "eyebrow",
-			children: "People"
-		}), (0, import_jsx_runtime.jsxs)("div", {
+		children: (0, import_jsx_runtime.jsxs)("div", {
 			className: "measure",
 			style: { "--screen-measure": "900px" },
 			children: [
-				(0, import_jsx_runtime.jsxs)("div", {
-					style: {
-						display: "flex",
-						alignItems: "flex-end",
-						gap: 20,
-						margin: "4px 0 16px"
-					},
-					children: [(0, import_jsx_runtime.jsxs)("div", {
-						style: { flex: 1 },
-						children: [(0, import_jsx_runtime.jsx)("h1", {
-							style: {
-								fontSize: 27,
-								margin: "0 0 4px",
-								color: "var(--text-strong)"
-							},
-							children: "People"
-						}), (0, import_jsx_runtime.jsxs)("p", {
-							style: {
-								margin: 0,
-								color: "var(--text-muted)",
-								fontSize: 14.5
-							},
-							children: [
-								"Who can use Clearotron ",
-								(0, import_jsx_runtime.jsx)("span", {
-									"data-anon": "mark",
-									children: where
-								}),
-								", what they can do, and which companies they can see."
-							]
-						})]
-					}), (0, import_jsx_runtime.jsx)("button", {
+				(0, import_jsx_runtime.jsx)(PageHeader, {
+					title: "People",
+					lede: (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+						"Who can use Clearotron ",
+						(0, import_jsx_runtime.jsx)("span", {
+							"data-anon": "mark",
+							children: where
+						}),
+						", what they can do, and which companies they can see."
+					] }),
+					actions: (0, import_jsx_runtime.jsx)("button", {
 						type: "button",
 						className: "btn-primary",
-						style: { flex: "none" },
 						disabled: !v.canAdd,
 						onClick: () => ctx.go(ADD_PERSON.path),
 						children: "+ Add a person"
-					})]
+					})
 				}),
 				v.localSignIn ? (0, import_jsx_runtime.jsx)("div", {
 					className: "notice quiet",
@@ -23824,12 +23798,17 @@ function PeopleAccess({ ctx }) {
 						children: [(0, import_jsx_runtime.jsx)("thead", { children: (0, import_jsx_runtime.jsxs)("tr", { children: [
 							(0, import_jsx_runtime.jsx)("th", { children: "Person" }),
 							(0, import_jsx_runtime.jsx)("th", { children: "Permissions" }),
-							(0, import_jsx_runtime.jsx)("th", { children: "Access to" })
+							(0, import_jsx_runtime.jsx)("th", { children: "Access to" }),
+							(0, import_jsx_runtime.jsx)("th", { "aria-label": "Change or remove" })
 						] }) }), (0, import_jsx_runtime.jsx)("tbody", { children: v.people.length === 0 ? (0, import_jsx_runtime.jsx)("tr", { children: (0, import_jsx_runtime.jsx)("td", {
-							colSpan: 3,
+							colSpan: 4,
 							style: { color: "var(--text-muted)" },
 							children: "Nobody has been given access yet."
-						}) }) : v.people.map((p) => (0, import_jsx_runtime.jsx)(Row, { person: p }, p.email)) })]
+						}) }) : v.people.map((p) => (0, import_jsx_runtime.jsx)(Row, {
+							person: p,
+							you: p.email.toLowerCase() === ctx.me.email.toLowerCase(),
+							onModify: () => ctx.go(`${MODIFY_PERSON.path}?email=${encodeURIComponent(p.email)}`)
+						}, p.email)) })]
 					})
 				}),
 				v.grantsFile ? (0, import_jsx_runtime.jsxs)("p", {
@@ -23862,7 +23841,7 @@ function PeopleAccess({ ctx }) {
 				}) : null,
 				(0, import_jsx_runtime.jsx)(Observed, { result: observed })
 			]
-		})]
+		})
 	});
 }
 function Observed({ result }) {
@@ -23958,11 +23937,11 @@ function Observed({ result }) {
 		]
 	});
 }
-function Row({ person }) {
+function Row({ person, you, onModify }) {
 	const chips = accessChips(person.access);
 	const viewOnly = !person.permissions.run && !person.permissions.manage;
 	return (0, import_jsx_runtime.jsxs)("tr", { children: [
-		(0, import_jsx_runtime.jsx)("td", { children: (0, import_jsx_runtime.jsx)("span", {
+		(0, import_jsx_runtime.jsxs)("td", { children: [(0, import_jsx_runtime.jsx)("span", {
 			style: {
 				fontWeight: 700,
 				color: "var(--text-strong)",
@@ -23970,7 +23949,15 @@ function Row({ person }) {
 			},
 			"data-anon": "mark",
 			children: person.email
-		}) }),
+		}), you ? (0, import_jsx_runtime.jsx)("span", {
+			className: "pill",
+			style: {
+				fontSize: 10.5,
+				padding: "1px 7px",
+				marginLeft: 7
+			},
+			children: "You"
+		}) : null] }),
 		(0, import_jsx_runtime.jsx)("td", {
 			style: { color: viewOnly ? "var(--text-muted)" : "var(--text-strong)" },
 			children: person.listed === false ? (0, import_jsx_runtime.jsx)("span", {
@@ -23992,7 +23979,23 @@ function Row({ person }) {
 		}) : (0, import_jsx_runtime.jsx)("span", {
 			style: { color: "var(--text-muted)" },
 			children: "Nothing yet — signed in, and given no access."
-		}) })
+		}) }),
+		(0, import_jsx_runtime.jsx)("td", {
+			style: {
+				textAlign: "right",
+				whiteSpace: "nowrap"
+			},
+			children: you ? null : (0, import_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: "pill",
+				style: {
+					cursor: "pointer",
+					fontSize: 12
+				},
+				onClick: onModify,
+				children: "Modify"
+			})
+		})
 	] });
 }
 //#endregion
@@ -24020,22 +24023,12 @@ function GiveAccess({ ctx }) {
 	(0, import_react.useEffect)(() => {
 		if (saved && !kept) ctx.go(PEOPLE.path);
 	}, [saved, kept]);
-	if (view && isOk(view) && !view.value.canAdd) return (0, import_jsx_runtime.jsxs)("div", {
+	if (view && isOk(view) && !view.value.canAdd) return (0, import_jsx_runtime.jsx)("div", {
 		className: "screen",
-		children: [(0, import_jsx_runtime.jsx)("div", {
-			className: "eyebrow",
-			children: "People"
-		}), (0, import_jsx_runtime.jsxs)("div", {
+		children: (0, import_jsx_runtime.jsxs)("div", {
 			className: "measure",
 			style: { "--screen-measure": "640px" },
-			children: [(0, import_jsx_runtime.jsx)("h1", {
-				style: {
-					fontSize: 27,
-					margin: "4px 0 12px",
-					color: "var(--text-strong)"
-				},
-				children: "Give someone access to Clearotron"
-			}), (0, import_jsx_runtime.jsx)("div", {
+			children: [(0, import_jsx_runtime.jsx)(PageHeader, { title: "Give someone access to Clearotron" }), (0, import_jsx_runtime.jsx)("div", {
 				className: "notice quiet",
 				children: (0, import_jsx_runtime.jsxs)("p", {
 					style: {
@@ -24059,7 +24052,7 @@ function GiveAccess({ ctx }) {
 					]
 				})
 			})]
-		})]
+		})
 	});
 	const holdsEverything = ctx.me.access.some((a) => a.kind === "everything");
 	const wholeOrgs = new Set(ctx.me.genericOrgs);
@@ -24111,30 +24104,15 @@ function GiveAccess({ ctx }) {
 		}
 	};
 	const failure = result && !isOk(result) ? result.kind === "conflict" ? "This Clearotron now signs in one person, so nobody can be added. Nothing was saved." : result.kind === "notFound" ? "You can only give access to what you have access to yourself. Nothing was saved." : result.kind === "reject" ? result.errors.join(" ") : saveFailureText(result, "That could not be saved. Nothing was changed.") : null;
-	return (0, import_jsx_runtime.jsxs)("div", {
+	return (0, import_jsx_runtime.jsx)("div", {
 		className: "screen",
-		children: [(0, import_jsx_runtime.jsx)("div", {
-			className: "eyebrow",
-			children: "People"
-		}), (0, import_jsx_runtime.jsxs)("div", {
+		children: (0, import_jsx_runtime.jsxs)("div", {
 			className: "measure",
 			style: { "--screen-measure": "640px" },
 			children: [
-				(0, import_jsx_runtime.jsx)("h1", {
-					style: {
-						fontSize: 27,
-						margin: "4px 0 4px",
-						color: "var(--text-strong)"
-					},
-					children: "Give someone access to Clearotron"
-				}),
-				(0, import_jsx_runtime.jsx)("p", {
-					style: {
-						margin: "0 0 22px",
-						color: "var(--text-muted)",
-						fontSize: 14.5
-					},
-					children: "Enter their email, choose what they can see and do, then save. They sign in the same way you do."
+				(0, import_jsx_runtime.jsx)(PageHeader, {
+					title: "Give someone access to Clearotron",
+					lede: "Enter their email, choose what they can see and do, then save. They sign in the same way you do."
 				}),
 				(0, import_jsx_runtime.jsx)("label", {
 					className: "field-label",
@@ -24163,7 +24141,7 @@ function GiveAccess({ ctx }) {
 						gap: 8,
 						marginBottom: 6
 					},
-					children: [(0, import_jsx_runtime.jsx)(Lever, {
+					children: [(0, import_jsx_runtime.jsx)(Lever$1, {
 						on: permissions.run,
 						title: "Run clearances",
 						line: "Start and stop clearances on the companies they can see.",
@@ -24172,7 +24150,7 @@ function GiveAccess({ ctx }) {
 							...p,
 							run: !p.run
 						}))
-					}), (0, import_jsx_runtime.jsx)(Lever, {
+					}), (0, import_jsx_runtime.jsx)(Lever$1, {
 						on: permissions.manage,
 						title: "Manage",
 						line: "Add companies, add people and change settings for the companies they can see.",
@@ -24202,7 +24180,7 @@ function GiveAccess({ ctx }) {
 						gap: 6,
 						marginBottom: 8
 					},
-					children: [holdsEverything ? (0, import_jsx_runtime.jsx)(AttachRow, {
+					children: [holdsEverything ? (0, import_jsx_runtime.jsx)(AttachRow$1, {
 						on: chosen.everything,
 						name: "Everything on this Clearotron",
 						line: "all organisations and companies, including ones added later",
@@ -24213,7 +24191,7 @@ function GiveAccess({ ctx }) {
 						}))
 					}) : null, tree.map((t) => (0, import_jsx_runtime.jsxs)("div", {
 						style: { display: "contents" },
-						children: [t.whole ? (0, import_jsx_runtime.jsx)(AttachRow, {
+						children: [t.whole ? (0, import_jsx_runtime.jsx)(AttachRow$1, {
 							on: chosen.everything || chosen.orgs.has(t.org.key),
 							implied: chosen.everything,
 							name: t.org.name,
@@ -24223,7 +24201,7 @@ function GiveAccess({ ctx }) {
 								...c,
 								orgs: toggle(c.orgs, t.org.key)
 							}))
-						}) : null, t.companies.map((k) => (0, import_jsx_runtime.jsx)(AttachRow, {
+						}) : null, t.companies.map((k) => (0, import_jsx_runtime.jsx)(AttachRow$1, {
 							sub: t.whole,
 							on: covered(k),
 							implied: chosen.everything || chosen.orgs.has(t.org.key),
@@ -24319,9 +24297,496 @@ function GiveAccess({ ctx }) {
 					})] })
 				})
 			]
+		})
+	});
+}
+function Lever$1({ on, title, line, disabled, onToggle }) {
+	return (0, import_jsx_runtime.jsxs)("button", {
+		type: "button",
+		className: on ? "lever lever-on" : "lever",
+		"aria-pressed": on,
+		disabled,
+		onClick: onToggle,
+		children: [(0, import_jsx_runtime.jsx)("span", { className: on ? "lever-box lever-box-on" : "lever-box" }), (0, import_jsx_runtime.jsxs)("span", {
+			style: { textAlign: "left" },
+			children: [(0, import_jsx_runtime.jsx)("span", {
+				style: {
+					display: "block",
+					fontWeight: 600,
+					color: "var(--text-strong)"
+				},
+				children: title
+			}), (0, import_jsx_runtime.jsx)("span", {
+				style: {
+					display: "block",
+					fontSize: 12.5,
+					color: "var(--text-muted)"
+				},
+				children: line
+			})]
 		})]
 	});
 }
+function AttachRow$1({ on, implied = false, sub = false, name, line, disabled, onToggle }) {
+	return (0, import_jsx_runtime.jsxs)("button", {
+		type: "button",
+		className: `attach-row${on ? " on" : ""}${sub ? " sub" : ""}`,
+		"aria-pressed": on,
+		disabled: disabled || implied,
+		onClick: onToggle,
+		children: [
+			(0, import_jsx_runtime.jsx)("span", { className: on ? "lever-box lever-box-on" : "lever-box" }),
+			(0, import_jsx_runtime.jsx)("span", {
+				style: {
+					color: "var(--text-strong)",
+					fontWeight: sub ? 400 : 600
+				},
+				"data-anon": "mark",
+				children: name
+			}),
+			(0, import_jsx_runtime.jsx)("span", {
+				className: "sub-t",
+				children: line
+			})
+		]
+	});
+}
+//#endregion
+//#region src/screens/ModifyAccess.tsx
+var emailInQuery = () => (new URLSearchParams(window.location.search).get("email") ?? "").trim().toLowerCase();
+var heldBy = (person) => ({
+	orgs: new Set(person.access.filter((a) => a.kind === "organisation").map((a) => a.key)),
+	companies: new Set(person.access.filter((a) => a.kind === "company").map((a) => a.key))
+});
+var sameSet = (a, b) => a.size === b.size && [...a].every((k) => b.has(k));
+function ModifyAccess({ ctx }) {
+	const email = emailInQuery();
+	const { result: view } = useLoad(() => api.adminAccess(), []);
+	if (!view) return (0, import_jsx_runtime.jsx)("div", { className: "screen" });
+	if (!isOk(view)) return (0, import_jsx_runtime.jsx)("div", {
+		className: "screen",
+		children: (0, import_jsx_runtime.jsx)("div", {
+			className: "empty",
+			children: (0, import_jsx_runtime.jsx)("p", { children: "This page is not available." })
+		})
+	});
+	const person = view.value.people.find((p) => p.email.toLowerCase() === email) ?? null;
+	if (!person) return (0, import_jsx_runtime.jsx)("div", {
+		className: "screen",
+		children: (0, import_jsx_runtime.jsxs)("div", {
+			className: "measure",
+			style: { "--screen-measure": "640px" },
+			children: [
+				(0, import_jsx_runtime.jsx)(PageHeader, { title: "Modify access" }),
+				(0, import_jsx_runtime.jsx)("div", {
+					className: "notice quiet",
+					children: (0, import_jsx_runtime.jsx)("p", {
+						style: {
+							margin: 0,
+							fontSize: 13.5,
+							color: "var(--text-muted)"
+						},
+						children: "Nobody with that address has access you can see. They may have been removed, or their access may be somewhere you cannot reach."
+					})
+				}),
+				(0, import_jsx_runtime.jsx)("div", {
+					style: { marginTop: 16 },
+					children: (0, import_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "btn-ghost",
+						onClick: () => ctx.go(PEOPLE.path),
+						children: "Back to People"
+					})
+				})
+			]
+		})
+	});
+	return (0, import_jsx_runtime.jsx)(Form, {
+		ctx,
+		person,
+		view: view.value
+	}, person.email);
+}
+function Form({ ctx, person, view }) {
+	const held = heldBy(person);
+	const [permissions, setPermissions] = (0, import_react.useState)(person.permissions);
+	const [chosen, setChosen] = (0, import_react.useState)(held);
+	const [busy, setBusy] = (0, import_react.useState)(false);
+	const [confirming, setConfirming] = (0, import_react.useState)(false);
+	const [saved, setSaved] = (0, import_react.useState)(null);
+	const [gone, setGone] = (0, import_react.useState)(null);
+	const whole = person.covered === true;
+	const holdsEverything = person.access.some((a) => a.kind === "everything");
+	const orgName = (key) => ctx.organisations.find((o) => o.key === key)?.name ?? key;
+	const wholeOrgs = new Set(ctx.me.genericOrgs);
+	const companiesIn = (org) => ctx.ownerKeys.filter((k) => !isGenericKey(k) && ctx.orgOf(k) === org);
+	const tree = ctx.organisations.map((o) => ({
+		org: o,
+		whole: wholeOrgs.has(o.key),
+		companies: companiesIn(o.key)
+	})).filter((t) => t.whole || t.companies.length > 0);
+	const toggle = (set, key) => {
+		const next = new Set(set);
+		if (next.has(key)) next.delete(key);
+		else next.add(key);
+		return next;
+	};
+	const covered = (company) => chosen.companies.has(company) || chosen.orgs.has(ctx.orgOf(company) ?? "");
+	const soloCompanies = [...chosen.companies].filter((k) => !chosen.orgs.has(ctx.orgOf(k) ?? ""));
+	const dirty = !sameSet(chosen.orgs, held.orgs) || !sameSet(chosen.companies, held.companies) || permissions.run !== person.permissions.run || permissions.manage !== person.permissions.manage;
+	useUnsaved(dirty && saved === null && gone === null);
+	const access = [...[...chosen.orgs].map((key) => ({
+		kind: "organisation",
+		key
+	})), ...soloCompanies.map((key) => ({
+		kind: "company",
+		key
+	}))];
+	const leftWithNothing = access.length === 0;
+	const losing = [...[...held.orgs].filter((k) => !chosen.orgs.has(k)).map(orgName), ...[...held.companies].filter((k) => !covered(k)).map((k) => ctx.ownerName(k))];
+	const sentence = accessSentence({
+		who: person.email,
+		permissions,
+		everything: holdsEverything,
+		organisations: [...chosen.orgs].map(orgName),
+		companies: soloCompanies.map((k) => ({
+			name: ctx.ownerName(k),
+			organisation: orgName(ctx.orgOf(k) ?? "")
+		}))
+	});
+	const save = async () => {
+		setBusy(true);
+		try {
+			setSaved(await api.changePerson({
+				email: person.email,
+				permissions,
+				access
+			}));
+		} finally {
+			setBusy(false);
+		}
+	};
+	const remove = async () => {
+		setBusy(true);
+		try {
+			const r = await api.removePerson({ email: person.email });
+			setGone(r);
+			if (isOk(r)) ctx.go(PEOPLE.path);
+		} finally {
+			setBusy(false);
+		}
+	};
+	const failure = (r) => r === null || isOk(r) ? null : r.kind === "conflict" ? "This Clearotron now signs in one person, so nobody else can be changed. Nothing was saved." : r.kind === "notFound" ? "That is not access you can change. Nothing was saved." : r.kind === "reject" ? r.errors.join(" ") : saveFailureText(r, "That could not be saved. Nothing was changed.");
+	const problem = failure(saved) ?? failure(gone);
+	const loses = person.access.length ? person.access.map((a) => a.kind === "everything" ? "everything on this Clearotron" : a.name ?? a.key) : [];
+	const holdsKey = (person.keys ?? 0) > 0;
+	const keyStaysLive = holdsKey && view.keysRevocable !== true;
+	const domain = person.email.startsWith("*@") ? person.email.slice(2) : null;
+	return (0, import_jsx_runtime.jsx)("div", {
+		className: "screen",
+		children: (0, import_jsx_runtime.jsxs)("div", {
+			className: "measure",
+			style: { "--screen-measure": "640px" },
+			children: [
+				(0, import_jsx_runtime.jsx)(PageHeader, {
+					title: "Modify access",
+					lede: (0, import_jsx_runtime.jsx)("b", {
+						style: {
+							color: "var(--text-strong)",
+							wordBreak: "break-all"
+						},
+						"data-anon": "mark",
+						children: person.email
+					})
+				}),
+				(0, import_jsx_runtime.jsx)("div", {
+					className: "field-label",
+					children: "Permissions"
+				}),
+				(0, import_jsx_runtime.jsxs)("div", {
+					style: {
+						display: "flex",
+						flexDirection: "column",
+						gap: 8,
+						marginBottom: 6
+					},
+					children: [(0, import_jsx_runtime.jsx)(Lever, {
+						on: permissions.run,
+						title: "Run clearances",
+						line: "Start and stop clearances on the companies they can see.",
+						disabled: !whole || busy,
+						onToggle: () => setPermissions((p) => ({
+							...p,
+							run: !p.run
+						}))
+					}), (0, import_jsx_runtime.jsx)(Lever, {
+						on: permissions.manage,
+						title: "Manage",
+						line: "Add companies, add people and change settings for the companies they can see.",
+						disabled: !whole || busy,
+						onToggle: () => setPermissions((p) => ({
+							...p,
+							manage: !p.manage
+						}))
+					})]
+				}),
+				(0, import_jsx_runtime.jsx)("p", {
+					style: {
+						margin: "0 0 22px",
+						fontSize: 12.5,
+						color: "var(--text-faint)"
+					},
+					children: whole ? "Everyone can view reports for the companies they can see. Leave both off for a view-only person." : "They have access you can't see, so only someone who can see all of it can change their permissions."
+				}),
+				(0, import_jsx_runtime.jsx)("div", {
+					className: "field-label",
+					children: "Access to"
+				}),
+				(0, import_jsx_runtime.jsxs)("div", {
+					style: {
+						display: "flex",
+						flexDirection: "column",
+						gap: 6,
+						marginBottom: 8
+					},
+					children: [holdsEverything ? (0, import_jsx_runtime.jsx)(AttachRow, {
+						on: true,
+						name: "Everything on this Clearotron",
+						line: "all organisations and companies, including ones added later",
+						disabled: true,
+						onToggle: () => {}
+					}) : null, tree.map((t) => (0, import_jsx_runtime.jsxs)("div", {
+						style: { display: "contents" },
+						children: [t.whole ? (0, import_jsx_runtime.jsx)(AttachRow, {
+							on: chosen.orgs.has(t.org.key),
+							name: t.org.name,
+							line: "every company in it, including ones added later",
+							disabled: busy,
+							onToggle: () => setChosen((c) => ({
+								...c,
+								orgs: toggle(c.orgs, t.org.key)
+							}))
+						}) : null, t.companies.map((k) => (0, import_jsx_runtime.jsx)(AttachRow, {
+							sub: t.whole,
+							on: covered(k),
+							implied: chosen.orgs.has(t.org.key),
+							name: ctx.ownerName(k),
+							line: t.whole ? "company" : `company in ${t.org.name}`,
+							disabled: busy,
+							onToggle: () => setChosen((c) => ({
+								...c,
+								companies: toggle(c.companies, k)
+							}))
+						}, k))]
+					}, t.org.key))]
+				}),
+				(0, import_jsx_runtime.jsxs)("p", {
+					style: {
+						margin: "0 0 22px",
+						fontSize: 12.5,
+						color: "var(--text-faint)"
+					},
+					children: ["Untick a row to take that access away.", whole ? "" : " You are seeing the part of their access you can reach; the rest is not shown and is not changed."]
+				}),
+				(0, import_jsx_runtime.jsx)("div", {
+					className: "notice quiet",
+					style: { marginBottom: 18 },
+					children: (0, import_jsx_runtime.jsxs)("p", {
+						style: {
+							margin: 0,
+							fontSize: 13.5,
+							color: "var(--text-muted)"
+						},
+						"data-anon": "mark",
+						children: [sentence, losing.length ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [" ", (0, import_jsx_runtime.jsxs)("b", {
+							style: { color: "var(--text-strong)" },
+							children: [
+								"They lose ",
+								losing.join(", "),
+								"."
+							]
+						})] }) : null]
+					})
+				}),
+				problem ? (0, import_jsx_runtime.jsx)("div", {
+					className: "notice",
+					style: {
+						borderColor: "var(--tone-high)",
+						marginBottom: 14
+					},
+					children: (0, import_jsx_runtime.jsx)("p", {
+						style: {
+							margin: 0,
+							fontSize: 13.5
+						},
+						children: problem
+					})
+				}) : null,
+				saved && isOk(saved) ? (0, import_jsx_runtime.jsx)("div", {
+					className: "notice",
+					style: {
+						borderColor: "var(--tone-medium)",
+						marginBottom: 14
+					},
+					children: (0, import_jsx_runtime.jsxs)("p", {
+						style: {
+							margin: 0,
+							fontSize: 13.5
+						},
+						children: ["Saved. ", saved.value.switchesApplied ? permissionsPhrase(permissions) + "." : (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+							"Their permissions stay as they were: ",
+							permissionsPhrase(person.permissions),
+							". They have access you cannot see, and permissions apply everywhere a person has access."
+						] })]
+					})
+				}) : null,
+				(0, import_jsx_runtime.jsxs)("div", {
+					style: {
+						display: "flex",
+						gap: 10,
+						alignItems: "center"
+					},
+					children: [
+						(0, import_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: "btn-primary",
+							disabled: !dirty || busy || leftWithNothing,
+							onClick: () => void save(),
+							children: busy && !confirming ? "Saving…" : "Save changes"
+						}),
+						(0, import_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: "btn-ghost",
+							onClick: () => ctx.go(PEOPLE.path),
+							children: "Cancel"
+						}),
+						leftWithNothing ? (0, import_jsx_runtime.jsx)("span", {
+							style: {
+								fontSize: 12.5,
+								color: "var(--text-faint)"
+							},
+							children: "Nothing is ticked. Leave them at least one, or remove them below."
+						}) : null
+					]
+				}),
+				(0, import_jsx_runtime.jsx)("div", {
+					style: {
+						marginTop: 34,
+						paddingTop: 18,
+						borderTop: "1px solid var(--border-hairline)",
+						display: "flex",
+						flexDirection: "column",
+						gap: 10,
+						alignItems: "flex-start"
+					},
+					children: confirming ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [(0, import_jsx_runtime.jsx)("div", {
+						className: "notice",
+						style: {
+							borderColor: "var(--tone-high)",
+							margin: 0,
+							width: "100%"
+						},
+						children: (0, import_jsx_runtime.jsxs)("p", {
+							style: {
+								margin: 0,
+								fontSize: 13.5
+							},
+							children: [
+								(0, import_jsx_runtime.jsx)("b", {
+									"data-anon": "mark",
+									children: person.email
+								}),
+								" ",
+								whole ? (0, import_jsx_runtime.jsxs)("b", { children: [
+									"loses access to ",
+									loses.length ? loses.join(" and ") : "this Clearotron",
+									" straight away,"
+								] }) : (0, import_jsx_runtime.jsxs)("b", { children: [
+									"loses ",
+									loses.join(" and "),
+									" straight away,"
+								] }),
+								" ",
+								keyStaysLive ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+									"here. Their AI was issued a key this Clearotron cannot withdraw — it was started without a revocation list — so that key keeps working until it expires.",
+									" ",
+									(0, import_jsx_runtime.jsx)("b", {
+										className: "mono",
+										children: "clearotron doctor"
+									}),
+									" reports it.",
+									" "
+								] }) : (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: ["here and through their AI.", " "] }),
+								holdsKey && !keyStaysLive ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+									"Their AI’s key is withdrawn at the same time;",
+									" ",
+									(0, import_jsx_runtime.jsx)("b", {
+										className: "mono",
+										children: "clearotron doctor"
+									}),
+									" says whether the connector has picked it up.",
+									" "
+								] }) : null,
+								whole ? "To stop them reaching your sign-in page, take them off your login system too." : "They keep the access you cannot see.",
+								domain ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [" ", (0, import_jsx_runtime.jsxs)("b", { children: [
+									"This takes access away from everyone with an address at ",
+									(0, import_jsx_runtime.jsx)("span", {
+										"data-anon": "mark",
+										children: domain
+									}),
+									"."
+								] })] }) : null
+							]
+						})
+					}), (0, import_jsx_runtime.jsxs)("div", {
+						style: {
+							display: "flex",
+							gap: 8
+						},
+						children: [(0, import_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: "pill",
+							style: {
+								cursor: "pointer",
+								fontSize: 12,
+								borderColor: "var(--tone-high)"
+							},
+							disabled: busy,
+							onClick: () => void remove(),
+							children: busy ? "Working…" : "Confirm — remove"
+						}), (0, import_jsx_runtime.jsx)("button", {
+							type: "button",
+							className: "pill",
+							style: {
+								cursor: "pointer",
+								fontSize: 12
+							},
+							onClick: () => setConfirming(false),
+							children: "Cancel"
+						})]
+					})] }) : (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [(0, import_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: "pill",
+						style: {
+							cursor: "pointer",
+							fontSize: 12
+						},
+						disabled: busy,
+						onClick: () => setConfirming(true),
+						children: whole ? domain ? `Remove everyone at ${domain}` : "Remove from Clearotron" : `Remove from ${[...held.orgs].map(orgName).join(", ") || "here"}`
+					}), whole ? null : (0, import_jsx_runtime.jsx)("p", {
+						style: {
+							margin: 0,
+							fontSize: 12.5,
+							color: "var(--text-faint)"
+						},
+						children: "They keep the access you cannot see."
+					})] })
+				})
+			]
+		})
+	});
+}
 function Lever({ on, title, line, disabled, onToggle }) {
 	return (0, import_jsx_runtime.jsxs)("button", {
 		type: "button",
@@ -24393,7 +24858,7 @@ function About() {
 	if (failed) return (0, import_jsx_runtime.jsxs)("section", {
 		className: "screen",
 		children: [
-			(0, import_jsx_runtime.jsx)("h1", { children: "About" }),
+			(0, import_jsx_runtime.jsx)(PageHeader, { title: "About" }),
 			(0, import_jsx_runtime.jsx)("p", { children: "This deployment could not report which build it is running. That is a fault, not a configuration choice — the source offer below is incomplete without it." }),
 			(0, import_jsx_runtime.jsxs)("p", { children: ["Source: ", (0, import_jsx_runtime.jsx)("a", {
 				href: "https://github.com/CordilleraSarl/Clearotron",
@@ -24403,13 +24868,13 @@ function About() {
 	});
 	if (!info) return (0, import_jsx_runtime.jsxs)("section", {
 		className: "screen",
-		children: [(0, import_jsx_runtime.jsx)("h1", { children: "About" }), (0, import_jsx_runtime.jsx)("p", { children: "Loading…" })]
+		children: [(0, import_jsx_runtime.jsx)(PageHeader, { title: "About" }), (0, import_jsx_runtime.jsx)("p", { children: "Loading…" })]
 	});
 	const shortSha = info.commit ? info.commit.slice(0, 12) : null;
 	return (0, import_jsx_runtime.jsxs)("section", {
 		className: "screen",
 		children: [
-			(0, import_jsx_runtime.jsxs)("h1", { children: ["About ", info.name] }),
+			(0, import_jsx_runtime.jsx)(PageHeader, { title: `About ${info.name}` }),
 			(0, import_jsx_runtime.jsxs)("dl", { children: [
 				(0, import_jsx_runtime.jsx)("dt", { children: "Product" }),
 				(0, import_jsx_runtime.jsxs)("dd", { children: [info.name, info.version ? ` ${info.version}` : ""] }),
@@ -24506,41 +24971,27 @@ function About() {
 function NotYet({ title, phase, what }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen",
-		children: [
-			(0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				children: title
-			}),
-			(0, import_jsx_runtime.jsx)("h1", {
+		children: [(0, import_jsx_runtime.jsx)(PageHeader, { title }), (0, import_jsx_runtime.jsxs)("div", {
+			className: "notice quiet",
+			children: [(0, import_jsx_runtime.jsx)("p", {
 				style: {
-					fontSize: 25,
-					margin: "4px 0 10px",
-					color: "var(--text-strong)"
+					margin: 0,
+					color: "var(--text-muted)"
 				},
-				children: title
-			}),
-			(0, import_jsx_runtime.jsxs)("div", {
-				className: "notice quiet",
-				children: [(0, import_jsx_runtime.jsx)("p", {
-					style: {
-						margin: 0,
-						color: "var(--text-muted)"
-					},
-					children: what
-				}), (0, import_jsx_runtime.jsxs)("p", {
-					style: {
-						margin: "8px 0 0",
-						fontSize: 13,
-						color: "var(--text-faint)"
-					},
-					children: [
-						"Being built — ",
-						phase,
-						"."
-					]
-				})]
-			})
-		]
+				children: what
+			}), (0, import_jsx_runtime.jsxs)("p", {
+				style: {
+					margin: "8px 0 0",
+					fontSize: 13,
+					color: "var(--text-faint)"
+				},
+				children: [
+					"Being built — ",
+					phase,
+					"."
+				]
+			})]
+		})]
 	});
 }
 var ownerKey = (ctx) => `${ctx.owner ?? "*"}#${ctx.visit}`;
@@ -24570,6 +25021,7 @@ function screen(id, ctx) {
 		case "about": return (0, import_jsx_runtime.jsx)(About, {});
 		case "people": return (0, import_jsx_runtime.jsx)(PeopleAccess, { ctx });
 		case "people.add": return (0, import_jsx_runtime.jsx)(GiveAccess, { ctx });
+		case "people.modify": return (0, import_jsx_runtime.jsx)(ModifyAccess, { ctx });
 		case "admin":
 		case "admin.config": return (0, import_jsx_runtime.jsx)(GlobalConfig, { ctx });
 		default: return (0, import_jsx_runtime.jsx)(NotYet, {