@riverbankcms/sdk 0.144.0 → 0.145.0

package/dist/server/rendering.mjs

@@ -314,7 +314,7 @@ function parseEventPageSurfaceDestinationMode(value) {
 	return value === "cms-managed" || value === "system-managed" ? value : void 0;
 }
 function parseEventPageSurfaceSubject(value) {
-	if (!isRecord$40(value)) return err$3({ kind: "notObject" });
+	if (!isRecord$41(value)) return err$3({ kind: "notObject" });
 	switch (value.kind) {
 		case "eventSeries": {
 			const eventSeriesId = parseEventSeriesId(value.eventSeriesId);
@@ -369,7 +369,7 @@ function parseEventSeriesIdList(values) {
 	}
 	return ok$3(parsed);
 }
-function isRecord$40(value) {
+function isRecord$41(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 //#endregion
@@ -595,6 +595,74 @@ function getLocalScheduleDate(date, timeZone) {
 	};
 }
 //#endregion
+//#region ../core/src/appointment-service-categories.ts
+/**
+* Groups services under their categories.
+*
+* A service whose `categoryId` names no category in `categories` lands in
+* Other. The composite foreign key keeps that from happening with stored data,
+* so this is only the total, safe answer for a caller holding a stale list.
+*/
+function layoutServicesByCategory(categories, services, options) {
+	if (categories.length === 0) return {
+		kind: "uncategorized-site",
+		services: [...services]
+	};
+	const buckets = new Map(categories.map((category) => [category.id, []]));
+	const other = [];
+	for (const service of services) {
+		const bucket = service.categoryId === null ? void 0 : buckets.get(service.categoryId);
+		if (bucket !== void 0) bucket.push(service);
+		else other.push(service);
+	}
+	const groups = [];
+	for (const category of categories) {
+		const groupServices = buckets.get(category.id) ?? [];
+		if (groupServices.length === 0 && !options.keepEmptyGroups) continue;
+		groups.push({
+			category,
+			services: groupServices
+		});
+	}
+	if (groups.length === 0 && !options.keepEmptyGroups) return {
+		kind: "uncategorized-site",
+		services: other
+	};
+	return {
+		kind: "categorized-site",
+		groups,
+		other
+	};
+}
+/**
+* Selects the public view for an optional category filter.
+*
+* It takes the category and service lists rather than a prebuilt layout
+* because the public layout has already dropped empty categories, and then an
+* empty category (`single` with no services) could not be told apart from a
+* deleted one (`fallback-all`).
+*/
+function selectCategoryView(categories, services, filterCategoryId) {
+	const publicLayout = () => layoutServicesByCategory(categories, services, { keepEmptyGroups: false });
+	if (filterCategoryId === null || filterCategoryId === void 0) return {
+		kind: "all",
+		layout: publicLayout()
+	};
+	const category = categories.find((candidate) => candidate.id === filterCategoryId);
+	if (category === void 0) return {
+		kind: "fallback-all",
+		missingCategoryId: filterCategoryId,
+		layout: publicLayout()
+	};
+	return {
+		kind: "single",
+		group: {
+			category,
+			services: services.filter((service) => service.categoryId === filterCategoryId)
+		}
+	};
+}
+//#endregion
 //#region ../core/src/location.ts
 function normalizeLocationAddressText(value) {
 	if (typeof value !== "string") return null;
@@ -613,7 +681,7 @@ function toLocationCoordinates(value) {
 }
 //#endregion
 //#region ../core/src/rich-text.ts
-function isRecord$38(value) {
+function isRecord$39(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function hasOnlyKeys(value, allowed) {
@@ -632,10 +700,10 @@ function isDenseArrayOf(value, predicate) {
 	return true;
 }
 function isTipTapMark(value) {
-	return isRecord$38(value) && hasOnlyKeys(value, markKeys) && typeof value.type === "string" && value.type.length > 0 && (value.attrs === void 0 || isRecord$38(value.attrs));
+	return isRecord$39(value) && hasOnlyKeys(value, markKeys) && typeof value.type === "string" && value.type.length > 0 && (value.attrs === void 0 || isRecord$39(value.attrs));
 }
 function isTipTapNode(value) {
-	if (!isRecord$38(value) || !hasOnlyKeys(value, nodeKeys) || typeof value.type !== "string" || value.type.length === 0 || value.type === "doc" || value.attrs !== void 0 && !isRecord$38(value.attrs) || value.marks !== void 0 && (!Array.isArray(value.marks) || !isDenseArrayOf(value.marks, isTipTapMark)) || value.content !== void 0 && (!Array.isArray(value.content) || !isDenseArrayOf(value.content, isTipTapNode))) return false;
+	if (!isRecord$39(value) || !hasOnlyKeys(value, nodeKeys) || typeof value.type !== "string" || value.type.length === 0 || value.type === "doc" || value.attrs !== void 0 && !isRecord$39(value.attrs) || value.marks !== void 0 && (!Array.isArray(value.marks) || !isDenseArrayOf(value.marks, isTipTapMark)) || value.content !== void 0 && (!Array.isArray(value.content) || !isDenseArrayOf(value.content, isTipTapNode))) return false;
 	if (value.type === "text") return typeof value.text === "string" && value.text.length > 0 && value.content === void 0;
 	return value.text === void 0;
 }
@@ -672,10 +740,10 @@ function parseBrevoListId(value) {
 //#endregion
 //#region ../core/src/mailing-list-targeting-parser.ts
 function parseMailingListPlacementTargeting(value) {
-	if (!isRecord$37(value)) return targetingError("shape");
+	if (!isRecord$38(value)) return targetingError("shape");
 	if (value.mode === "default") return ok$3({ mode: "default" });
 	if (value.mode !== "custom") return targetingError("mode");
-	if (!isRecord$37(value.selection)) return targetingError("selection");
+	if (!isRecord$38(value.selection)) return targetingError("selection");
 	switch (value.provider) {
 		case "native": return parseNativeTargeting(value.selection);
 		case "brevo": return parseBrevoTargeting(value.selection);
@@ -779,7 +847,7 @@ function parseUniqueIds(value, parseId) {
 	}
 	return ok$3(parsed);
 }
-function isRecord$37(value) {
+function isRecord$38(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function targetingError(field) {
@@ -802,12 +870,12 @@ new Map([
 ].map((kind, index) => [kind, index]));
 //#endregion
 //#region ../core/src/mailing-list-setup.ts
-function isRecord$34(value) {
+function isRecord$35(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 const DEFAULT_MAILING_LIST_SUCCESS_MESSAGE = "Thanks — you're on the list.";
 function parseMailingListProviderScope(value) {
-	if (!isRecord$34(value)) return err$3("invalid_mailing_list_provider_scope");
+	if (!isRecord$35(value)) return err$3("invalid_mailing_list_provider_scope");
 	if (value.provider === "native") return ok$3({ provider: "native" });
 	if (value.provider === "brevo") {
 		const accountId = parseBrevoAccountId(value.accountId);
@@ -828,7 +896,7 @@ function parseMailingListProviderScope(value) {
 //#endregion
 //#region ../core/src/mailing-list-setup-parser.ts
 function parseMailingListGlobalForm(value) {
-	if (!isRecord$33(value)) return formError("shape");
+	if (!isRecord$34(value)) return formError("shape");
 	const fields = parseGlobalFields(value.fields);
 	if (fields === null) return formError("fields");
 	if (typeof value.includeOptionalPhone !== "boolean") return formError("includeOptionalPhone");
@@ -847,7 +915,7 @@ function parseMailingListGlobalForm(value) {
 	});
 }
 function parseGlobalFields(value) {
-	if (!isRecord$33(value) || typeof value.preset !== "string") return null;
+	if (!isRecord$34(value) || typeof value.preset !== "string") return null;
 	switch (value.preset) {
 		case "emailOnly": return { preset: "emailOnly" };
 		case "emailName": return isRequirement(value.name) ? {
@@ -884,7 +952,7 @@ function parseOptionalString(value) {
 function isRequirement(value) {
 	return value === "required" || value === "optional";
 }
-function isRecord$33(value) {
+function isRecord$34(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function formError(field) {
@@ -934,7 +1002,7 @@ function planMailingListChoicePresentation(targeting) {
 //#endregion
 //#region ../core/src/mailing-list-runtime.ts
 function parseMailingListRuntimeContext(value) {
-	if (!isRecord$32(value)) return invalidRuntimeContext();
+	if (!isRecord$33(value)) return invalidRuntimeContext();
 	if (value.tag === "not_configured") return ok$3({ tag: "not_configured" });
 	if (value.tag !== "configured") return invalidRuntimeContext();
 	const revision = parseMailingListSetupRevision(value.revision);
@@ -949,7 +1017,7 @@ function parseMailingListRuntimeContext(value) {
 	});
 }
 function parseRuntimeProvider(value) {
-	if (!isRecord$32(value)) return null;
+	if (!isRecord$33(value)) return null;
 	switch (value.provider) {
 		case "native": return parseNativeRuntimeProvider(value);
 		case "brevo": return parseBrevoRuntimeProvider(value);
@@ -981,7 +1049,7 @@ function parseMailchimpRuntimeProvider(value) {
 	if (defaultAudienceId === null) return null;
 	const audiences = [];
 	for (const audience of value.audiences) {
-		if (!isRecord$32(audience)) return null;
+		if (!isRecord$33(audience)) return null;
 		const id = parseMailchimpAudienceId$1(audience.id);
 		const name = parseName(audience.name);
 		if (id === null || name === null || !Array.isArray(audience.interests)) return null;
@@ -1002,7 +1070,7 @@ function parseMailchimpRuntimeProvider(value) {
 function parseMailchimpInterests(value) {
 	const interests = [];
 	for (const interest of value) {
-		if (!isRecord$32(interest)) return null;
+		if (!isRecord$33(interest)) return null;
 		const id = parseMailchimpInterestId(interest.id);
 		const name = parseName(interest.name);
 		const categoryName = parseName(interest.categoryName);
@@ -1019,7 +1087,7 @@ function parseNamedItems(value, parseId) {
 	if (!Array.isArray(value)) return null;
 	const items = [];
 	for (const item of value) {
-		if (!isRecord$32(item)) return null;
+		if (!isRecord$33(item)) return null;
 		const id = parseId(item.id);
 		const name = parseName(item.name);
 		if (id === null || name === null) return null;
@@ -1035,7 +1103,7 @@ function parseName(value) {
 	const name = value.trim();
 	return name.length > 0 ? name : null;
 }
-function isRecord$32(value) {
+function isRecord$33(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function invalidRuntimeContext() {
@@ -1595,11 +1663,11 @@ function parseRelativeStoragePath(value) {
 }
 //#endregion
 //#region ../media-core/src/typeGuards.ts
-function isRecord$30(value) {
+function isRecord$31(value) {
 	return Boolean(value) && typeof value === "object" && !Array.isArray(value);
 }
 function asRecord$3(value) {
-	return isRecord$30(value) ? value : void 0;
+	return isRecord$31(value) ? value : void 0;
 }
 function isFileJsonObject(value) {
 	return Object.values(value).every(isFileJsonValue);
@@ -1608,7 +1676,7 @@ function isFileJsonValue(value) {
 	if (value === null || typeof value === "string" || typeof value === "boolean") return true;
 	if (typeof value === "number") return Number.isFinite(value);
 	if (Array.isArray(value)) return value.every(isFileJsonValue);
-	return isRecord$30(value) && isFileJsonObject(value);
+	return isRecord$31(value) && isFileJsonObject(value);
 }
 new TextDecoder("latin1");
 //#endregion
@@ -1867,7 +1935,7 @@ function isCmsMediaObjectType(value) {
 	return typeof value === "string" && CMS_MEDIA_OBJECT_TYPES.includes(value);
 }
 function isCmsMediaObject(value) {
-	if (!isRecord$30(value)) return false;
+	if (!isRecord$31(value)) return false;
 	const type = value.type;
 	if (!isCmsMediaObjectType(type)) return false;
 	if ("attrs" in value) return false;
@@ -1878,7 +1946,7 @@ function collectMediaObjects(value, out, location = "") {
 		value.forEach((item, index) => collectMediaObjects(item, out, `${location}[${index}]`));
 		return;
 	}
-	if (!isRecord$30(value)) return;
+	if (!isRecord$31(value)) return;
 	if (isCmsMediaObject(value)) out.push({
 		obj: value,
 		location
@@ -1904,8 +1972,8 @@ function walkAndCollectImageAttrs(value, out, location = "") {
 		value.forEach((item, index) => walkAndCollectImageAttrs(item, out, `${location}[${index}]`));
 		return;
 	}
-	if (!isRecord$30(value)) return;
-	if (value.type === "image" && isRecord$30(value.attrs)) out.push({
+	if (!isRecord$31(value)) return;
+	if (value.type === "image" && isRecord$31(value.attrs)) out.push({
 		attrs: value.attrs,
 		location: location ? `${location}.attrs` : "attrs"
 	});
@@ -1952,7 +2020,7 @@ function mediaIdentifierOrFallback(current, fallback) {
 }
 //#endregion
 //#region ../media-core/src/contentMediaAudit.ts
-function isRecord$29(value) {
+function isRecord$30(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function summarizeContentMediaValue(value) {
@@ -1963,7 +2031,7 @@ function summarizeContentMediaValue(value) {
 	}
 	if (value === null) return "null";
 	if (Array.isArray(value)) return `array(${value.length})`;
-	if (isRecord$29(value)) return `object(${Object.keys(value).sort().join(",")})`;
+	if (isRecord$30(value)) return `object(${Object.keys(value).sort().join(",")})`;
 	return typeof value;
 }
 function auditMediaValue(context, path, allowedMediaTypes, value) {
@@ -1987,9 +2055,9 @@ function auditMediaValue(context, path, allowedMediaTypes, value) {
 			allowedMediaTypes
 		}];
 	}
-	const hasValidIdentifier = isRecord$29(value) && typeof value.identifier === "string" && value.identifier.trim().length > 0;
-	const hasValidExplicitType = isRecord$29(value) && (!("type" in value) || typeof value.type === "string" && allowedMediaTypes.includes(value.type));
-	const hasRetiredEnvironmentField = isRecord$29(value) && ("assetId" in value || "storagePath" in value || "storageBucket" in value || "src" in value || "mimeType" in value || looksLikeUuid(value.id));
+	const hasValidIdentifier = isRecord$30(value) && typeof value.identifier === "string" && value.identifier.trim().length > 0;
+	const hasValidExplicitType = isRecord$30(value) && (!("type" in value) || typeof value.type === "string" && allowedMediaTypes.includes(value.type));
+	const hasRetiredEnvironmentField = isRecord$30(value) && ("assetId" in value || "storagePath" in value || "storageBucket" in value || "src" in value || "mimeType" in value || looksLikeUuid(value.id));
 	if (hasValidIdentifier && hasValidExplicitType && !hasRetiredEnvironmentField) return [];
 	return [{
 		tag: "malformed-object",
@@ -2000,7 +2068,7 @@ function auditMediaValue(context, path, allowedMediaTypes, value) {
 	}];
 }
 function auditFields(context, fields, value, parentPath) {
-	if (!isRecord$29(value)) return [];
+	if (!isRecord$30(value)) return [];
 	const findings = [];
 	for (const field of fields) {
 		if (!(field.id in value)) continue;
@@ -2017,7 +2085,7 @@ function auditFields(context, fields, value, parentPath) {
 				if (!Array.isArray(fieldValue)) break;
 				for (const [index, item] of fieldValue.entries()) {
 					const itemPath = [...fieldPath, index];
-					if (!isRecord$29(item)) {
+					if (!isRecord$30(item)) {
 						findings.push({
 							tag: "missing-schema",
 							context,
@@ -2056,7 +2124,7 @@ const contentMediaTypes = /* @__PURE__ */ new Set([
 	"spreadsheet",
 	"archive"
 ]);
-function isRecord$28(value) {
+function isRecord$29(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function unknownArray(value) {
@@ -2065,7 +2133,7 @@ function unknownArray(value) {
 function fieldsArray(value) {
 	const directFields = unknownArray(value);
 	if (directFields) return directFields;
-	if (!isRecord$28(value)) return null;
+	if (!isRecord$29(value)) return null;
 	return unknownArray(value.fields);
 }
 function nestedFields$1(field) {
@@ -2130,7 +2198,7 @@ function mergeFields(fields) {
 }
 function adaptFields(rawFields, flattenRepeaterGroups = false, defaultFileKinds = ["document"]) {
 	return mergeFields(rawFields.flatMap((rawField) => {
-		if (!isRecord$28(rawField)) return [];
+		if (!isRecord$29(rawField)) return [];
 		const { id, type } = rawField;
 		if (typeof id !== "string" || !id || typeof type !== "string") return [];
 		if (type === "media" || type === "file") return [{
@@ -2138,7 +2206,7 @@ function adaptFields(rawFields, flattenRepeaterGroups = false, defaultFileKinds
 			id,
 			allowedMediaTypes: allowedMediaTypes(rawField, type, defaultFileKinds)
 		}];
-		if (flattenRepeaterGroups && type === "group" && isRecord$28(rawField.ui) && rawField.ui.flattenInRepeater === true) return adaptFields(nestedFields$1(rawField), false, defaultFileKinds);
+		if (flattenRepeaterGroups && type === "group" && isRecord$29(rawField.ui) && rawField.ui.flattenInRepeater === true) return adaptFields(nestedFields$1(rawField), false, defaultFileKinds);
 		if (type === "group" || type === "modal") return [{
 			kind: "object",
 			id,
@@ -2147,14 +2215,14 @@ function adaptFields(rawFields, flattenRepeaterGroups = false, defaultFileKinds
 		if (type === "tabGroup") return [{
 			kind: "object",
 			id,
-			fields: adaptFields((unknownArray(rawField.tabs) ?? []).flatMap((tab) => isRecord$28(tab) ? unknownArray(tab.fields) ?? [] : []), false, defaultFileKinds)
+			fields: adaptFields((unknownArray(rawField.tabs) ?? []).flatMap((tab) => isRecord$29(tab) ? unknownArray(tab.fields) ?? [] : []), false, defaultFileKinds)
 		}];
 		if (type !== "repeater") return [];
-		if (isRecord$28(rawField.itemTypes)) return [{
+		if (isRecord$29(rawField.itemTypes)) return [{
 			kind: "repeater",
 			id,
 			mode: "variants",
-			variants: Object.entries(rawField.itemTypes).flatMap(([typeId, itemType]) => isRecord$28(itemType) && Array.isArray(itemType.fields) ? [{
+			variants: Object.entries(rawField.itemTypes).flatMap(([typeId, itemType]) => isRecord$29(itemType) && Array.isArray(itemType.fields) ? [{
 				typeId,
 				fields: adaptFields(itemType.fields, true, defaultFileKinds)
 			}] : []),
@@ -2463,7 +2531,8 @@ const siteOptionSources = [
 	"eventCategories",
 	"eventSeries",
 	"venues",
-	"staffMembers"
+	"staffMembers",
+	"appointmentServiceCategories"
 ];
 const mediaDeliverySchema = z$1.object({
 	sizes: z$1.string().optional(),
@@ -5629,6 +5698,15 @@ function asSiteStyleId(value) {
 function asDesignSystemTemplateId(value) {
 	return brandNonEmptyString(value, "DesignSystemTemplateId");
 }
+function toNonEmptyReadonlyArray(values) {
+	const [first, ...rest] = values;
+	return first === void 0 ? null : [first, ...rest];
+}
+function requireNonEmptyReadonlyArray(values, message = "Expected a non-empty array.") {
+	const result = toNonEmptyReadonlyArray(values);
+	if (!result) throw new Error(message);
+	return result;
+}
 function makeBoundaryId(previousBlockId, nextBlockId) {
 	return asDesignBoundaryId(`boundary:${encodeURIComponent(previousBlockId)}:${encodeURIComponent(nextBlockId)}`);
 }
@@ -7293,12 +7371,577 @@ function cardRoleFromLegacyVocabulary(value) {
 * the role they meant, everything else fails the parse.
 */
 const cardRoleWithLegacyAliasSchema = z$1.preprocess((value) => cardRoleFromLegacyVocabulary(value) ?? value, cardRoleSchema);
+const hotspotSchema = z$1.object({
+	x: z$1.number().min(0).max(1),
+	y: z$1.number().min(0).max(1),
+	radius: z$1.number().optional()
+});
+const rotationSchema = z$1.union([
+	z$1.literal(0),
+	z$1.literal(90),
+	z$1.literal(180),
+	z$1.literal(270)
+]);
+const rectSchema = z$1.tuple([
+	z$1.number(),
+	z$1.number(),
+	z$1.number(),
+	z$1.number()
+]);
+const aspectCropSchema = z$1.object({
+	aspect: z$1.preprocess((value) => value == null ? void 0 : value, z$1.string().optional()),
+	rect: z$1.preprocess((value) => value == null ? void 0 : value, rectSchema.optional()),
+	hotspot: z$1.preprocess((value) => value == null ? void 0 : value, hotspotSchema.optional()),
+	rotation: z$1.preprocess((value) => value == null ? void 0 : value, rotationSchema.optional())
+});
+const transformSchema = z$1.object({
+	aspectCrops: z$1.preprocess((value) => {
+		if (!value || typeof value !== "object" || Array.isArray(value)) return;
+		return value;
+	}, z$1.record(z$1.string(), aspectCropSchema.catch({}))).optional(),
+	rect: rectSchema.optional(),
+	hotspot: hotspotSchema.optional(),
+	rotation: rotationSchema.optional()
+});
+const mediaPosterSchema = z$1.discriminatedUnion("tag", [z$1.object({
+	tag: z$1.literal("storage"),
+	assetId: z$1.string().optional(),
+	storageBucket: z$1.string().min(1),
+	storagePath: z$1.string().min(1)
+}), z$1.object({
+	tag: z$1.literal("external-src"),
+	assetId: z$1.string().optional(),
+	src: z$1.string().url()
+})]);
+const mediaBaseSchema = z$1.object({
+	purpose: z$1.string().optional(),
+	placeholder: z$1.boolean().default(true).optional(),
+	assetId: z$1.string().optional(),
+	identifier: z$1.string().optional(),
+	src: z$1.string().optional(),
+	alt: z$1.string().optional(),
+	filename: z$1.string().optional(),
+	mimeType: z$1.string().optional(),
+	width: z$1.number().optional(),
+	height: z$1.number().optional(),
+	storageBucket: z$1.string().optional(),
+	storagePath: z$1.string().optional(),
+	poster: mediaPosterSchema.optional(),
+	transform: transformSchema.optional()
+});
+const mediaIdentifierSchema = z$1.string().trim().min(1).brand();
+const imageMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("image") });
+const videoMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("video") });
+const audioMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("audio") });
+const documentMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("document") });
+const spreadsheetMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("spreadsheet") });
+const archiveMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("archive") });
+const mediaSchema = z$1.discriminatedUnion("type", [
+	imageMediaSchema,
+	videoMediaSchema,
+	audioMediaSchema,
+	documentMediaSchema,
+	spreadsheetMediaSchema,
+	archiveMediaSchema
+]);
+const persistableMediaBaseSchema = mediaBaseSchema.extend({ identifier: mediaIdentifierSchema });
+z$1.discriminatedUnion("type", [
+	persistableMediaBaseSchema.extend({ type: z$1.literal("image") }),
+	persistableMediaBaseSchema.extend({ type: z$1.literal("video") }),
+	persistableMediaBaseSchema.extend({ type: z$1.literal("audio") }),
+	persistableMediaBaseSchema.extend({ type: z$1.literal("document") }),
+	persistableMediaBaseSchema.extend({ type: z$1.literal("spreadsheet") }),
+	persistableMediaBaseSchema.extend({ type: z$1.literal("archive") })
+]);
 //#endregion
-//#region ../theme-core/src/site-styles/compilationPlan.ts
-const defaultHeaderBrandPreferences = {
-	brandDisplay: "auto",
-	logoSize: "auto"
-};
+//#region ../theme-core/src/site-styles/rawStyleFields.ts
+const themeV2RuntimeStyleFieldNames = [
+	"_frameStyles",
+	"_sectionStyles",
+	"_containerStyles",
+	"_cardStyles"
+];
+const themeV2BlockSpecificRawStyleFieldNames = [
+	"_contentCardStyles",
+	"_heroLayoutStyles",
+	"_textCardStyles"
+];
+const themeV2NormalEditorRawStyleFieldNames = [
+	...themeV2RuntimeStyleFieldNames,
+	...themeV2BlockSpecificRawStyleFieldNames,
+	"styleGroup"
+];
+new Set(themeV2NormalEditorRawStyleFieldNames);
+[...themeV2RuntimeStyleFieldNames, ...themeV2BlockSpecificRawStyleFieldNames];
+const pageDesignEditorBackgroundOverrideOwner = "page-design-editor";
+const siteChromeBackgroundOverrideOwner = "site-chrome-editor";
+const staleTransitionStyleGroupPrefix = "site-style-transition-";
+/**
+* A `styleGroup` in the retired `site-style-transition-*` namespace is residue
+* from the old per-block transition path (issue 1422). Any other value is
+* authored and must survive.
+*/
+function isStaleTransitionStyleGroup(value) {
+	return typeof value === "string" && value.startsWith(staleTransitionStyleGroupPrefix);
+}
+/** Drops a stale transition `styleGroup`, leaving authored values untouched. */
+function stripStaleTransitionStyleGroup(content) {
+	if (!isStaleTransitionStyleGroup(content.styleGroup)) return { ...content };
+	const { styleGroup: _stale, ...rest } = content;
+	return rest;
+}
+//#endregion
+//#region ../theme-core/src/utils/tokenOrColor.ts
+/**
+* Runtime color-reference fields intentionally accept any string, including
+* the legacy empty-string "no color" sentinel. Semantic validation needs
+* palette context and happens in `parseThemeColorReference`.
+*/
+const tokenOrCssColorValueSchema = z$1.string();
+const CSS_COLOR_FUNCTION_PATTERN = /^(?:rgb|rgba|hsl|hsla|hwb|lab|lch|oklab|oklch|color|color-mix|light-dark)\(/i;
+const CSS_HEX_COLOR_PATTERN = /^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i;
+const CSS_COLOR_KEYWORDS = /* @__PURE__ */ new Set([
+	"transparent",
+	"currentcolor",
+	"inherit",
+	"initial",
+	"revert",
+	"revert-layer",
+	"unset"
+]);
+const COMMON_CSS_NAMED_COLORS = /* @__PURE__ */ new Set([
+	"black",
+	"blue",
+	"gray",
+	"green",
+	"grey",
+	"orange",
+	"pink",
+	"purple",
+	"red",
+	"white",
+	"yellow"
+]);
+function isCssColorLiteral(value) {
+	const trimmed = value.trim();
+	if (!trimmed) return false;
+	return CSS_HEX_COLOR_PATTERN.test(trimmed) || CSS_COLOR_FUNCTION_PATTERN.test(trimmed) || /^var\(/i.test(trimmed) || CSS_COLOR_KEYWORDS.has(trimmed.toLowerCase());
+}
+function parseThemeToken(token) {
+	const trimmed = token.trim();
+	const match = trimmed.match(/^(.*?)-(\d{2,3})$/);
+	if (!match) return {
+		role: trimmed,
+		shade: null
+	};
+	const role = match[1] ?? trimmed;
+	const shade = match[2] ? Number(match[2]) : null;
+	return {
+		role,
+		shade: Number.isFinite(shade) ? shade : null
+	};
+}
+function parseContextThemeColorToken(value, context) {
+	const parts = parseColorTokenParts(value);
+	if (parts.kind !== "token") return null;
+	if (!(Boolean(context?.palette?.[value.trim()]) || parts.opacityPercent !== null && Boolean(context?.palette?.[parts.token]))) return null;
+	return value.trim();
+}
+function isTokenShapedTypo(value) {
+	if (COMMON_CSS_NAMED_COLORS.has(value.toLowerCase())) return false;
+	if (!/^[a-zA-Z][a-zA-Z0-9]*(?:-[a-zA-Z0-9]+)*(?:\/[^/]+)?$/.test(value)) return false;
+	return !isCssColorLiteral(value);
+}
+function warnUnknownThemeColorReference(value) {
+	if (typeof process !== "undefined" && process.env.NODE_ENV === "production") return;
+	if (!isTokenShapedTypo(value)) return;
+	console.warn(`[theme-core] Unknown Theme V2 color token "${value}" treated as literal CSS. Use raw:* for deliberate custom CSS values.`);
+}
+function parseThemeColorReference(input, context) {
+	const trimmed = input.trim();
+	if (trimmed.startsWith("raw:")) return {
+		kind: "literal-css",
+		value: trimmed.slice(4)
+	};
+	const contextToken = parseContextThemeColorToken(trimmed, context);
+	if (contextToken) return {
+		kind: "palette-context-token",
+		token: contextToken
+	};
+	const knownToken = parseThemeColorToken(trimmed);
+	if (knownToken) return {
+		kind: "theme-token",
+		token: knownToken
+	};
+	warnUnknownThemeColorReference(trimmed);
+	return {
+		kind: "literal-css",
+		value: trimmed
+	};
+}
+function resolveThemeColorReferenceValue(input, context) {
+	const reference = parseThemeColorReference(input, context);
+	return reference.kind === "literal-css" ? reference.value : rgbColorValue(reference.token);
+}
+function resolveTokenOrCssColorValue(input, context) {
+	return resolveThemeColorReferenceValue(input, context);
+}
+function resolveOnColorForThemeToken(token) {
+	if (!parseThemeColorToken(token)) return null;
+	const parts = parseColorTokenParts(token);
+	if (parts.kind !== "token") return null;
+	const { role, shade } = parseThemeToken(parts.token);
+	const normalizedRole = role.trim();
+	if (!normalizedRole) return null;
+	if (!shade) return rgbColorValue(`on${normalizedRole.charAt(0).toUpperCase() + normalizedRole.slice(1)}`);
+	return shade <= 400 ? "#000000" : "#FFFFFF";
+}
+//#endregion
+//#region ../theme-core/src/boxBackgroundSchema.ts
+const boxBackgroundOverlaySchema = z$1.preprocess(normalizeAuthoringOpacity, z$1.discriminatedUnion("type", [
+	z$1.object({ type: z$1.literal("none") }),
+	z$1.object({
+		type: z$1.literal("color"),
+		color: tokenOrCssColorValueSchema.nullable().optional(),
+		opacity: z$1.number().min(0).max(1).nullable().optional()
+	}),
+	z$1.object({
+		type: z$1.literal("gradient"),
+		gradient: z$1.string().nullable().optional(),
+		opacity: z$1.number().min(0).max(1).nullable().optional()
+	})
+]));
+const commonSchema = z$1.object({
+	contentOwner: z$1.literal(pageDesignEditorBackgroundOverrideOwner).optional(),
+	textColor: tokenOrCssColorValueSchema.nullable().optional(),
+	headingColor: tokenOrCssColorValueSchema.nullable().optional(),
+	linkColor: tokenOrCssColorValueSchema.nullable().optional(),
+	supportingColor: tokenOrCssColorValueSchema.nullable().optional()
+});
+const mediaPresentationSchema = commonSchema.extend({
+	opacity: z$1.preprocess(normalizeOpacity, z$1.number().min(0).max(1).nullable()).optional(),
+	objectFit: z$1.enum([
+		"fill",
+		"fit",
+		"original",
+		"custom"
+	]).nullable().optional(),
+	scale: z$1.string().nullable().optional(),
+	position: z$1.string().nullable().optional(),
+	motion: z$1.enum(["static", "fixed-frame"]).nullable().optional(),
+	overflow: z$1.boolean().nullable().optional(),
+	overlay: boxBackgroundOverlaySchema.nullable().optional()
+});
+const boxBackgroundSchema = z$1.discriminatedUnion("type", [
+	commonSchema.extend({
+		type: z$1.literal("color"),
+		color: tokenOrCssColorValueSchema.nullable().optional()
+	}),
+	commonSchema.extend({
+		type: z$1.literal("gradient"),
+		gradient: z$1.string().nullable().optional(),
+		gradientPresetId: z$1.string().min(1).nullable().optional()
+	}),
+	mediaPresentationSchema.extend({
+		type: z$1.literal("image"),
+		image: imageMediaSchema.nullable().optional()
+	}),
+	mediaPresentationSchema.extend({
+		type: z$1.literal("video"),
+		image: videoMediaSchema.nullable().optional(),
+		showVideoOnMobile: z$1.boolean().nullable().optional()
+	})
+]);
+function normalizeAuthoringOpacity(value) {
+	if (!isRecord$28(value)) return value;
+	return {
+		...value,
+		opacity: normalizeOpacity(value.opacity)
+	};
+}
+function normalizeOpacity(value) {
+	return typeof value === "number" && value > 1 && value <= 100 ? value / 100 : value;
+}
+function isRecord$28(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+//#endregion
+//#region ../theme-core/src/site-styles/runtimeBackgroundResolution.ts
+function parseCanonicalRuntimeBackground(content) {
+	const background = readRecord(readRecord(content._sectionStyles)?.background);
+	if (!background) return { kind: "none" };
+	const parsed = boxBackgroundSchema.safeParse(background);
+	if (!parsed.success) return { kind: "none" };
+	return parsed.data.contentOwner === "page-design-editor" ? {
+		kind: "page-design-override",
+		background: parsed.data
+	} : {
+		kind: "block-authored",
+		background: parsed.data
+	};
+}
+function readRecord(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value) ? value : null;
+}
+//#endregion
+//#region ../theme-core/src/site-styles/transitionCatalogue.ts
+/**
+* Family order for pickers. Entries below are listed family by family in this
+* same order, so the flat option list and the grouped families agree.
+*/
+const transitionCatalogueFamilies = [
+	{
+		id: "gradient",
+		label: "Gradient"
+	},
+	{
+		id: "wave",
+		label: "Wave"
+	},
+	{
+		id: "angle",
+		label: "Angle"
+	}
+];
+const mediumHeight = "6rem + 2px";
+const compactHeight = "4.5rem + 2px";
+const largeHeight = "7rem + 2px";
+/**
+* The single source of transition vocabulary. Order is significant: it is the
+* order of `boundaryOptions` (after `none`) and of each family's variants,
+* which persisted pins, page-flow presets and the editor picker all rely on.
+*
+* Shapes match what `generateLayoutCss` draws today. Structured
+* amplitude/frequency treatments (issue 826) extend this list later.
+*/
+const transitionCatalogueEntries = defineExactCatalog()([
+	{
+		intent: "soft-fade-short",
+		optionId: asBoundaryOptionId("break:soft"),
+		family: "gradient",
+		variantId: "soft",
+		label: "Soft",
+		variantLabel: "Soft",
+		treatment: {
+			kind: "soft-fade",
+			height: "medium",
+			curve: "soft"
+		},
+		size: "medium",
+		heightExpression: mediumHeight,
+		shape: { kind: "fade" }
+	},
+	{
+		intent: "soft-fade-long",
+		optionId: asBoundaryOptionId("break:spacious"),
+		family: "gradient",
+		variantId: "spacious",
+		label: "Spacious",
+		variantLabel: "Spacious",
+		treatment: {
+			kind: "soft-fade",
+			height: "large",
+			curve: "spacious"
+		},
+		size: "spacious",
+		heightExpression: "10rem",
+		shape: { kind: "fade" }
+	},
+	{
+		intent: "soft-fade-expansive",
+		optionId: asBoundaryOptionId("break:expansive"),
+		family: "gradient",
+		variantId: "expansive",
+		label: "Expansive",
+		variantLabel: "Expansive",
+		treatment: {
+			kind: "soft-fade",
+			height: "expansive",
+			curve: "expansive"
+		},
+		size: "expansive",
+		heightExpression: "14rem",
+		shape: { kind: "fade" }
+	},
+	{
+		intent: "wave-edge-balanced",
+		optionId: asBoundaryOptionId("break:wave-balanced"),
+		family: "wave",
+		variantId: "balanced",
+		label: "Balanced wave",
+		variantLabel: "Balanced",
+		treatment: {
+			kind: "wave-edge",
+			height: "medium",
+			amplitude: "balanced",
+			rhythm: "double",
+			symmetry: "symmetrical"
+		},
+		size: "medium",
+		heightExpression: mediumHeight,
+		shape: {
+			kind: "wave",
+			mask: "balanced"
+		}
+	},
+	{
+		intent: "wave-edge",
+		optionId: asBoundaryOptionId("break:wave"),
+		family: "wave",
+		variantId: "classic",
+		label: "Classic wave",
+		variantLabel: "Classic",
+		treatment: {
+			kind: "wave-edge",
+			height: "medium",
+			amplitude: "balanced",
+			rhythm: "double",
+			symmetry: "asymmetrical"
+		},
+		size: "medium",
+		heightExpression: mediumHeight,
+		shape: {
+			kind: "wave",
+			mask: "classic"
+		}
+	},
+	{
+		intent: "wave-edge-gentle",
+		optionId: asBoundaryOptionId("break:wave-gentle"),
+		family: "wave",
+		variantId: "gentle",
+		label: "Gentle wave",
+		variantLabel: "Gentle",
+		treatment: {
+			kind: "wave-edge",
+			height: "compact",
+			amplitude: "subtle",
+			rhythm: "single",
+			symmetry: "symmetrical"
+		},
+		size: "compact",
+		heightExpression: compactHeight,
+		shape: {
+			kind: "wave",
+			mask: "gentle"
+		}
+	},
+	{
+		intent: "wave-edge-bold",
+		optionId: asBoundaryOptionId("break:wave-bold"),
+		family: "wave",
+		variantId: "bold",
+		label: "Bold wave",
+		variantLabel: "Bold",
+		treatment: {
+			kind: "wave-edge",
+			height: "large",
+			amplitude: "bold",
+			rhythm: "double",
+			symmetry: "symmetrical"
+		},
+		size: "large",
+		heightExpression: largeHeight,
+		shape: {
+			kind: "wave",
+			mask: "bold"
+		}
+	},
+	{
+		intent: "wave-edge-drift",
+		optionId: asBoundaryOptionId("break:wave-drift"),
+		family: "wave",
+		variantId: "drift",
+		label: "Drift wave",
+		variantLabel: "Drift",
+		treatment: {
+			kind: "wave-edge",
+			height: "medium",
+			amplitude: "balanced",
+			rhythm: "double",
+			symmetry: "drift"
+		},
+		size: "medium",
+		heightExpression: mediumHeight,
+		shape: {
+			kind: "wave",
+			mask: "drift"
+		}
+	},
+	{
+		intent: "angle-edge-subtle",
+		optionId: asBoundaryOptionId("break:angle-subtle"),
+		family: "angle",
+		variantId: "subtle",
+		label: "Subtle angle",
+		variantLabel: "Subtle",
+		treatment: {
+			kind: "angle-edge",
+			height: "compact",
+			slope: "subtle",
+			direction: "forward"
+		},
+		size: "compact",
+		heightExpression: compactHeight,
+		shape: {
+			kind: "angle",
+			polygon: {
+				startTopPercent: 34,
+				endTopPercent: 18
+			}
+		}
+	},
+	{
+		intent: "angle-edge",
+		optionId: asBoundaryOptionId("break:angle-balanced"),
+		family: "angle",
+		variantId: "balanced",
+		label: "Balanced angle",
+		variantLabel: "Balanced",
+		treatment: {
+			kind: "angle-edge",
+			height: "medium",
+			slope: "balanced",
+			direction: "forward"
+		},
+		size: "medium",
+		heightExpression: mediumHeight,
+		shape: {
+			kind: "angle",
+			polygon: {
+				startTopPercent: 42,
+				endTopPercent: 8
+			}
+		}
+	},
+	{
+		intent: "angle-edge-steep",
+		optionId: asBoundaryOptionId("break:angle-steep"),
+		family: "angle",
+		variantId: "steep",
+		label: "Steep angle",
+		variantLabel: "Steep",
+		treatment: {
+			kind: "angle-edge",
+			height: "large",
+			slope: "steep",
+			direction: "forward"
+		},
+		size: "large",
+		heightExpression: largeHeight,
+		shape: {
+			kind: "angle",
+			polygon: {
+				startTopPercent: 54,
+				endTopPercent: 0
+			}
+		}
+	}
+]);
+/** CSS `clip-path` value for an angle shape, as `generateLayoutCss` draws it. */
+function anglePolygonCss(polygon) {
+	return `polygon(0 ${polygon.startTopPercent}%, 100% ${polygon.endTopPercent}%, 100% 100%, 0 100%)`;
+}
 //#endregion
 //#region ../theme-core/src/site-styles/sectionTransitions.ts
 function boundaryRuntimeMetrics(family, size, heightExpression) {
@@ -7309,22 +7952,19 @@ function boundaryRuntimeMetrics(family, size, heightExpression) {
 		reserveCss: `calc((${heightExpression}) / 2)`
 	};
 }
-const sectionBoundaryRuntimeMetricsByTransition = {
-	none: null,
-	"soft-fade-short": boundaryRuntimeMetrics("gradient", "medium", "6rem + 2px"),
-	"soft-fade-long": boundaryRuntimeMetrics("gradient", "spacious", "10rem"),
-	"soft-fade-expansive": boundaryRuntimeMetrics("gradient", "expansive", "14rem"),
-	"wave-edge": boundaryRuntimeMetrics("wave", "medium", "6rem + 2px"),
-	"wave-edge-balanced": boundaryRuntimeMetrics("wave", "medium", "6rem + 2px"),
-	"wave-edge-gentle": boundaryRuntimeMetrics("wave", "compact", "4.5rem + 2px"),
-	"wave-edge-bold": boundaryRuntimeMetrics("wave", "large", "7rem + 2px"),
-	"wave-edge-drift": boundaryRuntimeMetrics("wave", "medium", "6rem + 2px"),
-	"angle-edge": boundaryRuntimeMetrics("angle", "medium", "6rem + 2px"),
-	"angle-edge-subtle": boundaryRuntimeMetrics("angle", "compact", "4.5rem + 2px"),
-	"angle-edge-steep": boundaryRuntimeMetrics("angle", "large", "7rem + 2px")
-};
-function boundaryRuntimeMetricsForTransition(transition) {
-	return sectionBoundaryRuntimeMetricsByTransition[transition];
+new Map(transitionCatalogueEntries.map((entry) => [entry.intent, entry]));
+const metricsByIntent = new Map(transitionCatalogueEntries.map((entry) => [entry.intent, boundaryRuntimeMetrics(entry.family, entry.size, entry.heightExpression)]));
+/**
+* The catalogue's compile-time coverage check guarantees an entry per
+* decorative intent, so a miss here is a broken invariant, not bad input.
+*/
+function requireCatalogueValue(values, intent) {
+	const value = values.get(intent);
+	if (value === void 0) throw new Error(`Transition catalogue has no entry for ${intent}`);
+	return value;
+}
+function boundaryRuntimeMetricsForDecorativeTransition(transition) {
+	return requireCatalogueValue(metricsByIntent, transition);
 }
 const noneBoundaryOption = {
 	id: asBoundaryOptionId("break:none"),
@@ -7332,29 +7972,233 @@ const noneBoundaryOption = {
 	transitionAfter: "none",
 	treatment: { kind: "none" }
 };
-const softBoundaryOption = {
-	id: asBoundaryOptionId("break:soft"),
-	label: "Soft",
-	transitionAfter: "soft-fade-short",
-	treatment: {
-		kind: "soft-fade",
-		height: "medium",
-		curve: "soft"
-	}
+const boundaryOptionByIntent = new Map(transitionCatalogueEntries.map((entry) => [entry.intent, {
+	id: entry.optionId,
+	label: entry.label,
+	transitionAfter: entry.intent,
+	treatment: entry.treatment
+}]));
+function boundaryOptionForTransitionIntent(intent) {
+	return requireCatalogueValue(boundaryOptionByIntent, intent);
+}
+const softBoundaryOption = boundaryOptionForTransitionIntent("soft-fade-short");
+const spaciousBoundaryOption = boundaryOptionForTransitionIntent("soft-fade-long");
+boundaryOptionForTransitionIntent("soft-fade-expansive");
+boundaryOptionForTransitionIntent("wave-edge");
+boundaryOptionForTransitionIntent("wave-edge-balanced");
+boundaryOptionForTransitionIntent("wave-edge-gentle");
+boundaryOptionForTransitionIntent("wave-edge-bold");
+boundaryOptionForTransitionIntent("wave-edge-drift");
+boundaryOptionForTransitionIntent("angle-edge-subtle");
+boundaryOptionForTransitionIntent("angle-edge");
+boundaryOptionForTransitionIntent("angle-edge-steep");
+/**
+* Must remain non-empty; downstream code indexes `[0]` as the documented default.
+*/
+const boundaryOptions = [noneBoundaryOption, ...transitionCatalogueEntries.map((entry) => boundaryOptionForTransitionIntent(entry.intent))];
+const noneTransitionVariant = {
+	familyId: "none",
+	variantId: "none",
+	label: "None",
+	boundaryOption: noneBoundaryOption
 };
-const spaciousBoundaryOption = {
-	id: asBoundaryOptionId("break:spacious"),
-	label: "Spacious",
-	transitionAfter: "soft-fade-long",
-	treatment: {
-		kind: "soft-fade",
-		height: "large",
-		curve: "spacious"
+function transitionVariantForEntry(entry) {
+	return {
+		familyId: entry.family,
+		variantId: entry.variantId,
+		label: entry.variantLabel,
+		boundaryOption: boundaryOptionForTransitionIntent(entry.intent)
+	};
+}
+const sectionTransitionFamilies = [{
+	id: "none",
+	label: "None",
+	variants: [noneTransitionVariant]
+}, ...transitionCatalogueFamilies.map((family) => ({
+	id: family.id,
+	label: family.label,
+	variants: requireNonEmptyReadonlyArray(transitionCatalogueEntries.filter((entry) => entry.family === family.id).map(transitionVariantForEntry), `Transition family ${family.id} has no catalogue entries.`)
+}))];
+new Map(boundaryOptions.map((option) => [option.id, option]));
+new Map(boundaryOptions.map((option) => [stableTreatmentKey(option.treatment), option]));
+new Map(sectionTransitionFamilies.flatMap((family) => family.variants.map((variant) => [variant.boundaryOption.id, variant])));
+new Map(sectionTransitionFamilies.map((family) => [family.id, family]));
+function stableTreatmentKey(treatment) {
+	switch (treatment.kind) {
+		case "none": return "none";
+		case "soft-fade": return `${treatment.kind}:${treatment.height}:${treatment.curve}`;
+		case "wave-edge": return [
+			treatment.kind,
+			treatment.height,
+			treatment.amplitude,
+			treatment.rhythm,
+			treatment.symmetry
+		].join(":");
+		case "angle-edge": return [
+			treatment.kind,
+			treatment.height,
+			treatment.slope,
+			treatment.direction
+		].join(":");
+		case "legacy-unsupported": return `${treatment.kind}:${treatment.boundaryOptionId}`;
+	}
+}
+//#endregion
+//#region ../theme-core/src/site-styles/sectionBoundaryComposition.ts
+const backgroundToken = requireThemeColorToken$1("background");
+/**
+* Classifies a section from its final render content. `_sectionStyles`
+* already holds the effective background (Look default, page-design override
+* and block-authored media merged by `resolveSectionBackground`), so this only
+* reads it and never re-decides precedence. A missing or unparseable
+* background is the page background, as it is for the renderer.
+*/
+function boundaryEndpointForSectionContent(content) {
+	const background = parseCanonicalRuntimeBackground(content);
+	if (background.kind === "none") return {
+		kind: "paint",
+		token: backgroundToken
+	};
+	const effective = background.background;
+	switch (effective.type) {
+		case "color": {
+			if (effective.color === null || effective.color === void 0) return {
+				kind: "paint",
+				token: backgroundToken
+			};
+			const token = parseThemeColorToken(effective.color);
+			return token ? {
+				kind: "paint",
+				token
+			} : {
+				kind: "unpainted",
+				reason: "literal-color"
+			};
+		}
+		case "gradient": return {
+			kind: "unpainted",
+			reason: "gradient"
+		};
+		case "image":
+		case "video": return {
+			kind: "unpainted",
+			reason: "media"
+		};
+		default: return assertNever$13(effective, "Unhandled section background type");
+	}
+}
+/**
+* Reads both facts from final render content in one place. `_frameStyles` is
+* the compiled frame; content without one (no page design, an SDK block)
+* draws a plain frame.
+*/
+function sectionFactsForContent(content) {
+	return {
+		endpoint: boundaryEndpointForSectionContent(content),
+		frame: frameKindForContent(content)
+	};
+}
+function frameKindForContent(content) {
+	const frameStyles = content._frameStyles;
+	const kind = typeof frameStyles === "object" && frameStyles !== null && "kind" in frameStyles ? frameStyles.kind : null;
+	return kind === "panel" || kind === "flush-panel" ? kind : "plain";
+}
+/**
+* The frame rule: a flush panel owns the edge it runs to, so no break is
+* drawn next to one. The single home for this rule; the generated
+* pipeline's budget and the site-style lab ask it with their plan frames.
+*/
+function frameNotShownReason(previous, next) {
+	return previous === "flush-panel" || next === "flush-panel" ? "flush-panel" : null;
+}
+/**
+* Decides whether and how a join draws. The frame rule wins before paint is
+* considered; two unpainted sides show nothing.
+*/
+function composeBoundary(previous, next) {
+	const frameReason = frameNotShownReason(previous.frame, next.frame);
+	if (frameReason) return {
+		kind: "not-shown",
+		reason: frameReason
+	};
+	const from = previous.endpoint;
+	const to = next.endpoint;
+	if (from.kind === "paint") return {
+		kind: "shown",
+		composition: to.kind === "paint" ? {
+			kind: "paint-to-paint",
+			from: from.token,
+			to: to.token
+		} : {
+			kind: "paint-to-unpainted",
+			from: from.token
+		}
+	};
+	return to.kind === "paint" ? {
+		kind: "shown",
+		composition: {
+			kind: "unpainted-to-paint",
+			to: to.token
+		}
+	} : {
+		kind: "not-shown",
+		reason: "both-unpainted"
+	};
+}
+/**
+* Placement, reserves and paint for a shown boundary, derived from the
+* composition and the catalogue's metrics for the treatment.
+*/
+function boundaryLayout(intent, composition) {
+	const metrics = boundaryRuntimeMetricsForDecorativeTransition(intent);
+	switch (composition.kind) {
+		case "paint-to-paint": return {
+			placement: "centred",
+			reserves: {
+				before: metrics.reserveCss,
+				after: metrics.reserveCss
+			},
+			paint: {
+				band: composition.from,
+				shape: composition.to
+			}
+		};
+		case "unpainted-to-paint": return {
+			placement: "previous",
+			reserves: {
+				before: metrics.heightCss,
+				after: null
+			},
+			paint: {
+				band: null,
+				shape: composition.to
+			}
+		};
+		case "paint-to-unpainted": return {
+			placement: "next",
+			reserves: {
+				before: null,
+				after: metrics.heightCss
+			},
+			paint: {
+				band: null,
+				shape: composition.from
+			}
+		};
+		default: return assertNever$13(composition, "Unhandled boundary composition");
 	}
+}
+function requireThemeColorToken$1(value) {
+	const token = parseThemeColorToken(value);
+	if (!token) throw new Error(`Expected a theme color token. Received: ${value}`);
+	return token;
+}
+//#endregion
+//#region ../theme-core/src/site-styles/compilationPlan.ts
+const defaultHeaderBrandPreferences = {
+	brandDisplay: "auto",
+	logoSize: "auto"
 };
-asBoundaryOptionId("break:expansive");
-asBoundaryOptionId("break:wave");
-asBoundaryOptionId("break:wave-balanced"), asBoundaryOptionId("break:wave-gentle"), asBoundaryOptionId("break:wave-bold"), asBoundaryOptionId("break:wave-drift"), asBoundaryOptionId("break:angle-subtle"), asBoundaryOptionId("break:angle-balanced"), asBoundaryOptionId("break:angle-steep");
 asBoundaryOptionId("break:unknown");
 const pageDesignUserPinnedAppearanceChoiceSchema = z$1.object({
 	kind: z$1.literal("user-pinned"),
@@ -7481,14 +8325,11 @@ function validateUniquePageDesignPins(intent, ctx) {
 		label: "block Look pin"
 	});
 	addDuplicateStringIssues(ctx, {
-		values: intent.boundaryPins.map((pin) => boundaryKey$1(pin.previousBlockId, pin.nextBlockId)),
+		values: intent.boundaryPins.map((pin) => makeBoundaryId(pin.previousBlockId, pin.nextBlockId)),
 		path: ["boundaryPins"],
 		label: "boundary pin"
 	});
 }
-function boundaryKey$1(previousBlockId, nextBlockId) {
-	return makeBoundaryId(previousBlockId, nextBlockId);
-}
 //#endregion
 //#region ../theme-core/src/buttons/types.ts
 /**
@@ -12748,88 +13589,6 @@ function resolveFooterRenderPlan(params) {
 		};
 	}
 }
-const hotspotSchema = z$1.object({
-	x: z$1.number().min(0).max(1),
-	y: z$1.number().min(0).max(1),
-	radius: z$1.number().optional()
-});
-const rotationSchema = z$1.union([
-	z$1.literal(0),
-	z$1.literal(90),
-	z$1.literal(180),
-	z$1.literal(270)
-]);
-const rectSchema = z$1.tuple([
-	z$1.number(),
-	z$1.number(),
-	z$1.number(),
-	z$1.number()
-]);
-const aspectCropSchema = z$1.object({
-	aspect: z$1.preprocess((value) => value == null ? void 0 : value, z$1.string().optional()),
-	rect: z$1.preprocess((value) => value == null ? void 0 : value, rectSchema.optional()),
-	hotspot: z$1.preprocess((value) => value == null ? void 0 : value, hotspotSchema.optional()),
-	rotation: z$1.preprocess((value) => value == null ? void 0 : value, rotationSchema.optional())
-});
-const transformSchema = z$1.object({
-	aspectCrops: z$1.preprocess((value) => {
-		if (!value || typeof value !== "object" || Array.isArray(value)) return;
-		return value;
-	}, z$1.record(z$1.string(), aspectCropSchema.catch({}))).optional(),
-	rect: rectSchema.optional(),
-	hotspot: hotspotSchema.optional(),
-	rotation: rotationSchema.optional()
-});
-const mediaPosterSchema = z$1.discriminatedUnion("tag", [z$1.object({
-	tag: z$1.literal("storage"),
-	assetId: z$1.string().optional(),
-	storageBucket: z$1.string().min(1),
-	storagePath: z$1.string().min(1)
-}), z$1.object({
-	tag: z$1.literal("external-src"),
-	assetId: z$1.string().optional(),
-	src: z$1.string().url()
-})]);
-const mediaBaseSchema = z$1.object({
-	purpose: z$1.string().optional(),
-	placeholder: z$1.boolean().default(true).optional(),
-	assetId: z$1.string().optional(),
-	identifier: z$1.string().optional(),
-	src: z$1.string().optional(),
-	alt: z$1.string().optional(),
-	filename: z$1.string().optional(),
-	mimeType: z$1.string().optional(),
-	width: z$1.number().optional(),
-	height: z$1.number().optional(),
-	storageBucket: z$1.string().optional(),
-	storagePath: z$1.string().optional(),
-	poster: mediaPosterSchema.optional(),
-	transform: transformSchema.optional()
-});
-const mediaIdentifierSchema = z$1.string().trim().min(1).brand();
-const imageMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("image") });
-const videoMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("video") });
-const audioMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("audio") });
-const documentMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("document") });
-const spreadsheetMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("spreadsheet") });
-const archiveMediaSchema = mediaBaseSchema.extend({ type: z$1.literal("archive") });
-const mediaSchema = z$1.discriminatedUnion("type", [
-	imageMediaSchema,
-	videoMediaSchema,
-	audioMediaSchema,
-	documentMediaSchema,
-	spreadsheetMediaSchema,
-	archiveMediaSchema
-]);
-const persistableMediaBaseSchema = mediaBaseSchema.extend({ identifier: mediaIdentifierSchema });
-z$1.discriminatedUnion("type", [
-	persistableMediaBaseSchema.extend({ type: z$1.literal("image") }),
-	persistableMediaBaseSchema.extend({ type: z$1.literal("video") }),
-	persistableMediaBaseSchema.extend({ type: z$1.literal("audio") }),
-	persistableMediaBaseSchema.extend({ type: z$1.literal("document") }),
-	persistableMediaBaseSchema.extend({ type: z$1.literal("spreadsheet") }),
-	persistableMediaBaseSchema.extend({ type: z$1.literal("archive") })
-]);
 //#endregion
 //#region ../theme-core/src/palette/schema.ts
 const colourHexString = z$1.string().regex(/^#([0-9A-Fa-f]{3}){1,2}$/);
@@ -15385,112 +16144,6 @@ function affordanceIconMaskUrl(iconId) {
 	return `data:image/svg+xml,${`<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'>${paths.map((d) => `<path d='${d}'/>`).join("")}</svg>`.replace(/"/g, "'").replace(/#/g, "%23").replace(/</g, "%3C").replace(/>/g, "%3E").replace(/\s+/g, " ")}`;
 }
 //#endregion
-//#region ../theme-core/src/utils/tokenOrColor.ts
-/**
-* Runtime color-reference fields intentionally accept any string, including
-* the legacy empty-string "no color" sentinel. Semantic validation needs
-* palette context and happens in `parseThemeColorReference`.
-*/
-const tokenOrCssColorValueSchema = z$1.string();
-const CSS_COLOR_FUNCTION_PATTERN = /^(?:rgb|rgba|hsl|hsla|hwb|lab|lch|oklab|oklch|color|color-mix|light-dark)\(/i;
-const CSS_HEX_COLOR_PATTERN = /^#(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i;
-const CSS_COLOR_KEYWORDS = /* @__PURE__ */ new Set([
-	"transparent",
-	"currentcolor",
-	"inherit",
-	"initial",
-	"revert",
-	"revert-layer",
-	"unset"
-]);
-const COMMON_CSS_NAMED_COLORS = /* @__PURE__ */ new Set([
-	"black",
-	"blue",
-	"gray",
-	"green",
-	"grey",
-	"orange",
-	"pink",
-	"purple",
-	"red",
-	"white",
-	"yellow"
-]);
-function isCssColorLiteral(value) {
-	const trimmed = value.trim();
-	if (!trimmed) return false;
-	return CSS_HEX_COLOR_PATTERN.test(trimmed) || CSS_COLOR_FUNCTION_PATTERN.test(trimmed) || /^var\(/i.test(trimmed) || CSS_COLOR_KEYWORDS.has(trimmed.toLowerCase());
-}
-function parseThemeToken(token) {
-	const trimmed = token.trim();
-	const match = trimmed.match(/^(.*?)-(\d{2,3})$/);
-	if (!match) return {
-		role: trimmed,
-		shade: null
-	};
-	const role = match[1] ?? trimmed;
-	const shade = match[2] ? Number(match[2]) : null;
-	return {
-		role,
-		shade: Number.isFinite(shade) ? shade : null
-	};
-}
-function parseContextThemeColorToken(value, context) {
-	const parts = parseColorTokenParts(value);
-	if (parts.kind !== "token") return null;
-	if (!(Boolean(context?.palette?.[value.trim()]) || parts.opacityPercent !== null && Boolean(context?.palette?.[parts.token]))) return null;
-	return value.trim();
-}
-function isTokenShapedTypo(value) {
-	if (COMMON_CSS_NAMED_COLORS.has(value.toLowerCase())) return false;
-	if (!/^[a-zA-Z][a-zA-Z0-9]*(?:-[a-zA-Z0-9]+)*(?:\/[^/]+)?$/.test(value)) return false;
-	return !isCssColorLiteral(value);
-}
-function warnUnknownThemeColorReference(value) {
-	if (typeof process !== "undefined" && process.env.NODE_ENV === "production") return;
-	if (!isTokenShapedTypo(value)) return;
-	console.warn(`[theme-core] Unknown Theme V2 color token "${value}" treated as literal CSS. Use raw:* for deliberate custom CSS values.`);
-}
-function parseThemeColorReference(input, context) {
-	const trimmed = input.trim();
-	if (trimmed.startsWith("raw:")) return {
-		kind: "literal-css",
-		value: trimmed.slice(4)
-	};
-	const contextToken = parseContextThemeColorToken(trimmed, context);
-	if (contextToken) return {
-		kind: "palette-context-token",
-		token: contextToken
-	};
-	const knownToken = parseThemeColorToken(trimmed);
-	if (knownToken) return {
-		kind: "theme-token",
-		token: knownToken
-	};
-	warnUnknownThemeColorReference(trimmed);
-	return {
-		kind: "literal-css",
-		value: trimmed
-	};
-}
-function resolveThemeColorReferenceValue(input, context) {
-	const reference = parseThemeColorReference(input, context);
-	return reference.kind === "literal-css" ? reference.value : rgbColorValue(reference.token);
-}
-function resolveTokenOrCssColorValue(input, context) {
-	return resolveThemeColorReferenceValue(input, context);
-}
-function resolveOnColorForThemeToken(token) {
-	if (!parseThemeColorToken(token)) return null;
-	const parts = parseColorTokenParts(token);
-	if (parts.kind !== "token") return null;
-	const { role, shade } = parseThemeToken(parts.token);
-	const normalizedRole = role.trim();
-	if (!normalizedRole) return null;
-	if (!shade) return rgbColorValue(`on${normalizedRole.charAt(0).toUpperCase() + normalizedRole.slice(1)}`);
-	return shade <= 400 ? "#000000" : "#FFFFFF";
-}
-//#endregion
 //#region ../theme-core/src/buttons/buttonSurfaceContext.ts
 /**
 * Derive only what the rendered section can honestly prove about its backing.
@@ -15892,7 +16545,7 @@ const LETTER_SPACING_MAP = {
 	normal: "0",
 	loose: "0.05em"
 };
-function rule$1(selector, declarations) {
+function rule$2(selector, declarations) {
 	return {
 		selectors: typeof selector === "string" ? [selector] : selector,
 		declarations
@@ -16075,7 +16728,7 @@ function variantAffordanceRule(variant, selector) {
 	const maskUrl = affordanceIconMaskUrl(affordance.iconId);
 	if (!maskUrl) return null;
 	const mask = `url("${maskUrl}") no-repeat center / contain`;
-	return rule$1(`${selector}:not(.${AFFORDANCE_SUPPRESS_CLASS})::after`, [
+	return rule$2(`${selector}:not(.${AFFORDANCE_SUPPRESS_CLASS})::after`, [
 		["content", "\"\""],
 		["display", "inline-block"],
 		["width", "1em"],
@@ -16114,7 +16767,7 @@ function variantBaseRule(variant, selector, global, tokens, theme, colour) {
 		const borderWidth = BORDER_WIDTH_MAP$2[variant.border.widthClass] || "1px";
 		decls.push(["border", `${borderWidth} solid currentColor`]);
 	}
-	return rule$1(selector, decls);
+	return rule$2(selector, decls);
 }
 /**
 * Resolve a colour for a button that does not own its own background.
@@ -16125,13 +16778,13 @@ function variantBaseRule(variant, selector, global, tokens, theme, colour) {
 */
 function variantStateColourRule(variantId, themeId, state, colour) {
 	const baseSelector = `:where([data-theme-scope="${themeId}"]) ${themeButtonSelector(variantId)}`;
-	return rule$1(state === "hover" ? [`${baseSelector}:hover`, `${baseSelector}[data-force-hover="true"]`] : `${baseSelector}:${state}`, resolvedButtonColourDeclarations(colour, {
+	return rule$2(state === "hover" ? [`${baseSelector}:hover`, `${baseSelector}[data-force-hover="true"]`] : `${baseSelector}:${state}`, resolvedButtonColourDeclarations(colour, {
 		role: variantId,
 		state
 	}));
 }
 function variantFocusVisibleRule(variantId, themeId, focusIndicator) {
-	return rule$1(`:where([data-theme-scope="${themeId}"]) ${themeButtonSelector(variantId)}:focus-visible`, resolvedButtonFocusDeclarations(focusIndicator, variantId));
+	return rule$2(`:where([data-theme-scope="${themeId}"]) ${themeButtonSelector(variantId)}:focus-visible`, resolvedButtonFocusDeclarations(focusIndicator, variantId));
 }
 function variantEffectsCss(variant, effects, themeId, tokens, theme) {
 	if (!effects) return "";
@@ -16157,10 +16810,10 @@ function variantDisabledRules(variantId, themeId, colour) {
 		`${base}:focus`
 	];
 	const pseudoSelectors = [`${base}::before`, `${base}::after`];
-	return [rule$1(disabledSelectors, [...resolvedButtonColourDeclarations(colour, {
+	return [rule$2(disabledSelectors, [...resolvedButtonColourDeclarations(colour, {
 		role: variantId,
 		state: "disabled"
-	}), ...RESOLVED_BUTTON_DISABLED_DECLARATIONS]), rule$1(pseudoSelectors, [
+	}), ...RESOLVED_BUTTON_DISABLED_DECLARATIONS]), rule$2(pseudoSelectors, [
 		["opacity", "0"],
 		["animation", "none"],
 		["pointer-events", "none"]
@@ -16175,7 +16828,7 @@ function variantSizeRules(variant, variantId, themeSizes, themeId) {
 		const decls = [];
 		for (const decl of paddingDeclarations(config.padding, borderWidth)) decls.push(decl);
 		if (config.fontSize) decls.push(["font-size", FONT_SIZE_MAP[config.fontSize] || "1rem"]);
-		rules.push(rule$1(selector, decls));
+		rules.push(rule$2(selector, decls));
 	}
 	return rules;
 }
@@ -17076,26 +17729,6 @@ function getComponentShadowVar(elevation) {
 	return `var(--shadow-${elevation})`;
 }
 //#endregion
-//#region ../theme-core/src/site-styles/rawStyleFields.ts
-const themeV2RuntimeStyleFieldNames = [
-	"_frameStyles",
-	"_sectionStyles",
-	"_containerStyles",
-	"_cardStyles",
-	"_transitionStyles",
-	"styleGroup"
-];
-const themeV2BlockSpecificRawStyleFieldNames = [
-	"_contentCardStyles",
-	"_heroLayoutStyles",
-	"_textCardStyles"
-];
-const themeV2NormalEditorRawStyleFieldNames = [...themeV2RuntimeStyleFieldNames, ...themeV2BlockSpecificRawStyleFieldNames];
-new Set(themeV2NormalEditorRawStyleFieldNames);
-[...themeV2RuntimeStyleFieldNames, ...themeV2BlockSpecificRawStyleFieldNames];
-const pageDesignEditorBackgroundOverrideOwner = "page-design-editor";
-const siteChromeBackgroundOverrideOwner = "site-chrome-editor";
-//#endregion
 //#region ../theme-core/src/header/legacyHeaderVariant.ts
 /**
 * The header variants the system actually renders.
@@ -17304,75 +17937,6 @@ const headerContainerSchema = z$1.object({
 	opacity: z$1.number().min(0).max(1).default(.12)
 }).optional();
 //#endregion
-//#region ../theme-core/src/boxBackgroundSchema.ts
-const boxBackgroundOverlaySchema = z$1.preprocess(normalizeAuthoringOpacity, z$1.discriminatedUnion("type", [
-	z$1.object({ type: z$1.literal("none") }),
-	z$1.object({
-		type: z$1.literal("color"),
-		color: tokenOrCssColorValueSchema.nullable().optional(),
-		opacity: z$1.number().min(0).max(1).nullable().optional()
-	}),
-	z$1.object({
-		type: z$1.literal("gradient"),
-		gradient: z$1.string().nullable().optional(),
-		opacity: z$1.number().min(0).max(1).nullable().optional()
-	})
-]));
-const commonSchema = z$1.object({
-	contentOwner: z$1.literal(pageDesignEditorBackgroundOverrideOwner).optional(),
-	textColor: tokenOrCssColorValueSchema.nullable().optional(),
-	headingColor: tokenOrCssColorValueSchema.nullable().optional(),
-	linkColor: tokenOrCssColorValueSchema.nullable().optional(),
-	supportingColor: tokenOrCssColorValueSchema.nullable().optional()
-});
-const mediaPresentationSchema = commonSchema.extend({
-	opacity: z$1.preprocess(normalizeOpacity, z$1.number().min(0).max(1).nullable()).optional(),
-	objectFit: z$1.enum([
-		"fill",
-		"fit",
-		"original",
-		"custom"
-	]).nullable().optional(),
-	scale: z$1.string().nullable().optional(),
-	position: z$1.string().nullable().optional(),
-	motion: z$1.enum(["static", "fixed-frame"]).nullable().optional(),
-	overflow: z$1.boolean().nullable().optional(),
-	overlay: boxBackgroundOverlaySchema.nullable().optional()
-});
-const boxBackgroundSchema = z$1.discriminatedUnion("type", [
-	commonSchema.extend({
-		type: z$1.literal("color"),
-		color: tokenOrCssColorValueSchema.nullable().optional()
-	}),
-	commonSchema.extend({
-		type: z$1.literal("gradient"),
-		gradient: z$1.string().nullable().optional(),
-		gradientPresetId: z$1.string().min(1).nullable().optional()
-	}),
-	mediaPresentationSchema.extend({
-		type: z$1.literal("image"),
-		image: imageMediaSchema.nullable().optional()
-	}),
-	mediaPresentationSchema.extend({
-		type: z$1.literal("video"),
-		image: videoMediaSchema.nullable().optional(),
-		showVideoOnMobile: z$1.boolean().nullable().optional()
-	})
-]);
-function normalizeAuthoringOpacity(value) {
-	if (!isRecord$27(value)) return value;
-	return {
-		...value,
-		opacity: normalizeOpacity(value.opacity)
-	};
-}
-function normalizeOpacity(value) {
-	return typeof value === "number" && value > 1 && value <= 100 ? value / 100 : value;
-}
-function isRecord$27(value) {
-	return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-//#endregion
 //#region ../theme-core/src/schema.ts
 const axesSchema = z$1.object({
 	tone: z$1.enum([
@@ -18133,6 +18697,13 @@ z$1.object({
 	fields: nonEmptyRuntimeStyleFieldNamesSchema,
 	authority: styleAuthoritySchema
 }).strict();
+asPageFlowPresetId("flow:quiet"), noneBoundaryOption.id, asPageFlowPresetId("flow:balanced"), softBoundaryOption.id, asPageFlowPresetId("flow:expressive"), spaciousBoundaryOption.id;
+asPageFlowPresetId("generated-default");
+asSiteStyleId("site-style:south-west-twerk-school");
+asAppearancePresetId("hero-brand-scrim-fixed-frame");
+asLayoutVariantKey("classic");
+asLayoutVariantKey("micro");
+asBoundaryOptionId("break:wave");
 //#endregion
 //#region ../theme-core/src/site-styles/runtimeCompiler.ts
 function defineSectionForegroundRuntimeTokens(input) {
@@ -18156,7 +18727,7 @@ function defineComponentRuntimeRules(rules) {
 }
 /**
 * Default design rules translate semantic page-level choices into the current
-* runtime's section background and transition style-group vocabulary.
+* runtime's section background vocabulary.
 */
 const defaultDesignRuntimeRules = defineDesignRuntimeRules({
 	sectionSurfaces: {
@@ -18191,8 +18762,7 @@ const defaultDesignRuntimeRules = defineDesignRuntimeRules({
 			color: "surface",
 			opacity: .88
 		}
-	},
-	transitionClassName: (transition, fromSurface, toSurface) => transition === "none" ? null : `site-style-transition-${transition}-from-${fromSurface}-to-${toSurface}`
+	}
 });
 /**
 * Default component rules translate frame and item-surface semantics into the
@@ -18246,37 +18816,6 @@ function uniformSectionForeground(token) {
 		supportingColor: token
 	};
 }
-function compileTransitionRuntime(input) {
-	return {
-		treatment: input.treatment,
-		from: input.from,
-		to: input.to,
-		cssVars: {
-			from: input.from.kind === "surface" && input.from.surface === "hero-image" ? "transparent" : transitionEndpointCssValue(input.from),
-			to: transitionEndpointCssValue(input.to)
-		}
-	};
-}
-function transitionEndpointCssValue(endpoint) {
-	switch (endpoint.kind) {
-		case "color-token": return themeColorTokenCssValue(endpoint.token);
-		case "surface": return themeColorTokenCssValue(tokenForTransitionSurface(endpoint.surface));
-		default: return assertNever$13(endpoint);
-	}
-}
-function tokenForTransitionSurface(surface) {
-	switch (surface) {
-		case "base":
-		case "hero-image": return "background";
-		case "muted-band": return "muted";
-		case "accent-band": return "accent";
-		case "brand-depth-band": return "primary-800";
-		default: return assertNever$13(surface);
-	}
-}
-function themeColorTokenCssValue(token) {
-	return `rgb(var(--tb-${token}))`;
-}
 //#endregion
 //#region ../theme-core/src/site-styles/curatedSiteStyles.ts
 const SOFT_EARTH_SITE_STYLE_ID_VALUE = "site-style:soft-earth";
@@ -19961,17 +20500,9 @@ const curatedSiteStylesById = new Map(curatedSiteStyles.map((style) => [style.id
 function getCuratedSiteStyle(id) {
 	return curatedSiteStylesById.get(id) ?? null;
 }
-asPageFlowPresetId("generated-default");
-asSiteStyleId("site-style:south-west-twerk-school");
-asAppearancePresetId("hero-brand-scrim-fixed-frame");
-asLayoutVariantKey("classic");
-asLayoutVariantKey("micro");
-asBoundaryOptionId("break:wave");
-asPageFlowPresetId("flow:quiet"), noneBoundaryOption.id, asPageFlowPresetId("flow:balanced"), softBoundaryOption.id, asPageFlowPresetId("flow:expressive"), spaciousBoundaryOption.id;
 const blockDesignFallback = {
 	sectionSurface: "base",
 	contentFrame: plainFrame,
-	transitionAfter: "none",
 	sectionHeight: "default",
 	heroLegibility: "none",
 	imageSurfaceTreatment: { kind: "none" },
@@ -19982,7 +20513,7 @@ const blockDesignFallback = {
 	accordionIconTreatment: null,
 	composition: null
 };
-blockDesignFallback.sectionSurface, blockDesignFallback.contentFrame, blockDesignFallback.transitionAfter, blockDesignFallback.sectionHeight, blockDesignFallback.heroLegibility, blockDesignFallback.imageSurfaceTreatment, blockDesignFallback.imageSurfaceMotion, blockDesignFallback.tileTreatment, blockDesignFallback.eventListTreatment, blockDesignFallback.eyebrowTreatment, blockDesignFallback.accordionIconTreatment, blockDesignFallback.composition;
+blockDesignFallback.sectionSurface, blockDesignFallback.contentFrame, blockDesignFallback.sectionHeight, blockDesignFallback.heroLegibility, blockDesignFallback.imageSurfaceTreatment, blockDesignFallback.imageSurfaceMotion, blockDesignFallback.tileTreatment, blockDesignFallback.eventListTreatment, blockDesignFallback.eyebrowTreatment, blockDesignFallback.accordionIconTreatment, blockDesignFallback.composition;
 //#endregion
 //#region ../theme-core/src/site-styles/siteChromeBackgrounds.ts
 const siteChromeBackgroundColorTokens = toSiteChromeBackgroundColorTokens(backgroundAppearanceColorTokenNames);
@@ -20090,35 +20621,6 @@ function jsonEquals(left, right) {
 	return true;
 }
 defaultHeaderBrandPreferences.brandDisplay, defaultHeaderBrandPreferences.logoSize, defaultHeaderNavPreferences.typography, defaultHeaderNavPreferences.fontSize, defaultHeaderNavPreferences.interactionPalette;
-function retargetCompiledBoundaryRuntimeForContentAdjacency(boundary, adjacency) {
-	const fromSurface = contentOwnedBackgroundEndpoint(adjacency.currentContent) ?? boundary.from;
-	const toSurface = contentOwnedBackgroundEndpoint(adjacency.nextContent) ?? boundary.to;
-	if (fromSurface === boundary.from && toSurface === boundary.to) return boundary;
-	const transition = compileTransitionRuntime({
-		treatment: boundary.treatment,
-		from: fromSurface,
-		to: toSurface
-	});
-	return {
-		...boundary,
-		from: transition.from,
-		to: transition.to,
-		cssVars: transition.cssVars
-	};
-}
-function contentOwnedBackgroundEndpoint(content) {
-	const background = readRecord(readRecord(content?._sectionStyles)?.background);
-	if (background?.contentOwner !== "page-design-editor" || background.type !== "color") return null;
-	const token = parseThemeColorToken(background.color);
-	if (!token) return null;
-	return {
-		kind: "color-token",
-		token
-	};
-}
-function readRecord(value) {
-	return typeof value === "object" && value !== null && !Array.isArray(value) ? value : null;
-}
 //#endregion
 //#region ../theme-core/src/site-styles/generatedSchemas.ts
 function uniqueNonEmpty(values) {
@@ -23838,7 +24340,7 @@ const teamMemberFragment = defineFragment({
 //#region ../blocks/src/system/data/linkedContentEntries.ts
 const LINKED_CONTENT_ENTRY_META_KEY = "__rbLinkedContentEntry";
 function coerceLinkedContentEntriesPayload(payload) {
-	if (!isRecord$25(payload)) return payload;
+	if (!isRecord$26(payload)) return payload;
 	const response = payload;
 	if (!Array.isArray(response.entries)) return payload;
 	const contentType = parsePublicContentTypeMeta(response.contentType);
@@ -23846,16 +24348,16 @@ function coerceLinkedContentEntriesPayload(payload) {
 	return response.entries.map((entry) => enrichLinkedContentEntry(entry, contentType));
 }
 function getLinkedContentEntryMeta(value) {
-	if (!isRecord$25(value)) return null;
+	if (!isRecord$26(value)) return null;
 	const candidate = value[LINKED_CONTENT_ENTRY_META_KEY];
 	return isLinkedContentEntryMeta(candidate) ? candidate : null;
 }
 function buildLinkedContentEditTarget(input) {
 	const { entry, sourceBlockId, sourceBlockKind, itemIndex } = input;
-	if (!isRecord$25(entry)) return null;
+	if (!isRecord$26(entry)) return null;
 	const meta = getLinkedContentEntryMeta(entry);
 	if (!meta || meta.support.kind !== "supported") return null;
-	const content = isRecord$25(entry.content) ? entry.content : {};
+	const content = isRecord$26(entry.content) ? entry.content : {};
 	return {
 		kind: "linked-content-entry",
 		entryId: meta.entryId,
@@ -23919,12 +24421,12 @@ function resolveLinkedEntryInlineFieldEligibility(input) {
 	};
 }
 function enrichLinkedContentEntry(entry, contentType) {
-	if (!isRecord$25(entry)) return entry;
+	if (!isRecord$26(entry)) return entry;
 	const entryId = typeof entry.id === "string" ? entry.id : null;
 	if (!entryId) return entry;
 	const title = typeof entry.title === "string" && entry.title.trim().length > 0 ? entry.title : entryId;
 	const optimisticHash = typeof entry.optimisticHash === "string" && entry.optimisticHash.length > 0 ? entry.optimisticHash : null;
-	const content = isRecord$25(entry.content) ? entry.content : {};
+	const content = isRecord$26(entry.content) ? entry.content : {};
 	const meta = {
 		kind: "linked-content-entry",
 		entryId,
@@ -24020,7 +24522,7 @@ function capitalize(value) {
 	return value.charAt(0).toUpperCase() + value.slice(1).toLowerCase();
 }
 function parsePublicContentTypeMeta(value) {
-	if (!isRecord$25(value)) return null;
+	if (!isRecord$26(value)) return null;
 	if (typeof value.key !== "string" || value.key.trim().length === 0) return null;
 	return {
 		key: value.key,
@@ -24030,7 +24532,7 @@ function parsePublicContentTypeMeta(value) {
 	};
 }
 function parsePublicContentTypeLinkedEntryEditing(value) {
-	if (!isRecord$25(value) || typeof value.kind !== "string") return null;
+	if (!isRecord$26(value) || typeof value.kind !== "string") return null;
 	switch (value.kind) {
 		case "generic": return { kind: "generic" };
 		case "unsupported-domain-backed": return {
@@ -24041,7 +24543,7 @@ function parsePublicContentTypeLinkedEntryEditing(value) {
 	}
 }
 function parsePublicContentTypeFieldMeta(value) {
-	if (!isRecord$25(value)) return [];
+	if (!isRecord$26(value)) return [];
 	if (typeof value.id !== "string" || typeof value.type !== "string") return [];
 	return [{
 		id: value.id,
@@ -24056,14 +24558,14 @@ function parseStringArray(value) {
 	return value.filter((item) => typeof item === "string");
 }
 function isLinkedContentEntryMeta(value) {
-	if (!isRecord$25(value)) return false;
+	if (!isRecord$26(value)) return false;
 	if (value.kind !== "linked-content-entry") return false;
 	if (typeof value.entryId !== "string") return false;
 	if (typeof value.contentTypeKey !== "string") return false;
 	if (typeof value.contentTypeLabel !== "string") return false;
 	if (typeof value.title !== "string") return false;
 	if (!(value.optimisticHash === null || typeof value.optimisticHash === "string")) return false;
-	if (!isRecord$25(value.contentType)) return false;
+	if (!isRecord$26(value.contentType)) return false;
 	if (!isLinkedEntryFieldSourceArray(value.fieldSources)) return false;
 	return isLinkedContentEditSupport(value.support);
 }
@@ -24071,7 +24573,7 @@ function isLinkedEntryFieldSourceArray(value) {
 	return Array.isArray(value) && value.every(isLinkedEntryFieldSource);
 }
 function isLinkedEntryFieldSource(value) {
-	if (!isRecord$25(value)) return false;
+	if (!isRecord$26(value)) return false;
 	if (typeof value.displayPath !== "string") return false;
 	switch (value.kind) {
 		case "content-field": return typeof value.fieldPath === "string" && (value.fieldType === "text" || value.fieldType === "richText");
@@ -24092,7 +24594,7 @@ function isLinkedEntryInlineFieldReadOnlyReason(value) {
 	}
 }
 function isLinkedContentEditSupport(value) {
-	if (!isRecord$25(value) || typeof value.kind !== "string") return false;
+	if (!isRecord$26(value) || typeof value.kind !== "string") return false;
 	switch (value.kind) {
 		case "supported": return true;
 		case "unsupported-domain-backed":
@@ -24101,7 +24603,7 @@ function isLinkedContentEditSupport(value) {
 		default: return false;
 	}
 }
-function isRecord$25(value) {
+function isRecord$26(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 const inlineTextMarkSchema = z$1.discriminatedUnion("kind", [
@@ -27034,7 +27536,7 @@ function resolveRouteHrefForStage(routeIdValue, routes, stageInput) {
 /**
 * Strict record guard: excludes null, primitives, and arrays.
 */
-function isRecord$24(value) {
+function isRecord$25(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 /**
@@ -27158,16 +27660,16 @@ const interpolateRichTextTokensOptionsSchema = z$1.object({ tokens: z$1.array(su
 const richTextTokenPattern = /\{\{\s*([a-zA-Z0-9_]+)\s*\}\}/g;
 function getSiteName(context) {
 	const viewModel = context.viewModel;
-	if (!isRecord$24(viewModel)) return null;
+	if (!isRecord$25(viewModel)) return null;
 	const site = viewModel.site;
-	if (isRecord$24(site) && typeof site.title === "string") {
+	if (isRecord$25(site) && typeof site.title === "string") {
 		const title = site.title.trim();
 		return title.length > 0 ? title : null;
 	}
 	const root = viewModel.$root;
-	if (isRecord$24(root)) {
+	if (isRecord$25(root)) {
 		const rootSite = root.site;
-		if (isRecord$24(rootSite) && typeof rootSite.title === "string") {
+		if (isRecord$25(rootSite) && typeof rootSite.title === "string") {
 			const title = rootSite.title.trim();
 			if (title.length > 0) return title;
 		}
@@ -27189,7 +27691,7 @@ function replaceTokenText(input, allowedTokens, tokenValues) {
 	});
 }
 function visitRichTextNode(node, allowedTokens, tokenValues) {
-	if (!isRecord$24(node)) return node;
+	if (!isRecord$25(node)) return node;
 	let changed = false;
 	const nextNode = { ...node };
 	if (nextNode.type === "text" && typeof nextNode.text === "string") {
@@ -27210,7 +27712,7 @@ function visitRichTextNode(node, allowedTokens, tokenValues) {
 	return changed ? nextNode : node;
 }
 function interpolateRichTextTokens(value, options, context) {
-	if (!isRecord$24(value)) return value;
+	if (!isRecord$25(value)) return value;
 	return visitRichTextNode(value, new Set(options.tokens), {
 		year: String((/* @__PURE__ */ new Date()).getFullYear()),
 		site_name: getSiteName(context)
@@ -28694,11 +29196,11 @@ var UnsafePathSegmentError = class extends Error {
 function assertSafePathSegments(segments) {
 	for (const segment of segments) if (typeof segment === "string" && UNSAFE_PATH_SEGMENTS.has(segment)) throw new UnsafePathSegmentError(segment);
 }
-function isRecord$23(value) {
+function isRecord$24(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function isPathContainer(value) {
-	return Array.isArray(value) || isRecord$23(value);
+	return Array.isArray(value) || isRecord$24(value);
 }
 function getContainerValue(container, segment) {
 	if (typeof segment === "number") return Array.isArray(container) ? container[segment] : void 0;
@@ -30451,7 +30953,7 @@ function parseSiteIconStyleGuideVersionId(value) {
 //#endregion
 //#region ../blocks/src/system/icons/value.ts
 const NO_BLOCK_ICON_VALUE = { kind: "none" };
-function isRecord$22(value) {
+function isRecord$23(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function parseBlockIconValue(value) {
@@ -30459,7 +30961,7 @@ function parseBlockIconValue(value) {
 		kind: "semantic",
 		iconId: value
 	};
-	if (!isRecord$22(value)) return NO_BLOCK_ICON_VALUE;
+	if (!isRecord$23(value)) return NO_BLOCK_ICON_VALUE;
 	switch (value.kind) {
 		case "none": return NO_BLOCK_ICON_VALUE;
 		case "semantic": return isSemanticIconId(value.iconId) ? {
@@ -30532,7 +31034,7 @@ function buildGeneratedBlockIconRenderAssetLookupFromUnknown(value) {
 	if (!Array.isArray(value)) return { kind: "invalid_asset_list" };
 	const inputs = [];
 	for (const [index, item] of value.entries()) {
-		if (!isRecord$22(item)) return {
+		if (!isRecord$23(item)) return {
 			kind: "invalid_asset_entry",
 			index,
 			reason: "not_object"
@@ -30649,11 +31151,11 @@ function resolveFeatureCardGeneratedIconSizePx(value) {
 	const parsed = parseFeatureCardGeneratedIconSizePx(value);
 	return parsed.ok ? parsed.value : unsafeAsFeatureCardGeneratedIconSizePx(FEATURE_CARD_GENERATED_ICON_SIZE_PX.default);
 }
-function isRecord$21(value) {
+function isRecord$22(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function toPlainTextFromTipTap(value) {
-	if (!isRecord$21(value)) return "";
+	if (!isRecord$22(value)) return "";
 	if (typeof value.text === "string") return value.text;
 	const content = value.content;
 	if (!Array.isArray(content)) return "";
@@ -31618,18 +32120,43 @@ const publicAppointmentServiceSchema = z$1.object({
 	pricing: publicPricingSchema.optional(),
 	priceAmount: z$1.number().nullable(),
 	priceCurrency: z$1.string().nullable(),
-	location: publicLocationSchema
+	location: publicLocationSchema,
+	categoryId: z$1.string().nullable().optional().transform((value) => value ?? null)
+});
+const publicServiceCategorySchema = z$1.object({
+	id: z$1.string().min(1),
+	name: z$1.string(),
+	description: z$1.string().nullable().optional().transform((value) => value ?? null)
 });
-const publicAppointmentServicesSchema = z$1.array(publicAppointmentServiceSchema);
+/**
+* The loader hands over the catalogue `{ services, categories }` (issue 1403).
+* A bare services array is still accepted and read as a site with no
+* categories, so callers from before categories keep the flat list.
+*/
+const publicAppointmentServicesSchema = z$1.union([z$1.array(publicAppointmentServiceSchema).transform((services) => ({
+	services,
+	categories: []
+})), z$1.object({
+	services: z$1.array(publicAppointmentServiceSchema),
+	categories: z$1.array(publicServiceCategorySchema)
+})]);
 const EMPTY_MESSAGE = "No appointments are available right now.";
 const ERROR_MESSAGE = "Appointments are temporarily unavailable. Please try again shortly.";
+const OTHER_GROUP_KEY = "other";
+const OTHER_GROUP_HEADING = "Other";
 function parseServices(value) {
 	const result = publicAppointmentServicesSchema.safeParse(value);
 	return result.success ? {
 		kind: "valid",
-		services: result.data
+		services: result.data.services,
+		categories: result.data.categories
 	} : { kind: "invalid" };
 }
+function readCategoryFilter(value) {
+	if (typeof value !== "string") return null;
+	const trimmed = value.trim();
+	return trimmed.length > 0 ? trimmed : null;
+}
 function formatAppointmentDuration(durationMinutes) {
 	return `${durationMinutes} min`;
 }
@@ -31703,8 +32230,44 @@ function buildRows(services, pathname, servicePathPrefix) {
 		detailsHref: servicePathPrefix && service.slug ? `${servicePathPrefix.replace(/\/$/, "")}/${encodeURIComponent(service.slug)}` : null
 	}));
 }
+const EMPTY_VIEW = {
+	kind: "empty",
+	message: EMPTY_MESSAGE
+};
+function categoryGroup(category, services, toRows) {
+	return {
+		key: category.id,
+		heading: category.name,
+		intro: category.description,
+		rows: toRows(services)
+	};
+}
+function viewFromLayout(layout, toRows) {
+	switch (layout.kind) {
+		case "uncategorized-site": return layout.services.length === 0 ? EMPTY_VIEW : {
+			kind: "items",
+			rows: toRows(layout.services)
+		};
+		case "categorized-site": {
+			const groups = layout.groups.map((group) => categoryGroup(group.category, group.services, toRows));
+			const other = layout.other.length === 0 ? [] : [{
+				key: OTHER_GROUP_KEY,
+				heading: OTHER_GROUP_HEADING,
+				intro: null,
+				rows: toRows(layout.other)
+			}];
+			const allGroups = [...groups, ...other];
+			return allGroups.length === 0 ? EMPTY_VIEW : {
+				kind: "groups",
+				groups: allGroups
+			};
+		}
+		default: return assertNever$21(layout);
+	}
+}
 function buildAppointmentServicesView(input) {
-	if (!input.pathname) return {
+	const pathname = input.pathname;
+	if (!pathname) return {
 		kind: "error",
 		message: ERROR_MESSAGE
 	};
@@ -31713,76 +32276,128 @@ function buildAppointmentServicesView(input) {
 		kind: "error",
 		message: ERROR_MESSAGE
 	};
-	if (parsed.services.length === 0) return {
-		kind: "empty",
-		message: EMPTY_MESSAGE
-	};
-	return {
-		kind: "items",
-		rows: buildRows(parsed.services, input.pathname, input.servicePathPrefix ?? null)
-	};
+	const toRows = (services) => buildRows(services, pathname, input.servicePathPrefix ?? null);
+	const view = selectCategoryView(parsed.categories, parsed.services, readCategoryFilter(input.categoryId));
+	switch (view.kind) {
+		case "single": return view.group.services.length === 0 ? EMPTY_VIEW : {
+			kind: "groups",
+			groups: [categoryGroup(view.group.category, view.group.services, toRows)]
+		};
+		case "all":
+		case "fallback-all": return viewFromLayout(view.layout, toRows);
+		default: return assertNever$21(view);
+	}
 }
-function AppointmentServicesNode({ sectionHeading, services, pathname, servicePathPrefix, className }) {
+function AppointmentServiceRows({ rows, RowTitle }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "appointment-services-rows rb-flex rb-flex-col",
+		children: rows.map((row) => /* @__PURE__ */ jsxs("article", {
+			className: "appointment-services-row rb-border-b rb-border-border rb-py-4",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "appointment-services-row-main rb-min-w-0",
+					children: [
+						/* @__PURE__ */ jsx(RowTitle, {
+							className: "appointment-services-row-title rb-text-lg rb-font-medium rb-leading-tight",
+							children: row.detailsHref ? /* @__PURE__ */ jsx("a", {
+								href: row.detailsHref,
+								children: row.title
+							}) : row.title
+						}),
+						row.description ? /* @__PURE__ */ jsx("p", {
+							className: "appointment-services-row-description rb-text-sm rb-leading-6 status-muted",
+							children: row.description
+						}) : null,
+						/* @__PURE__ */ jsxs("p", {
+							className: "appointment-services-row-meta rb-caption status-muted",
+							children: [row.durationLabel, row.locationLabel ? ` · ${row.locationLabel}` : ""]
+						})
+					]
+				}),
+				row.priceLabel ? /* @__PURE__ */ jsx("span", {
+					className: "appointment-services-row-price rb-text-lg",
+					children: row.priceLabel
+				}) : null,
+				/* @__PURE__ */ jsx(ThemedButtonLink, {
+					variant: "secondary",
+					size: "sm",
+					extraClassName: "appointment-services-row-action",
+					href: row.href,
+					label: "Check times",
+					screenReaderSuffix: ` for ${row.title}`
+				})
+			]
+		}, row.id))
+	});
+}
+function AppointmentServiceGroups({ groups, hasSectionHeading, idPrefix }) {
+	const GroupHeading = hasSectionHeading ? "h3" : "h2";
+	const RowTitle = hasSectionHeading ? "h4" : "h3";
+	return /* @__PURE__ */ jsx("div", {
+		className: "appointment-services-groups rb-flex rb-flex-col rb-gap-10",
+		children: groups.map((group) => {
+			const headingId = `${idPrefix}-group-${group.key}`;
+			return /* @__PURE__ */ jsxs("section", {
+				className: "appointment-services-group rb-flex rb-flex-col rb-gap-2",
+				"aria-labelledby": headingId,
+				"data-appointment-services-group": group.key,
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "appointment-services-group-heading",
+					children: [/* @__PURE__ */ jsx(GroupHeading, {
+						id: headingId,
+						className: "appointment-services-group-title rb-text-sm rb-font-semibold rb-uppercase rb-tracking-wide",
+						children: group.heading
+					}), group.intro ? /* @__PURE__ */ jsx("p", {
+						className: "appointment-services-group-intro rb-text-sm rb-leading-6 rb-max-w-prose status-muted",
+						children: group.intro
+					}) : null]
+				}), /* @__PURE__ */ jsx(AppointmentServiceRows, {
+					rows: group.rows,
+					RowTitle
+				})]
+			}, group.key);
+		})
+	});
+}
+function AppointmentServicesNode({ sectionHeading, categoryId, services, pathname, servicePathPrefix, blockId, className }) {
 	const view = buildAppointmentServicesView({
 		services,
+		categoryId,
 		pathname: typeof pathname === "string" ? pathname : void 0,
 		servicePathPrefix: typeof servicePathPrefix === "string" ? servicePathPrefix : null
 	});
 	const rootClassName = `appointment-services ${className ?? ""}`.trim();
-	const RowTitle = sectionHeading ? "h3" : "h2";
-	if (view.kind === "error" || view.kind === "empty") return /* @__PURE__ */ jsx("div", {
-		className: rootClassName,
-		"data-appointment-services-state": view.kind,
-		children: /* @__PURE__ */ jsx("p", {
-			className: "rb-caption status-muted",
-			role: "status",
-			children: view.message
-		})
-	});
-	return /* @__PURE__ */ jsx("div", {
-		className: `${rootClassName} rb-flex rb-flex-col`,
-		"data-appointment-services-state": "populated",
-		children: /* @__PURE__ */ jsx("div", {
-			className: "appointment-services-rows rb-flex rb-flex-col",
-			children: view.rows.map((row) => /* @__PURE__ */ jsxs("article", {
-				className: "appointment-services-row rb-border-b rb-border-border rb-py-4",
-				children: [
-					/* @__PURE__ */ jsxs("div", {
-						className: "appointment-services-row-main rb-min-w-0",
-						children: [
-							/* @__PURE__ */ jsx(RowTitle, {
-								className: "appointment-services-row-title rb-text-lg rb-font-medium rb-leading-tight",
-								children: row.detailsHref ? /* @__PURE__ */ jsx("a", {
-									href: row.detailsHref,
-									children: row.title
-								}) : row.title
-							}),
-							row.description ? /* @__PURE__ */ jsx("p", {
-								className: "appointment-services-row-description rb-text-sm rb-leading-6 status-muted",
-								children: row.description
-							}) : null,
-							/* @__PURE__ */ jsxs("p", {
-								className: "appointment-services-row-meta rb-caption status-muted",
-								children: [row.durationLabel, row.locationLabel ? ` · ${row.locationLabel}` : ""]
-							})
-						]
-					}),
-					row.priceLabel ? /* @__PURE__ */ jsx("span", {
-						className: "appointment-services-row-price rb-text-lg",
-						children: row.priceLabel
-					}) : null,
-					/* @__PURE__ */ jsx(ThemedButtonLink, {
-						variant: "secondary",
-						size: "sm",
-						extraClassName: "appointment-services-row-action",
-						href: row.href,
-						label: "Check times",
-						screenReaderSuffix: ` for ${row.title}`
-					})
-				]
-			}, row.id))
-		})
-	});
+	const hasSectionHeading = Boolean(sectionHeading);
+	switch (view.kind) {
+		case "error":
+		case "empty": return /* @__PURE__ */ jsx("div", {
+			className: rootClassName,
+			"data-appointment-services-state": view.kind,
+			children: /* @__PURE__ */ jsx("p", {
+				className: "rb-caption status-muted",
+				role: "status",
+				children: view.message
+			})
+		});
+		case "items": return /* @__PURE__ */ jsx("div", {
+			className: `${rootClassName} rb-flex rb-flex-col`,
+			"data-appointment-services-state": "populated",
+			children: /* @__PURE__ */ jsx(AppointmentServiceRows, {
+				rows: view.rows,
+				RowTitle: hasSectionHeading ? "h3" : "h2"
+			})
+		});
+		case "groups": return /* @__PURE__ */ jsx("div", {
+			className: `${rootClassName} rb-flex rb-flex-col`,
+			"data-appointment-services-state": "populated",
+			children: /* @__PURE__ */ jsx(AppointmentServiceGroups, {
+				groups: view.groups,
+				hasSectionHeading,
+				idPrefix: `appointment-services-${blockId ?? "block"}`
+			})
+		});
+		default: return assertNever$21(view);
+	}
 }
 //#endregion
 //#region ../blocks/src/contracts/runtime.ts
@@ -31837,7 +32452,7 @@ function buildInteractiveIslandProps(options) {
 		render
 	};
 }
-function isRecord$19(value) {
+function isRecord$20(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 function deepEqualJsonValue(left, right) {
@@ -31847,8 +32462,8 @@ function deepEqualJsonValue(left, right) {
 		if (left.length !== right.length) return false;
 		return left.every((item, index) => deepEqualJsonValue(item, right[index]));
 	}
-	if (isRecord$19(left) || isRecord$19(right)) {
-		if (!isRecord$19(left) || !isRecord$19(right)) return false;
+	if (isRecord$20(left) || isRecord$20(right)) {
+		if (!isRecord$20(left) || !isRecord$20(right)) return false;
 		const leftKeys = Object.keys(left).sort();
 		if (!deepEqualJsonValue(leftKeys, Object.keys(right).sort())) return false;
 		return leftKeys.every((key) => deepEqualJsonValue(left[key], right[key]));
@@ -31862,12 +32477,12 @@ function toTrimmedString(value) {
 	return trimmed ? trimmed : void 0;
 }
 function normalizeBookingFormConfig(form) {
-	if (!isRecord$18(form)) return null;
+	if (!isRecord$19(form)) return null;
 	const id = readNonEmptyString(form.id);
 	const name = readNonEmptyString(form.name);
 	if (!id || !name) return null;
-	const schemaSource = isRecord$18(form.schema) ? form.schema : isRecord$18(form.schemaJson) ? form.schemaJson : null;
-	const settingsSource = isRecord$18(form.settings) ? form.settings : isRecord$18(form.settingsJson) ? form.settingsJson : null;
+	const schemaSource = isRecord$19(form.schema) ? form.schema : isRecord$19(form.schemaJson) ? form.schemaJson : null;
+	const settingsSource = isRecord$19(form.settings) ? form.settings : isRecord$19(form.settingsJson) ? form.settingsJson : null;
 	return {
 		id,
 		name,
@@ -31887,8 +32502,8 @@ function normalizeBookingServices(services) {
 	};
 	if (!services) return [];
 	if (Array.isArray(services)) return services.filter(isBookingFormService).map(normalizeService);
-	if (isRecord$18(services) && "services" in services) return Array.isArray(services.services) ? services.services.filter(isBookingFormService).map(normalizeService) : [];
-	return isRecord$18(services) ? Object.values(services).filter(isBookingFormService).map(normalizeService) : [];
+	if (isRecord$19(services) && "services" in services) return Array.isArray(services.services) ? services.services.filter(isBookingFormService).map(normalizeService) : [];
+	return isRecord$19(services) ? Object.values(services).filter(isBookingFormService).map(normalizeService) : [];
 }
 function normalizeBookingSchema(value) {
 	if (!value) return void 0;
@@ -31899,7 +32514,7 @@ function normalizeBookingSchema(value) {
 	};
 }
 function readBookingFormField(value) {
-	if (!isRecord$18(value)) return null;
+	if (!isRecord$19(value)) return null;
 	const id = readNonEmptyString(value.id);
 	const label = readNonEmptyString(value.label);
 	const type = readBookingFieldType(value.type);
@@ -31942,7 +32557,7 @@ function readBookingFieldOptions(value) {
 	return options.length > 0 ? options : void 0;
 }
 function readBookingFieldOption(value) {
-	if (!isRecord$18(value)) return null;
+	if (!isRecord$19(value)) return null;
 	const optionValue = readNonEmptyString(value.value);
 	const label = readNonEmptyString(value.label);
 	return optionValue && label ? {
@@ -31962,7 +32577,7 @@ function normalizeBookingSettings(value) {
 	};
 }
 function isBookingFormService(value) {
-	return isRecord$18(value) && typeof value.id === "string" && typeof value.siteId === "string" && typeof value.title === "string" && (value.consent === void 0 || blockBookingConsentSchema.safeParse(value.consent).success);
+	return isRecord$19(value) && typeof value.id === "string" && typeof value.siteId === "string" && typeof value.title === "string" && (value.consent === void 0 || blockBookingConsentSchema.safeParse(value.consent).success);
 }
 function readNonEmptyString(value) {
 	if (typeof value !== "string") return null;
@@ -31980,9 +32595,34 @@ function readStringArray(value) {
 	const strings = value.filter((item) => typeof item === "string");
 	return strings.length > 0 ? strings : void 0;
 }
-function isRecord$18(value) {
+function isRecord$19(value) {
 	return typeof value === "object" && value !== null;
 }
+//#endregion
+//#region ../blocks/src/system/runtime/nodes/booking-form.service-categories.ts
+function isRecord$18(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function readCategory(value) {
+	if (!isRecord$18(value)) return [];
+	const { id, name, description } = value;
+	if (typeof id !== "string" || id.trim() === "" || typeof name !== "string") return [];
+	return [{
+		id,
+		name,
+		description: typeof description === "string" ? description : null
+	}];
+}
+/**
+* The ordered service categories carried by a catalogue-shaped services
+* source (`{ services, categories }`). Every other shape has none, which
+* reads as a site without categories. Order is preserved: the database owns
+* it.
+*/
+function normalizeBookingServiceCategories(services) {
+	if (!isRecord$18(services) || !Array.isArray(services.categories)) return [];
+	return services.categories.flatMap(readCategory);
+}
 const bookingFieldOptionSchema = z$1.object({
 	value: z$1.string(),
 	label: z$1.string()
@@ -32059,11 +32699,20 @@ const bookingServiceSchema = z$1.object({
 	priceCurrency: z$1.string().nullable().optional(),
 	paymentTerms: blockBookingPaymentTermsSchema.optional(),
 	paymentTermsAvailability: blockBookingPaymentTermsAvailabilitySchema.optional(),
-	consent: blockBookingConsentSchema.optional()
+	consent: blockBookingConsentSchema.optional(),
+	categoryId: z$1.string().nullable().optional()
+});
+const bookingServiceCategorySchema = z$1.object({
+	id: z$1.string(),
+	name: z$1.string(),
+	description: z$1.string().nullable()
 });
 const bookingServicesSourceSchema = z$1.union([
 	z$1.array(bookingServiceSchema),
-	z$1.object({ services: z$1.array(bookingServiceSchema).optional() }),
+	z$1.object({
+		services: z$1.array(bookingServiceSchema).optional(),
+		categories: z$1.array(bookingServiceCategorySchema).optional()
+	}),
 	z$1.record(z$1.string(), bookingServiceSchema)
 ]);
 const bookingConfigSchema = z$1.object({
@@ -32116,6 +32765,7 @@ const bookingHydrationSchema = z$1.object({
 	rebookContext: z$1.object({ kind: z$1.literal("portal_rebook") }).nullable().optional(),
 	form: bookingConfigSchema.nullable(),
 	services: z$1.array(bookingServiceSchema),
+	serviceCategories: z$1.array(bookingServiceCategorySchema).optional(),
 	spamProtectionEnabled: z$1.boolean().optional()
 });
 const bookingRenderSchema = z$1.object({
@@ -32160,6 +32810,7 @@ const bookingFormBlockRuntime = defineClientOwnedBlockRuntime({
 				rebookContext: source.rebookContext ?? null,
 				form,
 				services,
+				serviceCategories: normalizeBookingServiceCategories(source.services),
 				spamProtectionEnabled: source.spamProtectionEnabled
 			}
 		};
@@ -46532,6 +47183,123 @@ function generateFooterBottomTextLinkStyles(footer, themeId, tokens) {
 	return cssChunks.join("\n");
 }
 //#endregion
+//#region ../theme-core/src/layout/boundaryCss.ts
+/**
+* Section-break CSS, generated from the transition catalogue (issue 1422).
+*
+* The renderer emits one element per shown join:
+*
+*   <div data-block-boundary data-boundary-treatment="wave-edge-gentle"
+*        data-boundary-placement="previous"
+*        style="--boundary-shape-paint: …; --boundary-band-paint: …">
+*
+* Every selector matches an exact attribute value, so there is no reliance on
+* prefix ordering in the cascade and nothing reads colours out of a string.
+* The shape layer is `::after`; the band layer (paint → paint only) is
+* `::before`.
+*/
+const waveMaskSvgPaths = {
+	classic: "M0 72V46C130 55 260 24 420 30C590 36 690 62 860 42C1035 21 1160 47 1305 36C1365 31 1415 33 1440 38V72H0Z",
+	balanced: "M0 72V42C120 24 240 24 360 42C480 60 600 60 720 42C840 24 960 24 1080 42C1200 60 1320 60 1440 42V72H0Z",
+	gentle: "M0 72V43C180 32 300 32 480 43C660 54 780 54 960 43C1140 32 1260 32 1440 43V72H0Z",
+	bold: "M0 72V44C90 14 270 14 360 44C450 74 630 74 720 44C810 14 990 14 1080 44C1170 74 1350 74 1440 44V72H0Z",
+	drift: "M0 72V39C115 31 205 54 340 48C505 41 610 16 760 33C920 51 1015 64 1160 44C1280 27 1375 35 1440 50V72H0Z"
+};
+function waveMaskDataUrl(mask) {
+	return svgDataUrl(`<svg viewBox='0 0 1440 72' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><path d='${waveMaskSvgPaths[mask]}' fill='white'/></svg>`);
+}
+/**
+* How each placement anchors the layers against the zero-height boundary
+* element that sits exactly on the join.
+*
+* - `centred` straddles the join, band under shape.
+* - `previous` sits above the join, inside the previous section.
+* - `next` sits below the join, inside the next section, with the shape
+*   flipped so it reads as the mirror of `previous`.
+*/
+const placementRules = {
+	centred: {
+		shape: ["top: 0;", "transform: translateY(-50%);"],
+		band: ["top: 0;", "transform: translateY(-50%);"]
+	},
+	previous: {
+		shape: ["bottom: 0;"],
+		band: null
+	},
+	next: {
+		shape: ["top: 0;", "transform: scaleY(-1);"],
+		band: null
+	}
+};
+function generateBoundaryCss(selector) {
+	const boundary = `${selector} [data-block-boundary]`;
+	return [
+		rule$1(boundary, [
+			"position: relative;",
+			"z-index: 3;",
+			"height: 0;",
+			"pointer-events: none;"
+		]),
+		rule$1(`${selector} [data-block][data-site-style-boundary-before] > :where([data-slot='section'])`, ["padding-top: calc(var(--rb-section-pad-y, 0rem) + var(--site-style-boundary-before-reserve, 0rem));"]),
+		rule$1(`${selector} [data-block][data-site-style-boundary-after] > :where([data-slot='section'])`, ["padding-bottom: calc(var(--rb-section-pad-y, 0rem) + var(--site-style-boundary-after-reserve, 0rem));"]),
+		rule$1(`${boundary}::before,\n${boundary}::after`, [
+			"content: '';",
+			"position: absolute;",
+			"left: 0;",
+			"right: 0;",
+			"height: var(--boundary-height);",
+			"pointer-events: none;"
+		]),
+		rule$1(`${boundary}::before`, ["z-index: 0;", "background: var(--boundary-band-paint, transparent);"]),
+		rule$1(`${boundary}::after`, ["z-index: 1;"]),
+		...placementCss(boundary),
+		...transitionCatalogueEntries.flatMap((entry) => treatmentCss(boundary, entry))
+	].join("\n\n");
+}
+function placementCss(boundary) {
+	return Object.keys(placementRules).flatMap((placement) => {
+		const placed = `${boundary}[data-boundary-placement='${placement}']`;
+		const rules = placementRules[placement];
+		return [rule$1(`${placed}::after`, rules.shape), rules.band ? rule$1(`${placed}::before`, rules.band) : rule$1(`${placed}::before`, ["content: none;"])];
+	});
+}
+function treatmentCss(boundary, entry) {
+	const selected = `${boundary}[data-boundary-treatment='${entry.intent}']`;
+	return [rule$1(selected, [`--boundary-height: ${boundaryRuntimeMetricsForDecorativeTransition(entry.intent).heightCss};`]), rule$1(`${selected}::after`, shapeDeclarations(entry))];
+}
+function shapeDeclarations(entry) {
+	switch (entry.shape.kind) {
+		case "fade": return [
+			"/* Fallback for browsers without color-mix(). */",
+			"background: linear-gradient(to bottom, transparent 0%, var(--boundary-shape-paint) 100%);",
+			"background: linear-gradient(to bottom, transparent 0%, color-mix(in srgb, var(--boundary-shape-paint) 16%, transparent) 34%, color-mix(in srgb, var(--boundary-shape-paint) 68%, transparent) 78%, var(--boundary-shape-paint) 100%);"
+		];
+		case "wave": {
+			const mask = waveMaskDataUrl(entry.shape.mask);
+			return [
+				"background: var(--boundary-shape-paint);",
+				`mask-image: url("${mask}");`,
+				"mask-repeat: no-repeat;",
+				"mask-size: 100% 100%;",
+				`-webkit-mask-image: url("${mask}");`,
+				"-webkit-mask-repeat: no-repeat;",
+				"-webkit-mask-size: 100% 100%;"
+			];
+		}
+		case "angle": return [
+			"height: calc(var(--boundary-height) + 2px);",
+			"background: var(--boundary-shape-paint);",
+			`clip-path: ${anglePolygonCss(entry.shape.polygon)};`
+		];
+	}
+}
+function rule$1(selector, declarations) {
+	return `${selector} {\n  ${declarations.join("\n  ")}\n}`;
+}
+function svgDataUrl(svg) {
+	return `data:image/svg+xml,${encodeURIComponent(svg)}`;
+}
+//#endregion
 //#region ../theme-core/src/layout/generateLayoutCss.ts
 /**
 * Generate layout CSS for theme scope (background, text color)
@@ -46556,7 +47324,7 @@ function generateLayoutCss(options) {
 	if (heroTypographyCss) cssChunks.push(heroTypographyCss);
 	const bodyTextTypographyCss = generateBodyTextTypographyCss(themeId, theme);
 	if (bodyTextTypographyCss) cssChunks.push(bodyTextTypographyCss);
-	cssChunks.push(generateSiteStyleTransitionCss(themeId));
+	cssChunks.push(generateBoundaryCss(selector));
 	return cssChunks.join("\n\n");
 }
 function toPaddingValue(preset) {
@@ -46567,193 +47335,6 @@ function toPaddingValue(preset) {
 		relaxed: "1.5rem"
 	}[preset];
 }
-const classicWaveTransitionMask = svgDataUrl("<svg viewBox='0 0 1440 72' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><path d='M0 72V46C130 55 260 24 420 30C590 36 690 62 860 42C1035 21 1160 47 1305 36C1365 31 1415 33 1440 38V72H0Z' fill='white'/></svg>");
-const balancedWaveTransitionMask = svgDataUrl("<svg viewBox='0 0 1440 72' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><path d='M0 72V42C120 24 240 24 360 42C480 60 600 60 720 42C840 24 960 24 1080 42C1200 60 1320 60 1440 42V72H0Z' fill='white'/></svg>");
-const gentleWaveTransitionMask = svgDataUrl("<svg viewBox='0 0 1440 72' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><path d='M0 72V43C180 32 300 32 480 43C660 54 780 54 960 43C1140 32 1260 32 1440 43V72H0Z' fill='white'/></svg>");
-const boldWaveTransitionMask = svgDataUrl("<svg viewBox='0 0 1440 72' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><path d='M0 72V44C90 14 270 14 360 44C450 74 630 74 720 44C810 14 990 14 1080 44C1170 74 1350 74 1440 44V72H0Z' fill='white'/></svg>");
-const driftWaveTransitionMask = svgDataUrl("<svg viewBox='0 0 1440 72' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><path d='M0 72V39C115 31 205 54 340 48C505 41 610 16 760 33C920 51 1015 64 1160 44C1280 27 1375 35 1440 50V72H0Z' fill='white'/></svg>");
-function generateSiteStyleTransitionCss(themeId) {
-	const selector = `:where([data-theme-scope="${themeId}"])`;
-	const compactBoundaryHeight = requiredBoundaryHeightCss("wave-edge-gentle");
-	const mediumBoundaryHeight = requiredBoundaryHeightCss("wave-edge");
-	const largeBoundaryHeight = requiredBoundaryHeightCss("wave-edge-bold");
-	return `${selector} [data-style-group^='site-style-transition-'] {
-  position: relative;
-  z-index: 2;
-  --site-style-transition-from: transparent;
-  --site-style-transition-to: rgb(var(--tb-background));
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-'] {
-  position: relative;
-  z-index: 3;
-  height: 0;
-  pointer-events: none;
-  --site-style-boundary-height: ${mediumBoundaryHeight};
-}
-
-${selector} [data-block][data-site-style-boundary-before] > :where([data-slot='section']) {
-  padding-top: calc(var(--rb-section-pad-y, 0rem) + var(--site-style-boundary-before-reserve, 0rem));
-}
-
-${selector} [data-block][data-site-style-boundary-after] > :where([data-slot='section']) {
-  padding-bottom: calc(var(--rb-section-pad-y, 0rem) + var(--site-style-boundary-after-reserve, 0rem));
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-']::before,
-${selector} [data-block-boundary][data-style-group^='site-style-transition-angle-edge-']::before,
-${selector} [data-block-boundary][data-style-group^='site-style-transition-soft-fade']::before {
-  content: '';
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  transform: translateY(-50%);
-  z-index: 0;
-  height: var(--site-style-boundary-height);
-  background: var(--site-style-transition-from);
-  pointer-events: none;
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-']::after,
-${selector} [data-block-boundary][data-style-group^='site-style-transition-angle-edge-']::after,
-${selector} [data-block-boundary][data-style-group^='site-style-transition-soft-fade']::after {
-  content: '';
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  transform: translateY(-50%);
-  z-index: 1;
-  height: var(--site-style-boundary-height);
-  pointer-events: none;
-}
-
-${selector} [data-style-group*='-from-base-'] {
-  --site-style-transition-from: rgb(var(--tb-background));
-}
-
-${selector} [data-style-group*='-from-muted-band-'] {
-  --site-style-transition-from: rgb(var(--tb-muted));
-}
-
-${selector} [data-style-group*='-from-accent-band-'] {
-  --site-style-transition-from: rgb(var(--tb-accent));
-}
-
-${selector} [data-style-group*='-from-brand-depth-band-'] {
-  --site-style-transition-from: rgb(var(--tb-primary-800));
-}
-
-${selector} [data-style-group$='-to-base'],
-${selector} [data-style-group$='-to-hero-image'] {
-  --site-style-transition-to: rgb(var(--tb-background));
-}
-
-${selector} [data-style-group$='-to-muted-band'] {
-  --site-style-transition-to: rgb(var(--tb-muted));
-}
-
-${selector} [data-style-group$='-to-accent-band'] {
-  --site-style-transition-to: rgb(var(--tb-accent));
-}
-
-${selector} [data-style-group$='-to-brand-depth-band'] {
-  --site-style-transition-to: rgb(var(--tb-primary-800));
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-soft-fade']::after {
-  /* Fallback for browsers without color-mix(). */
-  background: linear-gradient(
-    to bottom,
-    transparent 0%,
-    var(--site-style-transition-to) 100%
-  );
-  background: linear-gradient(
-    to bottom,
-    transparent 0%,
-    color-mix(in srgb, var(--site-style-transition-to) 16%, transparent) 34%,
-    color-mix(in srgb, var(--site-style-transition-to) 68%, transparent) 78%,
-    var(--site-style-transition-to) 100%
-  );
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-soft-fade-long-'] {
-  --site-style-boundary-height: ${requiredBoundaryHeightCss("soft-fade-long")};
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-soft-fade-expansive-'] {
-  --site-style-boundary-height: ${requiredBoundaryHeightCss("soft-fade-expansive")};
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-angle-edge-']::after {
-  height: calc(var(--site-style-boundary-height) + 2px);
-  background: var(--site-style-transition-to);
-  clip-path: polygon(0 42%, 100% 8%, 100% 100%, 0 100%);
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-angle-edge-subtle-'] {
-  --site-style-boundary-height: ${compactBoundaryHeight};
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-angle-edge-subtle-']::after {
-  clip-path: polygon(0 34%, 100% 18%, 100% 100%, 0 100%);
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-angle-edge-steep-'] {
-  --site-style-boundary-height: ${largeBoundaryHeight};
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-angle-edge-steep-']::after {
-  clip-path: polygon(0 54%, 100% 0%, 100% 100%, 0 100%);
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-']::after {
-  background: var(--site-style-transition-to);
-  mask-image: url("${classicWaveTransitionMask}");
-  mask-repeat: no-repeat;
-  mask-size: 100% 100%;
-  -webkit-mask-image: url("${classicWaveTransitionMask}");
-  -webkit-mask-repeat: no-repeat;
-  -webkit-mask-size: 100% 100%;
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-balanced-']::after {
-  mask-image: url("${balancedWaveTransitionMask}");
-  -webkit-mask-image: url("${balancedWaveTransitionMask}");
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-gentle-'] {
-  --site-style-boundary-height: ${compactBoundaryHeight};
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-gentle-']::after {
-  mask-image: url("${gentleWaveTransitionMask}");
-  -webkit-mask-image: url("${gentleWaveTransitionMask}");
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-bold-'] {
-  --site-style-boundary-height: ${largeBoundaryHeight};
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-bold-']::after {
-  mask-image: url("${boldWaveTransitionMask}");
-  -webkit-mask-image: url("${boldWaveTransitionMask}");
-}
-
-${selector} [data-block-boundary][data-style-group^='site-style-transition-wave-edge-drift-']::after {
-  mask-image: url("${driftWaveTransitionMask}");
-  -webkit-mask-image: url("${driftWaveTransitionMask}");
-}`;
-}
-function requiredBoundaryHeightCss(transition) {
-	const metrics = boundaryRuntimeMetricsForTransition(transition);
-	if (!metrics) throw new Error(`Missing boundary runtime metrics for ${transition}`);
-	return metrics.heightCss;
-}
-function svgDataUrl(svg) {
-	return `data:image/svg+xml,${encodeURIComponent(svg)}`;
-}
 function generateHeroTypographyCss(themeId, theme) {
 	const typography = theme.hero?.typography;
 	if (!typography) return "";
@@ -46772,24 +47353,23 @@ function generateHeroTypographyCss(themeId, theme) {
 	if (microHeadlineRules.length > 0) chunks.push(`${microHeadlineSelector} {\n  ${microHeadlineRules.join("\n  ")}\n}`);
 	const microSubheadlineRules = buildTypographyRules("subheadline", typography.microSubheadlineSize, typography.microSubheadlineLineHeight);
 	if (microSubheadlineRules.length > 0) chunks.push(`${microSubheadlineSelector} {\n  ${microSubheadlineRules.join("\n  ")}\n}`);
-	if (typography.responsive?.tablet) {
-		const tabletHeadlineRules = buildTypographyRules("headline", typography.responsive.tablet.headlineSize, typography.responsive.tablet.headlineLineHeight);
-		const tabletSubheadlineRules = buildTypographyRules("subheadline", typography.responsive.tablet.subheadlineSize, typography.responsive.tablet.subheadlineLineHeight);
-		const tabletChunks = [];
-		if (tabletHeadlineRules.length > 0) tabletChunks.push(`${headlineSelector} {\n    ${tabletHeadlineRules.join("\n    ")}\n  }`);
-		if (tabletSubheadlineRules.length > 0) tabletChunks.push(`${subheadlineSelector} {\n    ${tabletSubheadlineRules.join("\n    ")}\n  }`);
-		if (tabletChunks.length > 0) chunks.push(`@media ${MQ_TABLET_ONLY} {\n  ${tabletChunks.join("\n\n  ")}\n}`);
-	}
-	if (typography.responsive?.mobile) {
-		const mobileHeadlineRules = buildTypographyRules("headline", typography.responsive.mobile.headlineSize, typography.responsive.mobile.headlineLineHeight);
-		const mobileSubheadlineRules = buildTypographyRules("subheadline", typography.responsive.mobile.subheadlineSize, typography.responsive.mobile.subheadlineLineHeight);
-		const mobileChunks = [];
-		if (mobileHeadlineRules.length > 0) mobileChunks.push(`${headlineSelector} {\n    ${mobileHeadlineRules.join("\n    ")}\n  }`);
-		if (mobileSubheadlineRules.length > 0) mobileChunks.push(`${subheadlineSelector} {\n    ${mobileSubheadlineRules.join("\n    ")}\n  }`);
-		if (mobileChunks.length > 0) chunks.push(`@media ${MQ_SM_DOWN} {\n  ${mobileChunks.join("\n\n  ")}\n}`);
-	}
+	const selectors = {
+		headline: headlineSelector,
+		subheadline: subheadlineSelector
+	};
+	const responsiveChunks = [responsiveHeroTypographyCss(MQ_TABLET_ONLY, selectors, typography.responsive?.tablet), responsiveHeroTypographyCss(MQ_SM_DOWN, selectors, typography.responsive?.mobile)];
+	for (const chunk of responsiveChunks) if (chunk) chunks.push(chunk);
 	return chunks.join("\n\n");
 }
+function responsiveHeroTypographyCss(media, selectors, overrides) {
+	if (!overrides) return null;
+	const headlineRules = buildTypographyRules("headline", overrides.headlineSize, overrides.headlineLineHeight);
+	const subheadlineRules = buildTypographyRules("subheadline", overrides.subheadlineSize, overrides.subheadlineLineHeight);
+	const mediaChunks = [];
+	if (headlineRules.length > 0) mediaChunks.push(`${selectors.headline} {\n    ${headlineRules.join("\n    ")}\n  }`);
+	if (subheadlineRules.length > 0) mediaChunks.push(`${selectors.subheadline} {\n    ${subheadlineRules.join("\n    ")}\n  }`);
+	return mediaChunks.length > 0 ? `@media ${media} {\n  ${mediaChunks.join("\n\n  ")}\n}` : null;
+}
 function buildTypographyRules(role, size, lineHeight) {
 	const rules = [];
 	if (size) rules.push(`font-size: ${toHeroSize(role, size)};`);
@@ -48768,70 +49348,171 @@ function requireThemeResources(resources, blockKind) {
 	return resources;
 }
 //#endregion
-//#region ../blocks/src/pageRendererBoundaries.tsx
-const boundaryKey = (previousBlockId, nextBlockId) => `${previousBlockId}\u0000${nextBlockId}`;
-function isSiteStyleTransitionStyleGroup(value) {
-	return value?.startsWith("site-style-transition-") === true;
+//#region ../blocks/src/pageRenderJoins.ts
+/**
+* Re-points joins across omitted blocks. Pure over joins.
+*
+* Joins are keyed by adjacent block-id pairs, so dropping B from [A, B, C]
+* removes the A→C join as well as B's own, because no A→C join was ever
+* resolved. For each surviving pair the original join is kept when the pair
+* was already adjacent. Across a gap, the treatment comes from the join
+* entering the omitted run (A→first omitted), falling back to the one leaving
+* it (last omitted→C). Nothing visual is carried: the survivors are composed
+* from their own content afterwards.
+*
+* `survivors` are compared by identity against `originalBlocks`.
+*/
+function retargetJoinsAcrossOmissions(input) {
+	const { joins, originalBlocks, survivingBlocks } = input;
+	if (joins.length === 0) return joins;
+	if (originalBlocks.every((block) => survivingBlocks.has(block))) return joins;
+	const byPair = joinsByPair(joins);
+	const retargeted = [];
+	let previousSurvivor = null;
+	let run = [];
+	for (const block of originalBlocks) {
+		if (!survivingBlocks.has(block)) {
+			run.push(block);
+			continue;
+		}
+		if (previousSurvivor?.id && block.id) {
+			const join = run.length === 0 ? byPair.get(pairKey(previousSurvivor.id, block.id)) : joinAcrossRun(byPair, previousSurvivor.id, block.id, run);
+			if (join) retargeted.push(join);
+		}
+		previousSurvivor = block;
+		run = [];
+	}
+	return retargeted;
+}
+function joinAcrossRun(byPair, previousBlockId, nextBlockId, run) {
+	const firstOmittedId = run[0]?.id;
+	const lastOmittedId = run[run.length - 1]?.id;
+	const entering = firstOmittedId ? byPair.get(pairKey(previousBlockId, firstOmittedId)) : void 0;
+	const exiting = lastOmittedId ? byPair.get(pairKey(lastOmittedId, nextBlockId)) : void 0;
+	const donor = entering ?? exiting;
+	return donor ? {
+		previousBlockId,
+		nextBlockId,
+		treatment: donor.treatment
+	} : void 0;
 }
-function boundaryMapForAdjacentBlockIds(boundaries) {
-	return new Map(boundaries.map((boundary) => [boundaryKey(boundary.previousBlockId, boundary.nextBlockId), boundary]));
+/**
+* The single composition site. For every adjacent pair of survivors with ids,
+* finds its join and composes it from both survivors' final content: what
+* each paints with and the frame each draws.
+*/
+function composePageJoins(input) {
+	const byPair = joinsByPair(input.joins);
+	return input.survivors.flatMap((previous, index) => {
+		const next = input.survivors[index + 1];
+		if (!next || !previous.id || !next.id) return [];
+		const join = byPair.get(pairKey(previous.id, next.id));
+		return [{
+			previousBlockId: previous.id,
+			nextBlockId: next.id,
+			join: join ? composeJoin(join, previous, next) : null
+		}];
+	});
 }
-function boundaryBetweenBlocks(previousBlock, nextBlock, boundaries) {
-	const previousBlockId = previousBlock?.id ?? null;
-	const nextBlockId = nextBlock?.id ?? null;
-	if (!previousBlockId || !nextBlockId) return null;
-	return boundaries.get(boundaryKey(previousBlockId, nextBlockId)) ?? null;
+function composeJoin(join, previous, next) {
+	return {
+		boundaryId: pairKey(join.previousBlockId, join.nextBlockId),
+		previousBlockId: join.previousBlockId,
+		nextBlockId: join.nextBlockId,
+		treatment: join.treatment,
+		outcome: composeBoundary(sectionFactsForContent(previous.content), sectionFactsForContent(next.content))
+	};
+}
+/** Placement, reserves and paint for a join that draws; null otherwise. */
+function renderedJoinLayout(join) {
+	if (!join || join.outcome.kind !== "shown") return null;
+	return boundaryLayout(join.treatment, join.outcome.composition);
 }
-function renderBoundaryAfterBlock(input) {
-	const previousBlockId = input.block.id;
-	const nextBlockId = input.nextBlock?.id ?? null;
+/** Joins with a missing id on either side cannot sit between two blocks. */
+function joinsByPair(joins) {
+	return new Map(joins.flatMap((join) => join.previousBlockId && join.nextBlockId ? [[pairKey(join.previousBlockId, join.nextBlockId), join]] : []));
+}
+/** Slot lookup key for an adjacent pair, in the one boundary-id scheme. */
+function joinSlotKey(previousBlockId, nextBlockId) {
+	return pairKey(previousBlockId, nextBlockId);
+}
+function pairKey(previousBlockId, nextBlockId) {
+	return makeBoundaryId(asDesignBlockId(previousBlockId), asDesignBlockId(nextBlockId));
+}
+//#endregion
+//#region ../blocks/src/pageRendererBoundaries.tsx
+function joinSlotsByPair(slots) {
+	return new Map(slots.map((slot) => [joinSlotKey(slot.previousBlockId, slot.nextBlockId), slot]));
+}
+function joinSlotBetween(previousBlockId, nextBlockId, slots) {
 	if (!previousBlockId || !nextBlockId) return null;
-	const boundary = input.boundaryByAdjacentBlockIds.get(boundaryKey(previousBlockId, nextBlockId));
-	if (!boundary) return null;
-	const rendered = /* @__PURE__ */ jsx("div", {
+	return slots.get(joinSlotKey(previousBlockId, nextBlockId)) ?? null;
+}
+/**
+* The markup at one join: the painted boundary element when the join draws,
+* then whatever `renderJoin` adds. Null when there is nothing to render.
+*/
+function renderJoinSlot(input) {
+	const { slot } = input;
+	if (!slot) return null;
+	const layout = renderedJoinLayout(slot.join);
+	const painted = slot.join && layout ? /* @__PURE__ */ jsx("div", {
 		"aria-hidden": "true",
 		"data-block-boundary": "",
-		"data-boundary-id": boundary.boundaryId,
-		"data-boundary-previous-block-id": boundary.previousBlockId,
-		"data-boundary-next-block-id": boundary.nextBlockId,
-		"data-style-group": boundary.styleGroup,
-		style: boundaryCssVarsStyle(boundary)
-	}, `${input.blockKey}:boundary`);
-	return input.wrapBoundary ? input.wrapBoundary(boundary, rendered) : rendered;
-}
-function boundaryCssVarsStyle(boundary) {
-	return {
-		"--site-style-transition-from": boundary.cssVars.from,
-		"--site-style-transition-to": boundary.cssVars.to
-	};
+		"data-boundary-id": slot.join.boundaryId,
+		"data-boundary-previous-block-id": slot.previousBlockId,
+		"data-boundary-next-block-id": slot.nextBlockId,
+		"data-boundary-treatment": slot.join.treatment,
+		"data-boundary-placement": layout.placement,
+		style: boundaryPaintStyle(layout.paint)
+	}, `${input.blockKey}:boundary`) : null;
+	const extra = input.renderJoin?.({
+		previousBlockId: slot.previousBlockId,
+		nextBlockId: slot.nextBlockId,
+		join: slot.join
+	});
+	if (!painted && (extra === null || extra === void 0)) return null;
+	return /* @__PURE__ */ jsxs(React.Fragment, { children: [painted, extra] }, `${input.blockKey}:join`);
 }
-function boundaryReserveCssVarsStyle(input) {
-	const before = input.before?.metrics.reserveCss ?? null;
-	const after = input.after?.metrics.reserveCss ?? null;
-	if (!before && !after) return void 0;
-	return {
-		...before ? { "--site-style-boundary-before-reserve": before } : {},
-		...after ? { "--site-style-boundary-after-reserve": after } : {}
-	};
+/**
+* The one render-edge place a theme token becomes CSS.
+*/
+function themeTokenCss(token) {
+	return `rgb(var(--tb-${token}))`;
 }
-function transitionCssVarsStyle(content) {
-	const transitionStyles = isObjectRecord$1(content._transitionStyles) ? content._transitionStyles : null;
-	const cssVars = isObjectRecord$1(transitionStyles?.cssVars) ? transitionStyles.cssVars : null;
-	const from = typeof cssVars?.from === "string" ? cssVars.from : null;
-	const to = typeof cssVars?.to === "string" ? cssVars.to : null;
-	if (!from && !to) return void 0;
+function boundaryPaintStyle(paint) {
 	return {
-		...from ? { "--site-style-transition-from": from } : {},
-		...to ? { "--site-style-transition-to": to } : {}
+		"--boundary-shape-paint": themeTokenCss(paint.shape),
+		...paint.band ? { "--boundary-band-paint": themeTokenCss(paint.band) } : {}
 	};
 }
-function mergeStyleObjects(left, right) {
-	if (!left) return right;
-	if (!right) return left;
-	return {
-		...left,
-		...right
+/**
+* Reserve attributes and variables for a block wrapper, from the joins on
+* either side. A join's `before` reserve sits inside its previous section, so
+* it pads the bottom of the block above the join; its `after` reserve pads the
+* top of the block below. Joins that do not draw reserve nothing.
+*/
+function blockBoundaryReserves(input) {
+	const top = reserveOnSide(input.before, "after");
+	const bottom = reserveOnSide(input.after, "before");
+	const style = {
+		...top ? { "--site-style-boundary-before-reserve": top.length } : {},
+		...bottom ? { "--site-style-boundary-after-reserve": bottom.length } : {}
 	};
+	return {
+		topPlacement: top?.placement,
+		bottomPlacement: bottom?.placement,
+		style: top || bottom ? style : void 0
+	};
+}
+/** The reserve one join needs on one side of itself, if it draws at all. */
+function reserveOnSide(slot, side) {
+	const layout = renderedJoinLayout(slot?.join ?? null);
+	const length = layout?.reserves[side] ?? null;
+	return layout && length ? {
+		length,
+		placement: layout.placement
+	} : null;
 }
 function pageBlockPosition(index, blockCount) {
 	if (blockCount <= 1) return "only";
@@ -53556,6 +54237,15 @@ const appointmentServicesBlockDefinition = {
 				required: false,
 				ui: { intent: "content" }
 			},
+			createSiteOptionSelectField({
+				id: "categoryId",
+				label: "Category",
+				description: "Show one category (with its heading and intro), or leave it on All categories to show everything grouped.",
+				required: false,
+				multiple: false,
+				optionSource: "appointmentServiceCategories",
+				ui: { intent: "content" }
+			}),
 			sectionStylesField({
 				id: "_sectionStyles",
 				label: "Section styles",
@@ -53590,6 +54280,7 @@ const appointmentServicesBlockDefinition = {
 				richText({ className: "rb-prose rb-max-w-none" }, bind("content.description"), when("content.description")),
 				el("appointment-services", {
 					sectionHeading: { $bind: { from: "content.heading" } },
+					categoryId: { $bind: { from: "content.categoryId" } },
 					services: { $bind: { from: "data.services" } },
 					pathname: { $bind: { from: "$root.pathname" } },
 					servicePathPrefix: { $bind: { from: "$root.appointmentServicePathPrefix" } }
@@ -58521,11 +59212,10 @@ function buildPageRenderPlan(input) {
 	return {
 		entries,
 		omitted,
-		runtimeBoundaries: retargetBoundariesAcrossOmissions({
-			boundaries: input.runtimeBoundaries,
+		runtimeJoins: retargetJoinsAcrossOmissions({
+			joins: input.runtimeJoins ?? [],
 			originalBlocks: input.page.blocks,
-			survivingBlocks: new Set(entries.map((entry) => entry.block)),
-			previewStage: input.previewStage
+			survivingBlocks: new Set(entries.map((entry) => entry.block))
 		})
 	};
 }
@@ -58627,86 +59317,15 @@ function getBlockOverride(blockKind, overrides) {
 * For draft/preview: draftContent takes priority over content.
 * For published: content is the source of truth.
 */
+/**
+* The content a block renders with. Every render path (public, preview,
+* templates, SDK) chooses content here, so this is also where a stale
+* `site-style-transition-*` styleGroup is dropped; authored values survive.
+*/
 function getRenderableContent(block, previewStage = "published") {
 	const source = previewStage === "preview" && block.draftContent ? block.draftContent : block.content ?? {};
-	return isObjectRecord$1(source) ? source : {};
-}
-/**
-* Re-points section boundaries across omitted blocks.
-*
-* Boundaries are keyed by adjacent block-id *pairs*, so dropping B from
-* [A, B, C] does not merely remove B's boundaries — it removes the boundary
-* between the survivors, because no `A→C` key was ever compiled.
-*
-* Per decision D2 the treatment for a merged gap comes from the boundary
-* entering the omitted run (`A→firstOmitted`), falling back to the one leaving
-* it (`lastOmitted→C`). The destination surface is a separate question: only
-* the exiting boundary knows what C looks like, so the merged boundary ends on
-* that endpoint rather than on the omitted block's. In the exiting-only
-* fallback the origin remains an approximation: `from` is the omitted block's
-* surface, because no compiled boundary carries A's. The hosted path no longer
-* needs this at all (site-renderer admits blocks before compiling boundaries);
-* it remains the safety net for an SDK whose compiled boundaries predate an
-* omission.
-*/
-function retargetBoundariesAcrossOmissions(input) {
-	const { boundaries, originalBlocks, survivingBlocks, previewStage } = input;
-	if (boundaries === void 0) return void 0;
-	if (boundaries.length === 0) return boundaries;
-	if (!originalBlocks.some((block) => !survivingBlocks.has(block))) return boundaries;
-	const byPair = new Map(boundaries.map((boundary) => [pairKey(boundary.previousBlockId, boundary.nextBlockId), boundary]));
-	const retargeted = [];
-	let previousSurvivor = null;
-	let run = [];
-	for (const block of originalBlocks) {
-		if (!survivingBlocks.has(block)) {
-			run.push(block);
-			continue;
-		}
-		if (previousSurvivor?.id && block.id) {
-			const boundary = run.length === 0 ? byPair.get(pairKey(previousSurvivor.id, block.id)) : mergedBoundary({
-				byPair,
-				previousBlock: previousSurvivor,
-				previousBlockId: previousSurvivor.id,
-				nextBlock: block,
-				nextBlockId: block.id,
-				run,
-				previewStage
-			});
-			if (boundary) retargeted.push(boundary);
-		}
-		previousSurvivor = block;
-		run = [];
-	}
-	return retargeted;
-}
-function mergedBoundary(input) {
-	const { byPair, previousBlock, previousBlockId, nextBlock, nextBlockId, run, previewStage } = input;
-	const firstOmittedId = run[0]?.id;
-	const lastOmittedId = run[run.length - 1]?.id;
-	const entering = firstOmittedId ? byPair.get(pairKey(previousBlockId, firstOmittedId)) : void 0;
-	const exiting = lastOmittedId ? byPair.get(pairKey(lastOmittedId, nextBlockId)) : void 0;
-	const donor = entering ?? exiting;
-	if (!donor) return void 0;
-	const transition = compileTransitionRuntime({
-		treatment: donor.treatment,
-		from: donor.from,
-		to: exiting?.to ?? donor.to
-	});
-	return retargetCompiledBoundaryRuntimeForContentAdjacency({
-		...donor,
-		boundaryId: makeBoundaryId(asDesignBlockId(previousBlockId), asDesignBlockId(nextBlockId)),
-		previousBlockId,
-		nextBlockId,
-		from: transition.from,
-		to: transition.to,
-		cssVars: transition.cssVars
-	}, {
-		currentContent: getRenderableContent(previousBlock, previewStage),
-		nextContent: getRenderableContent(nextBlock, previewStage)
-	});
+	return isObjectRecord$1(source) ? stripStaleTransitionStyleGroup(source) : {};
 }
-const pairKey = boundaryKey;
 //#endregion
 //#region ../blocks/src/system/manifest/hydrateLinks.ts
 /**
@@ -58741,7 +59360,7 @@ function hydrateResolvedBookingConsentValue(value, context) {
 		const hydratedItems = value.map((item) => hydrateResolvedBookingConsentValue(item, context));
 		return hydratedItems.every((item, index) => item === value[index]) ? value : hydratedItems;
 	}
-	if (!isRecord$24(value)) return value;
+	if (!isRecord$25(value)) return value;
 	if (isBookingConsentCarrier(value)) {
 		const agreement = hydrateValue(value.agreement, context);
 		return agreement === value.agreement ? value : {
@@ -58761,7 +59380,7 @@ function hydrateValue(value, context) {
 			const resolvedItems = value.map((item) => hydrateValue(item, context));
 			return resolvedItems.every((item, index) => item === value[index]) ? value : resolvedItems;
 		}
-		if (isRecord$24(value)) {
+		if (isRecord$25(value)) {
 			if (isInternalLink$1(value)) return hydrateInternalLink(value, context.routes);
 			if (isPageLink$1(value)) return hydratePageLink(value, context);
 			if (isEntryLink$1(value)) return hydrateEntryLink(value, context);
@@ -58826,7 +59445,7 @@ function hydrateEntryLink(link, context) {
 //#region ../blocks/src/system/manifest/resolveBlockData.ts
 function resolveBlockData$1(blockId, dataLoaders, dataContext, routes) {
 	const raw = blockId ? dataContext?.resolvedData?.[blockId] : void 0;
-	if (isRecord$24(raw)) return routes ? hydrateResolvedBookingConsentLinks(raw, routes, dataContext?.pagesByIdentifier, dataContext?.entriesByIdentifier) : raw;
+	if (isRecord$25(raw)) return routes ? hydrateResolvedBookingConsentLinks(raw, routes, dataContext?.pagesByIdentifier, dataContext?.entriesByIdentifier) : raw;
 	return dataLoaders && typeof dataLoaders === "object" && Object.keys(dataLoaders).length > 0 ? {} : void 0;
 }
 //#endregion
@@ -58861,23 +59480,44 @@ function preparePageRender(input) {
 			prepared
 		});
 	}
-	if (constructionFailures.length === 0 || input.audience === "authoring") return {
-		entries,
-		constructionFailures,
-		runtimeBoundaries: input.plan.runtimeBoundaries
-	};
-	const survivors = entries.filter((candidate) => candidate.prepared.kind !== "render-threw");
+	const survivors = input.audience === "authoring" ? entries : entries.filter((candidate) => candidate.prepared.kind !== "render-threw");
 	return {
 		entries: survivors,
 		constructionFailures,
-		runtimeBoundaries: retargetBoundariesAcrossOmissions({
-			boundaries: input.plan.runtimeBoundaries,
-			originalBlocks: input.plan.entries.map((planned) => planned.block),
-			survivingBlocks: new Set(survivors.map((survivor) => survivor.entry.block)),
-			previewStage: input.previewStage
-		})
+		joins: composeSurvivorJoins(input.plan, survivors, input.themeResources)
 	};
 }
+/**
+* The only place joins are composed. Plan-time omissions were already
+* re-pointed by the plan; construction failures are re-pointed here by the
+* same primitive, so `[A, B, C]` losing B still gets an A→C join. Each
+* survivor is then classified from its final content.
+*/
+function composeSurvivorJoins(plan, survivors, themeResources) {
+	return composePageJoins({
+		joins: retargetJoinsAcrossOmissions({
+			joins: plan.runtimeJoins,
+			originalBlocks: plan.entries.map((planned) => planned.block),
+			survivingBlocks: new Set(survivors.map((survivor) => survivor.entry.block))
+		}),
+		survivors: survivors.map(({ entry }) => ({
+			id: entry.block.id,
+			kind: entry.block.kind,
+			content: boundaryClassificationContent(entry, themeResources)
+		}))
+	});
+}
+/**
+* The content a join is classified from must be the content that paints the
+* section. The default block renderer layers the theme's per-block style
+* defaults (`theme.blockOverrides[kind].styles`, background included) under
+* the block's own `_sectionStyles`, so classify that same projection. An
+* override component renders its own markup from the unmerged content.
+*/
+function boundaryClassificationContent(entry, themeResources) {
+	if (entry.kind !== "renderable" || entry.override) return entry.renderableContent;
+	return mergeContentWithBlockStyleOverrides(entry.renderableContent, themeResources.kind === "available" ? themeResources.config : void 0, entry.block.kind);
+}
 function prepareEntry(entry, input) {
 	if (entry.kind !== "renderable") return { kind: "plan-decided" };
 	const draftContent = previewableEditorContent(entry);
@@ -59084,7 +59724,7 @@ function EditorPageRenderer$1(props) {
 	});
 }
 function PageRendererCore(props) {
-	const { page, audience, runtimeBoundaries, dataContext, routeMap, registry, sdkConfig, customBlocks, blockOverrides } = props;
+	const { page, audience, runtimeJoins, dataContext, routeMap, registry, sdkConfig, customBlocks, blockOverrides } = props;
 	const imageResolveContext = React$1.useMemo(() => resolvePageRendererImageResolveContext(dataContext), [
 		dataContext?.imageResolveContext,
 		dataContext?.mediaAssets,
@@ -59100,7 +59740,7 @@ function PageRendererCore(props) {
 			blocks: []
 		},
 		audience,
-		runtimeBoundaries,
+		runtimeJoins,
 		previewStage,
 		sdkConfig,
 		customBlocks,
@@ -59108,7 +59748,7 @@ function PageRendererCore(props) {
 	}), [
 		page,
 		audience,
-		runtimeBoundaries,
+		runtimeJoins,
 		previewStage,
 		sdkConfig,
 		customBlocks,
@@ -59125,19 +59765,16 @@ function PageRendererCore(props) {
 		dataContext,
 		routeMap,
 		themeResources,
-		imageResolveContext,
-		previewStage
+		imageResolveContext
 	}), [
 		plan,
 		audience,
 		dataContext,
 		routeMap,
 		themeResources,
-		imageResolveContext,
-		previewStage
+		imageResolveContext
 	]);
-	const boundaryByAdjacentBlockIds = React$1.useMemo(() => boundaryMapForAdjacentBlockIds(preparation.runtimeBoundaries ?? []), [preparation.runtimeBoundaries]);
-	const usesRuntimeBoundaries = preparation.runtimeBoundaries !== void 0;
+	const joinSlots = React$1.useMemo(() => joinSlotsByPair(preparation.joins), [preparation.joins]);
 	reportAndReplayOmissions({
 		plan,
 		preparation,
@@ -59155,10 +59792,9 @@ function PageRendererCore(props) {
 		themeResources,
 		imageResolveContext,
 		resolvedRegistry,
-		boundaryByAdjacentBlockIds,
-		usesRuntimeBoundaries,
+		joinSlots,
 		wrapBlock: props.wrapBlock,
-		wrapBoundary: props.wrapBoundary
+		renderJoin: props.renderJoin
 	})) });
 }
 /**
@@ -59247,27 +59883,25 @@ function requireEntryBlockOverride(entry, themeResources) {
 }
 /**
 * Renders one planned block: its wrapper, style-group data attributes,
-* boundary reserve space and any boundary or transition sibling that follows.
+* boundary reserve space and the join markup that follows it.
 *
 * Extracted from PageRendererCore so the component stays about wiring the plan
 * rather than also owning per-block markup.
 */
 function renderPlanEntry(input) {
-	const { index, entries, props, themeResources, imageResolveContext, resolvedRegistry, boundaryByAdjacentBlockIds, usesRuntimeBoundaries, wrapBlock, wrapBoundary } = input;
+	const { index, entries, props, themeResources, imageResolveContext, resolvedRegistry, joinSlots, wrapBlock, renderJoin } = input;
 	const entry = input.entry.entry;
 	const block = entry.block;
 	const blockPosition = pageBlockPosition(index, entries.length);
 	const blockKey = blockKeyFor(block, index);
 	const previousBlock = entries[index - 1]?.entry.block ?? null;
 	const nextBlock = entries[index + 1]?.entry.block ?? null;
-	const boundaryBefore = boundaryBetweenBlocks(previousBlock, block, boundaryByAdjacentBlockIds);
-	const boundaryAfter = boundaryBetweenBlocks(block, nextBlock, boundaryByAdjacentBlockIds);
-	const boundaryElement = renderBoundaryAfterBlock({
-		block,
-		nextBlock,
+	const joinBefore = joinSlotBetween(previousBlock?.id, block.id, joinSlots);
+	const joinAfter = joinSlotBetween(block.id, nextBlock?.id, joinSlots);
+	const boundaryElement = renderJoinSlot({
+		slot: joinAfter,
 		blockKey,
-		boundaryByAdjacentBlockIds,
-		wrapBoundary
+		renderJoin
 	});
 	const cleanKind = block.kind.replace(/^block\./, "");
 	const managesOwnWrapper = entry.kind === "renderable" && entry.managesOwnWrapper;
@@ -59290,11 +59924,10 @@ function renderPlanEntry(input) {
 	const styleGroup = typeof renderableContent.styleGroup === "string" ? renderableContent.styleGroup : void 0;
 	const blockLook = typeof renderableContent.blockLook === "string" ? renderableContent.blockLook : void 0;
 	const blockComposition = readBlockComposition(renderableContent.blockComposition);
-	const transitionStyle = transitionCssVarsStyle(renderableContent);
-	const blockStyle = mergeStyleObjects(transitionStyle, boundaryReserveCssVarsStyle({
-		before: boundaryBefore,
-		after: boundaryAfter
-	}));
+	const reserves = blockBoundaryReserves({
+		before: joinBefore,
+		after: joinAfter
+	});
 	const blockElement = /* @__PURE__ */ jsx("div", {
 		className: wrapperClassName,
 		"data-block": cleanKind,
@@ -59306,21 +59939,14 @@ function renderPlanEntry(input) {
 		"data-block-composition": blockComposition?.treatment,
 		"data-block-composition-kind": blockComposition?.kind,
 		"data-page-block-position": blockPosition,
-		"data-site-style-boundary-before": boundaryBefore?.metrics.size,
-		"data-site-style-boundary-after": boundaryAfter?.metrics.size,
+		"data-site-style-boundary-before": reserves.topPlacement,
+		"data-site-style-boundary-after": reserves.bottomPlacement,
 		"data-style-group": styleGroup,
-		style: blockStyle,
+		style: reserves.style,
 		children: /* @__PURE__ */ jsx(MemoBlockSection, { ...blockSectionProps })
 	}, blockKey);
 	if (boundaryElement) return /* @__PURE__ */ jsxs(React$1.Fragment, { children: [blockElement, boundaryElement] }, blockKey);
-	if (usesRuntimeBoundaries || !isSiteStyleTransitionStyleGroup(styleGroup)) return blockElement;
-	return /* @__PURE__ */ jsxs(React$1.Fragment, { children: [blockElement, /* @__PURE__ */ jsx("div", {
-		"aria-hidden": "true",
-		"data-block-transition": "",
-		"data-block-transition-for": block.id ?? blockKey,
-		"data-style-group": styleGroup,
-		style: transitionStyle
-	})] }, blockKey);
+	return blockElement;
 }
 function resolvePageRendererImageResolveContext(dataContext) {
 	const input = dataContext?.imageResolveContext;
@@ -73087,7 +73713,7 @@ function toBlocksPageRendererDataContext(dataContext) {
 function toBlocksCommonProps(props) {
 	return {
 		page: props.page,
-		runtimeBoundaries: props.runtimeBoundaries,
+		runtimeJoins: props.runtimeJoins,
 		dataContext: props.dataContext ? toBlocksPageRendererDataContext(props.dataContext) : void 0,
 		routeMap: props.routeMap,
 		wrapBlock: props.wrapBlock,
@@ -73210,10 +73836,10 @@ function buildPageRouteRenderContext(dataContext) {
 	};
 }
 function PageContent(props) {
-	const { page, runtimeBoundaries, siteId, resolvedData, bookingOfferingPresets, mailingList, bookingTimeZone, routeMap, pagesByIdentifier, entriesByIdentifier, wrapBlock, registry, blockOverrides, sdkConfig, customBlocks, supabaseUrl, mediaAssets, apiBaseUrl, portalToken, previewToken, readAuthority, dataContext } = props;
+	const { page, runtimeJoins, siteId, resolvedData, bookingOfferingPresets, mailingList, bookingTimeZone, routeMap, pagesByIdentifier, entriesByIdentifier, wrapBlock, registry, blockOverrides, sdkConfig, customBlocks, supabaseUrl, mediaAssets, apiBaseUrl, portalToken, previewToken, readAuthority, dataContext } = props;
 	const rendererCommonProps = {
 		page,
-		runtimeBoundaries,
+		runtimeJoins,
 		dataContext: {
 			siteId,
 			...buildPageRouteRenderContext(dataContext),
@@ -75041,6 +75667,17 @@ function coerceToString(value) {
 	return "";
 }
 /**
+* The appointment-services catalogue (issue 1403) pairs the services with the
+* site's ordered categories. Both are needed to group them, so that response
+* is passed through whole; any other `{ services }` wrapper is unwrapped.
+*/
+function coerceServicesPayload(record) {
+	return Array.isArray(record.services) && Array.isArray(record.categories) ? {
+		services: record.services,
+		categories: record.categories
+	} : record.services;
+}
+/**
 * Extract data from API response.
 * Unwraps common response wrappers: { data }, { form }, { entries }, { services }, { teamMembers }
 *
@@ -75055,7 +75692,7 @@ function coercePayload(payload) {
 		if ("data" in record && typeof record.data !== "function") return record.data;
 		if ("form" in record && typeof record.form !== "function") return record.form;
 		if ("entries" in record && typeof record.entries !== "function") return record.entries;
-		if ("services" in record && typeof record.services !== "function") return record.services;
+		if ("services" in record && typeof record.services !== "function") return coerceServicesPayload(record);
 		if ("teamMembers" in record && typeof record.teamMembers !== "function") return record.teamMembers;
 	}
 	return payload;
@@ -75776,6 +76413,75 @@ z$1.object({
 	className: z$1.string().nullable().optional()
 });
 //#endregion
+//#region ../api/src/defineEndpointDefinitions.ts
+/**
+* Validates extracted endpoint descriptors while preserving each literal path,
+* method, and parameter contract for the typed URL builders.
+*/
+function defineEndpointDefinitions(definitions) {
+	return definitions;
+}
+//#endregion
+//#region ../api/src/publicNewsletterEndpointDefinitions.ts
+const PUBLIC_NEWSLETTER_ENDPOINT_DEFINITIONS = defineEndpointDefinitions({
+	subscribeNewsletter: {
+		path: "/public/sites/{siteId}/newsletter/subscribe",
+		method: "POST",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "json"
+	},
+	confirmNewsletter: {
+		path: "/public/sites/{siteId}/newsletter/confirm/{token}",
+		method: "GET",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "text"
+	},
+	unsubscribeNewsletter: {
+		path: "/public/sites/{siteId}/newsletter/unsubscribe/{token}",
+		method: "GET",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "text"
+	},
+	unsubscribeNewsletterPost: {
+		path: "/public/sites/{siteId}/newsletter/unsubscribe/{token}",
+		method: "POST",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "text"
+	},
+	confirmNewsletterPost: {
+		path: "/public/sites/{siteId}/newsletter/confirm/{token}",
+		method: "POST",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "text"
+	},
+	getNewsletterPreferences: {
+		path: "/public/sites/{siteId}/newsletter/preferences/{token}",
+		method: "GET",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "text"
+	},
+	saveNewsletterPreferences: {
+		path: "/public/sites/{siteId}/newsletter/preferences/{token}",
+		method: "POST",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "text"
+	},
+	getNewsletterArchive: {
+		path: "/public/sites/{siteId}/newsletter/archive/{token}",
+		method: "GET",
+		tags: ["public-newsletter-{siteId}"],
+		auth: "public",
+		responseKind: "text"
+	}
+});
+//#endregion
 //#region ../api/src/apiEndpointTypes.ts
 function allowedDemoMutationPolicy() {
 	return {
@@ -75865,17 +76571,85 @@ const SDK_ENTRY_READ_ENDPOINTS = {
 	}
 };
 //#endregion
-//#region ../api/src/defineEndpointDefinitions.ts
-/**
-* Validates extracted endpoint descriptors while preserving each literal path,
-* method, and parameter contract for the typed URL builders.
-*/
-function defineEndpointDefinitions(definitions) {
-	return definitions;
-}
-//#endregion
 //#region ../api/src/appointmentEndpointDefinitions.ts
 const APPOINTMENT_ENDPOINT_DEFINITIONS = defineEndpointDefinitions({
+	...defineEndpointDefinitions({
+		listGroupedAppointmentServices: {
+			path: "/sites/{siteId}/bookings/services/grouped",
+			method: "GET",
+			auth: "user",
+			responseKind: "json",
+			errors: ["server:internal_error"]
+		},
+		reorderAppointmentServices: {
+			path: "/sites/{siteId}/bookings/services/order",
+			method: "PUT",
+			auth: "user",
+			responseKind: "json",
+			errors: [
+				"validation:invalid_input",
+				"auth:forbidden",
+				"resource:not_found",
+				"resource:conflict",
+				"server:internal_error"
+			]
+		},
+		listAppointmentServiceCategories: {
+			path: "/sites/{siteId}/bookings/service-categories",
+			method: "GET",
+			auth: "user",
+			responseKind: "json",
+			errors: ["server:internal_error"]
+		},
+		createAppointmentServiceCategory: {
+			path: "/sites/{siteId}/bookings/service-categories",
+			method: "POST",
+			auth: "user",
+			responseKind: "json",
+			errors: [
+				"validation:invalid_input",
+				"auth:forbidden",
+				"resource:conflict",
+				"server:internal_error"
+			]
+		},
+		updateAppointmentServiceCategory: {
+			path: "/sites/{siteId}/bookings/service-categories/{categoryId}",
+			method: "PUT",
+			auth: "user",
+			responseKind: "json",
+			errors: [
+				"validation:invalid_input",
+				"auth:forbidden",
+				"resource:not_found",
+				"resource:conflict",
+				"server:internal_error"
+			]
+		},
+		deleteAppointmentServiceCategory: {
+			path: "/sites/{siteId}/bookings/service-categories/{categoryId}",
+			method: "DELETE",
+			auth: "user",
+			responseKind: "json",
+			errors: [
+				"auth:forbidden",
+				"resource:not_found",
+				"server:internal_error"
+			]
+		},
+		reorderAppointmentServiceCategories: {
+			path: "/sites/{siteId}/bookings/service-categories/order",
+			method: "PUT",
+			auth: "user",
+			responseKind: "json",
+			errors: [
+				"validation:invalid_input",
+				"auth:forbidden",
+				"resource:conflict",
+				"server:internal_error"
+			]
+		}
+	}),
 	listAppointmentResources: {
 		path: "/sites/{siteId}/bookings/resources",
 		method: "GET",
@@ -77023,39 +77797,6 @@ const NEWSLETTER_ENDPOINT_DEFINITIONS = defineEndpointDefinitions({
 		auth: "user",
 		responseKind: "json",
 		demoMutation: DEMO_MUTATION_BLOCKED_HIDDEN
-	},
-	listNewsletterSendJobs: {
-		path: "/sites/{siteId}/newsletter/jobs",
-		method: "GET",
-		tags: [TAG_TEMPLATES.site, TAG_TEMPLATES.siteNewsletter],
-		auth: "user",
-		responseKind: "json"
-	},
-	retryNewsletterSendJob: {
-		path: "/sites/{siteId}/newsletter/jobs/{jobId}/retry",
-		method: "POST",
-		errors: [
-			"validation:invalid_input",
-			"resource:not_found",
-			"auth:forbidden",
-			"server:internal_error"
-		],
-		tags: [TAG_TEMPLATES.site, TAG_TEMPLATES.siteNewsletter],
-		auth: "user",
-		responseKind: "json"
-	},
-	cancelNewsletterSendJob: {
-		path: "/sites/{siteId}/newsletter/jobs/{jobId}/cancel",
-		method: "POST",
-		errors: [
-			"validation:invalid_input",
-			"resource:not_found",
-			"auth:forbidden",
-			"server:internal_error"
-		],
-		tags: [TAG_TEMPLATES.site, TAG_TEMPLATES.siteNewsletter],
-		auth: "user",
-		responseKind: "json"
 	}
 });
 //#endregion
@@ -77821,6 +78562,7 @@ const BILLING_ENDPOINT_DEFINITIONS = defineEndpointDefinitions({
 	}
 });
 ({
+	...PUBLIC_NEWSLETTER_ENDPOINT_DEFINITIONS,
 	...ACCOUNT_ENDPOINT_DEFINITIONS,
 	...PUBLIC_ONBOARDING_ATTEMPT_ENDPOINT_DEFINITIONS,
 	...PUBLIC_EVENT_ENDPOINT_DEFINITIONS,
@@ -78819,7 +79561,12 @@ const appointmentSetupServiceDraftSchema = z$1.object({
 	venue: appointmentSetupVenueChoiceSchema,
 	timezone: z$1.string().trim().min(1).nullable(),
 	payment: appointmentSetupPaymentDraftSchema,
-	assignment: appointmentSetupServiceAssignmentDraftSchema
+	assignment: appointmentSetupServiceAssignmentDraftSchema,
+	/**
+	* The service's category, or null for "Other" (issue 1403). Omitted leaves
+	* an existing service's category alone and puts a new one in "Other".
+	*/
+	categoryId: z$1.string().uuid().nullable().optional()
 }).superRefine((service, ctx) => {
 	if (service.payment.kind !== "free" && (service.priceAmount === null || service.priceAmount <= 0)) ctx.addIssue({
 		code: "custom",
@@ -80396,7 +81143,7 @@ async function loadPageWithDeps(deps, params) {
 	});
 	return {
 		page: pageOutline,
-		runtimeBoundaries: pageData.runtimeBoundaries,
+		runtimeJoins: pageData.runtimeJoins,
 		theme: requireSdkTheme(support.theme, siteId),
 		sdkConfig: support.sdkConfig,
 		siteId,
@@ -82669,7 +83416,7 @@ function applyBindings$1(bindings, context) {
 			if (value !== void 0 && value !== null) setBindingValue(result, key, value);
 			continue;
 		}
-		if (isRecord$24(bindingSpec)) {
+		if (isRecord$25(bindingSpec)) {
 			const nested = applyBindings$1(bindingSpec, context);
 			if (Object.keys(nested).length > 0) setBindingValue(result, key, nested);
 		}
@@ -82710,7 +83457,7 @@ function mergeResolvedBindings(base, resolved) {
 	const merged = { ...base };
 	for (const [key, resolvedValue] of Object.entries(resolved)) {
 		const baseValue = merged[key];
-		merged[key] = isRecord$24(baseValue) && isRecord$24(resolvedValue) ? mergeResolvedBindings(baseValue, resolvedValue) : resolvedValue;
+		merged[key] = isRecord$25(baseValue) && isRecord$25(resolvedValue) ? mergeResolvedBindings(baseValue, resolvedValue) : resolvedValue;
 	}
 	return merged;
 }
@@ -82735,7 +83482,7 @@ function setBindingValue(target, path, value) {
 				current[Number(segment)] = value;
 				return;
 			}
-			if (isRecord$24(current)) current[segment] = value;
+			if (isRecord$25(current)) current[segment] = value;
 			return;
 		}
 		const nextWantsArray = typeof nextSegment === "string" && isIndex(nextSegment);
@@ -82744,15 +83491,15 @@ function setBindingValue(target, path, value) {
 			const existing = current[index];
 			if (nextWantsArray) {
 				if (!Array.isArray(existing)) current[index] = [];
-			} else if (!isRecord$24(existing)) current[index] = {};
+			} else if (!isRecord$25(existing)) current[index] = {};
 			current = current[index];
 			continue;
 		}
-		if (isRecord$24(current)) {
+		if (isRecord$25(current)) {
 			const existing = current[segment];
 			if (nextWantsArray) {
 				if (!Array.isArray(existing)) current[segment] = [];
-			} else if (!isRecord$24(existing)) current[segment] = {};
+			} else if (!isRecord$25(existing)) current[segment] = {};
 			current = current[segment];
 			continue;
 		}
@@ -82790,7 +83537,7 @@ function getPath$1(source, path) {
 	const segments = path.split(".").map((segment) => segment.trim()).filter(Boolean);
 	let current = source;
 	for (const segment of segments) {
-		if (!isRecord$24(current)) return void 0;
+		if (!isRecord$25(current)) return void 0;
 		current = current[segment];
 	}
 	return current;
@@ -82823,7 +83570,7 @@ function textToInlineText(value) {
 function extractFirstParagraph$1(value) {
 	if (!isRichTextDoc(value)) return null;
 	for (const node of value.content) {
-		if (!isRecord$24(node)) continue;
+		if (!isRecord$25(node)) continue;
 		if (node.type !== "paragraph" || !Array.isArray(node.content)) continue;
 		const text = node.content.filter((item) => item.type === "text").map((item) => typeof item.text === "string" ? item.text : "").join("").trim();
 		if (text.length > 0) return text;
@@ -82843,7 +83590,7 @@ function formatDate$1(value, options) {
 * Type guard to check if a value is a valid binding descriptor.
 */
 function isBindingDescriptor$1(value) {
-	if (!isRecord$24(value) || typeof value.source !== "string") return false;
+	if (!isRecord$25(value) || typeof value.source !== "string") return false;
 	if (!BINDING_SOURCES$1.includes(value.source)) return false;
 	switch (value.source) {
 		case "field":
@@ -82858,7 +83605,7 @@ function isBindingDescriptor$1(value) {
 * Type guard to check if a value is binding-descriptor-like (can be normalized).
 */
 function isBindingDescriptorLike$1(value) {
-	return isBindingDescriptor$1(value) || typeof value === "string" || isRecord$24(value) && typeof value.source === "string" && typeof value.path === "string";
+	return isBindingDescriptor$1(value) || typeof value === "string" || isRecord$25(value) && typeof value.source === "string" && typeof value.path === "string";
 }
 /**
 * Normalizes a binding input to a binding descriptor.
@@ -82899,7 +83646,7 @@ const ImagePresets = {
 		resize: "contain"
 	}
 };
-const isRecord = isRecord$24;
+const isRecord = isRecord$25;
 const applyBindingsToContent = applyBindingsToContent$1;
 //#endregion
 //#region src/rendering/helpers/templateContent.ts
@@ -83348,7 +84095,7 @@ async function loadContentFromContentResponseWithDeps(deps, params) {
 			ogImageId: pageRecord.ogImageId ?? null
 		},
 		page: pageOutline,
-		runtimeBoundaries: pageData.runtimeBoundaries,
+		runtimeJoins: pageData.runtimeJoins,
 		theme: support.theme,
 		siteId,
 		...support.customBlocks ? { customBlocks: support.customBlocks } : {},