@diffenderfer-games/hub 2.0.0-next.4 → 2.0.0-next.6

package/dist/shared/svg-markup.js

@@ -0,0 +1,1860 @@
+import { t as _defineProperty } from "./defineProperty.js";
+import { decodeLook, encodeLook, normaliseHex, partName, resolveColour } from "@diffenderfer-games/hub-contract/avatar";
+//#region src/avatar/look-like.ts
+/** Turns anything a render accepts into a look (or `null` for the silhouette), caching decoded codes. */
+const decoded = /* @__PURE__ */ new Map();
+const DECODE_CACHE = 512;
+/** Decodes a code once (an LRU of 512). */
+function fromCode(code) {
+	const hit = decoded.get(code);
+	if (hit !== void 0 || decoded.has(code)) return hit ?? null;
+	const look = decodeLook(code)?.look ?? null;
+	if (decoded.size >= DECODE_CACHE) {
+		const oldest = decoded.keys().next().value;
+		if (oldest !== void 0) decoded.delete(oldest);
+	}
+	decoded.set(code, look);
+	return look;
+}
+/** The look a {@link LookLike} names, or `null` (hidden, malformed, missing). */
+function toLook(like) {
+	if (like === null || like === void 0 || like === "") return null;
+	if (typeof like === "string") return fromCode(like);
+	if ("v" in like) return like;
+	if ("look" in like) return like.look;
+	return fromCode(like.code);
+}
+/** The code a {@link LookLike} names (`''` for none). */
+function toCode(like) {
+	if (typeof like === "string") return like;
+	if (like && "code" in like) return like.code;
+	const look = toLook(like);
+	return look ? encodeLook(look) : "";
+}
+//#endregion
+//#region src/avatar/colour.ts
+const toLin = (c) => {
+	const v = c / 255;
+	return v <= .04045 ? v / 12.92 : ((v + .055) / 1.055) ** 2.4;
+};
+const fromLin = (c) => {
+	const v = c <= .0031308 ? 12.92 * c : 1.055 * c ** (1 / 2.4) - .055;
+	return Math.round(Math.min(1, Math.max(0, v)) * 255);
+};
+/** A `#rrggbb` colour in OKLab. */
+function hexToLab(hex) {
+	const r = toLin(parseInt(hex.slice(1, 3), 16));
+	const g = toLin(parseInt(hex.slice(3, 5), 16));
+	const bl = toLin(parseInt(hex.slice(5, 7), 16));
+	const l = Math.cbrt(.4122214708 * r + .5363325363 * g + .0514459929 * bl);
+	const m = Math.cbrt(.2119034982 * r + .6806995451 * g + .1073969566 * bl);
+	const s = Math.cbrt(.0883024619 * r + .2817188376 * g + .6299787005 * bl);
+	return {
+		L: .2104542553 * l + .793617785 * m - .0040720468 * s,
+		a: 1.9779984951 * l - 2.428592205 * m + .4505937099 * s,
+		b: .0259040371 * l + .7827717662 * m - .808675766 * s
+	};
+}
+/** An OKLab colour as `#rrggbb` (clipped to sRGB). */
+function labToHex(lab) {
+	const { a, b } = lab;
+	const l = (lab.L + .3963377774 * a + .2158037573 * b) ** 3;
+	const m = (lab.L - .1055613458 * a - .0638541728 * b) ** 3;
+	const s = (lab.L - .0894841775 * a - 1.291485548 * b) ** 3;
+	return `#${[
+		fromLin(4.0767416621 * l - 3.3077115913 * m + .2309699292 * s),
+		fromLin(-1.2684380046 * l + 2.6097574011 * m - .3413193965 * s),
+		fromLin(-.0041960863 * l - .7034186147 * m + 1.707614701 * s)
+	].map((v) => v.toString(16).padStart(2, "0")).join("")}`;
+}
+/** Shifts lightness by `dL` (OKLab L units) and scales chroma. */
+function adjust(hex, dL, chroma = 1) {
+	const c = hexToLab(hex);
+	return labToHex({
+		L: Math.min(.98, Math.max(.03, c.L + dL)),
+		a: c.a * chroma,
+		b: c.b * chroma
+	});
+}
+/** The one shade tone of a fill. */
+const shade = (hex) => adjust(hex, -.1, 1.08);
+/** The one highlight tone of a fill. */
+const light = (hex) => adjust(hex, .09, .9);
+/** Style C's tonal outline: a darker shade of the fill's own colour (§14.1). */
+const outline = (hex) => adjust(hex, -.24, 1.1);
+/** A dark ink in the fill's own hue (status props keep a strong edge). */
+function ink(hex) {
+	const c = hexToLab(hex);
+	return labToHex({
+		L: Math.min(.24, c.L * .42),
+		a: c.a * .6,
+		b: c.b * .6
+	});
+}
+/** Linear mix in OKLab. */
+function mix$1(a, b, t) {
+	const lhs = hexToLab(a);
+	const rhs = hexToLab(b);
+	return labToHex({
+		L: lhs.L + (rhs.L - lhs.L) * t,
+		a: lhs.a + (rhs.a - lhs.a) * t,
+		b: lhs.b + (rhs.b - lhs.b) * t
+	});
+}
+/** OKLab lightness, 0 … 1. */
+const lightness = (hex) => hexToLab(hex).L;
+/** Perceptual distance (OKLab ΔE × 100). */
+function deltaE(a, b) {
+	const lhs = hexToLab(a);
+	const rhs = hexToLab(b);
+	return Math.hypot(lhs.L - rhs.L, lhs.a - rhs.a, lhs.b - rhs.b) * 100;
+}
+/**
+* Keeps brows and facial hair visible on the skin (§14.2): a colour within
+* ΔE 12 of the skin is darkened by 0.18 L.
+*/
+function keepApart(colour, skin) {
+	return deltaE(colour, skin) >= 12 ? colour : adjust(colour, -.18);
+}
+/** WCAG relative luminance of a `#rrggbb`. */
+function luminance(hex) {
+	const r = toLin(parseInt(hex.slice(1, 3), 16));
+	const g = toLin(parseInt(hex.slice(3, 5), 16));
+	const b = toLin(parseInt(hex.slice(5, 7), 16));
+	return .2126 * r + .7152 * g + .0722 * b;
+}
+/** WCAG contrast ratio between two colours. */
+function contrast(a, b) {
+	const lhs = luminance(a);
+	const rhs = luminance(b);
+	return (Math.max(lhs, rhs) + .05) / (Math.min(lhs, rhs) + .05);
+}
+//#endregion
+//#region src/avatar/scene.ts
+/** A group helper that drops empty groups' wrapping. */
+function g(children, opts = {}) {
+	return {
+		k: "g",
+		...opts,
+		children
+	};
+}
+/** A path helper. */
+function path(d, paint, tf) {
+	return {
+		k: "path",
+		d,
+		...paint,
+		...tf ? { tf } : {}
+	};
+}
+/** An ellipse helper. */
+function ellipse(cx, cy, rx, ry, paint, tf) {
+	return {
+		k: "ellipse",
+		cx,
+		cy,
+		rx,
+		ry,
+		...paint,
+		...tf ? { tf } : {}
+	};
+}
+/** A rect helper. */
+function rect(left, top, w, h, paint, r) {
+	return {
+		k: "rect",
+		x: left,
+		y: top,
+		w,
+		h,
+		...paint,
+		...r === void 0 ? {} : { r }
+	};
+}
+/** A translate step. */
+const tr = (dx, dy) => ({
+	k: "t",
+	x: dx,
+	y: dy
+});
+/** A scale step (uniform when `sy` is omitted). */
+const sc = (sx, sy = sx) => ({
+	k: "s",
+	x: sx,
+	y: sy
+});
+/** A rotate step, degrees. */
+const rot = (a) => ({
+	k: "r",
+	a
+});
+/** A horizontal skew step, degrees. */
+const skewX = (a) => ({
+	k: "skx",
+	a
+});
+/** A round-joined stroke paint. */
+function line(colour, width, cap = "round", opacity) {
+	return {
+		fill: "none",
+		stroke: colour,
+		sw: width,
+		cap,
+		...opacity === void 0 ? {} : { opacity }
+	};
+}
+//#endregion
+//#region src/avatar/render/frame.ts
+/**
+* Frames (§3.4): which part of rig space an output shows, and the badge
+* background (the site's rounded panel with a ring that lightens on dark
+* skin, §3.9).
+*/
+/** The three frames' boxes. */
+const FRAMES = {
+	head: [
+		-66,
+		-164,
+		132,
+		132
+	],
+	bust: [
+		-84,
+		-188,
+		168,
+		168
+	],
+	full: [
+		-86,
+		-196,
+		172,
+		206
+	]
+};
+/** The site panel colour behind badges. */
+const PANEL = "#11141c";
+/** The frame an options object asks for (default `head`). */
+function frameOf(opts) {
+	return opts.frame ?? "head";
+}
+/** Output pixel size for a frame (the longer edge is `size`). */
+function pixelSize(opts) {
+	const [, , w, h] = FRAMES[frameOf(opts)];
+	const scale = (opts.size ?? 48) / Math.max(w, h);
+	return {
+		width: w * scale,
+		height: h * scale,
+		scale
+	};
+}
+/** The badge ring colour: lighter when the skin is darker than the panel, so every skin has an edge. */
+function ringColour(look) {
+	return look && lightness(resolveColour(look.skin)) < .42 ? "#6f7787" : "#2a3142";
+}
+/** Wraps the avatar's nodes in the frame's background (a badge clips to the rounded panel). */
+function framed(nodes, look, opts) {
+	const [left, top, w, h] = FRAMES[frameOf(opts)];
+	const background = opts.background ?? (frameOf(opts) === "head" ? "badge" : "none");
+	if (background === "badge") {
+		const r = w * .24;
+		return [
+			rect(left, top, w, h, { fill: PANEL }, r),
+			g(nodes, { clip: { shapes: [rect(left, top, w, h, {}, r)] } }),
+			rect(left + 1.5, top + 1.5, w - 3, h - 3, {
+				fill: "none",
+				stroke: ringColour(look),
+				sw: 3
+			}, r - 1.5)
+		];
+	}
+	if (background === "none") return [...nodes];
+	const fill = normaliseHex(background);
+	return fill ? [rect(left, top, w, h, { fill }), ...nodes] : [...nodes];
+}
+//#endregion
+//#region src/avatar/art-store.ts
+let art = null;
+let loading = null;
+const waiters = /* @__PURE__ */ new Set();
+/** The loaded art, or `null` before {@link ready} resolves. */
+function currentArt() {
+	return art;
+}
+/** Loads the art chunk (once). Resolves when rendering is synchronous. */
+function ready() {
+	loading ?? (loading = import("./art.js").then((mod) => {
+		art = mod.ART;
+		for (const waiter of waiters) waiter();
+		waiters.clear();
+	}));
+	return loading;
+}
+/** Calls `fn` once the art has loaded (now, when it already has). */
+function onArtReady(fn) {
+	if (art) {
+		fn();
+		return;
+	}
+	waiters.add(fn);
+}
+//#endregion
+//#region src/avatar/face.ts
+const brow$1 = (dy = 0, tilt = 0, arch = 2.5) => ({
+	dy,
+	tilt,
+	arch
+});
+const mouth$1 = (m) => ({
+	w: 13,
+	sL: 1.5,
+	sR: 1.5,
+	open: 0,
+	round: 0,
+	teeth: 0,
+	tongue: 0,
+	dx: 0,
+	...m
+});
+const BASE = {
+	browL: brow$1(),
+	browR: brow$1(),
+	lidL: .12,
+	lidR: .12,
+	lowL: 0,
+	lowR: 0,
+	lidTilt: 0,
+	closedCurveL: 1,
+	closedCurveR: 1,
+	pupil: 1,
+	mouth: mouth$1({}),
+	cheeks: .25,
+	headTilt: 0,
+	squash: 0,
+	extras: []
+};
+const face = (f) => ({
+	...BASE,
+	...f
+});
+/** The launch set of 16 expressions (§3.5). Kid-friendly: angry and shocked stay cartoon-cute, cry is one tear. */
+const EXPRESSIONS = {
+	neutral: BASE,
+	happy: face({
+		browL: brow$1(-2, 0, 3.5),
+		browR: brow$1(-2, 0, 3.5),
+		lowL: .22,
+		lowR: .22,
+		mouth: mouth$1({
+			w: 19,
+			sL: 5,
+			sR: 5,
+			open: 7,
+			teeth: .5,
+			tongue: .6
+		}),
+		cheeks: .65
+	}),
+	laugh: face({
+		browL: brow$1(-4, -1, 4),
+		browR: brow$1(-4, -1, 4),
+		lidL: 1,
+		lidR: 1,
+		mouth: mouth$1({
+			w: 22,
+			sL: 6,
+			sR: 6,
+			open: 13,
+			teeth: .45,
+			tongue: .9
+		}),
+		cheeks: .9,
+		headTilt: -6,
+		squash: .03,
+		extras: ["sparkle"]
+	}),
+	grin: face({
+		browL: brow$1(-2.5, 0, 3.5),
+		browR: brow$1(-2.5, 0, 3.5),
+		lowL: .3,
+		lowR: .3,
+		mouth: mouth$1({
+			w: 21,
+			sL: 5.5,
+			sR: 5.5,
+			open: 4.5,
+			teeth: 1
+		}),
+		cheeks: .7
+	}),
+	sad: face({
+		browL: brow$1(1, -4.5, 1),
+		browR: brow$1(1, -4.5, 1),
+		lidL: .3,
+		lidR: .3,
+		lidTilt: -3,
+		mouth: mouth$1({
+			w: 12,
+			sL: -4,
+			sR: -4
+		}),
+		cheeks: .1,
+		headTilt: 4
+	}),
+	cry: face({
+		browL: brow$1(1, -5.5, 1),
+		browR: brow$1(1, -5.5, 1),
+		lidL: .4,
+		lidR: .4,
+		lidTilt: -3,
+		lowL: .15,
+		lowR: .15,
+		mouth: mouth$1({
+			w: 13,
+			sL: -4.5,
+			sR: -4.5,
+			open: 3
+		}),
+		cheeks: .4,
+		headTilt: 5,
+		extras: ["tear"]
+	}),
+	surprised: face({
+		browL: brow$1(-7, -1, 4),
+		browR: brow$1(-7, -1, 4),
+		lidL: 0,
+		lidR: 0,
+		pupil: .8,
+		mouth: mouth$1({
+			w: 9,
+			sL: 0,
+			sR: 0,
+			open: 11,
+			round: 1,
+			tongue: .3
+		}),
+		cheeks: .2,
+		squash: -.05
+	}),
+	shocked: face({
+		browL: brow$1(-9, -2, 4.5),
+		browR: brow$1(-9, -2, 4.5),
+		lidL: 0,
+		lidR: 0,
+		pupil: .7,
+		mouth: mouth$1({
+			w: 11,
+			sL: -1,
+			sR: -1,
+			open: 14,
+			round: .8,
+			tongue: .4
+		}),
+		cheeks: .15,
+		squash: -.07,
+		extras: ["sweat"]
+	}),
+	angry: face({
+		browL: brow$1(2, 5.5, 0),
+		browR: brow$1(2, 5.5, 0),
+		lidL: .32,
+		lidR: .32,
+		lidTilt: 4,
+		mouth: mouth$1({
+			w: 15,
+			sL: -2.5,
+			sR: -2.5,
+			open: 3.5,
+			teeth: .9
+		}),
+		cheeks: .35,
+		extras: ["anger"]
+	}),
+	grumpy: face({
+		browL: brow$1(2, 3.5, .5),
+		browR: brow$1(2, 3.5, .5),
+		lidL: .42,
+		lidR: .42,
+		lidTilt: 2,
+		mouth: mouth$1({
+			w: 12,
+			sL: -2,
+			sR: -2.5,
+			dx: -1
+		}),
+		cheeks: .1,
+		headTilt: -3
+	}),
+	thinking: face({
+		browL: brow$1(-5, -1.5, 3.5),
+		browR: brow$1(1.5, 3, .5),
+		lidL: .1,
+		lidR: .3,
+		mouth: mouth$1({
+			w: 9,
+			sL: -.5,
+			sR: 1.5,
+			dx: 4
+		}),
+		cheeks: .15,
+		headTilt: -5,
+		extras: ["question"]
+	}),
+	wink: face({
+		browL: brow$1(-2, 0, 3.5),
+		browR: brow$1(1.5, 1.5, 1.5),
+		lidR: 1,
+		lowL: .15,
+		mouth: mouth$1({
+			w: 16,
+			sL: 2,
+			sR: 5.5,
+			dx: 1.5
+		}),
+		cheeks: .6,
+		headTilt: 3,
+		extras: ["sparkle"]
+	}),
+	smug: face({
+		browL: brow$1(0, 1, 1.5),
+		browR: brow$1(-4, -1, 3.5),
+		lidL: .45,
+		lidR: .4,
+		lowL: .1,
+		lowR: .1,
+		mouth: mouth$1({
+			w: 14,
+			sL: 1,
+			sR: 5,
+			dx: 3
+		}),
+		cheeks: .45,
+		headTilt: 4
+	}),
+	worried: face({
+		browL: brow$1(-2, -5, 2),
+		browR: brow$1(-2, -5, 2),
+		lidL: .05,
+		lidR: .05,
+		pupil: .9,
+		mouth: mouth$1({
+			w: 11,
+			sL: -1.5,
+			sR: -1,
+			open: 1.5
+		}),
+		cheeks: .1,
+		extras: ["sweat"]
+	}),
+	sleepy: face({
+		browL: brow$1(1, -1, 1.5),
+		browR: brow$1(1, -1, 1.5),
+		lidL: .72,
+		lidR: .72,
+		closedCurveL: -1,
+		closedCurveR: -1,
+		mouth: mouth$1({
+			w: 7,
+			sL: 0,
+			sR: 0,
+			open: 2.5,
+			round: 1
+		}),
+		cheeks: .2,
+		headTilt: 7,
+		extras: ["zzz"]
+	}),
+	determined: face({
+		browL: brow$1(1, 3.5, .5),
+		browR: brow$1(1, 3.5, .5),
+		lidL: .22,
+		lidR: .22,
+		lidTilt: 2,
+		mouth: mouth$1({
+			w: 12,
+			sL: 1,
+			sR: 1
+		}),
+		cheeks: .25
+	})
+};
+/** Every expression name, in the launch order. */
+const EXPRESSION_NAMES = [
+	"neutral",
+	"happy",
+	"laugh",
+	"grin",
+	"sad",
+	"cry",
+	"surprised",
+	"shocked",
+	"angry",
+	"grumpy",
+	"thinking",
+	"wink",
+	"smug",
+	"worried",
+	"sleepy",
+	"determined"
+];
+/** True for a known expression name. */
+function isExpression(name) {
+	return Object.prototype.hasOwnProperty.call(EXPRESSIONS, name);
+}
+const lerp = (a, b, t) => a + (b - a) * t;
+const mixBrow = (a, b, t) => ({
+	dy: lerp(a.dy, b.dy, t),
+	tilt: lerp(a.tilt, b.tilt, t),
+	arch: lerp(a.arch, b.arch, t)
+});
+const mixMouth = (a, b, t) => ({
+	w: lerp(a.w, b.w, t),
+	sL: lerp(a.sL, b.sL, t),
+	sR: lerp(a.sR, b.sR, t),
+	open: lerp(a.open, b.open, t),
+	round: lerp(a.round, b.round, t),
+	teeth: lerp(a.teeth, b.teeth, t),
+	tongue: lerp(a.tongue, b.tongue, t),
+	dx: lerp(a.dx, b.dx, t)
+});
+/** An expression's parameters (a name or parameters pass through). */
+function faceOf(e) {
+	return typeof e === "string" ? EXPRESSIONS[e] : e;
+}
+/** Blends two expressions: `mix('happy', 'surprised', 0.4)`. */
+function mix(a, b, t) {
+	const from = faceOf(a);
+	const to = faceOf(b);
+	return {
+		browL: mixBrow(from.browL, to.browL, t),
+		browR: mixBrow(from.browR, to.browR, t),
+		lidL: lerp(from.lidL, to.lidL, t),
+		lidR: lerp(from.lidR, to.lidR, t),
+		lowL: lerp(from.lowL, to.lowL, t),
+		lowR: lerp(from.lowR, to.lowR, t),
+		lidTilt: lerp(from.lidTilt, to.lidTilt, t),
+		closedCurveL: lerp(from.closedCurveL, to.closedCurveL, t),
+		closedCurveR: lerp(from.closedCurveR, to.closedCurveR, t),
+		pupil: lerp(from.pupil, to.pupil, t),
+		mouth: mixMouth(from.mouth, to.mouth, t),
+		cheeks: lerp(from.cheeks, to.cheeks, t),
+		headTilt: lerp(from.headTilt, to.headTilt, t),
+		squash: lerp(from.squash, to.squash, t),
+		extras: t < .5 ? from.extras : to.extras
+	};
+}
+/** The hub's quick-chat emotes (`e:<emoji>`, the safety package's EMOTES) mapped to faces (§3.7), so an emote can also play on the sender's face. */
+const EMOTE_FACES = {
+	"😀": "happy",
+	"😂": "laugh",
+	"😮": "surprised",
+	"😢": "sad",
+	"😎": "smug",
+	"🤔": "thinking",
+	"👍": "grin",
+	"👏": "happy",
+	"🎉": "laugh",
+	"❤️": "happy",
+	"🔥": "determined",
+	"⭐": "grin"
+};
+/** The face for a quick-chat emote (`e:😂` or the bare emoji), or `null`. */
+function expressionFromEmote(emoteId) {
+	return EMOTE_FACES[emoteId.startsWith("e:") ? emoteId.slice(2) : emoteId] ?? null;
+}
+//#endregion
+//#region src/avatar/geom.ts
+/** Rounds to one decimal and drops a trailing `.0` and negative zero. */
+function n(v) {
+	const r = Math.round(v * 10) / 10;
+	return Object.is(r, -0) ? "0" : String(r);
+}
+/** A path of absolute M/L/C/Q/Z commands that can be warped as a whole. */
+var Path = class {
+	constructor() {
+		_defineProperty(this, "cmds", []);
+	}
+	m(px, py) {
+		this.cmds.push({
+			c: "M",
+			p: [px, py]
+		});
+		return this;
+	}
+	l(px, py) {
+		this.cmds.push({
+			c: "L",
+			p: [px, py]
+		});
+		return this;
+	}
+	c(x1, y1, x2, y2, px, py) {
+		this.cmds.push({
+			c: "C",
+			p: [
+				x1,
+				y1,
+				x2,
+				y2,
+				px,
+				py
+			]
+		});
+		return this;
+	}
+	q(x1, y1, px, py) {
+		this.cmds.push({
+			c: "Q",
+			p: [
+				x1,
+				y1,
+				px,
+				py
+			]
+		});
+		return this;
+	}
+	z() {
+		this.cmds.push({
+			c: "Z",
+			p: []
+		});
+		return this;
+	}
+	/** Appends every command of another path. */
+	add(other) {
+		this.cmds.push(...other.cmds);
+		return this;
+	}
+	/** The SVG `d` string, optionally warping every point. */
+	d(warp) {
+		return this.cmds.map(({ c, p }) => {
+			if (c === "Z") return "Z";
+			const out = [];
+			for (let i = 0; i < p.length; i += 2) {
+				const px = p[i] ?? 0;
+				const py = p[i + 1] ?? 0;
+				const [wx, wy] = warp ? warp(px, py) : [px, py];
+				out.push(`${n(wx)} ${n(wy)}`);
+			}
+			return c + out.join(" ");
+		}).join("");
+	}
+};
+/** A point by index, or the origin. */
+const at = (pts, i) => pts[i] ?? [0, 0];
+/**
+* A smooth Catmull-Rom curve through the points (cubic segments). Points
+* flagged `'c'` become sharp corners.
+*/
+function blob(pts, isClosed = true, tension = 1, into = new Path()) {
+	const count = pts.length;
+	if (count === 0) return into;
+	const wrap = (i) => isClosed ? at(pts, (i + count) % count) : at(pts, Math.max(0, Math.min(count - 1, i)));
+	const tangent = (i) => {
+		if (wrap(i)[2] === "c" || !isClosed && (i === 0 || i === count - 1)) return [0, 0];
+		const a = wrap(i - 1);
+		const b = wrap(i + 1);
+		return [(b[0] - a[0]) * tension / 6, (b[1] - a[1]) * tension / 6];
+	};
+	const first = at(pts, 0);
+	into.m(first[0], first[1]);
+	const segs = isClosed ? count : count - 1;
+	for (let i = 0; i < segs; i += 1) {
+		const p1 = wrap(i);
+		const p2 = wrap(i + 1);
+		const t1 = tangent(i);
+		const t2 = tangent(i + 1);
+		into.c(p1[0] + t1[0], p1[1] + t1[1], p2[0] - t2[0], p2[1] - t2[1], p2[0], p2[1]);
+	}
+	if (isClosed) into.z();
+	return into;
+}
+/** Points along an ellipse arc; angles in degrees, 0 = right, 90 = down. */
+function arc(cx, cy, rx, ry, a0, a1, steps) {
+	const out = [];
+	for (let i = 0; i <= steps; i += 1) {
+		const a = (a0 + (a1 - a0) * i / steps) * Math.PI / 180;
+		out.push([cx + rx * Math.cos(a), cy + ry * Math.sin(a)]);
+	}
+	return out;
+}
+/**
+* A scalloped edge: one outward bump between each pair of points (quadratic
+* curves), for curls and clouds. `side` 1 bumps to the left of travel.
+*/
+function scallop(pts, bump, isClosed, side = 1, into = new Path()) {
+	const count = pts.length;
+	const first = at(pts, 0);
+	into.m(first[0], first[1]);
+	const segs = isClosed ? count : count - 1;
+	for (let i = 0; i < segs; i += 1) {
+		const a = at(pts, i);
+		const b = at(pts, (i + 1) % count);
+		const dx = b[0] - a[0];
+		const dy = b[1] - a[1];
+		const len = Math.hypot(dx, dy) || 1;
+		into.q((a[0] + b[0]) / 2 + dy / len * bump * side, (a[1] + b[1]) / 2 + -dx / len * bump * side, b[0], b[1]);
+	}
+	if (isClosed) into.z();
+	return into;
+}
+/** A rounded rectangle path. */
+function roundedRect(px, py, w, h, r) {
+	return new Path().m(px + r, py).l(px + w - r, py).q(px + w, py, px + w, py + r).l(px + w, py + h - r).q(px + w, py + h, px + w - r, py + h).l(px + r, py + h).q(px, py + h, px, py + h - r).l(px, py + r).q(px, py, px + r, py).z();
+}
+/** Clamps `v` to [lo, hi]. */
+const clamp = (v, lo, hi) => Math.max(lo, Math.min(hi, v));
+//#endregion
+//#region src/avatar/render/colours.ts
+/**
+* Resolves a look's colours into every tint slot the art uses (§3.2): each
+* fill gets its shade, highlight and tonal outline (style C, §14.1), brows
+* and beards are kept apart from the skin (§14.2), and accessories default
+* to the body colour.
+*/
+/** The soft dark-brown ink for lids, mouths and closed eyes (§14.1). */
+const SOFT_INK = "#3a2a2a";
+/** The fixed colours every look shares. */
+const FIXED = {
+	ink: SOFT_INK,
+	white: "#fbfaf6",
+	mouth: "#5a1d2a",
+	tongue: "#ff7d8e",
+	blush: "#ff7b8f",
+	pupil: "#140f0d"
+};
+/** A fill and its tones. */
+function tones(hex) {
+	return {
+		base: hex,
+		shade: shade(hex),
+		light: light(hex),
+		ink: outline(hex)
+	};
+}
+/** The colours of a look. */
+function lookColours(look) {
+	const skin = resolveColour(look.skin);
+	const hair = resolveColour(look.hair.colour);
+	const browBase = look.brows.colour === void 0 ? lightness(hair) > .78 ? adjust(hair, -.22) : adjust(hair, -.05) : resolveColour(look.brows.colour);
+	const beard = keepApart(look.facialHair.colour === void 0 ? hair : resolveColour(look.facialHair.colour), skin);
+	const eye = resolveColour(look.eyes.colour);
+	const body = resolveColour(look.body.colour);
+	return {
+		skin,
+		skinShade: shade(skin),
+		skinLight: light(skin),
+		skinInk: outline(skin),
+		eyeRim: adjust(skin, -.2, 1.1),
+		hair,
+		hairShade: shade(hair),
+		hairLight: light(hair),
+		hairInk: outline(hair),
+		hairBuzz: mix$1(hair, skin, .42),
+		brow: keepApart(browBase, skin),
+		beard,
+		beardShade: shade(beard),
+		beardInk: outline(beard),
+		stubble: mix$1(beard, skin, .35),
+		eye,
+		eyeDark: adjust(eye, -.18),
+		body,
+		bodyShade: shade(body),
+		bodyLight: light(body),
+		bodyInk: outline(body)
+	};
+}
+/** An accessory's colour: its own, else the body colour. */
+function accessoryColour(look, accessory) {
+	return accessory?.colour === void 0 ? resolveColour(look.body.colour) : resolveColour(accessory.colour);
+}
+/** Style C's outline width at the 100-unit head height (§14.1). */
+const LINE = 2.4;
+/** Part fills are outlined a little thinner than lines (the POC's style C). */
+const FILL_OUTLINE = .8;
+/** The head outline (centre 0,0; 100 units tall). */
+const HEAD_PATH = new Path().m(0, -50).c(27, -50, 46, -32, 46, -4).c(46, 24, 30, 50, 0, 50).c(-30, 50, -46, 24, -46, -4).c(-46, -32, -27, -50, 0, -50).z();
+/** The head as a clip region. */
+const HEAD_CLIP = { shapes: [path(HEAD_PATH.d(), {})] };
+/** Where a face feature centred at `x0` lands after the head turn. */
+function feat(ctx, x0) {
+	const t0 = Math.asin(clamp(x0 / 46, -1, 1));
+	const t = t0 + ctx.phi;
+	return {
+		x: 46 * Math.sin(t),
+		sx: Math.max(.05, Math.cos(t) / Math.cos(t0)),
+		vis: Math.cos(t) > .22
+	};
+}
+/**
+* A warp that wraps a part around the skull by `phi`. Unlike a strict
+* cylinder, the far side is squeezed toward the silhouette instead of
+* folding behind it, so outlines never collapse into wedges (§14.2).
+*/
+function turnWarp(phi, dy = 0) {
+	if (phi === 0 && dy === 0) return;
+	const half = Math.PI / 2;
+	return (px, py) => {
+		const ax = Math.abs(px);
+		const sg = Math.sign(px) || 1;
+		const t0 = Math.asin(Math.min(ax, 46) / 46) * sg;
+		const t = t0 + phi * (phi >= 0 ? t0 <= 0 ? 1 : 1 - t0 / half : t0 >= 0 ? 1 : 1 + t0 / half);
+		const over = Math.max(0, ax - 46) * Math.max(.25, Math.abs(Math.sin(t)));
+		return [46 * Math.sin(t) + sg * over, py + dy];
+	};
+}
+/** Resolves a tint slot. `acc` is the accessory (or hair-tie) colour for this part. */
+function slotColour(c, acc, slot) {
+	switch (slot) {
+		case "none": return "none";
+		case "acc": return acc.base;
+		case "accShade": return acc.shade;
+		case "accLight": return acc.light;
+		case "accInk": return acc.ink;
+		case "ink": return FIXED.ink;
+		case "white": return FIXED.white;
+		default: return c[slot];
+	}
+}
+/** The tonal outline slot for a fill slot. */
+function outlineOf(slot) {
+	if (slot.startsWith("hair")) return "hairInk";
+	if (slot === "beard" || slot === "beardShade" || slot === "stubble") return "beardInk";
+	if (slot.startsWith("acc")) return "accInk";
+	if (slot.startsWith("skin")) return "skinInk";
+	return "ink";
+}
+/** Paints catalog shapes with an optional warp; `clip: 'head'` shapes are clipped to the head. */
+function paintShapes(c, acc, shapes, warp) {
+	if (!shapes) return [];
+	return shapes.map((s) => {
+		const d = s.d.d(warp);
+		const opacity = s.opacity === void 0 ? {} : { opacity: s.opacity };
+		if (s.line) return path(d, {
+			fill: "none",
+			stroke: slotColour(c, acc, s.stroke ?? "ink"),
+			sw: s.sw ?? 2.4,
+			cap: s.cap ?? "round",
+			...opacity
+		});
+		const strokeSlot = s.stroke ?? outlineOf(s.fill);
+		const stroke = strokeSlot === "none" ? {} : {
+			stroke: slotColour(c, acc, strokeSlot),
+			sw: (s.sw ?? 2.4) * FILL_OUTLINE
+		};
+		const node = path(d, {
+			fill: slotColour(c, acc, s.fill),
+			...s.evenOdd ? { evenOdd: true } : {},
+			...stroke,
+			...opacity
+		});
+		return s.clip === "head" ? g([node], { clip: HEAD_CLIP }) : node;
+	});
+}
+//#endregion
+//#region src/avatar/render/body.ts
+/**
+* The body blob and its poses (§3.11). Each pose is a transform of the same
+* gumdrop plus where the head sits; a future limbed body re-implements the
+* same names. The cycle poses (`walk`, `run`, `dance`, `jump`, `cheer`) read
+* `phase` (0 … 1).
+*/
+const BODY = blob([
+	[-35, -2],
+	[-40, -24],
+	[-30, -50],
+	[0, -60],
+	[30, -50],
+	[40, -24],
+	[35, -2],
+	[0, 2]
+]).d();
+const STOOL = [
+	rect(-27, -12, 6, 12, {
+		fill: "#2a3142",
+		stroke: "#0d0f14",
+		sw: 2
+	}),
+	rect(21, -12, 6, 12, {
+		fill: "#2a3142",
+		stroke: "#0d0f14",
+		sw: 2
+	}),
+	rect(-38, -22, 76, 11, {
+		fill: "#4a5470",
+		stroke: "#0d0f14",
+		sw: 3
+	}, 5.5)
+];
+const hand = (c, cx, cy) => ellipse(cx, cy, 8, 8, {
+	fill: c.body,
+	stroke: c.bodyInk,
+	sw: LINE
+});
+/** Lays out the body for a pose; `phi` is the body turn (shading shifts with it). */
+function bodyLayout(c, pose, phi, phase, hasStool) {
+	const wave = Math.sin(phase * Math.PI * 2);
+	const hop = Math.abs(Math.sin(phase * Math.PI));
+	let tf = [];
+	let headDx = 0;
+	let headDy = 0;
+	let tilt = 0;
+	let lift = 0;
+	const behind = [];
+	const front = [];
+	switch (pose) {
+		case "sit":
+		case "play": {
+			const up = hasStool ? -18 : 0;
+			tf = [tr(0, up), sc(1.12, .8)];
+			headDy = 12 + up;
+			if (hasStool) behind.push(...STOOL);
+			break;
+		}
+		case "walk":
+		case "run": {
+			const k = pose === "run" ? 1.6 : 1;
+			tf = [
+				tr(0, -10 * k),
+				skewX(-10 * k),
+				sc(1 - wave * .04, 1 + wave * .06)
+			];
+			headDy = -14 * k + wave * 3;
+			headDx = 7 * k;
+			tilt = 6 * k;
+			behind.push(path("M-52 -30h-14M-50 -18h-20M-54 -6h-10", line("#6f7787", 3, "round", .8)));
+			break;
+		}
+		case "wave":
+			tf = [rot(-6)];
+			headDx = -5;
+			tilt = -7;
+			front.push(hand(c, 44, -58), path("M56 -70Q61 -64 58 -56M62 -76Q69 -66 64 -54", line("#e8e6df", 2.2, "round", .8)));
+			break;
+		case "cheer":
+			lift = hop * 10;
+			tf = [sc(1 - hop * .04, 1 + hop * .05)];
+			headDy = -4 * hop;
+			front.push(hand(c, -42, -66 - hop * 4), hand(c, 42, -66 - hop * 4));
+			break;
+		case "jump":
+			lift = hop * 18;
+			tf = [sc(1 - hop * .06, 1 + hop * .08)];
+			headDy = -6 * hop;
+			break;
+		case "dance":
+			tf = [rot(wave * 8), sc(1 + hop * .03, 1 - hop * .03)];
+			headDx = wave * 5;
+			tilt = wave * 7;
+			break;
+		case "away":
+			tf = [sc(1.04, .95)];
+			headDy = 3;
+			tilt = 5;
+	}
+	const hl = -16 - Math.sin(phi) * 8;
+	const body = [g([
+		path(BODY, { fill: c.bodyShade }),
+		path(BODY, { fill: c.body }, [tr(-3 - Math.sin(phi) * 2, -3), sc(.9)]),
+		ellipse(0, -54, 20, 6, { fill: c.bodyShade }),
+		ellipse(0, 0, 6, 4, { fill: c.bodyLight }, [tr(hl, -36), rot(-30)]),
+		path(BODY, {
+			fill: "none",
+			stroke: c.bodyInk,
+			sw: LINE
+		})
+	], { tf })];
+	const isSitting = pose === "sit" || pose === "play";
+	return {
+		behind,
+		body,
+		front,
+		headDx,
+		headDy,
+		tilt,
+		lift,
+		prop: {
+			x: headDx * .5,
+			y: isSitting ? -34 + (hasStool ? -18 : 0) * .8 : -30
+		}
+	};
+}
+/** The soft ground shadow at the feet (shrinks while lifted). */
+function groundShadow(lift) {
+	const k = Math.max(.5, 1 - lift / 40);
+	return ellipse(0, 0, 36 * k, 8 * k, {
+		fill: "#000000",
+		opacity: .3
+	});
+}
+//#endregion
+//#region src/avatar/render/eyewear.ts
+/** Glasses: arms toward the ears, a lens at each eye, and the bridge. */
+function glasses(ctx, part, frame) {
+	const out = [];
+	const warp = turnWarp(ctx.phi, ctx.dy);
+	for (const side of [-1, 1]) if (feat(ctx, 30 * side).vis) out.push(path(new Path().m(30 * side, 2).l(45 * side, 0).d(warp), line(frame, 2.6)));
+	for (const side of [-1, 1]) {
+		const f = feat(ctx, 17 * side);
+		if (!f.vis) continue;
+		out.push(g([path(part.lens.d(), {
+			fill: "#ffffff",
+			fillOpacity: .16,
+			stroke: frame,
+			sw: 3.2
+		}), path("M-6 -4L-2 -7", line("#ffffff", 1.8, "round", .7))], { tf: [tr(f.x, 4 + ctx.dy), sc(f.sx, 1)] }));
+	}
+	const fb = feat(ctx, 0);
+	out.push(g([path(part.bridge.d(), line(frame, 2.8))], { tf: [tr(fb.x, 4 + ctx.dy), sc(fb.sx, 1)] }));
+	return out;
+}
+const STRAP_FRONT = new Path().m(-47, -2).c(-30, -6, 30, -6, 47, -2);
+const STRAP_BACK = new Path().m(-47, -2).c(-30, 4, 30, 4, 47, -2);
+const SHELL = blob([
+	[-31, -9],
+	[-4, -10],
+	[0, -6],
+	[4, -10],
+	[31, -9],
+	[34, 4],
+	[26, 16],
+	[7, 16],
+	[0, 11],
+	[-7, 16],
+	[-26, 16],
+	[-34, 4]
+]);
+const GLASS_L = blob([
+	[-27, -5],
+	[-7, -6],
+	[-5, 8],
+	[-9, 12],
+	[-24, 12],
+	[-29, 4]
+]);
+const GLASS_R = blob([
+	[27, -5],
+	[7, -6],
+	[5, 8],
+	[9, 12],
+	[24, 12],
+	[29, 4]
+]);
+/** Play goggles over the eyes (they replace the eyes and any glasses); the strap is the body colour. */
+function goggles(ctx) {
+	const w = turnWarp(ctx.phi, ctx.dy);
+	const band = ctx.c.body;
+	const strap = STRAP_FRONT.d(w);
+	return [
+		path(strap, line(ink(band), 9)),
+		path(strap, line(band, 6)),
+		path(SHELL.d(w), {
+			fill: "#2a3142",
+			stroke: "#0d0f14",
+			sw: LINE
+		}),
+		path(GLASS_L.d(w), { fill: "#5fe3f2" }),
+		path(GLASS_R.d(w), { fill: "#5fe3f2" }),
+		path(new Path().m(-22, 6).l(-14, -2).d(w), line("#e8fbff", 3)),
+		path(new Path().m(12, 6).l(20, -2).d(w), line("#e8fbff", 3))
+	];
+}
+/** The goggles strap seen from behind. */
+function gogglesStrapBack(ctx, phi) {
+	const d = STRAP_BACK.d(turnWarp(phi));
+	return [path(d, line(ink(ctx.c.body), 9)), path(d, line(ctx.c.body, 6))];
+}
+//#endregion
+//#region src/avatar/render/eyes.ts
+/**
+* Eyes and brows in style C (§14.1): whites 7% larger than style A's with a
+* 1.6-unit rim in a darker shade of the skin, an iris with a darker ring, a
+* pupil, two glints, and a soft dark-brown lid line. No dark outline.
+*/
+/** Eye-white radii: style A's 9.6 × 11.8, 7% larger. */
+const RX = 10.272;
+const RY = 11.8 * 1.07;
+/** One eye; `side` −1 is the viewer's left. */
+function eye(ctx, side) {
+	const f = feat(ctx, 17 * side);
+	if (!f.vis) return [];
+	const fp = ctx.face;
+	const lidBase = side < 0 ? fp.lidL : fp.lidR;
+	const lid = lidBase + (1 - lidBase) * ctx.blink;
+	const low = side < 0 ? fp.lowL : fp.lowR;
+	const curve = side < 0 ? fp.closedCurveL : fp.closedCurveR;
+	const place = [tr(f.x, 4 + ctx.dy), sc(f.sx, 1)];
+	if (lid >= .9) return [g([path(`M-8 1.5Q0 ${n(1.5 - 9 * curve)} 8 1.5`, line(SOFT_INK, LINE * 1.05))], { tf: place })];
+	const top = -12.626000000000001 + lid * 2 * RY;
+	const edgeY = (px) => top + fp.lidTilt * (px * -side) / 9;
+	const bot = RY - low * 2 * RY;
+	const gx = ctx.gaze.x * 2.8;
+	const gy = ctx.gaze.y * 3.4;
+	const clip = { shapes: [ellipse(0, 0, RX, RY, {})] };
+	const inner = [g([
+		ellipse(0, 0, 7, 7, { fill: ctx.c.eye }),
+		ellipse(0, 0, 6.4, 6.4, line(ctx.c.eyeDark, 1.2)),
+		ellipse(0, 0, 3.6 * fp.pupil, 3.6 * fp.pupil, { fill: FIXED.pupil }),
+		ellipse(-2.4, -2.8, 2.2, 2.2, { fill: "#ffffff" }),
+		ellipse(2.1, 2, .9, .9, { fill: "#ffffff" })
+	], { tf: [tr(gx, gy)] })];
+	if (lid > .02) inner.push(path(`M-12 -14L12 -14L12 ${n(edgeY(12))}Q0 ${n(top + 1.5)} -12 ${n(edgeY(-12))}Z`, { fill: ctx.c.skin }));
+	if (low > .02) inner.push(path(`M-12 14L12 14L12 ${n(bot)}Q0 ${n(bot - 3)} -12 ${n(bot)}Z`, { fill: ctx.c.skin }));
+	const out = [ellipse(0, 0, RX, RY, { fill: FIXED.white }), g(inner, { clip })];
+	if (lid > .06) out.push(g([path(`M${n(-9.772)} ${n(edgeY(-9.772))}Q0 ${n(top + 1.5)} ${n(9.772)} ${n(edgeY(9.772))}`, line(SOFT_INK, 1.9))], { clip }));
+	out.push(ellipse(0, 0, RX, RY, line(ctx.c.eyeRim, 1.6)));
+	return [g(out, { tf: place })];
+}
+const BROW_W = {
+	soft: 3.8,
+	thin: 2.4,
+	thick: 5.6,
+	arched: 3.6,
+	straight: 4.2
+};
+const BROW_ARCH = {
+	soft: 1,
+	thin: 1,
+	thick: .8,
+	arched: 1.9,
+	straight: .2
+};
+/** One brow in a style (`soft`, `thin`, …). */
+function brow(ctx, side, style) {
+	const f = feat(ctx, 17 * side);
+	if (!f.vis) return [];
+	const p = side < 0 ? ctx.face.browL : ctx.face.browR;
+	const by = -14 + p.dy + ctx.dy * 1.1;
+	const xi = -7.5 * side;
+	const xo = 7.5 * side;
+	const yi = by + p.tilt * .8;
+	const yo = by - p.tilt * .35;
+	const arch = p.arch * (BROW_ARCH[style] ?? 1);
+	const width = (BROW_W[style] ?? 3.8) * 1.15;
+	return [g([path(`M${n(xi)} ${n(yi)}Q0 ${n(Math.min(yi, yo) - arch * 2)} ${n(xo)} ${n(yo)}`, line(ctx.c.brow, width))], { tf: [tr(f.x, 0), sc(f.sx, 1)] })];
+}
+//#endregion
+//#region src/avatar/render/head.ts
+/** The head, ears, cheeks and the small face and ear extras. */
+const EAR = "M-2 -10C6 -12 11 -6 10 1C9 8 5 11 -1 10Z";
+const EAR_FOLD = "M1.5 -5C5.5 -5 6.5 0 5 3.5";
+/** Ears behind the head (`behind`) or in front of it (`front`), hidden when turned away. */
+function ears(ctx, which, extra) {
+	const out = [];
+	for (const side of [-1, 1]) {
+		const t = Math.PI / 2 * side + ctx.phi;
+		const cos = Math.cos(t);
+		if (cos < -.15) continue;
+		const isInFront = cos > .3;
+		if (which === "front" !== isInFront) continue;
+		const earX = clamp(46 * Math.sin(t), -44, 44);
+		const w = isInFront ? .75 + .25 * cos : 1;
+		const flip = isInFront ? -Math.sign(earX || side) : side;
+		const parts = [path(EAR, {
+			fill: ctx.c.skin,
+			stroke: ctx.c.skinInk,
+			sw: LINE
+		}), path(EAR_FOLD, line(ctx.c.skinShade, 2.2))];
+		if (extra?.kind === "studs") parts.push(ellipse(3, 7, 2.2, 2.2, {
+			fill: extra.colour,
+			stroke: "#3a2a2a",
+			sw: .8
+		}));
+		if (extra?.kind === "hoops") parts.push(ellipse(3, 12, 3.6, 4.4, line(extra.colour, 1.8)));
+		out.push(g(parts, { tf: [tr(earX, 6 + ctx.dy * .3), sc(flip * w, 1)] }));
+	}
+	return out;
+}
+/** The head: a shade base, the lit face, and the tonal outline. */
+function head(ctx) {
+	const d = HEAD_PATH.d();
+	const lx = -2.5 + Math.sin(ctx.phi) * 3;
+	return [
+		path(d, { fill: ctx.c.skinShade }),
+		path(d, { fill: ctx.c.skin }, [tr(lx, -3), sc(.95)]),
+		path(d, {
+			fill: "none",
+			stroke: ctx.c.skinInk,
+			sw: LINE
+		})
+	];
+}
+const FRECKLES = [
+	[-3.5, -1.5],
+	[0, .8],
+	[3.5, -1.2],
+	[1.5, -3.5]
+];
+/** Cheek blush (from the expression, plus `rosy`) and freckles. */
+function cheeks(ctx, hasFreckles, isRosy) {
+	const out = [];
+	const blush = Math.min(1, ctx.face.cheeks + (isRosy ? .45 : 0));
+	for (const side of [-1, 1]) {
+		const f = feat(ctx, 25 * side);
+		if (!f.vis) continue;
+		const parts = [];
+		if (blush > .02) parts.push(ellipse(0, 0, 6.5, 3.8, {
+			fill: FIXED.blush,
+			opacity: Math.round(blush * 5) / 10
+		}));
+		if (hasFreckles) parts.push(...FRECKLES.map(([fx, fy]) => ellipse(fx, fy, 1.05, 1.05, {
+			fill: ctx.c.skinInk,
+			opacity: .45
+		})));
+		if (parts.length > 0) out.push(g(parts, { tf: [tr(f.x, 18 + ctx.dy), sc(f.sx, 1)] }));
+	}
+	return out;
+}
+//#endregion
+//#region src/avatar/render/mouth.ts
+/**
+* The nose, the mouth morph (one cubic structure for every shape, so any two
+* expressions tween, §3.5) and the small FX glyphs.
+*/
+/** The nose: a soft shade with a highlight. */
+function nose(ctx) {
+	const f = feat(ctx, 0);
+	return [g([ellipse(0, 0, 4.4, 3, { fill: ctx.c.skinShade }), ellipse(-1.5, -1, 1.2, 1.2, {
+		fill: ctx.c.skinLight,
+		opacity: .9
+	})], { tf: [tr(f.x, 16 + ctx.dy), sc(Math.max(.6, f.sx), 1)] })];
+}
+/** The mouth: a line when closed, a filled shape with teeth and tongue when open. Talking adds opening. */
+function mouth(ctx) {
+	const base = ctx.face.mouth;
+	const m = {
+		...base,
+		open: base.open + ctx.talk * 9 * (1 - base.round * .4)
+	};
+	const f = feat(ctx, m.dx);
+	const baseY = 27;
+	const lx = -m.w / 2;
+	const ly = baseY - m.sL;
+	const rx = m.w / 2;
+	const ry = baseY - m.sR;
+	const s = (m.sL + m.sR) / 2;
+	const corner = baseY - s;
+	const ctrl = (target) => (target - .25 * corner) / .75;
+	const place = [tr(f.x, ctx.dy * .8), sc(Math.max(.35, f.sx), 1)];
+	if (m.open < 1) {
+		const c = ctrl(baseY + s * .55);
+		return [g([path(`M${n(lx)} ${n(ly)}C${n(-m.w * .18)} ${n(c)} ${n(m.w * .18)} ${n(c)} ${n(rx)} ${n(ry)}`, line(SOFT_INK, LINE * .95))], { tf: place })];
+	}
+	const up = baseY + s * .3 - m.round * m.open * .45;
+	const lo = baseY + s * .55 + m.open * (1 - m.round * .45);
+	const kx = m.w / 2 * (.55 + m.round * .8);
+	const d = `M${n(lx)} ${n(ly)}C${n(-kx)} ${n(ctrl(up))} ${n(kx)} ${n(ctrl(up))} ${n(rx)} ${n(ry)}C${n(kx)} ${n(ctrl(lo))} ${n(-kx)} ${n(ctrl(lo))} ${n(lx)} ${n(ly)}Z`;
+	const inside = [];
+	if (m.tongue > .05) inside.push(ellipse(0, lo + 1, m.w * .32, m.open * .42 * m.tongue + 1, { fill: FIXED.tongue }));
+	if (m.teeth > .05) inside.push(rect(-m.w / 2, up - 6, m.w, 6 + m.open * .22 * m.teeth, { fill: FIXED.white }));
+	return [g([
+		path(d, { fill: FIXED.mouth }),
+		g(inside, { clip: { shapes: [path(d, {})] } }),
+		path(d, line(SOFT_INK, LINE * .9))
+	], { tf: place })];
+}
+/** FX glyphs beside the head (sparkle, tear, sweat, anger, question, zzz). */
+function extras(ctx) {
+	const out = [];
+	const f = feat(ctx, 0);
+	for (const e of ctx.face.extras) {
+		if (e === "sparkle") out.push(path("M0 -9Q1.4 -1.4 9 0Q1.4 1.4 0 9Q-1.4 1.4 -9 0Q-1.4 -1.4 0 -9Z", {
+			fill: "#ffd23f",
+			stroke: "#0d0f14",
+			sw: 1.6
+		}, [tr(48 + f.x * .2, -44)]));
+		if (e === "tear") {
+			const t = feat(ctx, -16);
+			if (t.vis) out.push(path("M0 -5Q4.5 2 0 5Q-4.5 2 0 -5Z", {
+				fill: "#7cc7ff",
+				stroke: "#1f3b5c",
+				sw: 1.4
+			}, [tr(t.x - 5, 16 + ctx.dy)]));
+		}
+		if (e === "sweat") out.push(path("M0 -6Q5 2 0 6Q-5 2 0 -6Z", {
+			fill: "#9fdcff",
+			stroke: "#1f3b5c",
+			sw: 1.4
+		}, [tr(40 + f.x * .2, -26)]));
+		if (e === "anger") out.push(g([
+			path("M-6 -2Q-2 -2 -2 -6", line("#ff4d4d", 2.6)),
+			path("M2 -6Q2 -2 6 -2", line("#ff4d4d", 2.6)),
+			path("M6 2Q2 2 2 6", line("#ff4d4d", 2.6)),
+			path("M-2 6Q-2 2 -6 2", line("#ff4d4d", 2.6))
+		], { tf: [tr(30 + f.x * .3, -36)] }));
+		if (e === "question") out.push({
+			k: "text",
+			x: 50 + f.x * .2,
+			y: -40,
+			text: "?",
+			size: 26,
+			font: "pixel",
+			fill: "#ffd23f",
+			stroke: "#0d0f14",
+			sw: 1.2
+		});
+		if (e === "zzz") out.push({
+			k: "text",
+			x: 44 + f.x * .2,
+			y: -42,
+			text: "z z",
+			size: 20,
+			font: "pixel",
+			fill: "#8ab4ff",
+			stroke: "#0d0f14",
+			sw: 1.2
+		});
+	}
+	return out;
+}
+//#endregion
+//#region src/avatar/render/props.ts
+/**
+* Status props (§3.11, §14.3): runtime-only parts the world (or a preview)
+* puts on a player. `goggles` lives in eyewear.ts; the head props here sit on
+* the head, the hand props at the `prop` anchor in front of the body.
+*/
+const DARK = "#0d0f14";
+/** Hand props are drawn at this scale so they read at small sizes. */
+const PROP_SCALE = 1.45;
+/** A headset: a band over the head, ear cups and a mic (head space). */
+function headset(ctx, isBack) {
+	const w = turnWarp(isBack ? 0 : ctx.phi);
+	const band = blob(arc(0, -4, 51, 51, 196, 344, 8), false);
+	const nodes = [path(band.d(w), line(DARK, 8)), path(band.d(w), line("#4a5470", 5))];
+	const phi = isBack ? 0 : ctx.phi;
+	for (const side of [-1, 1]) {
+		const t = Math.PI / 2 * side + phi;
+		if (Math.cos(t) < -.15) continue;
+		const cupX = Math.max(-47, Math.min(47, 46 * Math.sin(t)));
+		const wide = 6 + 3 * Math.max(0, Math.cos(t));
+		nodes.push(path(roundedRect(cupX - wide, -6, wide * 2, 20, 5).d(), {
+			fill: "#2a3142",
+			stroke: DARK,
+			sw: LINE
+		}));
+	}
+	if (!isBack && Math.abs(phi) < .7) nodes.push(path(new Path().m(-46, 12).q(-40, 30, -18, 30).d(w), line("#4a5470", 3)), ellipse(-17, 30, 3, 3, {
+		fill: "#ff5f3b",
+		stroke: DARK,
+		sw: 1.2
+	}));
+	return nodes;
+}
+/** A small crown on top of the head (head space; `top` is the hair or hat top). */
+function crown(top) {
+	return [g([path("M-16 0L-18 -16L-8 -8L0 -20L8 -8L18 -16L16 0Z", {
+		fill: "#ffd23f",
+		stroke: "#8a5a00",
+		sw: LINE
+	}), ellipse(0, -5, 2.4, 2.4, { fill: "#ff5f3b" })], { tf: [tr(0, -50 - top + 4)] })];
+}
+const card = (colour) => rect(-6, -9, 12, 17, {
+	fill: colour,
+	stroke: DARK,
+	sw: 1.6
+}, 2.5);
+/** Nub hands holding something at the prop anchor (body space). */
+function nubs(body, ink, spread, atY) {
+	return [-1, 1].map((s) => ellipse(spread * s, atY, 7, 6, {
+		fill: body,
+		stroke: ink,
+		sw: LINE
+	}));
+}
+/** A hand prop drawn at the `prop` anchor (x, y) in front of the body. */
+function handProp(prop, atX, atY, body, bodyInk) {
+	switch (prop) {
+		case "cards": return [g([
+			g([card("#ff5f3b")], { tf: [tr(-8, 0), rot(-18)] }),
+			g([card("#ffd23f")], { tf: [tr(0, -3)] }),
+			g([card("#3d7bff")], { tf: [tr(8, 0), rot(18)] }),
+			...nubs(body, bodyInk, 13, 8)
+		], { tf: [tr(atX, atY), sc(PROP_SCALE)] })];
+		case "controller": return [g([
+			path(new Path().m(-20, -4).c(-20, -12, 20, -12, 20, -4).c(24, 10, 14, 14, 8, 6).l(-8, 6).c(-14, 14, -24, 10, -20, -4).z().d(), {
+				fill: "#2a3142",
+				stroke: DARK,
+				sw: LINE
+			}),
+			ellipse(-9, -2, 2.6, 2.6, { fill: "#8ab4ff" }),
+			ellipse(10, -4, 2, 2, { fill: "#ff5f3b" }),
+			ellipse(13, 0, 2, 2, { fill: "#4ade80" }),
+			...nubs(body, bodyInk, 20, 4)
+		], { tf: [tr(atX, atY), sc(PROP_SCALE)] })];
+		case "book": return [g([
+			path("M0 -2C-8 -8 -18 -8 -24 -5L-24 12C-18 9 -8 9 0 14C8 9 18 9 24 12L24 -5C18 -8 8 -8 0 -2Z", {
+				fill: "#f4f1ea",
+				stroke: DARK,
+				sw: LINE
+			}),
+			path("M0 -2L0 14", line("#c9c2b4", 1.6)),
+			path("M-19 0L-5 3M-19 5L-5 8M5 3L19 0M5 8L19 5", line("#9a9384", 1.2)),
+			path("M-24 12C-18 9 -8 9 0 14C8 9 18 9 24 12L24 15C18 12 8 12 0 17C-8 12 -18 12 -24 15Z", {
+				fill: "#ff5f3b",
+				stroke: DARK,
+				sw: 1.4
+			}),
+			...nubs(body, bodyInk, 25, 6)
+		], { tf: [tr(atX, atY), sc(PROP_SCALE)] })];
+		case "trophy": return [g([
+			path("M-11 -14L11 -14L9 0C8 6 -8 6 -9 0Z", {
+				fill: "#ffd23f",
+				stroke: "#8a5a00",
+				sw: LINE
+			}),
+			path("M-11 -11C-18 -11 -18 -2 -9 -1M11 -11C18 -11 18 -2 9 -1", line("#8a5a00", 2.2)),
+			rect(-3, 4, 6, 6, { fill: "#e0a800" }),
+			rect(-9, 10, 18, 5, {
+				fill: "#6b4f12",
+				stroke: DARK,
+				sw: 1.2
+			}, 1.5),
+			ellipse(13, 6, 7, 6, {
+				fill: body,
+				stroke: bodyInk,
+				sw: LINE
+			})
+		], { tf: [tr(atX + 24, atY - 10), sc(PROP_SCALE)] })];
+		default: return [];
+	}
+}
+//#endregion
+//#region src/avatar/render/compose.ts
+/**
+* Composes a look and a pose into a scene in rig space: the feet at (0, 0),
+* y down, the head centre near (0, −96) (§14.2). Layers go back to front as
+* in §3.2, with facial hair split into beard and moustache layers.
+*/
+/** The head centre's height above the feet. */
+const HEAD_Y = -96;
+const DEG = Math.PI / 180;
+const FACING_ANGLE = {
+	S: 0,
+	SE: 34,
+	E: 70,
+	NE: 145,
+	N: 180
+};
+const MIRROR = {
+	SW: "SE",
+	W: "E",
+	NW: "NE"
+};
+const VIEW_FACING = {
+	front: "S",
+	back: "N",
+	left: "W",
+	right: "E"
+};
+/** The facing an options object asks for. */
+function facingOf(opts) {
+	return opts.facing ?? (opts.view ? VIEW_FACING[opts.view] : "S");
+}
+function resolveParts(look, art) {
+	const slot = (name) => look.accessories.find((a) => a.slot === name);
+	const hatAcc = slot("headwear");
+	const glassAcc = slot("glasses");
+	const earAcc = slot("ears");
+	const face = slot("face");
+	return {
+		c: lookColours(look),
+		hair: art.hair[partName(look.hair.style)],
+		hat: hatAcc ? art.headwear[partName(hatAcc.id)] : void 0,
+		hatColour: accessoryColour(look, hatAcc),
+		beard: art.beard[partName(look.facialHair.style)],
+		glasses: glassAcc ? art.glasses[partName(glassAcc.id)] : void 0,
+		glassesColour: glassAcc?.colour === void 0 ? "#1d1a1e" : accessoryColour(look, glassAcc),
+		freckles: face?.id === "face.freckles",
+		rosy: face?.id === "face.rosy",
+		earExtra: earAcc ? {
+			kind: earAcc.id === "ears.hoops" ? "hoops" : "studs",
+			colour: earAcc.colour === void 0 ? "#f5c542" : accessoryColour(look, earAcc)
+		} : void 0,
+		browStyle: partName(look.brows.style)
+	};
+}
+/** The far-side clip for a turned head's rear art (a back-of-skull crescent). */
+function backOfHead(phi) {
+	const left = -46 * Math.cos(phi) - 3;
+	const cx = (left + 46 + 12) / 2;
+	const rx = (58 - left) / 2;
+	return {
+		crescent: {
+			shapes: [path(`M-200 -200H200V200H-200Z M${n(cx - rx)} 8A${n(rx)} 64 0 1 0 ${n(cx + rx)} 8A${n(rx)} 64 0 1 0 ${n(cx - rx)} 8Z`, {})],
+			evenOdd: true
+		},
+		half: { shapes: [rect(-200, -200, 200 + cx, 400, {})] }
+	};
+}
+/** The front and side views of the head. */
+function frontHead(ctx, p, isPlaying, status, angle, gazeX) {
+	const hatCut = p.hat && typeof p.hat.hides === "number" ? { shapes: [rect(-120, p.hat.hides, 240, 260, {})] } : void 0;
+	const isHairShown = !(p.hat && p.hat.hides === "all");
+	const cut = (nodes) => hatCut && nodes.length > 0 ? [g(nodes, { clip: hatCut })] : nodes;
+	const hairTie = tones(ctx.c.body);
+	const hatTones = tones(p.hatColour);
+	const warpFront = turnWarp((angle + gazeX * 6) * DEG);
+	const warpBack = ctx.phi === 0 ? void 0 : (px, py) => [px - Math.sin(ctx.phi) * 8, py];
+	const out = [];
+	if (p.hat?.back) out.push(...paintShapes(ctx.c, hatTones, p.hat.back, warpBack));
+	if (isHairShown) out.push(...cut(paintShapes(ctx.c, hairTie, p.hair?.back, warpBack)));
+	if (!p.hat?.hidesEars) out.push(...ears(ctx, "behind", p.earExtra));
+	out.push(...head(ctx));
+	const turnS = Math.sin(ctx.phi);
+	if (Math.abs(turnS) > .3) {
+		const co = Math.cos(ctx.phi);
+		const shift = (px, py) => [px * (.92 + .08 * co) - turnS * 5, py];
+		const rear = [...isHairShown ? cut(paintShapes(ctx.c, hairTie, p.hair?.rear, shift)) : [], ...p.hat ? paintShapes(ctx.c, hatTones, p.hat.rear, shift) : []];
+		const clips = backOfHead(ctx.phi);
+		if (rear.length > 0) out.push(g([g(rear, { clip: clips.crescent })], { clip: clips.half }));
+	}
+	if (!p.hat?.hidesEars) out.push(...ears(ctx, "front", p.earExtra));
+	out.push(...cheeks(ctx, p.freckles, p.rosy));
+	const faceWarp = turnWarp(ctx.phi, ctx.dy * .8);
+	out.push(...paintShapes(ctx.c, hairTie, p.beard?.beard, faceWarp));
+	if (!isPlaying) out.push(...eye(ctx, -1), ...eye(ctx, 1));
+	out.push(...brow(ctx, -1, p.browStyle), ...brow(ctx, 1, p.browStyle));
+	if (turnS > .8) out.push(path("M43 9C50 11 51 18 43.5 20", {
+		fill: ctx.c.skin,
+		stroke: ctx.c.skinInk,
+		sw: LINE
+	}));
+	out.push(...nose(ctx), ...mouth(ctx));
+	out.push(...paintShapes(ctx.c, hairTie, p.beard?.moustache, faceWarp));
+	if (isHairShown) {
+		out.push(...cut(paintShapes(ctx.c, hairTie, p.hair?.front, warpFront)));
+		if (p.hair?.front?.some((s) => s.clip === "head")) out.push(path(HEAD_PATH.d(), {
+			fill: "none",
+			stroke: ctx.c.skinInk,
+			sw: LINE
+		}));
+	}
+	if (isPlaying) out.push(...goggles(ctx));
+	else if (p.glasses) out.push(...glasses(ctx, p.glasses, p.glassesColour));
+	if (p.hat) out.push(...paintShapes(ctx.c, hatTones, p.hat.front, warpFront));
+	if (status === "headset") out.push(...headset(ctx, false));
+	out.push(...extras(ctx));
+	return out;
+}
+/** The back views (N, NE): the rear art wrapped past 180°. */
+function backHead(ctx, p, isPlaying, status, angle) {
+	const phi = (angle - 180) * DEG;
+	const warp = turnWarp(phi);
+	const isHairShown = !(p.hat && p.hat.hides === "all");
+	const hatCut = p.hat && typeof p.hat.hides === "number" ? { shapes: [rect(-120, p.hat.hides, 240, 260, {})] } : void 0;
+	const out = [];
+	if (!p.hat?.hidesEars) out.push(...ears({
+		...ctx,
+		phi
+	}, "behind", p.earExtra));
+	out.push(...head({
+		...ctx,
+		phi: 0
+	}));
+	if (isHairShown) {
+		const rear = paintShapes(ctx.c, tones(ctx.c.body), p.hair?.rear, warp);
+		out.push(...hatCut && rear.length > 0 ? [g(rear, { clip: hatCut })] : rear);
+		if (p.hair?.rear.some((s) => s.clip === "head")) out.push(path(HEAD_PATH.d(), {
+			fill: "none",
+			stroke: ctx.c.skinInk,
+			sw: LINE
+		}));
+	}
+	if (isPlaying) out.push(...gogglesStrapBack(ctx, phi));
+	if (p.hat) out.push(...paintShapes(ctx.c, tones(p.hatColour), p.hat.rear, warp));
+	if (status === "headset") out.push(...headset(ctx, true));
+	return out;
+}
+/** The grey silhouette: a malformed code, a hidden player, or before the art loads. */
+function silhouette(hasShadow) {
+	const grey = "#6f7787";
+	return [
+		...hasShadow ? [groundShadow(0)] : [],
+		path("M-35 -2C-42 -20 -38 -46 -22 -56C-8 -62 8 -62 22 -56C38 -46 42 -20 35 -2C20 3 -20 3 -35 -2Z", { fill: grey }),
+		path(HEAD_PATH.d(), { fill: grey }, [tr(0, -96), sc(.94)])
+	];
+}
+function anchorsFor(headX, headY, top, prop, mirror) {
+	const at = (px, py) => ({
+		x: px * mirror,
+		y: py
+	});
+	return {
+		feet: at(0, 0),
+		body: at(0, -30),
+		neck: at(headX, headY + 46),
+		head: at(headX, headY),
+		eyeLine: at(headX, headY + 4),
+		mouth: at(headX, headY + 27),
+		hatTop: at(headX, top),
+		nameplate: at(0, top - 10),
+		bubble: at(0, top - 14),
+		seat: at(0, 0),
+		prop: at(prop.x, prop.y),
+		shadow: at(0, 0),
+		handL: at(-40, -30),
+		handR: at(40, -30),
+		pod: at(0, 14)
+	};
+}
+/** Composes a look (or `null` for the silhouette) with a pose. */
+function composeAvatar(look, opts = {}) {
+	const art = currentArt();
+	const facingIn = facingOf(opts);
+	const isMirrored = MIRROR[facingIn] !== void 0;
+	const facing = MIRROR[facingIn] ?? (facingIn === "S" || facingIn === "SE" || facingIn === "E" || facingIn === "NE" ? facingIn : "N");
+	const hasShadow = opts.shadow ?? opts.frame === "full";
+	if (!look || !art) return {
+		nodes: silhouette(hasShadow),
+		anchors: anchorsFor(0, -96, -156, {
+			x: 0,
+			y: -30
+		}, 1)
+	};
+	const pose = opts.pose ?? {};
+	const bodyPose = pose.body ?? "idle";
+	const status = pose.status ?? (bodyPose === "play" ? "goggles" : null);
+	const isPlaying = status === "goggles";
+	const face = pose.face ?? EXPRESSIONS[pose.expression ?? (bodyPose === "play" ? "determined" : bodyPose === "away" ? "sleepy" : "neutral")];
+	const gaze = pose.look ?? {
+		x: 0,
+		y: 0
+	};
+	const angle = FACING_ANGLE[facing];
+	const isBack = angle > 90;
+	const parts = resolveParts(look, art);
+	const ctx = {
+		c: parts.c,
+		face,
+		gaze,
+		phi: (angle + gaze.x * 11) * DEG,
+		dy: gaze.y * 3,
+		blink: pose.blink ?? 0,
+		talk: pose.talk ?? 0
+	};
+	const b = bodyLayout(parts.c, bodyPose, ctx.phi, pose.phase ?? .25, opts.stool === true);
+	const headX = b.headDx + (pose.bob?.x ?? 0);
+	const headY = -96 + b.headDy + (pose.bob?.y ?? 0);
+	const tilt = face.headTilt + b.tilt + (pose.tilt ?? 0);
+	const sq = face.squash + (pose.squash ?? 0);
+	const headNodes = isBack ? backHead(ctx, parts, isPlaying, status, angle) : frontHead(ctx, parts, isPlaying, status, angle, gaze.x);
+	const top = headY - 50 - Math.max(parts.hair?.top ?? 0, parts.hat?.top ?? 0);
+	if (status === "crown") headNodes.push(...crown(Math.max(parts.hair?.top ?? 0, parts.hat?.top ?? 0)));
+	const handProps = status && !isBack ? handProp(status, b.prop.x, b.prop.y, parts.c.body, parts.c.bodyInk) : [];
+	const character = [
+		...b.behind,
+		...b.body,
+		g(headNodes, { tf: [
+			tr(headX, headY),
+			rot(tilt),
+			sc(1 + sq, 1 - sq)
+		] }),
+		...b.front,
+		...handProps
+	];
+	const lifted = b.lift > 0 ? [g(character, { tf: [tr(0, -b.lift)] })] : character;
+	const rimmed = opts.rim ? [g(lifted, { rim: true })] : lifted;
+	const all = [...hasShadow ? [groundShadow(b.lift)] : [], ...rimmed];
+	const mirror = isMirrored ? -1 : 1;
+	return {
+		nodes: isMirrored ? [g(all, { tf: [sc(-1, 1)] })] : all,
+		anchors: anchorsFor(headX, headY - b.lift, top - b.lift, {
+			x: b.prop.x,
+			y: b.prop.y - b.lift
+		}, mirror)
+	};
+}
+//#endregion
+//#region src/avatar/outputs/svg-markup.ts
+/**
+* Scene → SVG markup. Ids for clips and the rim filter are prefixed per call,
+* so many avatars can be inlined on one page. The output holds only numbers,
+* derived colours and escaped overlay text, so it is safe to insert as HTML.
+*/
+/** The rim filter: a dilated, soft light edge behind the silhouette. */
+const RIM_COLOUR = "#aab3c7";
+const FONTS = {
+	mono: "'Space Mono', monospace",
+	pixel: "'VT323', monospace"
+};
+/** Three decimals, for scales and opacities. */
+const fine = (v) => String(Math.round(v * 1e3) / 1e3);
+/** Escapes text for SVG content. */
+function escapeXml(text) {
+	return text.replace(/[&<>"']/g, (c) => `&#${String(c.charCodeAt(0))};`);
+}
+/** A transform list as an SVG `transform` attribute (empty for none). */
+function tfAttr(tf) {
+	if (!tf || tf.length === 0) return "";
+	return ` transform="${tf.map((op) => {
+		switch (op.k) {
+			case "t": return `translate(${n(op.x)} ${n(op.y)})`;
+			case "s": return `scale(${fine(op.x)} ${fine(op.y)})`;
+			case "r": return `rotate(${n(op.a)})`;
+			case "skx": return `skewX(${n(op.a)})`;
+		}
+	}).join(" ")}"`;
+}
+function paintAttrs(p) {
+	let out = ` fill="${p.fill ?? "none"}"`;
+	if (p.evenOdd) out += " fill-rule=\"evenodd\"";
+	if (p.fillOpacity !== void 0) out += ` fill-opacity="${fine(p.fillOpacity)}"`;
+	if (p.stroke && p.stroke !== "none") out += ` stroke="${p.stroke}" stroke-width="${n(p.sw ?? 1)}" stroke-linejoin="round" stroke-linecap="${p.cap ?? "round"}"`;
+	if (p.opacity !== void 0 && p.opacity < 1) out += ` opacity="${fine(p.opacity)}"`;
+	return out;
+}
+/** Collects `<defs>` while serialising. */
+var Writer = class {
+	constructor(prefix) {
+		_defineProperty(this, "defs", []);
+		_defineProperty(this, "count", 0);
+		_defineProperty(this, "usesRim", false);
+		_defineProperty(this, "prefix", void 0);
+		this.prefix = prefix;
+	}
+	id(kind) {
+		this.count += 1;
+		return `${this.prefix}${kind}${this.count.toString(36)}`;
+	}
+	clip(clip) {
+		const id = this.id("c");
+		const rule = clip.evenOdd ? " clip-rule=\"evenodd\"" : "";
+		this.defs.push(`<clipPath id="${id}">${clip.shapes.map((s) => this.node(s).replace("<path ", `<path${rule} `)).join("")}</clipPath>`);
+		return id;
+	}
+	node(node) {
+		switch (node.k) {
+			case "g": {
+				let attrs = tfAttr(node.tf);
+				if (node.clip) attrs += ` clip-path="url(#${this.clip(node.clip)})"`;
+				if (node.opacity !== void 0 && node.opacity < 1) attrs += ` opacity="${fine(node.opacity)}"`;
+				if (node.rim) {
+					this.usesRim = true;
+					attrs += ` filter="url(#${this.prefix}rim)"`;
+				}
+				const inner = node.children.map((child) => this.node(child)).join("");
+				return attrs === "" ? inner : `<g${attrs}>${inner}</g>`;
+			}
+			case "path": return `<path d="${node.d}"${tfAttr(node.tf)}${paintAttrs(node)}/>`;
+			case "ellipse": return node.rx === node.ry ? `<circle cx="${n(node.cx)}" cy="${n(node.cy)}" r="${n(node.rx)}"${tfAttr(node.tf)}${paintAttrs(node)}/>` : `<ellipse cx="${n(node.cx)}" cy="${n(node.cy)}" rx="${n(node.rx)}" ry="${n(node.ry)}"${tfAttr(node.tf)}${paintAttrs(node)}/>`;
+			case "rect": return `<rect x="${n(node.x)}" y="${n(node.y)}" width="${n(node.w)}" height="${n(node.h)}"${node.r ? ` rx="${n(node.r)}"` : ""}${tfAttr(node.tf)}${paintAttrs(node)}/>`;
+			case "text": return `<text x="${n(node.x)}" y="${n(node.y)}" font-family="${FONTS[node.font]}" font-size="${n(node.size)}"${node.bold ? " font-weight=\"700\"" : ""}${node.anchor === "middle" ? " text-anchor=\"middle\"" : ""} paint-order="stroke"${paintAttrs(node)}>${escapeXml(node.text)}</text>`;
+		}
+	}
+};
+/** A scene as SVG markup plus the `<defs>` it needs. */
+function sceneToSvg(nodes, prefix) {
+	const writer = new Writer(prefix);
+	const body = nodes.map((node) => writer.node(node)).join("");
+	if (writer.usesRim) writer.defs.push(`<filter id="${prefix}rim" x="-20%" y="-20%" width="140%" height="140%"><feMorphology in="SourceAlpha" operator="dilate" radius="2.8" result="d"/><feFlood flood-color="${RIM_COLOUR}" flood-opacity=".48"/><feComposite in2="d" operator="in"/><feMerge><feMergeNode/><feMergeNode in="SourceGraphic"/></feMerge></filter>`);
+	return {
+		body,
+		defs: writer.defs.join("")
+	};
+}
+//#endregion
+export { contrast as A, ellipse as C, rect as D, path as E, lightness as M, toCode as N, rot as O, toLook as P, pixelSize as S, line as T, onArtReady as _, composeAvatar as a, frameOf as b, n as c, EXPRESSIONS as d, EXPRESSION_NAMES as f, mix as g, isExpression as h, HEAD_Y as i, deltaE as j, tr as k, roundedRect as l, faceOf as m, escapeXml as n, arc as o, expressionFromEmote as p, sceneToSvg as r, blob as s, RIM_COLOUR as t, scallop as u, ready as v, g as w, framed as x, FRAMES as y };
+
+//# sourceMappingURL=svg-markup.js.map