pageship 0.3.0 → 0.4.1

package/dist/skills/pageship-docs/references/palette.mjs

@@ -0,0 +1,791 @@
+// Generated from scripts/palette/ by `pnpm run build:palette`. Edit those files, not this one.
+// Writes a document's colour variables for light and dark, or checks a file's. See design.md.
+import { readFileSync } from "node:fs";
+import { parseArgs } from "node:util";
+//#region evals/look.ts
+/**
+* The colour variables a source file defines for light and dark, as the router's design rules
+* (`pageship-docs/references/design.md`) list them. Every pattern skill reads only these.
+*/
+const lookVariables = [
+	"--bg",
+	"--fg",
+	"--muted",
+	"--line",
+	"--surface",
+	"--accent",
+	"--accent-2",
+	"--series-1",
+	"--series-2",
+	"--series-3",
+	"--series-4",
+	"--good",
+	"--warn",
+	"--bad"
+];
+const themes = ["light", "dark"];
+/**
+* Every style rule in a stylesheet with its declarations, nested rules flattened and the
+* `@media` rules around each one kept. `@font-face`, `@keyframes`, `@page` and `@property`
+* blocks hold no style rules, so they are skipped.
+*/
+function cssRules(css) {
+	const text = css.replace(/\/\*[\s\S]*?\*\//gu, "");
+	const rules = [];
+	let at = 0;
+	/** Reads up to the next `;`, `{` or `}` at this nesting level, skipping strings and parentheses. */
+	const readPrelude = () => {
+		const start = at;
+		let depth = 0;
+		while (at < text.length) {
+			const char = text[at];
+			if (char === "\"" || char === "'") {
+				const end = text.indexOf(char, at + 1);
+				at = end === -1 ? text.length : end + 1;
+				continue;
+			}
+			if (char === "(") depth += 1;
+			else if (char === ")") depth = Math.max(0, depth - 1);
+			else if (depth === 0 && (char === ";" || char === "{" || char === "}")) break;
+			at += 1;
+		}
+		return text.slice(start, at).trim();
+	};
+	const skipBlock = () => {
+		let depth = 1;
+		while (at < text.length && depth > 0) {
+			const char = text[at];
+			if (char === "{") depth += 1;
+			else if (char === "}") depth -= 1;
+			at += 1;
+		}
+	};
+	const parseBlock = (media, parent) => {
+		const rule = parent ? {
+			selector: parent,
+			declarations: [],
+			media
+		} : void 0;
+		while (at < text.length) {
+			const prelude = readPrelude();
+			const char = text[at];
+			at += 1;
+			if (char === ";" || char === "}" || char === void 0) {
+				const colon = prelude.indexOf(":");
+				if (rule && colon > 0) rule.declarations.push({
+					property: prelude.slice(0, colon).trim().toLowerCase(),
+					value: prelude.slice(colon + 1).trim()
+				});
+				if (char === ";") continue;
+				break;
+			}
+			if (prelude.startsWith("@")) {
+				const name = /^@([\w-]+)/u.exec(prelude)?.[1]?.toLowerCase();
+				if ([
+					"media",
+					"supports",
+					"layer",
+					"container",
+					"scope"
+				].includes(name ?? "")) parseBlock(name === "media" ? [...media, prelude.slice(6).trim()] : media, parent);
+				else skipBlock();
+				continue;
+			}
+			const selector = parent ? prelude.includes("&") ? prelude.replaceAll("&", parent) : `${parent} ${prelude}` : prelude;
+			parseBlock(media, selector);
+		}
+		if (rule) rules.push(rule);
+	};
+	parseBlock([], void 0);
+	return rules;
+}
+/** The `<style>` elements of a page, joined, with the `style` attributes as one-off rules. */
+function stylesheets(markup) {
+	const blocks = [...markup.matchAll(/<style\b[^>]*>([\s\S]*?)<\/style\s*>/giu)].map((match) => match[1]);
+	const inline = [...markup.matchAll(/\sstyle\s*=\s*(?:"([^"]*)"|'([^']*)')/giu)].map((match, index) => `[data-inline-style-${index}] { ${match[1] ?? match[2]} }`);
+	return [...blocks, ...inline].join("\n");
+}
+const colourScheme = /^(?:(?:screen|all)\s+and\s+)?\(\s*prefers-color-scheme\s*:\s*(dark|light)\s*\)$/u;
+/**
+* Which theme a rule's `@media` wrappers select: both when none of them picks one. A condition
+* on the colour scheme that is more than the plain query, such as one with `not`, is reported
+* rather than guessed.
+*/
+function themeOf(rule) {
+	let theme = "both";
+	for (const prelude of rule.media) {
+		const text = prelude.trim().toLowerCase();
+		if (/\bprint\b/u.test(text) && !/\bnot\b/u.test(text)) return { theme: "print" };
+		if (!text.includes("prefers-color-scheme")) continue;
+		const match = colourScheme.exec(text);
+		if (!match) return {
+			theme,
+			unsupported: prelude.trim()
+		};
+		theme = match[1];
+	}
+	return { theme };
+}
+const isRootSelector = (selector) => selector.split(",").some((part) => /^(?::root|html|body|:where\(:root\))$/u.test(part.trim()));
+/** Splits `text` at the commas outside any parentheses or quotes. */
+function splitArguments(text) {
+	const parts = [];
+	let depth = 0;
+	let start = 0;
+	let quote;
+	for (let at = 0; at < text.length; at += 1) {
+		const char = text[at];
+		if (quote) {
+			if (char === quote) quote = void 0;
+		} else if (char === "\"" || char === "'") quote = char;
+		else if (char === "(") depth += 1;
+		else if (char === ")") depth -= 1;
+		else if (char === "," && depth === 0) {
+			parts.push(text.slice(start, at).trim());
+			start = at + 1;
+		}
+	}
+	parts.push(text.slice(start).trim());
+	return parts;
+}
+/** The arguments of `name(...)` when the whole value is that one call, else undefined. */
+function callArguments(value, name) {
+	const text = value.trim();
+	if (!text.toLowerCase().startsWith(`${name}(`) || !text.endsWith(")")) return void 0;
+	let depth = 0;
+	for (let at = name.length; at < text.length; at += 1) if (text[at] === "(") depth += 1;
+	else if (text[at] === ")") {
+		depth -= 1;
+		if (depth === 0 && at !== text.length - 1) return void 0;
+	}
+	return splitArguments(text.slice(name.length + 1, -1));
+}
+const stripImportant = (value) => value.replace(/\s*!\s*important\s*$/iu, "").trim();
+/**
+* Every custom property the file's root rules set, by theme. A plain root rule sets both themes,
+* so a dark value may point at a variable it sets, and a plain rule after the dark block
+* overrides both. Only a dark rule or a `light-dark()` value counts as setting dark.
+*/
+function lookDefinitions(markup) {
+	const values = {
+		light: /* @__PURE__ */ new Map(),
+		dark: /* @__PURE__ */ new Map()
+	};
+	const darkDeclared = /* @__PURE__ */ new Set();
+	const unsupported = /* @__PURE__ */ new Set();
+	for (const rule of cssRules(stylesheets(markup))) {
+		if (!isRootSelector(rule.selector)) continue;
+		const media = themeOf(rule);
+		if (media.unsupported) {
+			unsupported.add(media.unsupported);
+			continue;
+		}
+		if (media.theme === "print") continue;
+		for (const declaration of rule.declarations) {
+			const { property } = declaration;
+			const value = stripImportant(declaration.value);
+			if (!property.startsWith("--") || value === "") continue;
+			const both = callArguments(value, "light-dark");
+			const [light, dark] = both?.length === 2 ? both : [value, value];
+			if (media.theme !== "dark") values.light.set(property, light);
+			if (media.theme !== "light") values.dark.set(property, dark);
+			if (media.theme === "dark" || both?.length === 2) darkDeclared.add(property);
+		}
+	}
+	return {
+		values,
+		darkDeclared,
+		unsupported
+	};
+}
+const list = (names) => names.length <= 1 ? names[0] ?? "" : `${names.slice(0, -1).join(", ")} and ${names[names.length - 1]}`;
+const namedColours = new Map("aliceblue f0f8ff antiquewhite faebd7 aqua 00ffff aquamarine 7fffd4 azure f0ffff beige f5f5dc bisque ffe4c4 black 000000 blanchedalmond ffebcd blue 0000ff blueviolet 8a2be2 brown a52a2a burlywood deb887 cadetblue 5f9ea0 chartreuse 7fff00 chocolate d2691e coral ff7f50 cornflowerblue 6495ed cornsilk fff8dc crimson dc143c cyan 00ffff darkblue 00008b darkcyan 008b8b darkgoldenrod b8860b darkgray a9a9a9 darkgreen 006400 darkgrey a9a9a9 darkkhaki bdb76b darkmagenta 8b008b darkolivegreen 556b2f darkorange ff8c00 darkorchid 9932cc darkred 8b0000 darksalmon e9967a darkseagreen 8fbc8f darkslateblue 483d8b darkslategray 2f4f4f darkslategrey 2f4f4f darkturquoise 00ced1 darkviolet 9400d3 deeppink ff1493 deepskyblue 00bfff dimgray 696969 dimgrey 696969 dodgerblue 1e90ff firebrick b22222 floralwhite fffaf0 forestgreen 228b22 fuchsia ff00ff gainsboro dcdcdc ghostwhite f8f8ff gold ffd700 goldenrod daa520 gray 808080 green 008000 greenyellow adff2f grey 808080 honeydew f0fff0 hotpink ff69b4 indianred cd5c5c indigo 4b0082 ivory fffff0 khaki f0e68c lavender e6e6fa lavenderblush fff0f5 lawngreen 7cfc00 lemonchiffon fffacd lightblue add8e6 lightcoral f08080 lightcyan e0ffff lightgoldenrodyellow fafad2 lightgray d3d3d3 lightgreen 90ee90 lightgrey d3d3d3 lightpink ffb6c1 lightsalmon ffa07a lightseagreen 20b2aa lightskyblue 87cefa lightslategray 778899 lightslategrey 778899 lightsteelblue b0c4de lightyellow ffffe0 lime 00ff00 limegreen 32cd32 linen faf0e6 magenta ff00ff maroon 800000 mediumaquamarine 66cdaa mediumblue 0000cd mediumorchid ba55d3 mediumpurple 9370db mediumseagreen 3cb371 mediumslateblue 7b68ee mediumspringgreen 00fa9a mediumturquoise 48d1cc mediumvioletred c71585 midnightblue 191970 mintcream f5fffa mistyrose ffe4e1 moccasin ffe4b5 navajowhite ffdead navy 000080 oldlace fdf5e6 olive 808000 olivedrab 6b8e23 orange ffa500 orangered ff4500 orchid da70d6 palegoldenrod eee8aa palegreen 98fb98 paleturquoise afeeee palevioletred db7093 papayawhip ffefd5 peachpuff ffdab9 peru cd853f pink ffc0cb plum dda0dd powderblue b0e0e6 purple 800080 rebeccapurple 663399 red ff0000 rosybrown bc8f8f royalblue 4169e1 saddlebrown 8b4513 salmon fa8072 sandybrown f4a460 seagreen 2e8b57 seashell fff5ee sienna a0522d silver c0c0c0 skyblue 87ceeb slateblue 6a5acd slategray 708090 slategrey 708090 snow fffafa springgreen 00ff7f steelblue 4682b4 tan d2b48c teal 008080 thistle d8bfd8 tomato ff6347 turquoise 40e0d0 violet ee82ee wheat f5deb3 white ffffff whitesmoke f5f5f5 yellow ffff00 yellowgreen 9acd32".split(" ").flatMap((word, index, words) => index % 2 === 0 ? [[word, words[index + 1]]] : []));
+/** A channel as a number from 0 to 1 at `scale`; undefined when it isn't a finite number. */
+const channel = (text, scale) => {
+	const trimmed = text.trim();
+	if (!/^[+-]?(?:\d+\.?\d*|\.\d+)(?:e[+-]?\d+)?%?$/iu.test(trimmed)) return void 0;
+	const value = Number.parseFloat(trimmed);
+	return trimmed.endsWith("%") ? value / 100 : value / scale;
+};
+/** An OKLab a or b, or an OKLCH chroma: a bare number as it is, and 100% as 0.4. */
+const okChannel = (text) => {
+	const value = channel(text, 1);
+	return value !== void 0 && text.trim().endsWith("%") ? value * .4 : value;
+};
+/** A hue in degrees from a bare number or a `deg` value; other units are not read. */
+const hue = (text) => {
+	const match = /^([+-]?(?:\d+\.?\d*|\.\d+))(deg)?$/iu.exec(text.trim());
+	if (!match) return void 0;
+	return (Number.parseFloat(match[1]) % 360 + 360) % 360;
+};
+/** Whether an alpha argument makes the colour less than fully opaque. */
+const translucent = (alpha) => alpha !== void 0 && channel(alpha, 1) !== 1;
+const clamp$1 = (value) => Math.min(1, Math.max(0, value));
+function hslToRgb(degrees, saturation, lightness) {
+	const part = (n) => {
+		const k = (n + degrees / 30) % 12;
+		return lightness - saturation * Math.min(lightness, 1 - lightness) * Math.max(-1, Math.min(k - 3, 9 - k, 1));
+	};
+	return [
+		part(0),
+		part(8),
+		part(4)
+	];
+}
+function oklabToRgb(lightness, a, b) {
+	const l = (lightness + .3963377774 * a + .2158037573 * b) ** 3;
+	const m = (lightness - .1055613458 * a - .0638541728 * b) ** 3;
+	const s = (lightness - .0894841775 * a - 1.291485548 * b) ** 3;
+	return [
+		4.0767416621 * l - 3.3077115913 * m + .2309699292 * s,
+		-1.2684380046 * l + 2.6097574011 * m - .3413193965 * s,
+		-.0041960863 * l - .7034186147 * m + 1.707614701 * s
+	].map((value) => {
+		const c = clamp$1(value);
+		return c <= .0031308 ? 12.92 * c : 1.055 * c ** (1 / 2.4) - .055;
+	});
+}
+/**
+* An opaque CSS colour as sRGB channels from 0 to 1: hex, named, `rgb()`, `hsl()`, `oklab()`
+* and `oklch()`, with hues as bare numbers or degrees. Anything else, such as `color-mix()`,
+* a translucent colour or a `turn` hue, is unreadable here and returns undefined.
+*/
+function parseColour(text) {
+	const value = stripImportant(text).toLowerCase();
+	const hex = /^#([0-9a-f]{3,8})$/u.exec(value)?.[1] ?? namedColours.get(value);
+	if (hex) {
+		const digits = hex.length <= 4 ? [...hex].map((digit) => digit + digit).join("") : hex;
+		if (![6, 8].includes(digits.length)) return void 0;
+		if (digits.length === 8 && digits.slice(6) !== "ff") return void 0;
+		return [
+			0,
+			2,
+			4
+		].map((at) => Number.parseInt(digits.slice(at, at + 2), 16) / 255);
+	}
+	const name = /^(rgba?|hsla?|oklab|oklch)\(/u.exec(value)?.[1];
+	const parts = name ? callArguments(value, name) : void 0;
+	if (!name || !parts) return void 0;
+	const [channels, slashAlpha] = parts.length === 1 ? parts[0].split("/") : [parts.join(" ")];
+	const words = channels.trim().split(/\s+/u);
+	const alpha = slashAlpha ?? (parts.length === 4 ? words.pop() : void 0);
+	if (words.length !== 3 || translucent(alpha)) return void 0;
+	const [first, second, third] = words;
+	const read = (values) => values.every((part) => part !== void 0 && Number.isFinite(part)) ? values.map(clamp$1) : void 0;
+	switch (name) {
+		case "rgb":
+		case "rgba": return read([
+			channel(first, 255),
+			channel(second, 255),
+			channel(third, 255)
+		]);
+		case "hsl":
+		case "hsla": {
+			const [h, s, l] = [
+				hue(first),
+				channel(second, 1),
+				channel(third, 1)
+			];
+			return h === void 0 || s === void 0 || l === void 0 ? void 0 : read(hslToRgb(h, s, l));
+		}
+		case "oklab": {
+			const [l, a, b] = [
+				channel(first, 1),
+				okChannel(second),
+				okChannel(third)
+			];
+			return l === void 0 || a === void 0 || b === void 0 ? void 0 : read(oklabToRgb(l, a, b));
+		}
+		case "oklch": {
+			const [l, c, h] = [
+				channel(first, 1),
+				okChannel(second),
+				hue(third)
+			];
+			if (l === void 0 || c === void 0 || h === void 0) return void 0;
+			const radians = h * Math.PI / 180;
+			return read(oklabToRgb(l, c * Math.cos(radians), c * Math.sin(radians)));
+		}
+		default: return;
+	}
+}
+/** sRGB channels from 0 to 1 without the gamma curve. */
+const toLinear$1 = (rgb) => rgb.map((part) => part <= .04045 ? part / 12.92 : ((part + .055) / 1.055) ** 2.4);
+/** WCAG relative luminance of sRGB channels from 0 to 1. */
+const luminance = (rgb) => {
+	const [r, g, b] = toLinear$1(rgb);
+	return .2126 * r + .7152 * g + .0722 * b;
+};
+/** The WCAG contrast ratio between two colours, from 1 to 21. */
+function contrastRatio(a, b) {
+	const [light, dark] = [luminance(a), luminance(b)].sort((x, y) => y - x);
+	return (light + .05) / (dark + .05);
+}
+/**
+* The contrast each variable needs against `--bg`: text, headings and links included, reads at
+* 4.5:1, marks at 3:1.
+*/
+const floorOf = (name) => name === "--fg" || name === "--muted" || name === "--accent" || name === "--accent-2" ? 4.5 : [
+	"--bg",
+	"--line",
+	"--surface"
+].includes(name) ? 0 : 3;
+/** A variable's value with `var()` references to the theme's variables followed. */
+function resolve(values, value, depth = 0) {
+	const reference = callArguments(value, "var");
+	if (!reference || depth > 8) return stripImportant(value);
+	const [name, ...fallback] = reference;
+	const next = values.get(name.trim()) ?? (fallback.length > 0 ? fallback.join(",") : void 0);
+	return next === void 0 ? stripImportant(value) : resolve(values, next, depth + 1);
+}
+/**
+* Rules for the look's colour variables: set for both themes and in contrast with the background.
+* See `evals/README.md`.
+*/
+function* lookFindings(markup) {
+	const defined = lookDefinitions(markup);
+	for (const condition of defined.unsupported) yield {
+		check: "palette",
+		message: `The media condition "${condition}" is not one this check reads; use (prefers-color-scheme: dark)`
+	};
+	for (const theme of themes) {
+		const declared = (name) => theme === "light" ? defined.values.light.has(name) : defined.darkDeclared.has(name);
+		const missing = lookVariables.filter((name) => !declared(name));
+		if (missing.length === lookVariables.length) yield {
+			check: "palette",
+			message: `No look variable is set for ${theme}`
+		};
+		else if (missing.length > 0) yield {
+			check: "palette",
+			message: `${list(missing)} ${missing.length === 1 ? "is" : "are"} not set for ${theme}`
+		};
+		yield* contrastFindings(theme, defined.values[theme], declared);
+	}
+}
+function* contrastFindings(theme, values, declared) {
+	const unreadable = (name, value) => ({
+		check: "contrast",
+		message: `In ${theme}, ${name} is ${value}, which this check can't read as an opaque colour`
+	});
+	const backgroundValue = values.get("--bg");
+	if (backgroundValue === void 0 || !declared("--bg")) return;
+	const background = parseColour(resolve(values, backgroundValue));
+	if (!background) {
+		yield unreadable("--bg", backgroundValue);
+		return;
+	}
+	for (const name of lookVariables) {
+		const floor = floorOf(name);
+		const value = values.get(name);
+		if (floor === 0 || value === void 0 || !declared(name)) continue;
+		const colour = parseColour(resolve(values, value));
+		if (!colour) {
+			yield unreadable(name, value);
+			continue;
+		}
+		const ratio = contrastRatio(colour, background);
+		if (ratio < floor) yield {
+			check: "contrast",
+			message: `In ${theme}, ${name} (${value}) is ${ratio.toFixed(2)}:1 against the background; the floor is ${floor}:1`
+		};
+	}
+}
+//#endregion
+//#region scripts/palette/palette.ts
+/**
+* The palette calculator behind `skills/pageship-docs/references/palette.mjs`: from a seed colour
+* and a colour system, it writes the design rules' fourteen colour variables for light and dark.
+* Every colour keeps its OKLCH hue, takes the lightness that meets its floor against `--bg`, and
+* gives up chroma until it fits sRGB. See docs/adr/0029-generate-document-colours-with-a-palette-calculator.md.
+*/
+/** Hue offsets from the seed, for colour systems one gap between hues can't make. */
+const presets = {
+	"split-complementary": [
+		0,
+		150,
+		210
+	],
+	rectangle: [
+		0,
+		60,
+		180,
+		240
+	]
+};
+/** How much of the seed's hue the neutrals carry, as OKLCH chroma. */
+const tints = {
+	none: 0,
+	subtle: .01,
+	strong: .022
+};
+const toLinear = (part) => part <= .04045 ? part / 12.92 : ((part + .055) / 1.055) ** 2.4;
+const toGamma = (part) => part <= .0031308 ? 12.92 * part : 1.055 * part ** (1 / 2.4) - .055;
+const clamp = (part) => Math.min(1, Math.max(0, part));
+const radians = (degrees) => degrees * Math.PI / 180;
+const wrap = (degrees) => (degrees % 360 + 360) % 360;
+function linearToOklab([r, g, b]) {
+	const l = Math.cbrt(.4122214708 * r + .5363325363 * g + .0514459929 * b);
+	const m = Math.cbrt(.2119034982 * r + .6806995451 * g + .1073969566 * b);
+	const s = Math.cbrt(.0883024619 * r + .2817188376 * g + .6299787005 * b);
+	return [
+		.2104542553 * l + .793617785 * m - .0040720468 * s,
+		1.9779984951 * l - 2.428592205 * m + .4505937099 * s,
+		.0259040371 * l + .7827717662 * m - .808675766 * s
+	];
+}
+function oklchToLinear({ l: lightness, c, h }) {
+	const [a, b] = [c * Math.cos(radians(h)), c * Math.sin(radians(h))];
+	const l = (lightness + .3963377774 * a + .2158037573 * b) ** 3;
+	const m = (lightness - .1055613458 * a - .0638541728 * b) ** 3;
+	const s = (lightness - .0894841775 * a - 1.291485548 * b) ** 3;
+	return [
+		4.0767416621 * l - 3.3077115913 * m + .2309699292 * s,
+		-1.2684380046 * l + 2.6097574011 * m - .3413193965 * s,
+		-.0041960863 * l - .7034186147 * m + 1.707614701 * s
+	];
+}
+const inGamut = (colour) => oklchToLinear(colour).every((part) => part >= -1e-4 && part <= 1.0001);
+/** The colour with its lightness and hue kept and its chroma lowered until it fits sRGB. */
+function fitGamut({ l, c, h }) {
+	const colour = {
+		l: clamp(l),
+		c,
+		h
+	};
+	if (inGamut(colour)) return colour;
+	let [low, high] = [0, colour.c];
+	for (let step = 0; step < 24; step += 1) {
+		const middle = (low + high) / 2;
+		if (inGamut({
+			...colour,
+			c: middle
+		})) low = middle;
+		else high = middle;
+	}
+	return {
+		...colour,
+		c: low
+	};
+}
+const gamma = (colour) => oklchToLinear(colour).map((part) => toGamma(clamp(part)));
+const hex = (colour) => `#${gamma(colour).map((part) => Math.round(clamp(part) * 255).toString(16).padStart(2, "0")).join("")}`;
+/** The WCAG contrast of two colours as they render, after rounding to hex. */
+const contrast = (a, b) => contrastRatio(parseColour(hex(a)), parseColour(hex(b)));
+/**
+* The contrast each colour is solved to against `--bg`: the design rules' floor, with headroom
+* for rounding.
+*/
+const target = (name) => [
+	"--fg",
+	"--muted",
+	"--accent",
+	"--accent-2"
+].includes(name) ? 4.6 : 3.1;
+/**
+* The colour at its preferred lightness when that meets `floor` against `bg`; otherwise the
+* lightness nearest to it that does, found by moving away from the page.
+*/
+function solveLightness(colour, bg, floor, theme) {
+	const at = (l) => fitGamut({
+		...colour,
+		l
+	});
+	if (contrast(at(colour.l), bg) >= floor) return at(colour.l);
+	let [low, high] = [colour.l, theme === "dark" ? 1 : 0];
+	for (let step = 0; step < 30; step += 1) {
+		const middle = (low + high) / 2;
+		if (contrast(at(middle), bg) >= floor) high = middle;
+		else low = middle;
+	}
+	return at(high);
+}
+const machado = {
+	protanopia: [
+		[
+			.152286,
+			1.052583,
+			-.204868
+		],
+		[
+			.114503,
+			.786281,
+			.099216
+		],
+		[
+			-.003882,
+			-.048116,
+			1.051998
+		]
+	],
+	deuteranopia: [
+		[
+			.367322,
+			.860646,
+			-.227968
+		],
+		[
+			.280085,
+			.672501,
+			.047413
+		],
+		[
+			-.01182,
+			.04294,
+			.968881
+		]
+	]
+};
+/** The colour as rendered, after rounding to hex, seen with the deficiency, in OKLab. */
+const simulate = (colour, deficiency) => {
+	const rgb = parseColour(hex(colour)).map(toLinear);
+	return linearToOklab(machado[deficiency].map((row) => row.reduce((sum, weight, at) => sum + weight * rgb[at], 0)).map(clamp));
+};
+/** The smallest OKLab ΔE, scaled so 1 is 0.01, between two colours under either deficiency. */
+function colourBlindDistance(a, b) {
+	return Math.min(...Object.keys(machado).map((deficiency) => {
+		const [x, y] = [simulate(a, deficiency), simulate(b, deficiency)];
+		return 100 * Math.hypot(x[0] - y[0], x[1] - y[1], x[2] - y[2]);
+	}));
+}
+/** The hue gap in degrees, from 0 to 180. */
+const hueDistance = (a, b) => {
+	const gap = Math.abs(a - b) % 360;
+	return gap > 180 ? 360 - gap : gap;
+};
+/** Hues closer than this read as one. */
+const sameHue = 15;
+const statusHues = {
+	"--good": 150,
+	"--warn": 70,
+	"--bad": 27
+};
+/** Yellow can't reach 4.5:1 on a light page without turning brown, so --accent-2 skips it. */
+const yellow = (h) => h > 65 && h < 115;
+const orange = 55;
+/** Yellow-green turns olive at 3:1 on a light page, so series hues skip it. */
+const olive = (h) => h > 85 && h < 120;
+/** The hues of the colour system, from the seed's: the accents' first, then the series'. */
+function systemHues(seedHue, input) {
+	const hues = ("preset" in input ? presets[input.preset] : Array.from({ length: input.colours }, (_, k) => k * (input.gap ?? 360 / input.colours))).map((offset) => wrap(seedHue + offset));
+	if (hues.length > 1 && yellow(hues[1])) hues[1] = orange;
+	return hues;
+}
+const seriesNames = [
+	"--series-1",
+	"--series-2",
+	"--series-3",
+	"--series-4"
+];
+/** How far a series colour may move from its preferred lightness, away from the page, to stand apart. */
+const seriesSteps = [
+	0,
+	.1,
+	.2
+];
+/**
+* The seed in OKLCH. An `oklch()` seed is read as written, since it may lie outside sRGB and
+* clipping it there would turn its hue; its alpha, if any, is ignored. Other formats go through
+* `parseColour`.
+*/
+function readSeed(text) {
+	const number = String.raw`[+-]?(?:\d+\.?\d*|\.\d+)(?:e[+-]?\d+)?`;
+	const written = new RegExp(String.raw`^oklch\(\s*(${number})(%?)\s+(${number})(%?)\s+(${number})(?:deg)?\s*(?:\/[^)]*)?\)$`, "iu").exec(text.trim());
+	if (written) {
+		const [, l, lPercent, c, cPercent, h] = written;
+		return {
+			l: Number(l) / (lPercent ? 100 : 1),
+			c: cPercent ? Number(c) / 100 * .4 : Number(c),
+			h: wrap(Number(h))
+		};
+	}
+	const rgb = parseColour(text);
+	if (!rgb) throw new Error(`Could not read the seed colour ${text}`);
+	const [l, a, b] = linearToOklab(rgb.map(toLinear));
+	return {
+		l,
+		c: Math.hypot(a, b),
+		h: wrap(Math.atan2(b, a) * 180 / Math.PI)
+	};
+}
+function palette(input) {
+	const seed = readSeed(input.seed);
+	const hues = systemHues(seed.h, input);
+	const tint = tints[input.tint ?? "subtle"];
+	const accentChroma = Math.max(.1, seed.c);
+	const neutral = (l, c = tint) => fitGamut({
+		l,
+		c,
+		h: seed.h
+	});
+	const base = Object.fromEntries(themes.map((theme) => {
+		const dark = theme === "dark";
+		const bg = neutral(dark ? .17 : .985);
+		const solve = (name, colour) => solveLightness(fitGamut(colour), bg, target(name), theme);
+		const accent = solve("--accent", {
+			l: dark ? Math.min(Math.max(seed.l, .7), .85) : Math.min(Math.max(seed.l, .4), .6),
+			c: accentChroma,
+			h: hues[0]
+		});
+		const accent2 = hues.length > 1 && hueDistance(hues[0], hues[1]) >= sameHue ? solve("--accent-2", {
+			l: accent.l,
+			c: accentChroma,
+			h: hues[1]
+		}) : solve("--accent-2", {
+			l: accent.l + (dark ? .14 : -.14),
+			c: accentChroma * .8,
+			h: hues[0]
+		});
+		return [theme, {
+			"--bg": bg,
+			"--fg": neutral(dark ? .94 : .22, tint * 1.5),
+			"--muted": solve("--muted", neutral(dark ? .62 : .56)),
+			"--line": neutral(dark ? .3 : .905),
+			"--surface": neutral(dark ? .215 : .955),
+			"--accent": accent,
+			"--accent-2": accent2,
+			"--good": solve("--good", {
+				l: dark ? .72 : .6,
+				c: .16,
+				h: statusHues["--good"]
+			}),
+			"--warn": solve("--warn", {
+				l: dark ? .8 : .7,
+				c: .16,
+				h: statusHues["--warn"]
+			}),
+			"--bad": solve("--bad", {
+				l: dark ? .68 : .58,
+				c: .19,
+				h: statusHues["--bad"]
+			})
+		}];
+	}));
+	const cache = /* @__PURE__ */ new Map();
+	const seriesColour = (h, step) => {
+		const key = `${h} ${step}`;
+		let colour = cache.get(key);
+		if (!colour) {
+			colour = Object.fromEntries(themes.map((theme) => {
+				const preferred = theme === "dark" ? .68 + seriesSteps[step] : .6 - seriesSteps[step];
+				const bg = base[theme]["--bg"];
+				return [theme, solveLightness(fitGamut({
+					l: preferred,
+					c: .15,
+					h
+				}), bg, target("--series-1"), theme)];
+			}));
+			cache.set(key, colour);
+		}
+		return colour;
+	};
+	const series = [];
+	const apart = (colour) => series.every((other) => themes.every((theme) => colourBlindDistance(colour[theme], other[theme]) >= 8));
+	const spaced = () => {
+		const taken = [...hues.slice(0, 2), ...series.map((colour) => colour.light.h)];
+		const spacing = (h) => Math.min(...taken.map((other) => hueDistance(other, h)), ...Object.values(statusHues).map((other) => 2 * hueDistance(other, h)));
+		for (const step of seriesSteps.keys()) {
+			let best;
+			for (let h = 0; h < 360; h += 5) {
+				if (olive(h)) continue;
+				const colour = seriesColour(h, step);
+				if (apart(colour) && (!best || spacing(h) > best.spacing)) best = {
+					colour,
+					spacing: spacing(h)
+				};
+			}
+			if (best) return best.colour;
+		}
+		throw new Error("No series hue stands apart from the others for colour-blind readers");
+	};
+	for (const at of seriesNames.keys()) {
+		let h = hues[at + 2];
+		if (h !== void 0 && olive(h)) h = h - 85 < 120 - h ? 85 : 120;
+		const onAccent = h !== void 0 && hues.slice(0, 2).some((a) => hueDistance(a, h) < sameHue);
+		const colour = h === void 0 || onAccent ? void 0 : seriesColour(h, 0);
+		series.push(colour && apart(colour) ? colour : spaced());
+	}
+	return Object.fromEntries(themes.map((theme) => [theme, {
+		...base[theme],
+		...Object.fromEntries(seriesNames.map((name, at) => [name, series[at][theme]]))
+	}]));
+}
+/** The palette as the `:root` block for light and the one for dark, ready to paste. */
+function css(colours) {
+	const block = (theme, indent) => lookVariables.map((name) => `${indent}${name}: ${hex(colours[theme][name])};`).join("\n");
+	return [
+		":root {",
+		block("light", "  "),
+		"}",
+		"@media (prefers-color-scheme: dark) {",
+		"  :root {",
+		block("dark", "    "),
+		"  }",
+		"}",
+		""
+	].join("\n");
+}
+//#endregion
+//#region scripts/palette/cli.ts
+const usage = `Usage:
+  node palette.mjs --seed <colour> --colours <1-5> [--gap <degrees>] [--tint none|subtle|strong]
+  node palette.mjs --seed <colour> --preset split-complementary|rectangle [--tint none|subtle|strong]
+  node palette.mjs --check <file.html>`;
+function fail(message) {
+	process.stderr.write(`${message}\n\n${usage}\n`);
+	process.exit(2);
+}
+const { values } = (() => {
+	try {
+		return parseArgs({ options: {
+			seed: { type: "string" },
+			colours: { type: "string" },
+			gap: { type: "string" },
+			preset: { type: "string" },
+			tint: { type: "string" },
+			check: { type: "string" }
+		} });
+	} catch (error) {
+		return fail(error.message);
+	}
+})();
+if (values.check !== void 0) {
+	const findings = [...lookFindings(readFileSync(values.check, "utf8"))];
+	for (const finding of findings) process.stdout.write(`${finding.message}\n`);
+	if (findings.length > 0) process.exit(1);
+	process.stdout.write("Every colour variable is set for light and dark and meets its floor.\n");
+	process.exit(0);
+}
+const isTint = (name) => Object.hasOwn(tints, name);
+const isPreset = (name) => Object.hasOwn(presets, name);
+const tint = values.tint ?? "subtle";
+if (!isTint(tint)) fail(`--tint is ${tint}; use none, subtle or strong`);
+if (values.seed === void 0) fail("Give --seed, or --check with a file");
+const seed = values.seed;
+let input;
+if (values.preset !== void 0) {
+	if (!isPreset(values.preset)) fail(`--preset is ${values.preset}; use split-complementary or rectangle`);
+	if (values.colours !== void 0 || values.gap !== void 0) fail("A preset sets the number of colours and the hues; leave out --colours and --gap");
+	input = {
+		seed,
+		tint,
+		preset: values.preset
+	};
+} else {
+	const colours = Number(values.colours);
+	if (!Number.isInteger(colours) || colours < 1 || colours > 5) fail(`--colours is ${values.colours ?? "missing"}; give a whole number from 1 to 5, or a --preset`);
+	const gap = values.gap === void 0 ? void 0 : Number(values.gap);
+	if (gap !== void 0 && !Number.isFinite(gap)) fail(`--gap is ${values.gap}; give degrees`);
+	input = {
+		seed,
+		tint,
+		colours,
+		gap
+	};
+}
+try {
+	process.stdout.write(css(palette(input)));
+} catch (error) {
+	fail(error.message);
+}
+//#endregion
+export {};