@tryvitris/website-harness 1.0.1 → 1.1.0

package/bin/chunks/{design-context-store-ETVS4N6W.js → design-context-store-PGXCHUOF.js}

@@ -3,7 +3,7 @@ import {
   loadPersistedDesignContextPacket,
   persistDesignContextArtifacts,
   resolveDesignContextExpansion
-} from "./chunk-GQPUILFR.js";
+} from "./chunk-WK7HJI5H.js";
 import "./chunk-KVMZSQ3D.js";
 import "./chunk-WOORR67N.js";
 import "./chunk-PRLL7B63.js";
@@ -13,15 +13,16 @@ import "./chunk-M4LNHYYR.js";
 import "./chunk-TY33XMHW.js";
 import "./chunk-HL6JVA4A.js";
 import "./chunk-M2ETYSVJ.js";
-import "./chunk-AUO5I56E.js";
+import "./chunk-C3F7XQD2.js";
 import "./chunk-BIEDSEL2.js";
 import "./chunk-IKNMBGGD.js";
 import "./chunk-WEFDVXFX.js";
-import "./chunk-H3BS2EBR.js";
-import "./chunk-L44ZTNDM.js";
-import "./chunk-37F7XIMH.js";
-import "./chunk-LKN75JGA.js";
+import "./chunk-WIT6364Y.js";
+import "./chunk-GPS3SAGQ.js";
+import "./chunk-JTXFTNEA.js";
+import "./chunk-GE6UUEG2.js";
 import "./chunk-YYPYYOEV.js";
+import "./chunk-S2XVNTQP.js";
 import "./chunk-GZDLXYZV.js";
 import "./chunk-G7MNMULR.js";
 import "./chunk-T6PE4KN4.js";

package/bin/chunks/{packets-XFXKHSEY.js → packets-B7MCJ42T.js}

@@ -10,7 +10,7 @@ import {
   partitionByObligation,
   rankEvidenceRelevance,
   selectDiverseEvidence
-} from "./chunk-GQPUILFR.js";
+} from "./chunk-WK7HJI5H.js";
 import "./chunk-KVMZSQ3D.js";
 import "./chunk-WOORR67N.js";
 import "./chunk-PRLL7B63.js";
@@ -20,15 +20,16 @@ import "./chunk-M4LNHYYR.js";
 import "./chunk-TY33XMHW.js";
 import "./chunk-HL6JVA4A.js";
 import "./chunk-M2ETYSVJ.js";
-import "./chunk-AUO5I56E.js";
+import "./chunk-C3F7XQD2.js";
 import "./chunk-BIEDSEL2.js";
 import "./chunk-IKNMBGGD.js";
 import "./chunk-WEFDVXFX.js";
-import "./chunk-H3BS2EBR.js";
-import "./chunk-L44ZTNDM.js";
-import "./chunk-37F7XIMH.js";
-import "./chunk-LKN75JGA.js";
+import "./chunk-WIT6364Y.js";
+import "./chunk-GPS3SAGQ.js";
+import "./chunk-JTXFTNEA.js";
+import "./chunk-GE6UUEG2.js";
 import "./chunk-YYPYYOEV.js";
+import "./chunk-S2XVNTQP.js";
 import "./chunk-GZDLXYZV.js";
 import "./chunk-G7MNMULR.js";
 import "./chunk-T6PE4KN4.js";

package/bin/chunks/{preparation-3OR7LVPQ.js → preparation-MVKICQPD.js}

@@ -30,7 +30,7 @@ import {
   withMutationLock,
   withMutationLockAsync,
   writeCommitJournal
-} from "./chunk-GQPUILFR.js";
+} from "./chunk-WK7HJI5H.js";
 import "./chunk-KVMZSQ3D.js";
 import "./chunk-WOORR67N.js";
 import "./chunk-PRLL7B63.js";
@@ -40,15 +40,16 @@ import "./chunk-M4LNHYYR.js";
 import "./chunk-TY33XMHW.js";
 import "./chunk-HL6JVA4A.js";
 import "./chunk-M2ETYSVJ.js";
-import "./chunk-AUO5I56E.js";
+import "./chunk-C3F7XQD2.js";
 import "./chunk-BIEDSEL2.js";
 import "./chunk-IKNMBGGD.js";
 import "./chunk-WEFDVXFX.js";
-import "./chunk-H3BS2EBR.js";
-import "./chunk-L44ZTNDM.js";
-import "./chunk-37F7XIMH.js";
-import "./chunk-LKN75JGA.js";
+import "./chunk-WIT6364Y.js";
+import "./chunk-GPS3SAGQ.js";
+import "./chunk-JTXFTNEA.js";
+import "./chunk-GE6UUEG2.js";
 import "./chunk-YYPYYOEV.js";
+import "./chunk-S2XVNTQP.js";
 import "./chunk-GZDLXYZV.js";
 import "./chunk-G7MNMULR.js";
 import "./chunk-T6PE4KN4.js";

package/bin/cloudflare/backend.js

@@ -14997,6 +14997,83 @@ function compileIcons(html2, route2 = "/") {
   return html2;
 }
 
+// src/typography.ts
+var TYPE_ROLES = ["display", "section", "subheading", "card-title", "body", "ui", "caption", "label"];
+var DEFAULT_TYPE_ROLES = {
+  display: { size: "clamp(2.75rem, 1.8rem + 4vw, 5rem)", weight: 600, lineHeight: "1.08", tracking: "-0.03em", font: "display" },
+  section: { size: "clamp(2rem, 1.5rem + 2vw, 3.5rem)", weight: 600, lineHeight: "1.15", tracking: "-0.025em", font: "display" },
+  subheading: { size: "clamp(1.5rem, 1.3rem + 0.8vw, 2rem)", weight: 600, lineHeight: "1.25", tracking: "-0.015em", font: "display" },
+  "card-title": { size: "1.5rem", weight: 600, lineHeight: "1.3", tracking: "-0.01em", font: "display" },
+  body: { size: "1.125rem", weight: 400, lineHeight: "1.6", tracking: "normal", font: "body" },
+  ui: { size: "1rem", weight: 600, lineHeight: "1.5", tracking: "normal", font: "body" },
+  caption: { size: "0.875rem", weight: 400, lineHeight: "1.5", tracking: "normal", font: "body" },
+  label: { size: "0.875rem", weight: 600, lineHeight: "1.5", tracking: "0.02em", font: "body" }
+};
+var TYPE_SELECTORS = {
+  display: ["h1"],
+  section: ["h2", ".stat__value", ".stat--sm .stat__value", ".price__amount"],
+  subheading: ["h3", ".card__body > h3"],
+  "card-title": ["h4", ".card__body > h4", ".brand", ".quote", ".quote--lg", ".quote--card"],
+  body: ["body", ".lede", ".section__head .lede", ".lede--lg", ".list-check li", ".rating"],
+  ui: ["h5", "h6", "button", "input", "select", "textarea", "nav a", ".nav-links a", "summary", ".accordion summary", ".btn", ".btn-outline", ".btn-ghost", ".btn-arrow", ".skip-link", ".c-cookie-banner__title", ".c-cookie-banner__more", ".announcement a"],
+  caption: ["small", "figcaption", "sub", "sup", ".stat__label", ".price__period", ".byline", ".quote cite", ".quote footer", ".announcement", ".c-cookie-banner__text"],
+  label: ["label", ".eyebrow", ".badge", ".table th", ".chips > legend", ".chips__label", ".chips span"]
+};
+function typographyEnabled(site) {
+  if (site?.typography && site.typography.version !== 1) throw Error("Unsupported typography policy version");
+  return site?.typography?.version === 1;
+}
+function resolvedTypography(theme = {}) {
+  return Object.fromEntries(TYPE_ROLES.map((role) => [role, { ...DEFAULT_TYPE_ROLES[role], ...theme.typography?.roles?.[role] }]));
+}
+function validateTypography(value, requireRoles = false) {
+  const errors = [];
+  if (!value || typeof value !== "object" || Array.isArray(value)) return ["Typography requires a shared roles object in theme/defaults.json"];
+  const system = value;
+  if (!system.roles || typeof system.roles !== "object" || Array.isArray(system.roles)) return ["Typography roles must be an object"];
+  if (requireRoles) {
+    for (const role of TYPE_ROLES) if (!system.roles[role] || typeof system.roles[role] !== "object" || Object.keys(DEFAULT_TYPE_ROLES[role]).some((key2) => !(key2 in system.roles[role]))) errors.push(`Typography role ${role} must declare size, weight, lineHeight, tracking and font`);
+  }
+  const check = (style, name) => {
+    if (!style || typeof style !== "object" || Array.isArray(style)) {
+      errors.push(`Invalid typography style: ${name}`);
+      return;
+    }
+    for (const key2 of ["size", "lineHeight", "tracking"]) if (style[key2] !== void 0 && (typeof style[key2] !== "string" || !style[key2].trim() || /[;{}<>]/.test(style[key2]))) errors.push(`Invalid typography ${name}.${key2}`);
+    if (style.weight !== void 0 && (!Number.isFinite(style.weight) || style.weight < 1 || style.weight > 1e3)) errors.push(`Invalid typography ${name}.weight`);
+    if (style.font !== void 0 && !["body", "display"].includes(style.font)) errors.push(`Invalid typography ${name}.font`);
+    for (const key2 of Object.keys(style)) if (!["size", "weight", "lineHeight", "tracking", "font", "role", "reason"].includes(key2)) errors.push(`Unknown typography property ${name}.${key2}`);
+  };
+  for (const [role, style] of Object.entries(system.roles)) {
+    if (!TYPE_ROLES.includes(role)) errors.push(`Unknown typography role: ${role}`);
+    check(style, role);
+  }
+  if (system.variants !== void 0 && (!system.variants || typeof system.variants !== "object" || Array.isArray(system.variants))) errors.push("Typography variants must be an object");
+  else for (const [name, variant] of Object.entries(system.variants || {})) {
+    if (!/^[a-z][a-z0-9-]*$/.test(name) || !variant || !TYPE_ROLES.includes(variant.role) || typeof variant.reason !== "string" || !variant.reason.trim()) errors.push(`Typography variant ${name} needs a known role and reason`);
+    check(variant, name);
+  }
+  return errors;
+}
+function typographyVariables(theme) {
+  const errors = theme.typography ? validateTypography(theme.typography) : [];
+  if (errors.length) throw Error(errors.join("\n"));
+  const roles = resolvedTypography(theme);
+  const values = (prefix, style) => `  --type-${prefix}-size: ${style.size};
+  --type-${prefix}-weight: ${style.weight};
+  --type-${prefix}-leading: ${style.lineHeight};
+  --type-${prefix}-tracking: ${style.tracking};
+  --type-${prefix}-font: var(--font-${style.font});`;
+  return [...TYPE_ROLES.map((role) => values(role, roles[role])), ...Object.entries(theme.typography?.variants || {}).map(([name, variant]) => values(`variant-${name}`, { ...roles[variant.role], ...variant }))].join("\n");
+}
+function typographyCss() {
+  const declarations = (name) => `font-size:var(--type-${name}-size);font-weight:var(--type-${name}-weight);line-height:var(--type-${name}-leading);letter-spacing:var(--type-${name}-tracking);font-family:var(--type-${name}-font);font-synthesis:none`;
+  return [...TYPE_ROLES.map((role) => `${TYPE_SELECTORS[role].join(",")}{${declarations(role)}}`), ...TYPE_ROLES.map((role) => `[data-type-role="${role}"][data-type-role]{${declarations(role)}}`)].join("\n");
+}
+function typographyVariantCss(theme) {
+  return Object.keys(theme.typography?.variants || {}).map((name) => `[data-type-variant="${name}"][data-type-variant][data-type-variant]{font-size:var(--type-variant-${name}-size);font-weight:var(--type-variant-${name}-weight);line-height:var(--type-variant-${name}-leading);letter-spacing:var(--type-variant-${name}-tracking);font-family:var(--type-variant-${name}-font)}`).join("\n");
+}
+
 // src/compile/site.ts
 var baseCss = `*, *::before, *::after { box-sizing: border-box; }
 html {
@@ -15336,8 +15413,9 @@ function usedComponents(pages) {
   }
   return [...names];
 }
-function siteCss(pages, catalog) {
+function siteCss(pages, catalog, site) {
   const chunks = [baseCss, primitivesCss];
+  if (typographyEnabled(site)) chunks.push(typographyCss());
   if (pages.some((page2) => page2.bodyHtml.includes("data-vitris-icon="))) chunks.push(iconCss);
   for (const name of usedComponents(pages)) {
     const css = catalog[name]?.css;
@@ -15480,8 +15558,9 @@ function mergeTheme(partial) {
   if (!partial?.radiusLg) merged.radiusLg = partial?.radiusLg || defaultTheme.radiusLg;
   return merged;
 }
-function themeCss(tokens) {
+function themeCss(tokens, typography) {
   const t = mergeTheme(tokens);
+  const sharedType = typography?.version === 1;
   return `:root {
   --color-bg: ${t.colorBg};
   --color-text: ${t.colorText};
@@ -15507,12 +15586,12 @@ function themeCss(tokens) {
   --space-7: 3rem;
   --space-8: 4.5rem;
   --space-9: 6rem;
-  --step-0: ${t.typeStep0 || "clamp(0.9rem, 0.85rem + 0.2vw, 1rem)"};
-  --step-1: ${t.typeStep1 || "clamp(1rem, 0.95rem + 0.3vw, 1.125rem)"};
-  --step-2: ${t.typeStep2 || "clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem)"};
-  --step-3: ${t.typeStep3 || "clamp(1.6rem, 1.25rem + 1.2vw, 2.25rem)"};
+  --step-0: ${sharedType ? "var(--type-caption-size)" : t.typeStep0 || "clamp(0.9rem, 0.85rem + 0.2vw, 1rem)"};
+  --step-1: ${sharedType ? "var(--type-body-size)" : t.typeStep1 || "clamp(1rem, 0.95rem + 0.3vw, 1.125rem)"};
+  --step-2: ${sharedType ? "var(--type-subheading-size)" : t.typeStep2 || "clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem)"};
+  --step-3: ${sharedType ? "var(--type-section-size)" : t.typeStep3 || "clamp(1.6rem, 1.25rem + 1.2vw, 2.25rem)"};
   --step-4: ${t.typeStep4 || "clamp(2.1rem, 1.5rem + 2.2vw, 3.5rem)"};
-  --step-5: ${t.typeStep5 || "clamp(2.6rem, 1.7rem + 3.4vw, 4.75rem)"};
+  --step-5: ${sharedType ? "var(--type-display-size)" : t.typeStep5 || "clamp(2.6rem, 1.7rem + 3.4vw, 4.75rem)"};
   --tap-min: 44px;
   --header-h: 4.75rem;
   --section-y: ${t.sectionY || "clamp(3.5rem, 3rem + 3vw, 6rem)"};
@@ -15521,8 +15600,8 @@ function themeCss(tokens) {
   --shadow-2: 0 8px 24px color-mix(in srgb, var(--color-text) 8%, transparent);
   --shadow-3: 0 20px 48px color-mix(in srgb, var(--color-text) 12%, transparent);
   --ring: 0 0 0 3px color-mix(in srgb, var(--color-focus) 35%, transparent);
-}
-`;
+${sharedType ? typographyVariables(t) + "\n" : ""}}
+${sharedType ? typographyVariantCss(t) + "\n" : ""}`;
 }
 
 // src/worker/github.ts
@@ -23629,12 +23708,12 @@ async function renderPreview(env, request) {
   const compiled = compileAllPages(bundle.site, bundle.pages, bundle.catalog, origin);
   if (rest === motionAssetHref.slice(1)) return compiled.some((page3) => page3.usesMotion) ? new Response(motionJs, { headers: { "content-type": "text/javascript; charset=utf-8", "cache-control": "public, max-age=31536000, immutable" } }) : text("Not found", 404);
   if (rest === "site.css") {
-    return new Response(siteCss(compiled, bundle.catalog), {
+    return new Response(siteCss(compiled, bundle.catalog, bundle.site), {
       headers: { "content-type": "text/css; charset=utf-8" }
     });
   }
   if (rest === "theme.css") {
-    return new Response(themeCss(bundle.theme), {
+    return new Response(themeCss(bundle.theme, bundle.site.typography), {
       headers: { "content-type": "text/css; charset=utf-8" }
     });
   }

package/bin/types/src/agent/browser-typography.d.ts

@@ -0,0 +1,33 @@
+import type { Page } from 'playwright';
+import type { ThemeTokens } from '../types.ts';
+export declare const TYPOGRAPHY_SCENARIO = "typography-v1-2026-10-28";
+export type TypeObservation = {
+    selector: string;
+    text: string;
+    role: string;
+    variant?: string;
+    size: number;
+    renderedSize: number;
+    weight: string;
+    lineHeight: string;
+    tracking: string;
+    family: string;
+};
+export type TypographyCapture = {
+    path: string;
+    width: number;
+    state: string;
+    scenario: string;
+    observations: TypeObservation[];
+    failures: string[];
+};
+/** A serialized callback keeps browser DOM types out of the Worker/compiler TS program. */
+export declare function captureTypography(page: Page, theme: Partial<ThemeTokens>, path: string, width: number, state: string): Promise<TypographyCapture>;
+export declare function typographyConsistencyFailures(captures: TypographyCapture[]): string[];
+export declare function typographyEvidenceFailures(report: {
+    scenario: string;
+    captures: TypographyCapture[];
+    failures: string[];
+} | undefined, routes: string[]): string[];
+/** Exercise ordinary local disclosure states without submitting forms or following links. */
+export declare function captureTypographyStates(page: Page, theme: Partial<ThemeTokens>, path: string, width: number): Promise<TypographyCapture[]>;

package/bin/types/src/agent/theme-suite-identity.d.ts

@@ -22,6 +22,7 @@ export declare function suiteIdentityRoles(id: string): {
         typeStep2?: string;
         typeStep3?: string;
         typeStep4?: string;
+        typography?: import("../typography.ts").TypographySystem;
         sectionY?: string;
     };
     mobileDisplay: string;

package/bin/types/src/agent/typography-policy.d.ts

@@ -0,0 +1,6 @@
+import type { ThemeTokens } from '../types.ts';
+export declare function typographyPolicy(root: string): {
+    enabled: boolean;
+    theme: Partial<ThemeTokens>;
+};
+export declare function typographyDirectionFailures(root: string): string[];

package/bin/types/src/build/index.d.ts

@@ -1,3 +1,4 @@
+import type { SchedulingConnection } from '../scheduling/config.ts';
 import type { Catalog, PageSource, SiteConfig, ThemeTokens } from "../types.ts";
 import type { PublicForm } from '../forms/config.ts';
 export type BuildSiteInput = {
@@ -12,6 +13,7 @@ export type BuildSiteInput = {
     themeHref?: string;
     publicOrigin?: string;
     forms?: PublicForm[];
+    scheduling?: SchedulingConnection;
     webAnalyticsToken?: string;
 };
 export declare function loadSiteCatalog(siteDir: string): Promise<Catalog>;

package/bin/types/src/cli/admin.d.ts

@@ -1,5 +1,5 @@
 import { type CommandResult } from './types.ts';
-export declare const ADMIN_VERSION = "0.1.0-alpha.1";
+export declare const ADMIN_VERSION = "0.1.0-alpha.2";
 export type AdminOptions = {
     site?: string;
     dir?: string;

package/bin/types/src/compile/site.d.ts

@@ -4,7 +4,7 @@ export { beaconJs };
 export declare const baseCss = "*, *::before, *::after { box-sizing: border-box; }\nhtml {\n  -webkit-text-size-adjust: 100%;\n  scroll-padding-top: calc(var(--header-h) + var(--space-3));\n}\nbody {\n  margin: 0;\n  font-family: var(--font-body);\n  font-size: var(--step-1);\n  background: var(--color-bg);\n  color: var(--color-text);\n  line-height: 1.6;\n}\nh1, h2, h3, h4 {\n  font-family: var(--font-display);\n  font-weight: 600;\n  margin: 0;\n  text-wrap: balance;\n  overflow-wrap: anywhere;\n}\nh1 { font-size: var(--step-5); line-height: 1.05; letter-spacing: -0.03em; }\nh2 { font-size: var(--step-3); line-height: 1.15; letter-spacing: -0.025em; }\nh3 { font-size: var(--step-2); line-height: 1.25; letter-spacing: -0.015em; }\nh4 { font-size: var(--step-1); line-height: 1.3; letter-spacing: -0.01em; }\np { margin: 0 0 var(--space-4); text-wrap: pretty; }\np:last-child { margin-bottom: 0; }\na { color: inherit; }\na:hover { text-decoration-color: var(--color-accent); }\nimg { max-width: 100%; height: auto; display: block; }\nsvg { display: inline-block; vertical-align: middle; }\nul, ol { margin: 0 0 var(--space-4); padding-inline-start: 1.25rem; }\nul:last-child, ol:last-child { margin-bottom: 0; }\nsmall { font-size: var(--step-0); }\n:focus-visible {\n  outline: 2px solid var(--color-focus);\n  outline-offset: 3px;\n}\n.skip-link {\n  position: absolute;\n  left: var(--space-4);\n  top: var(--space-4);\n  z-index: 100;\n  padding: var(--space-3) var(--space-4);\n  background: var(--color-surface);\n  color: var(--color-text);\n  border: 1px solid var(--color-border);\n  border-radius: var(--radius);\n  text-decoration: none;\n  font-weight: 600;\n  transform: translateY(-160%);\n  transition: transform 160ms ease;\n}\n.skip-link:focus {\n  transform: translateY(0);\n}\n.visually-hidden {\n  position: absolute !important;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n.wrap {\n  width: min(var(--max-width), calc(100% - 2rem));\n  margin-inline: auto;\n}\n@media (min-width: 720px) {\n  .wrap { width: min(var(--max-width), calc(100% - 2.5rem)); }\n}\n.btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.5rem;\n  min-height: var(--tap-min);\n  padding: 0.75rem 1.5rem;\n  line-height: 1.2;\n  white-space: nowrap;\n  background: var(--color-accent);\n  color: var(--color-accent-text);\n  text-decoration: none;\n  border: 1px solid transparent;\n  border-radius: var(--radius-pill);\n  font: inherit;\n  font-weight: 600;\n  cursor: pointer;\n  transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;\n}\n.btn:hover {\n  background: color-mix(in srgb, var(--color-accent) 88%, var(--color-text));\n}\n.btn-outline {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.5rem;\n  min-height: var(--tap-min);\n  padding: 0.75rem 1.5rem;\n  line-height: 1.2;\n  white-space: nowrap;\n  background: transparent;\n  color: var(--color-text);\n  text-decoration: none;\n  border: 1px solid var(--color-border);\n  border-radius: var(--radius-pill);\n  font: inherit;\n  font-weight: 600;\n  cursor: pointer;\n  transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;\n}\n.btn-outline:hover {\n  border-color: var(--color-text);\n  background: color-mix(in srgb, var(--color-text) 6%, transparent);\n}\n.btn-arrow {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.4rem;\n  min-height: var(--tap-min);\n  white-space: nowrap;\n  font-weight: 600;\n  text-decoration: none;\n  color: var(--color-text);\n  transition: color 180ms ease;\n}\n.btn-arrow::after {\n  content: \"\u2192\";\n  transition: transform 180ms ease;\n}\n.btn-arrow:hover {\n  color: var(--color-accent);\n}\n.btn-arrow:hover::after { transform: translateX(3px); }\n.btn-ghost {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.5rem;\n  min-height: var(--tap-min);\n  padding: 0.75rem 1.5rem;\n  line-height: 1.2;\n  white-space: nowrap;\n  background: transparent;\n  color: var(--color-text);\n  text-decoration: none;\n  border: 1px solid transparent;\n  border-radius: var(--radius-pill);\n  font: inherit;\n  font-weight: 600;\n  cursor: pointer;\n  transition: border-color 180ms ease, color 180ms ease, background-color 180ms ease;\n}\n.btn-ghost:hover {\n  background: color-mix(in srgb, var(--color-text) 6%, transparent);\n}\n.c-cookie-banner {\n  position: fixed;\n  inset-inline: 0;\n  bottom: 0;\n  z-index: 200;\n  padding: var(--space-4) 0 calc(var(--space-4) + env(safe-area-inset-bottom, 0px));\n  background: var(--color-surface);\n  color: var(--color-text);\n  border-top: 1px solid var(--color-border);\n  box-shadow: 0 -8px 24px color-mix(in srgb, var(--color-text) 8%, transparent);\n}\n.c-cookie-banner__inner {\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-4);\n}\n.c-cookie-banner__title {\n  margin: 0 0 var(--space-2);\n  font-family: var(--font-display);\n  font-size: var(--step-1);\n  font-weight: 600;\n  letter-spacing: -0.02em;\n  line-height: 1.25;\n}\n.c-cookie-banner__text {\n  margin: 0;\n  font-size: var(--step-0);\n  color: var(--color-muted);\n  max-width: 42rem;\n}\n.c-cookie-banner__actions {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--space-3);\n}\n.c-cookie-banner__more {\n  min-height: var(--tap-min);\n  display: inline-flex;\n  align-items: center;\n  font-weight: 600;\n  font-size: var(--step-0);\n  color: var(--color-text);\n  text-decoration: underline;\n  text-underline-offset: 0.15em;\n  cursor: pointer;\n}\n.c-cookie-banner__more:hover { color: var(--color-accent); }\n@media (max-width: 719px) {\n  .c-cookie-banner {\n    /* A delayed first-visit beacon must not insert a banner into document flow. */\n    max-height: 50dvh;\n    overflow-y: auto;\n    overscroll-behavior: contain;\n  }\n}\n@media (min-width: 720px) {\n  .c-cookie-banner__inner {\n    flex-direction: row;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--space-5);\n  }\n  .c-cookie-banner__actions { flex-shrink: 0; }\n}\n.c-lead-ok {\n  background: var(--color-surface);\n  border: 1px solid var(--color-border);\n  border-radius: var(--radius);\n  padding: var(--space-3) var(--space-4);\n  margin: 0 0 var(--space-4);\n  color: var(--color-text);\n}\n.c-lead-hp {\n  position: absolute;\n  left: -9999px;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n}\n.c-cookie-page {\n  padding: var(--space-7) 0 var(--space-8);\n}\n.c-cookie-page h1 {\n  margin-bottom: var(--space-3);\n}\n.c-cookie-page h2 {\n  margin: var(--space-6) 0 var(--space-3);\n}\n.c-cookie-page .wrap { max-width: 42rem; }\n.c-cookie-page p { color: var(--color-muted); }\n.c-cookie-page__actions {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--space-3);\n  margin-top: var(--space-5);\n}\n\n/* Scroll reveal \u2014 armed only after islands mark above-fold .is-in */\n[data-reveal] {\n  --reveal-x: 0;\n  --reveal-y: var(--reveal-dist, 16px);\n}\n[data-reveal-strength=\"whisper\"] {\n  --reveal-dist: 8px;\n  --reveal-dur: 400ms;\n  --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);\n}\n[data-reveal-strength=\"editorial\"] {\n  --reveal-dist: 16px;\n  --reveal-dur: 550ms;\n  --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);\n}\n[data-reveal-strength=\"noticeable\"] {\n  --reveal-dist: 24px;\n  --reveal-dur: 650ms;\n  --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);\n}\n[data-reveal-from=\"up\"] { --reveal-x: 0; --reveal-y: var(--reveal-dist, 16px); }\n[data-reveal-from=\"down\"] { --reveal-x: 0; --reveal-y: calc(var(--reveal-dist, 16px) * -1); }\n[data-reveal-from=\"left\"] { --reveal-x: calc(var(--reveal-dist, 16px) * -1); --reveal-y: 0; }\n[data-reveal-from=\"right\"] { --reveal-x: var(--reveal-dist, 16px); --reveal-y: 0; }\n[data-reveal-child][data-reveal-from=\"up\"] {\n  --reveal-child-x: 0;\n  --reveal-child-y: var(--reveal-dist, 16px);\n}\n[data-reveal-child][data-reveal-from=\"down\"] {\n  --reveal-child-x: 0;\n  --reveal-child-y: calc(var(--reveal-dist, 16px) * -1);\n}\n[data-reveal-child][data-reveal-from=\"left\"] {\n  --reveal-child-x: calc(var(--reveal-dist, 16px) * -1);\n  --reveal-child-y: 0;\n}\n[data-reveal-child][data-reveal-from=\"right\"] {\n  --reveal-child-x: var(--reveal-dist, 16px);\n  --reveal-child-y: 0;\n}\n@media (prefers-reduced-motion: reduce) {\n  *, *::before, *::after { animation: none !important; transition: none !important; }\n}\n";
 export declare function compilePage(page: PageSource, catalog: Catalog, site: SiteConfig, kernelOrigin: string): CompiledPage;
 export declare function usedComponents(pages: CompiledPage[]): string[];
-export declare function siteCss(pages: CompiledPage[], catalog: Catalog): string;
+export declare function siteCss(pages: CompiledPage[], catalog: Catalog, site?: SiteConfig): string;
 export declare function siteIslands(pages: CompiledPage[], catalog: Catalog): string;
 export declare function renderDocument(opts: {
     site: SiteConfig;

package/bin/types/src/scheduling/config.d.ts

@@ -0,0 +1,11 @@
+export interface SchedulingConnection {
+    version: 1;
+    enabled: boolean;
+    apiOrigin: string;
+    siteId: string;
+    installationId: string;
+    route: string;
+}
+export declare function schedulingConnection(value: unknown): SchedulingConnection | undefined;
+export declare function bookingOrigin(value: unknown): string;
+export declare function bookingPage(name: string): string;

package/bin/types/src/scheduling/management.d.ts

@@ -0,0 +1,2 @@
+/** Runs synchronously at the start of head, keeping email capabilities out of URLs before any other scripts. */
+export declare const managementJs: string;

package/bin/types/src/scheduling/styles.d.ts

@@ -0,0 +1 @@
+export declare const bookingCss = "\n.vb-site-header{max-width:71rem;margin:0 auto;padding:1.4rem 1.5rem;border-bottom:1px solid var(--color-border,#c3cfd3)}.vb-site-header a{font-family:var(--font-body,system-ui);font-weight:650;text-decoration:none;color:var(--color-text,#1d3340)}.vb-page{max-width:71rem;margin:0 auto;padding:2.5rem 1.5rem 4rem}.vb-page>h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:.5rem 0 1rem}.vb-page>.vb-eyebrow{margin:0}.vb .vb-summary summary{font-family:inherit;font-size:1.1rem;font-weight:650;cursor:pointer}.vb h2,.vb h3{font-family:inherit}\n\n.vb{--vb-accent:var(--color-accent,#234957);--vb-accent-text:var(--color-accent-text,#fff);color:var(--color-text,#172c36);font-family:var(--font-body,system-ui);font-size:1rem;line-height:1.5;max-width:68rem;margin:2rem auto;isolation:isolate}.vb *{box-sizing:border-box}.vb [hidden]{display:none!important}.vb h2{font-size:1.65rem;line-height:1.25;margin:0 0 .6rem}.vb h3{font-size:1.15rem;margin:.2rem 0}.vb p{margin:.5rem 0 1rem}.vb button,.vb input,.vb select{font:inherit}.vb button,.vb input,.vb select{min-height:48px}.vb button{border:1px solid var(--color-border,#bdc8cd);background:var(--color-surface,#fff);color:inherit;border-radius:var(--radius,8px);padding:.7rem 1rem;cursor:pointer;text-align:center}.vb button:disabled{opacity:.55;cursor:wait}.vb .vb-primary{background:var(--vb-accent);color:var(--vb-accent-text);border-color:var(--vb-accent)}.vb button:hover:not(:disabled){filter:brightness(.96)}.vb :focus-visible{outline:3px solid var(--color-focus,#246c9a);outline-offset:3px}.vb fieldset{min-width:0;border:0;padding:0;margin:0 0 1.5rem}.vb legend{font-size:1.1rem;font-weight:650;margin-bottom:.8rem}.vb input:not([type=checkbox]):not([type=radio]),.vb select{width:100%;border:1px solid var(--color-border,#a8bbc2);border-radius:var(--radius,8px);background:var(--color-bg,#fff);color:inherit;padding:.75rem}.vb label{display:grid;gap:.4rem;margin-bottom:1rem}.vb .vb-check{display:flex;align-items:flex-start;gap:.7rem}.vb .vb-check input{min-height:24px;width:24px;flex:0 0 auto;margin-top:.1rem;accent-color:var(--vb-accent)}.vb .vb-steps{display:flex;gap:1.2rem;list-style:none;padding:0 0 1.1rem;margin:0 0 1.5rem;border-bottom:1px solid var(--color-border,#c7d2d6);flex-wrap:wrap}.vb .vb-steps li{color:var(--color-muted,#50636c)}.vb .vb-steps [aria-current=step]{color:var(--color-text,#172c36);font-weight:700}.vb .vb-layout{display:grid;grid-template-columns:minmax(0,1fr) 19rem;gap:2rem}.vb .vb-panel{background:var(--color-surface,#fff);border:1px solid var(--color-border,#c7d2d6);border-radius:var(--radius-lg,12px);padding:1.6rem;min-width:0}.vb .vb-summary{height:max-content}.vb .vb-services{display:grid;gap:.8rem}.vb .vb-service{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:start;border:1px solid var(--color-border,#c7d2d6);border-radius:var(--radius,8px);padding:1rem;gap:.7rem;margin:0}.vb .vb-service:has(input:checked){border-color:var(--vb-accent);box-shadow:inset 0 0 0 1px var(--vb-accent)}.vb .vb-service input{width:20px;min-height:24px;margin:.15rem 0;accent-color:var(--vb-accent)}.vb .vb-service strong,.vb .vb-service small{display:block;overflow-wrap:anywhere}.vb .vb-service small{font-size:.9rem;margin-top:.25rem}.vb .vb-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.vb .vb-times{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;margin:1.3rem 0}.vb .vb-times button{padding:.8rem .4rem}.vb .vb-times button[aria-pressed=true]{background:var(--vb-accent);color:var(--vb-accent-text);border-color:var(--vb-accent)}.vb .vb-times small{display:block;font-size:.8rem}.vb .vb-actions{display:flex;justify-content:space-between;gap:.8rem;margin-top:1.4rem;flex-wrap:wrap}.vb .vb-notice{padding:.8rem 1rem;background:var(--color-surface-2,#eef3f5);border-left:3px solid var(--vb-accent);margin-bottom:1.5rem;font-size:.92rem}.vb .vb-error{border-left:3px solid #aa3c34;padding:.8rem 1rem;background:var(--color-surface,#fff);margin:.8rem 0;overflow-wrap:anywhere}.vb .vb-policy{white-space:pre-wrap;overflow-wrap:anywhere}.vb dl{margin:.8rem 0}.vb dl div{padding:.7rem 0;border-bottom:1px solid var(--color-border,#dce2e5)}.vb dt{font-size:.85rem;opacity:.8}.vb dd{margin:.2rem 0 0;overflow-wrap:anywhere}.vb .vb-status{font-size:.9rem;font-weight:600;letter-spacing:.04em}.vb .vb-reference{font: .85rem ui-monospace,monospace;overflow-wrap:anywhere}.vb .vb-honey{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.vb .vb-hint{font-size:.9rem}.vb-eyebrow{font-size:.8rem;letter-spacing:.13em;font-weight:700}@media(max-width:760px){.vb .vb-layout{grid-template-columns:1fr;gap:1rem}.vb .vb-summary{order:-1}.vb .vb-summary dl div{display:inline-block;margin-right:1.4rem;border:0;padding:.2rem 0}.vb .vb-panel{padding:1.2rem}.vb .vb-steps{gap:.8rem;font-size:.85rem}.vb .vb-times{grid-template-columns:repeat(2,minmax(0,1fr))}.vb .vb-grid{grid-template-columns:1fr}.vb .vb-actions button{flex:1}}@media(prefers-reduced-motion:reduce){.vb *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}\n";

package/bin/types/src/scheduling/widget.d.ts

@@ -0,0 +1,2 @@
+/** Standard booking browser program, scoped to one explicit mount. Browser acceptance exercises this emitted JavaScript. */
+export declare const bookingJs = "(function initializeBooking() {\n  const root = document.querySelector(\"[data-vitris-booking]\");\n  if (!root) return;\n  const metadata = document.querySelector(\"script[data-vitris-booking-config]\");\n  if (!metadata) return;\n  root.classList.add(\"vb\");\n  const node = (tag, text, className) => {\n    const el = document.createElement(tag);\n    if (text !== void 0) el.textContent = text;\n    if (className) el.className = className;\n    return el;\n  };\n  const notice = (text) => {\n    const el = node(\"p\", text, \"vb-notice\");\n    el.setAttribute(\"role\", \"status\");\n    return el;\n  };\n  let connection;\n  try {\n    connection = JSON.parse(metadata.textContent || \"\");\n    if (connection.siteOrigin !== location.origin) throw Error();\n  } catch {\n    root.append(notice(\"Booking is available on the approved business website. This preview is not connected.\"));\n    return;\n  }\n  let catalog, step = 0, serviceId = \"\", locationId = \"\", providerId = \"\", day = \"\", slot = null, slots = [], revision = 0, busy = false, requestSerial = 0, error = \"\", status = \"\", customer = { name: \"\", email: \"\", phone: \"\" }, accepted = false, challengeToken = \"\", challengeId, receipt, company = \"\", attemptKey = \"\", attemptPayload = \"\", uncertain = false;\n  let objectUrl = \"\";\n  const api = async (path, data) => {\n    const response = await fetch(connection.apiOrigin + \"/api/booking/v1\" + path, { mode: \"cors\", credentials: \"omit\", cache: \"no-store\", referrerPolicy: \"no-referrer\", signal: AbortSignal.timeout(25e3), ...data === void 0 ? {} : { method: \"POST\", headers: { \"content-type\": \"application/json\" }, body: JSON.stringify(data) } });\n    const text = await response.text();\n    if (text.length > 1e6) throw Error(\"The booking response could not be verified.\");\n    let result;\n    try {\n      result = JSON.parse(text);\n    } catch {\n      throw Error(\"Booking is temporarily unavailable. Please contact the business.\");\n    }\n    if (!response.ok) {\n      const failure = Object.assign(new Error(typeof result.error === \"string\" ? result.error : \"Booking could not be completed.\"), { status: response.status, code: result.code });\n      throw failure;\n    }\n    return result;\n  };\n  const service = () => catalog.services.find((s) => s.id === serviceId);\n  const place = () => catalog.locations.find((l) => l.id === locationId);\n  const dateOf = (at, zone) => {\n    const parts = new Intl.DateTimeFormat(\"en-US\", { timeZone: zone, year: \"numeric\", month: \"2-digit\", day: \"2-digit\" }).formatToParts(new Date(at)), get = (key) => parts.find((p) => p.type === key).value;\n    return get(\"year\") + \"-\" + get(\"month\") + \"-\" + get(\"day\");\n  };\n  const addDays = (value, count) => new Date(Date.parse(value + \"T12:00:00Z\") + count * 864e5).toISOString().slice(0, 10);\n  const dayStart = (value, zone) => {\n    const target = Date.parse(value + \"T00:00:00Z\");\n    for (let at = target - 14 * 36e5; at <= target + 14 * 36e5; at += 6e4) if (dateOf(at, zone) === value) return new Date(at).toISOString();\n    throw Error(\"This date is unavailable in the selected timezone.\");\n  };\n  const time = (at, zone) => new Intl.DateTimeFormat(\"en-US\", { timeZone: zone, hour: \"numeric\", minute: \"2-digit\", timeZoneName: \"shortOffset\" }).format(new Date(at));\n  const fullDate = (at, zone) => new Intl.DateTimeFormat(\"en-US\", { timeZone: zone, weekday: \"short\", month: \"long\", day: \"numeric\", year: \"numeric\" }).format(new Date(at));\n  const price = (value) => {\n    if (value.amountMinor === null) return value.label || \"Price agreed with the business\";\n    try {\n      const options2 = new Intl.NumberFormat(\"en-US\", { style: \"currency\", currency: value.currency }), digits = options2.resolvedOptions().maximumFractionDigits ?? 2;\n      return options2.format(value.amountMinor / 10 ** digits);\n    } catch {\n      return value.label;\n    }\n  };\n  const button = (label, action, primary = false) => {\n    const el = node(\"button\", label, primary ? \"vb-primary\" : void 0);\n    el.type = \"button\";\n    el.dataset.focusKey = label;\n    el.disabled = busy;\n    el.addEventListener(\"click\", action);\n    return el;\n  };\n  const field = (label, input) => {\n    const el = node(\"label\");\n    input.dataset.focusKey = label;\n    el.append(node(\"span\", label), input);\n    return el;\n  };\n  const detail = (list, label, value) => {\n    const row = node(\"div\");\n    row.append(node(\"dt\", label), node(\"dd\", value));\n    list.append(row);\n  };\n  const move = (next) => {\n    if (busy || uncertain) return;\n    step = next;\n    error = \"\";\n    status = \"\";\n    render(true);\n  };\n  const clearTimes = () => {\n    requestSerial++;\n    slots = [];\n    slot = null;\n    revision = 0;\n    status = \"\";\n    error = \"\";\n    attemptKey = \"\";\n    accepted = false;\n  };\n  const options = (select, items, value, all) => {\n    if (all) {\n      const opt = node(\"option\", all);\n      opt.value = \"\";\n      select.append(opt);\n    }\n    for (const item of items) {\n      const opt = node(\"option\", item.name);\n      opt.value = item.id;\n      select.append(opt);\n    }\n    select.value = value;\n  };\n  const cleanupChallenge = () => {\n    if (challengeId) {\n      window.turnstile?.remove(challengeId);\n      challengeId = void 0;\n    }\n    challengeToken = \"\";\n  };\n  const errorBlock = () => {\n    const el = node(\"p\", error, \"vb-error\");\n    el.setAttribute(\"role\", \"alert\");\n    return el;\n  };\n  const showSummary = (panel) => {\n    const disclosure = node(\"details\");\n    disclosure.open = window.matchMedia(\"(min-width:761px)\").matches;\n    disclosure.append(node(\"summary\", \"Your appointment\"));\n    const list = node(\"dl\"), s = service();\n    if (s) {\n      detail(list, \"Service\", s.name);\n      detail(list, \"Duration\", s.durationMinutes + \" minutes\");\n      detail(list, \"Price\", price(s.price));\n      detail(list, \"Confirmation\", s.bookingMode === \"approval\" ? \"Business approval required\" : \"Confirmed when booked\");\n    }\n    if (place()) detail(list, \"Location\", place().name);\n    if (slot) {\n      detail(list, \"Time\", fullDate(slot.startsAt, place().timezone) + \" \\xB7 \" + time(slot.startsAt, place().timezone));\n      detail(list, \"Staff\", catalog.providers.find((p) => p.id === slot.providerId)?.name || \"Available staff\");\n    }\n    disclosure.append(list);\n    panel.append(disclosure);\n  };\n  const normalizeSelection = () => {\n    const s = service();\n    if (!s) return;\n    const places = catalog.locations.filter((l) => s.locationIds.includes(l.id));\n    if (!places.some((p) => p.id === locationId)) locationId = places[0]?.id || \"\";\n    const staff = catalog.providers.filter((p) => s.providerIds.includes(p.id) && p.locationIds.includes(locationId));\n    if (!catalog.allowProviderChoice || !staff.some((p) => p.id === providerId)) providerId = staff.length === 1 ? staff[0].id : \"\";\n    if (!day && place()) day = dateOf(Date.now() + catalog.minNoticeMinutes * 6e4, place().timezone);\n  };\n  const loadTimes = async (lookAhead = false) => {\n    if (busy || uncertain) return;\n    busy = true;\n    slot = null;\n    error = \"\";\n    status = \"Checking availability\\u2026\";\n    const serial = ++requestSerial;\n    render();\n    try {\n      const zone = place().timezone, params = new URLSearchParams({ serviceId, locationId, startsAt: dayStart(day, zone), endsAt: dayStart(addDays(day, lookAhead ? 6 : 1), zone), ...providerId ? { providerId } : {} });\n      const data = await api(\"/availability?\" + params);\n      if (serial !== requestSerial) return;\n      if (data.schemaVersion !== 1 || data.siteId !== connection.siteId || !Array.isArray(data.slots) || data.slots.length > 500 || !Number.isSafeInteger(data.revision)) throw Error(\"The availability response could not be verified.\");\n      if (!data.terms || typeof data.policyText !== \"string\" || !data.location) throw Error(\"This service changed. Reload services before booking.\");\n      const old = JSON.stringify(service());\n      Object.assign(service(), data.terms);\n      Object.assign(place(), data.location);\n      if (catalog.policyText !== data.policyText) accepted = false;\n      catalog.policyText = data.policyText;\n      slots = data.slots;\n      revision = data.revision;\n      status = slots.length ? `${slots.length} available ${slots.length === 1 ? \"time\" : \"times\"}. ${zone}.` : \"No available times for this date. Try another day.\";\n      if (old !== JSON.stringify(service())) status += \" Service details have changed; review the current price and duration.\";\n      if (data.truncated) status += \" Showing the first available times; narrow the date or staff selection.\";\n    } catch (failure) {\n      if (serial === requestSerial) {\n        slots = [];\n        error = failure instanceof Error ? failure.message : \"Availability could not be loaded.\";\n        status = \"\";\n      }\n    } finally {\n      if (serial === requestSerial) {\n        busy = false;\n        render();\n      }\n    }\n  };\n  const mountChallenge = async (container) => {\n    if (catalog.challenge.kind === \"local-fixture\") {\n      container.append(notice(\"Local simulation: the security challenge is bypassed only for this isolated loopback preview.\"));\n      return;\n    }\n    try {\n      const win = window;\n      if (!win.turnstile) await new Promise((resolve, reject) => {\n        let script = document.querySelector(\"script[data-booking-turnstile]\");\n        if (!script) {\n          script = node(\"script\");\n          script.src = \"https://challenges.cloudflare.com/turnstile/v0/api.js?render=explicit\";\n          script.async = true;\n          script.dataset.bookingTurnstile = \"\";\n          document.head.append(script);\n        }\n        script.addEventListener(\"load\", () => resolve(), { once: true });\n        script.addEventListener(\"error\", () => reject(Error(\"The security check could not load. Please retry or contact the business.\")), { once: true });\n      });\n      if (!container.isConnected || step !== 3) return;\n      challengeId = win.turnstile.render(container, { sitekey: catalog.challenge.siteKey, action: \"booking\", callback: (value) => {\n        challengeToken = value;\n      }, \"expired-callback\": () => {\n        challengeToken = \"\";\n      }, \"error-callback\": () => {\n        challengeToken = \"\";\n      } });\n    } catch (failure) {\n      if (container.isConnected) container.append(errorBlockMessage(failure instanceof Error ? failure.message : \"Security check unavailable.\"));\n    }\n  };\n  const errorBlockMessage = (text) => {\n    const el = node(\"p\", text, \"vb-error\");\n    el.setAttribute(\"role\", \"alert\");\n    return el;\n  };\n  const submit = async () => {\n    if (busy) return;\n    if (!accepted) {\n      error = \"Accept the booking policy before booking.\";\n      render();\n      return;\n    }\n    if (catalog.challenge.kind === \"turnstile\" && !challengeToken) {\n      error = \"Complete the security check before booking.\";\n      const existing = root.querySelector(\"[role=alert]\");\n      if (existing) existing.textContent = error;\n      else root.querySelector(\".vb-panel\")?.append(errorBlock());\n      return;\n    }\n    const content = { revision, serviceId, locationId, providerId: slot.providerId, startsAt: slot.startsAt, customer, acceptedPolicy: true };\n    const payload = JSON.stringify(content);\n    if (!attemptKey || attemptPayload !== payload) {\n      attemptKey = crypto.randomUUID();\n      attemptPayload = payload;\n    }\n    busy = true;\n    error = \"\";\n    status = \"Saving your appointment\\u2026\";\n    const token = challengeToken;\n    render();\n    try {\n      const result = await api(\"/appointments\", { ...content, idempotencyKey: attemptKey, challengeToken: token, company });\n      if (result.schemaVersion !== 1 || result.siteId !== connection.siteId || ![\"confirmed\", \"pending_approval\"].includes(result.status) || typeof result.reference !== \"string\" || typeof result.calendar?.content !== \"string\") throw Error(\"The booking response could not be verified. Keep this page open and retry the same booking.\");\n      receipt = result;\n      uncertain = false;\n      step = 4;\n      status = \"\";\n    } catch (failure) {\n      const f = failure;\n      error = f.message || \"The booking response was interrupted.\";\n      status = \"\";\n      if (!f.status || f.status >= 500) {\n        uncertain = true;\n        error += \" Your result may still be pending. Retry this same booking; do not create another appointment.\";\n      } else {\n        uncertain = false;\n        if (f.status === 409) {\n          step = 1;\n          slot = null;\n          slots = [];\n          revision = 0;\n          attemptKey = \"\";\n    accepted = false;\n          status = \"Your details are saved. Find available times again.\";\n        } else if (f.status === 400 && String(f.code).startsWith(\"challenge\")) {\n          challengeToken = \"\";\n        }\n      }\n    } finally {\n      busy = false;\n      render(true);\n    }\n  };\n  function render(focus = false) {\n    const focusKey = document.activeElement?.dataset.focusKey;\n    cleanupChallenge();\n    root.replaceChildren();\n    root.append(notice(catalog.emailMode === \"send\" ? \"TEST BOOKING - Emails use the configured sender and allowed test recipients.\" : catalog.emailMode === \"disabled\" ? \"TEST BOOKING - Customer emails are not enabled. Keep your booking reference.\" : \"TEST BOOKING - This preview stores appointments in the admin calendar. Customer emails are captured, not sent.\"));\n    const progress = node(\"ol\", void 0, \"vb-steps\");\n    progress.setAttribute(\"aria-label\", \"Booking progress\");\n    [\"Service\", \"Time\", \"Your details\", \"Review\", \"Receipt\"].forEach((name, index) => {\n      const item = node(\"li\", index + 1 + \". \" + name);\n      if (index === step) item.setAttribute(\"aria-current\", \"step\");\n      progress.append(item);\n    });\n    root.append(progress);\n    const layout = node(\"div\", void 0, \"vb-layout\"), panel = node(\"section\", void 0, \"vb-panel\"), summary = node(\"aside\", void 0, \"vb-panel vb-summary\");\n    summary.setAttribute(\"aria-label\", \"Appointment summary\");\n    layout.append(panel, summary);\n    root.append(layout);\n    showSummary(summary);\n    const heading = node(\"h2\", [\"Choose a service\", \"Choose a time\", \"Your details\", \"Review your appointment\", receipt?.status === \"pending_approval\" ? \"Request received\" : \"Appointment confirmed\"][step]);\n    heading.tabIndex = -1;\n    panel.append(heading);\n    if (error) panel.append(errorBlock());\n    if (status) {\n      const live = node(\"p\", status);\n      live.setAttribute(\"role\", \"status\");\n      panel.append(live);\n    }\n    if (step === 0) {\n      if (!catalog.services.length) {\n        panel.append(node(\"p\", \"No services are available for online booking. Please contact the business.\"));\n        return;\n      }\n      const group = node(\"fieldset\"), legend = node(\"legend\", \"Available services\"), list = node(\"div\", void 0, \"vb-services\");\n      group.append(legend, list);\n      for (const s of catalog.services) {\n        const radio = node(\"input\");\n        radio.type = \"radio\";\n        radio.name = \"booking-service\";\n        radio.dataset.focusKey = \"service-\" + s.id;\n        radio.value = s.id;\n        radio.checked = s.id === serviceId;\n        radio.addEventListener(\"change\", () => {\n          serviceId = s.id;\n          clearTimes();\n          normalizeSelection();\n          render();\n        });\n        const label = node(\"label\", void 0, \"vb-service\"), copy = node(\"span\");\n        copy.append(node(\"strong\", s.name), node(\"small\", s.durationMinutes + \" minutes \\xB7 \" + price(s.price)), node(\"small\", s.bookingMode === \"approval\" ? \"Requires business approval\" : \"Immediate confirmation\"));\n        label.append(radio, copy);\n        list.append(label);\n      }\n      panel.append(group, button(\"Choose a time\", () => {\n        normalizeSelection();\n        move(1);\n      }, true));\n    } else if (step === 1) {\n      const s = service(), grid = node(\"div\", void 0, \"vb-grid\"), places = catalog.locations.filter((l) => s.locationIds.includes(l.id));\n      if (places.length > 1) {\n        const select = node(\"select\");\n        options(select, places, locationId);\n        select.disabled = busy || uncertain;\n        select.addEventListener(\"change\", () => {\n          locationId = select.value;\n          day = \"\";\n          clearTimes();\n          normalizeSelection();\n          render();\n        });\n        grid.append(field(\"Location\", select));\n      }\n      const staff = catalog.providers.filter((p) => s.providerIds.includes(p.id) && p.locationIds.includes(locationId));\n      if (catalog.allowProviderChoice && staff.length > 1) {\n        const select = node(\"select\");\n        options(select, staff, providerId, \"Any available staff\");\n        select.disabled = busy || uncertain;\n        select.addEventListener(\"change\", () => {\n          providerId = select.value;\n          clearTimes();\n          render();\n        });\n        grid.append(field(\"Staff preference\", select));\n      }\n      const date = node(\"input\");\n      date.type = \"date\";\n      date.required = true;\n      date.value = day;\n      date.min = dateOf(Date.now(), place().timezone);\n      date.max = dateOf(Date.now() + catalog.horizonDays * 864e5, place().timezone);\n      date.disabled = busy || uncertain;\n      date.addEventListener(\"change\", () => {\n        if (date.value) {\n          day = date.value;\n          clearTimes();\n          render();\n        }\n      });\n      grid.append(field(\"Appointment date\", date));\n      panel.append(grid, node(\"p\", \"Times are shown in \" + place().timezone + \". A time is reserved only after booking.\", \"vb-hint\"), button(busy ? \"Checking times\\u2026\" : \"Find available times\", () => {\n        void loadTimes();\n      }));\n      const times = node(\"div\", void 0, \"vb-times\");\n      times.setAttribute(\"aria-label\", \"Available times\");\n      const seen = /* @__PURE__ */ new Set();\n      for (const value of slots) {\n        if (!providerId && seen.has(value.startsAt)) continue;\n        seen.add(value.startsAt);\n        const label = time(value.startsAt, place().timezone), b = button(label, () => {\n          slot = value;\n          render();\n        });\n        b.dataset.focusKey = value.startsAt + \"-\" + value.providerId;\n        b.setAttribute(\"aria-pressed\", String(slot?.startsAt === value.startsAt && slot.providerId === value.providerId));\n        b.setAttribute(\"aria-label\", fullDate(value.startsAt, place().timezone) + \" at \" + label);\n        b.append(node(\"small\", fullDate(value.startsAt, place().timezone)));\n        times.append(b);\n      }\n      panel.append(times);\n      if (!slots.length && !busy) panel.append(button(\"Look ahead six days\", () => {\n        void loadTimes(true);\n      }));\n      const actions = node(\"div\", void 0, \"vb-actions\"), next = button(\"Continue to your details\", () => move(2), true);\n      next.disabled = !slot || busy;\n      actions.append(button(\"Back to services\", () => move(0)), next);\n      panel.append(actions);\n    } else if (step === 2) {\n      const form = node(\"form\");\n      for (const [key, label, type, autocomplete] of [[\"name\", \"Full name\", \"text\", \"name\"], [\"email\", \"Email address\", \"email\", \"email\"], [\"phone\", \"Phone number (optional)\", \"tel\", \"tel\"]]) {\n        const input = node(\"input\");\n        input.name = key;\n        input.type = type;\n        input.autocomplete = autocomplete;\n        input.required = key !== \"phone\";\n        input.maxLength = key === \"email\" ? 254 : key === \"name\" ? 160 : 40;\n        input.value = customer[key];\n        input.addEventListener(\"input\", () => {\n          customer[key] = input.value;\n        });\n        form.append(field(label, input));\n      }\n      const hidden = node(\"div\", void 0, \"vb-honey\");\n      hidden.setAttribute(\"aria-hidden\", \"true\");\n      const honey = node(\"input\");\n      honey.name = \"company\";\n      honey.tabIndex = -1;\n      honey.autocomplete = \"off\";\n      honey.addEventListener(\"input\", () => {\n        company = honey.value;\n      });\n      hidden.append(field(\"Leave this field empty\", honey));\n      form.append(hidden, node(\"p\", \"Your details are used to arrange this appointment. See the test email mode above before submitting.\", \"vb-hint\"));\n      const actions = node(\"div\", void 0, \"vb-actions\"), next = button(\"Review appointment\", () => {\n      }, true);\n      next.type = \"submit\";\n      actions.append(button(\"Back to times\", () => move(1)), next);\n      form.append(actions);\n      form.addEventListener(\"submit\", (event) => {\n        event.preventDefault();\n        if (form.reportValidity()) {\n          customer = { name: customer.name.trim(), email: customer.email.trim(), phone: customer.phone.trim() };\n          move(3);\n        }\n      });\n      panel.append(form);\n    } else if (step === 3) {\n      const list = node(\"dl\");\n      detail(list, \"Customer\", customer.name);\n      detail(list, \"Email\", customer.email);\n      if (customer.phone) detail(list, \"Phone\", customer.phone);\n      panel.append(list, node(\"h3\", \"Booking policy\"), node(\"p\", catalog.policyText, \"vb-policy\"));\n      if(catalog.customerManagement){const m=catalog.customerManagement;panel.append(node(\"p\",\"Online cancellation notice: \"+m.cancellationCutoffMinutes+\" minutes. Online rescheduling notice: \"+m.rescheduleCutoffMinutes+\" minutes. Zero permits changes until the appointment starts.\",\"vb-hint\"));}\n      const check = node(\"input\");\n      check.type = \"checkbox\";\n      check.checked = accepted;\n      check.disabled = busy || uncertain;\n      check.addEventListener(\"change\", () => {\n        accepted = check.checked;\n      });\n      const label = node(\"label\", void 0, \"vb-check\");\n      label.append(check, node(\"span\", \"I have read and accept the booking policy.\"));\n      panel.append(label);\n      if (!busy) {\n        const challenge = node(\"div\");\n        panel.append(challenge);\n        void mountChallenge(challenge);\n      }\n      const actions = node(\"div\", void 0, \"vb-actions\");\n      if (!uncertain) actions.append(button(\"Back to your details\", () => move(2)));\n      actions.append(button(busy ? \"Booking\\u2026\" : uncertain ? \"Retry same booking\" : service().bookingMode === \"approval\" ? \"Request appointment\" : \"Confirm appointment\", () => {\n        void submit();\n      }, true));\n      panel.append(actions);\n    } else if (receipt) {\n      const pending = receipt.status === \"pending_approval\";\n      panel.append(node(\"p\", pending ? \"The business needs to approve your request. Your time is held until the approval deadline. This request is not yet confirmed.\" : \"Your appointment is saved in the business calendar.\", \"vb-status\"));\n      const list = node(\"dl\");\n      detail(list, \"Service\", receipt.serviceName);\n      detail(list, \"When\", fullDate(receipt.startsAt, receipt.timezone) + \" \\xB7 \" + time(receipt.startsAt, receipt.timezone));\n      detail(list, \"Location\", receipt.locationName);\n      detail(list, \"Staff\", receipt.providerName);\n      detail(list, \"Price\", price(receipt.price));\n      if (receipt.expiresAt) detail(list, \"Approval deadline\", fullDate(receipt.expiresAt, receipt.timezone) + \" \\xB7 \" + time(receipt.expiresAt, receipt.timezone));\n      panel.append(list, node(\"p\", \"Booking reference\", \"vb-hint\"), node(\"p\", receipt.reference, \"vb-reference\"), node(\"p\", \"Keep this reference. \" + (receipt.emailStatus === \"captured\" ? \"Your test email is captured in the admin Customer emails inbox. Its private links can cancel or reschedule this appointment.\" : receipt.emailStatus === \"accepted\" ? \"Your email was accepted by the email provider. Check your inbox for private cancellation and rescheduling links.\" : receipt.emailStatus === \"blocked\" || receipt.emailStatus === \"unknown\" ? \"Your appointment is saved, but the email needs attention. Contact the business if you do not receive it.\" : (catalog.emailMode === \"disabled\" ? \"Customer emails are not enabled. Contact the business for appointment changes.\" : \"Open your appointment email for cancellation and rescheduling links. Email delivery may still be pending.\")) + \"\", \"vb-hint\"));\n      if (objectUrl) URL.revokeObjectURL(objectUrl);\n      objectUrl = URL.createObjectURL(new Blob([receipt.calendar.content], { type: \"text/calendar;charset=utf-8\" }));\n      const link = node(\"a\", \"Download calendar file (.ics)\");\n      link.href = objectUrl;\n      link.download = \"appointment.ics\";\n      panel.append(link, node(\"p\", \"A calendar file adds a copy to your calendar. It does not keep your calendar synchronized.\", \"vb-hint\"));\n    }\n    if (focus) heading.focus({ preventScroll: false });\n    else if (focusKey) root.querySelector('[data-focus-key=\"' + CSS.escape(focusKey) + '\"]')?.focus({ preventScroll: true });\n  }\n  root.append(notice(\"Loading available services\\u2026\"));\n  void api(\"/catalog\").then((data) => {\n    if (data.schemaVersion !== 1 || data.siteId !== connection.siteId || data.installationId !== connection.installationId || data.siteOrigin !== connection.siteOrigin || data.mode !== \"test\" || !Array.isArray(data.services) || data.services.length > 128 || !Array.isArray(data.providers) || !Array.isArray(data.locations) || ![\"local-fixture\", \"turnstile\"].includes(data.challenge?.kind)) throw Error(\"This website booking connection could not be verified. Please contact the business.\");\n    catalog = data;\n    serviceId = new URL(location.href).searchParams.get(\"service\") || data.services[0]?.id || \"\";\n    if (!data.services.some((s) => s.id === serviceId)) serviceId = data.services[0]?.id || \"\";\n    normalizeSelection();\n    render();\n  }).catch((failure) => {\n    root.replaceChildren(errorBlockMessage(failure instanceof Error ? failure.message : \"Booking is unavailable.\"));\n    root.append(button(\"Try loading services again\", () => location.reload()));\n  });\n  window.addEventListener(\"beforeunload\", (event) => {\n    if (uncertain || busy && step === 3) {\n      event.preventDefault();\n      event.returnValue = \"\";\n    }\n  });\n})();";

package/bin/types/src/theme.d.ts

@@ -1,3 +1,5 @@
 import type { ThemeTokens } from "./types.ts";
 export declare function mergeTheme(partial?: Partial<ThemeTokens> | null): ThemeTokens;
-export declare function themeCss(tokens: ThemeTokens): string;
+export declare function themeCss(tokens: ThemeTokens, typography?: {
+    version: 1;
+}): string;

package/bin/types/src/types.d.ts

@@ -26,6 +26,10 @@ export type SiteConfig = {
         version: 2;
         routes: "all-authored" | string[];
     };
+    /** Shared type roles and rendered acceptance; omitted on historical sites. */
+    typography?: {
+        version: 1;
+    };
     /** Design-run instrumentation; omitted from ordinary single-site authoring. */
     designRun?: {
         runId?: string;
@@ -61,13 +65,14 @@ export type ThemeTokens = {
     /** Pill radius for `.btn` / `.btn-outline`. Cards keep `radius`. */
     radiusPill: string;
     maxWidth: string;
-    /** Opt-in type scale and rhythm. Omitted values retain legacy compiler defaults. */
+    /** Legacy scale and rhythm. Typography v1 resolves steps 0–3/5 from shared roles instead. */
     typeStep0?: string;
     typeStep1?: string;
     typeStep2?: string;
     typeStep3?: string;
     typeStep4?: string;
     typeStep5?: string;
+    typography?: import('./typography.ts').TypographySystem;
     sectionY?: string;
 };
 /** @deprecated Editor-era content tree — dormant patch/workflow only. */

package/bin/types/src/typography.d.ts

@@ -0,0 +1,27 @@
+import type { SiteConfig, ThemeTokens } from './types.ts';
+export declare const TYPE_ROLES: readonly ["display", "section", "subheading", "card-title", "body", "ui", "caption", "label"];
+export type TypeRole = typeof TYPE_ROLES[number];
+export type TypeStyle = {
+    size: string;
+    weight: number;
+    lineHeight: string;
+    tracking: string;
+    font: 'body' | 'display';
+};
+export type TypographySystem = {
+    roles: Partial<Record<TypeRole, Partial<TypeStyle>>>;
+    variants?: Record<string, Partial<TypeStyle> & {
+        role: TypeRole;
+        reason: string;
+    }>;
+};
+export declare const MINIMUM_TYPE_PX = 12;
+export declare const DEFAULT_TYPE_ROLES: Record<TypeRole, TypeStyle>;
+export declare const TYPE_SELECTORS: Record<TypeRole, string[]>;
+export declare function typographyEnabled(site?: Pick<SiteConfig, 'typography'>): boolean;
+export declare function resolvedTypography(theme?: Pick<ThemeTokens, 'typography'>): Record<TypeRole, TypeStyle>;
+/** Reject malformed values early; actual CSS lengths are resolved and checked in Chromium. */
+export declare function validateTypography(value: unknown, requireRoles?: boolean): string[];
+export declare function typographyVariables(theme: ThemeTokens): string;
+export declare function typographyCss(): string;
+export declare function typographyVariantCss(theme: ThemeTokens): string;

package/bin/vitris-art.js

@@ -12,7 +12,7 @@ import {
   retireProducedAsset,
   validateAssetProduction,
   withMutationLock
-} from "./chunks/chunk-GQPUILFR.js";
+} from "./chunks/chunk-WK7HJI5H.js";
 import "./chunks/chunk-KVMZSQ3D.js";
 import "./chunks/chunk-WOORR67N.js";
 import "./chunks/chunk-PRLL7B63.js";
@@ -27,17 +27,18 @@ import {
 } from "./chunks/chunk-TY33XMHW.js";
 import "./chunks/chunk-HL6JVA4A.js";
 import "./chunks/chunk-M2ETYSVJ.js";
-import "./chunks/chunk-AUO5I56E.js";
+import "./chunks/chunk-C3F7XQD2.js";
 import "./chunks/chunk-BIEDSEL2.js";
 import "./chunks/chunk-IKNMBGGD.js";
 import "./chunks/chunk-WEFDVXFX.js";
 import {
   findHarnessRoot
-} from "./chunks/chunk-H3BS2EBR.js";
-import "./chunks/chunk-L44ZTNDM.js";
-import "./chunks/chunk-37F7XIMH.js";
-import "./chunks/chunk-LKN75JGA.js";
+} from "./chunks/chunk-WIT6364Y.js";
+import "./chunks/chunk-GPS3SAGQ.js";
+import "./chunks/chunk-JTXFTNEA.js";
+import "./chunks/chunk-GE6UUEG2.js";
 import "./chunks/chunk-YYPYYOEV.js";
+import "./chunks/chunk-S2XVNTQP.js";
 import "./chunks/chunk-GZDLXYZV.js";
 import {
   mediaDimensions

package/bin/vitris-build.js

@@ -1,11 +1,12 @@
 #!/usr/bin/env node
 import {
   buildVerified
-} from "./chunks/chunk-H3BS2EBR.js";
-import "./chunks/chunk-L44ZTNDM.js";
-import "./chunks/chunk-37F7XIMH.js";
-import "./chunks/chunk-LKN75JGA.js";
+} from "./chunks/chunk-WIT6364Y.js";
+import "./chunks/chunk-GPS3SAGQ.js";
+import "./chunks/chunk-JTXFTNEA.js";
+import "./chunks/chunk-GE6UUEG2.js";
 import "./chunks/chunk-YYPYYOEV.js";
+import "./chunks/chunk-S2XVNTQP.js";
 import "./chunks/chunk-GZDLXYZV.js";
 import "./chunks/chunk-T6PE4KN4.js";
 import "./chunks/chunk-7FS67SRF.js";

package/bin/vitris-create-site.js

@@ -1,16 +1,16 @@
 #!/usr/bin/env node
 import {
   createSite
-} from "./chunks/chunk-M72KKZIB.js";
+} from "./chunks/chunk-5KRJQKHB.js";
 import "./chunks/chunk-34H54KEY.js";
 import "./chunks/chunk-JCRGE6AL.js";
 import {
   promptSourceUrl
-} from "./chunks/chunk-54QPYUM2.js";
+} from "./chunks/chunk-OZD7ZWDX.js";
 import "./chunks/chunk-XGTHGWPW.js";
 import {
   siteInputsFromArgv
-} from "./chunks/chunk-GQPUILFR.js";
+} from "./chunks/chunk-WK7HJI5H.js";
 import "./chunks/chunk-KVMZSQ3D.js";
 import "./chunks/chunk-WOORR67N.js";
 import "./chunks/chunk-PRLL7B63.js";
@@ -20,15 +20,16 @@ import "./chunks/chunk-M4LNHYYR.js";
 import "./chunks/chunk-TY33XMHW.js";
 import "./chunks/chunk-HL6JVA4A.js";
 import "./chunks/chunk-M2ETYSVJ.js";
-import "./chunks/chunk-AUO5I56E.js";
+import "./chunks/chunk-C3F7XQD2.js";
 import "./chunks/chunk-BIEDSEL2.js";
 import "./chunks/chunk-IKNMBGGD.js";
 import "./chunks/chunk-WEFDVXFX.js";
-import "./chunks/chunk-H3BS2EBR.js";
-import "./chunks/chunk-L44ZTNDM.js";
-import "./chunks/chunk-37F7XIMH.js";
-import "./chunks/chunk-LKN75JGA.js";
+import "./chunks/chunk-WIT6364Y.js";
+import "./chunks/chunk-GPS3SAGQ.js";
+import "./chunks/chunk-JTXFTNEA.js";
+import "./chunks/chunk-GE6UUEG2.js";
 import "./chunks/chunk-YYPYYOEV.js";
+import "./chunks/chunk-S2XVNTQP.js";
 import "./chunks/chunk-GZDLXYZV.js";
 import "./chunks/chunk-G7MNMULR.js";
 import "./chunks/chunk-T6PE4KN4.js";