@zitadel/components 0.0.0

package/dist/orchestrator-CNKo2WQG.mjs

@@ -0,0 +1,3336 @@
+import { _ as __decorate, b as t, v as focusVisibleStyles, y as baseHostStyles } from "./atoms-CmOTltTH.mjs";
+import { r as tokensCss } from "./tokens-TXmurodq.mjs";
+import { manifestRegistry } from "./manifests.mjs";
+import { LitElement, css, html, nothing } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { unsafeHTML } from "lit/directives/unsafe-html.js";
+import { Liquid } from "liquidjs";
+import DOMPurify from "dompurify";
+//#region ../api/dist/runtime/base-url.mjs
+let proxyPath = "";
+function getProxyPath() {
+	return proxyPath;
+}
+function setProxyPath(path) {
+	proxyPath = path;
+}
+//#endregion
+//#region ../api/dist/runtime/auth.mjs
+/**
+* Module-global bearer token used by the orval-generated client's
+* custom fetch. Set once at command boot (the same lifecycle pattern
+* as `base-url.ts`); every generated request reads from here.
+*
+* Keeping the token here means the CLI doesn't have to thread an
+* `Authorization` header through every generated call site; orval's
+* `mutator` wires `runtime/fetch.ts` in, and that file pulls the token
+* from this module.
+*/
+let apiAuthToken;
+function getApiAuthToken() {
+	return apiAuthToken;
+}
+function setApiAuthToken(token) {
+	apiAuthToken = token;
+}
+//#endregion
+//#region ../api/dist/chunk-CfYAbeIz.mjs
+var __defProp = Object.defineProperty;
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+//#endregion
+//#region ../api/dist/runtime/fetch.mjs
+/**
+* Framework-neutral failure type the orval-generated client throws on
+* any non-2xx response. Carries the HTTP status, the parsed error body
+* (the spec's `{code, message, details?}` envelope when the server
+* returned one), and the request URL — enough for callers to map to
+* their own error taxonomy without re-implementing the fetch layer.
+*
+* Callers that don't care about the distinction can catch `ApiError`
+* generically; callers that do (the CLI's `toZitadelError`) read
+* `status` and decide.
+*/
+var ApiError = class extends Error {
+	status;
+	url;
+	body;
+	constructor(status, url, body, message) {
+		super(message);
+		this.name = "ApiError";
+		this.status = status;
+		this.url = url;
+		this.body = body;
+	}
+};
+/**
+* The orval `mutator` for the fetch client. Every generated operation
+* routes its request through this function instead of the global
+* `fetch`. We pin three concerns here so generated call sites stay
+* focused on the shape of one HTTP call:
+*
+* - bearer auth — read from `runtime/auth.ts` and attached automatically;
+* - non-2xx → throw — orval's stock client parses the body regardless
+*   of status, so callers would have to inspect every response. Throw
+*   `ApiError` on `!res.ok` so failures interrupt control flow;
+* - body parsing — return the parsed JSON typed as `T` (the operation's
+*   return type, threaded through by orval), or `undefined` for the
+*   spec's `204`/`205`/`304` no-body responses.
+*/
+async function customFetch(url, options) {
+	const token = getApiAuthToken();
+	const headers = new Headers(options.headers);
+	if (token && !headers.has("authorization")) headers.set("authorization", `Bearer ${token}`);
+	const res = await fetch(url, {
+		...options,
+		headers
+	});
+	const rawBody = [
+		204,
+		205,
+		304
+	].includes(res.status) ? "" : await res.text();
+	const parsed = rawBody ? safeJsonParse(rawBody) : void 0;
+	if (!res.ok) {
+		const message = `${options.method ?? "GET"} ${url} returned ${res.status}`;
+		throw new ApiError(res.status, url, parsed, message);
+	}
+	return parsed;
+}
+/**
+* `JSON.parse` wrapped so a non-JSON body (e.g. an HTML 502 from a
+* proxy) becomes `{ raw: "<text>" }` instead of throwing inside
+* `customFetch`. The thrown `ApiError` then carries something useful
+* for the user to see.
+*/
+function safeJsonParse(text) {
+	try {
+		return JSON.parse(text);
+	} catch {
+		return { raw: text };
+	}
+}
+//#endregion
+//#region ../api/dist/generated/endpoints/zitadelNextGen.mjs
+/**
+* Generated by orval v8.10.0 🍺
+* Do not edit manually.
+* Zitadel NextGen
+* This is the next generation of the Zitadel identity platform.
+* OpenAPI spec version: 0.0.1
+*/
+var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
+	authorizeDevice: () => authorizeDevice,
+	authorizeGet: () => authorizeGet,
+	createAuthAttempt: () => createAuthAttempt,
+	createFlow: () => createFlow,
+	createFlowDefinition: () => createFlowDefinition,
+	createHandoff: () => createHandoff,
+	createProject: () => createProject,
+	createSchema: () => createSchema,
+	createSession: () => createSession,
+	createTeam: () => createTeam,
+	createUser: () => createUser,
+	deleteFlowDefinition: () => deleteFlowDefinition,
+	endSession: () => endSession,
+	exchangeHandoff: () => exchangeHandoff,
+	getAuthAttempt: () => getAuthAttempt,
+	getAuthorizeDeviceUrl: () => getAuthorizeDeviceUrl,
+	getAuthorizeGetUrl: () => getAuthorizeGetUrl,
+	getCreateAuthAttemptUrl: () => getCreateAuthAttemptUrl,
+	getCreateFlowDefinitionUrl: () => getCreateFlowDefinitionUrl,
+	getCreateFlowUrl: () => getCreateFlowUrl,
+	getCreateHandoffUrl: () => getCreateHandoffUrl,
+	getCreateProjectUrl: () => getCreateProjectUrl,
+	getCreateSchemaUrl: () => getCreateSchemaUrl,
+	getCreateSessionUrl: () => getCreateSessionUrl,
+	getCreateTeamUrl: () => getCreateTeamUrl,
+	getCreateUserUrl: () => getCreateUserUrl,
+	getDeleteFlowDefinitionUrl: () => getDeleteFlowDefinitionUrl,
+	getEndSessionUrl: () => getEndSessionUrl,
+	getExchangeHandoffUrl: () => getExchangeHandoffUrl,
+	getFlowDefinition: () => getFlowDefinition,
+	getFlowStep: () => getFlowStep,
+	getGetAuthAttemptUrl: () => getGetAuthAttemptUrl,
+	getGetFlowDefinitionUrl: () => getGetFlowDefinitionUrl,
+	getGetFlowStepUrl: () => getGetFlowStepUrl,
+	getGetHealthUrl: () => getGetHealthUrl,
+	getGetKeysUrl: () => getGetKeysUrl,
+	getGetLiveUrl: () => getGetLiveUrl,
+	getGetMySessionUrl: () => getGetMySessionUrl,
+	getGetOpenIDConfigurationUrl: () => getGetOpenIDConfigurationUrl,
+	getGetProjectUrl: () => getGetProjectUrl,
+	getGetReadyUrl: () => getGetReadyUrl,
+	getGetSchemaByIdUrl: () => getGetSchemaByIdUrl,
+	getGetSessionUrl: () => getGetSessionUrl,
+	getGetTeamUrl: () => getGetTeamUrl,
+	getGetTokenUrl: () => getGetTokenUrl,
+	getGetUserByIDUrl: () => getGetUserByIDUrl,
+	getGetUserInfoUrl: () => getGetUserInfoUrl,
+	getHealth: () => getHealth,
+	getIntrospectUrl: () => getIntrospectUrl,
+	getIssueChallengeUrl: () => getIssueChallengeUrl,
+	getKeys: () => getKeys,
+	getListFlowDefinitionsUrl: () => getListFlowDefinitionsUrl,
+	getListSessionsUrl: () => getListSessionsUrl,
+	getListUsersUrl: () => getListUsersUrl,
+	getLive: () => getLive,
+	getMySession: () => getMySession,
+	getOpenIDConfiguration: () => getOpenIDConfiguration,
+	getProject: () => getProject,
+	getReady: () => getReady,
+	getRevokeMySessionUrl: () => getRevokeMySessionUrl,
+	getRevokeSessionUrl: () => getRevokeSessionUrl,
+	getRevokeTokenUrl: () => getRevokeTokenUrl,
+	getSchemaById: () => getSchemaById,
+	getSession: () => getSession,
+	getSubmitFlowEventUrl: () => getSubmitFlowEventUrl,
+	getSubmitFlowStepUrl: () => getSubmitFlowStepUrl,
+	getTeam: () => getTeam,
+	getToken: () => getToken,
+	getUpdateFlowDefinitionUrl: () => getUpdateFlowDefinitionUrl,
+	getUserByID: () => getUserByID,
+	getUserInfo: () => getUserInfo,
+	getVerifyChallengeProofUrl: () => getVerifyChallengeProofUrl,
+	introspect: () => introspect,
+	issueChallenge: () => issueChallenge,
+	listFlowDefinitions: () => listFlowDefinitions,
+	listSessions: () => listSessions,
+	listUsers: () => listUsers,
+	revokeMySession: () => revokeMySession,
+	revokeSession: () => revokeSession,
+	revokeToken: () => revokeToken,
+	submitFlowEvent: () => submitFlowEvent,
+	submitFlowStep: () => submitFlowStep,
+	updateFlowDefinition: () => updateFlowDefinition,
+	verifyChallengeProof: () => verifyChallengeProof
+});
+const getGetOpenIDConfigurationUrl = () => {
+	return `${getProxyPath()}/.well-known/openid-configuration`;
+};
+/**
+* Retrieve the OpenID Connect configuration
+* @summary Get OpenID Connect configuration
+*/
+const getOpenIDConfiguration = async (options) => {
+	return customFetch(getGetOpenIDConfigurationUrl(), {
+		...options,
+		method: "GET"
+	});
+};
+const getAuthorizeGetUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/auth/authorize?${stringifiedParams}` : `${getProxyPath()}/auth/authorize`;
+};
+/**
+* @summary Authorize a user
+*/
+const authorizeGet = async (params, options) => {
+	return customFetch(getAuthorizeGetUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
+const getAuthorizeDeviceUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/auth/device-authorization?${stringifiedParams}` : `${getProxyPath()}/auth/device-authorization`;
+};
+/**
+* @summary Authorize a device
+*/
+const authorizeDevice = async (params, options) => {
+	return customFetch(getAuthorizeDeviceUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
+const getEndSessionUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/auth/end-session?${stringifiedParams}` : `${getProxyPath()}/auth/end-session`;
+};
+/**
+* @summary End a session
+*/
+const endSession = async (params, options) => {
+	return customFetch(getEndSessionUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
+const getIntrospectUrl = () => {
+	return `${getProxyPath()}/auth/introspect`;
+};
+/**
+* @summary Introspect a token
+*/
+const introspect = async (introspectBody, options) => {
+	const formUrlEncoded = new URLSearchParams();
+	formUrlEncoded.append(`token`, introspectBody.token);
+	if (introspectBody.token_type_hint !== void 0) formUrlEncoded.append(`token_type_hint`, introspectBody.token_type_hint);
+	return customFetch(getIntrospectUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/x-www-form-urlencoded",
+			...options?.headers
+		},
+		body: formUrlEncoded
+	});
+};
+const getGetKeysUrl = () => {
+	return `${getProxyPath()}/auth/keys`;
+};
+/**
+* @summary Get public keys
+*/
+const getKeys = async (options) => {
+	return customFetch(getGetKeysUrl(), {
+		...options,
+		method: "GET"
+	});
+};
+const getRevokeTokenUrl = () => {
+	return `${getProxyPath()}/auth/revoke`;
+};
+/**
+* @summary Revoke an access token or refresh token
+*/
+const revokeToken = async (revokeTokenBody, options) => {
+	const formUrlEncoded = new URLSearchParams();
+	if (revokeTokenBody.token !== void 0) formUrlEncoded.append(`token`, revokeTokenBody.token);
+	if (revokeTokenBody.token_type_hint !== void 0) formUrlEncoded.append(`token_type_hint`, revokeTokenBody.token_type_hint);
+	return customFetch(getRevokeTokenUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/x-www-form-urlencoded",
+			...options?.headers
+		},
+		body: formUrlEncoded
+	});
+};
+const getGetTokenUrl = () => {
+	return `${getProxyPath()}/auth/token`;
+};
+/**
+* @summary Get accesstoken
+*/
+const getToken = async (getTokenBody, options) => {
+	const formUrlEncoded = new URLSearchParams();
+	if (getTokenBody.code !== void 0) formUrlEncoded.append(`code`, getTokenBody.code);
+	if (getTokenBody.client_assertion !== void 0) formUrlEncoded.append(`client_assertion`, getTokenBody.client_assertion);
+	if (getTokenBody.client_assertion_type !== void 0) formUrlEncoded.append(`client_assertion_type`, getTokenBody.client_assertion_type);
+	if (getTokenBody.client_id !== void 0) formUrlEncoded.append(`client_id`, getTokenBody.client_id);
+	if (getTokenBody.client_secret !== void 0) formUrlEncoded.append(`client_secret`, getTokenBody.client_secret);
+	if (getTokenBody.code_verifier !== void 0) formUrlEncoded.append(`code_verifier`, getTokenBody.code_verifier);
+	if (getTokenBody.grant_type !== void 0) formUrlEncoded.append(`grant_type`, getTokenBody.grant_type);
+	if (getTokenBody.redirect_uri !== void 0) formUrlEncoded.append(`redirect_uri`, getTokenBody.redirect_uri);
+	return customFetch(getGetTokenUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/x-www-form-urlencoded",
+			...options?.headers
+		},
+		body: formUrlEncoded
+	});
+};
+const getGetUserInfoUrl = () => {
+	return `${getProxyPath()}/auth/userinfo`;
+};
+/**
+* @summary Get user info
+*/
+const getUserInfo = async (options) => {
+	return customFetch(getGetUserInfoUrl(), {
+		...options,
+		method: "GET"
+	});
+};
+const getGetHealthUrl = () => {
+	return `${getProxyPath()}/healthz`;
+};
+/**
+* Check whether the server is healthy
+* @summary Check server health
+*/
+const getHealth = async (options) => {
+	return customFetch(getGetHealthUrl(), {
+		...options,
+		method: "GET"
+	});
+};
+const getGetLiveUrl = () => {
+	return `${getProxyPath()}/livez`;
+};
+/**
+* Check whether the server is started
+* @summary Check server liveness
+*/
+const getLive = async (options) => {
+	return customFetch(getGetLiveUrl(), {
+		...options,
+		method: "GET"
+	});
+};
+const getGetReadyUrl = () => {
+	return `${getProxyPath()}/readyz`;
+};
+/**
+* Check whether the server is ready to accept requests
+* @summary Check server readiness
+*/
+const getReady = async (options) => {
+	return customFetch(getGetReadyUrl(), {
+		...options,
+		method: "GET"
+	});
+};
+const getCreateUserUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/user?${stringifiedParams}` : `${getProxyPath()}/user`;
+};
+/**
+* @summary Create user
+*/
+const createUser = async (createUserBody, params, options) => {
+	return customFetch(getCreateUserUrl(params), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createUserBody)
+	});
+};
+const getListUsersUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/user?${stringifiedParams}` : `${getProxyPath()}/user`;
+};
+/**
+* @summary List users
+*/
+const listUsers = async (params, options) => {
+	return customFetch(getListUsersUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
+const getGetUserByIDUrl = (userId, params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/user/${userId}?${stringifiedParams}` : `${getProxyPath()}/user/${userId}`;
+};
+/**
+* @summary Get user by ID
+*/
+const getUserByID = async (userId, params, options) => {
+	return customFetch(getGetUserByIDUrl(userId, params), {
+		...options,
+		method: "GET"
+	});
+};
+const getCreateFlowUrl = () => {
+	return `${getProxyPath()}/flow`;
+};
+/**
+* Resolves a flow definition based on purpose + audience context and returns
+the first capability step. Creates a new session implicitly unless
+`session_id` is provided (for step-up / reauth on an existing session).
+
+The response contains an `id` field — the flow handle. Use it as the path
+parameter for all subsequent `/flow/{id}/submit` and `/flow/{id}/event` calls.
+
+The response also sets an encrypted `HttpOnly` cookie (`_zflow`) containing
+the flow's orchestration state (current step, collected data, history).
+The server is stateless between requests — all flow state lives in this
+cookie. The browser sends it automatically on subsequent requests.
+
+* @summary Start a new flow
+*/
+const createFlow = async (createFlowBody, options) => {
+	return customFetch(getCreateFlowUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createFlowBody)
+	});
+};
+const getGetFlowStepUrl = (id) => {
+	return `${getProxyPath()}/flow/${id}`;
+};
+/**
+* Returns the current capability step without advancing the state machine.
+Useful for page reloads or re-rendering after a network error.
+
+* @summary Get current step (re-render)
+*/
+const getFlowStep = async (id, options) => {
+	return customFetch(getGetFlowStepUrl(id), {
+		...options,
+		method: "GET"
+	});
+};
+const getSubmitFlowStepUrl = (id) => {
+	return `${getProxyPath()}/flow/${id}/submit`;
+};
+/**
+* Submits user input for the current step. The server validates,
+processes (e.g., verifies a credential), advances the state machine
+through any invisible steps, and returns the next visible step.
+
+The response sets an updated encrypted `HttpOnly` cookie (`_zflow`)
+with the new flow state. The server is stateless — all orchestration
+state is carried in this cookie between requests.
+
+**Important:** The `id` in the response may differ from the `id` used in
+the request. This happens when a flow pivots (pushes a new flow onto the
+stack) or when a stacked flow completes (auto-pops to the parent flow).
+Always use the `id` from the latest response for the next request.
+
+## Flow completion
+
+When `step.type` is `complete`, the flow is terminal. The `step.behavior`
+field tells the frontend what to do:
+
+| `behavior`   | Action                                                     |
+|------------- |------------------------------------------------------------|
+| `redirect`   | Navigate to `redirect_uri` (OIDC/SAML auth request done). |
+| `show`       | Render the step as a success screen (e.g., registration).  |
+
+A `complete` step is only returned when the **entire flow stack** is done.
+If a stacked flow (e.g., recovery pivoted from login) finishes, the server
+auto-pops to the parent flow and returns the parent's next step — the
+frontend never sees a `complete` for intermediate flows.
+
+* @summary Submit step data and advance
+*/
+const submitFlowStep = async (id, submitFlowStepBody, options) => {
+	return customFetch(getSubmitFlowStepUrl(id), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(submitFlowStepBody)
+	});
+};
+const getSubmitFlowEventUrl = (id) => {
+	return `${getProxyPath()}/flow/${id}/event`;
+};
+/**
+* Submits telemetry or fingerprint data from the frontend.
+Does not advance the state machine. Used for risk evaluation.
+
+* @summary Submit client-side event
+*/
+const submitFlowEvent = async (id, submitFlowEventBody, options) => {
+	return customFetch(getSubmitFlowEventUrl(id), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(submitFlowEventBody)
+	});
+};
+const getCreateAuthAttemptUrl = () => {
+	return `${getProxyPath()}/auth_attempts`;
+};
+/**
+* Starts a new authentication attempt. This is the entry point for the auth_attempts state machine.
+
+An attempt is an ephemeral (15-minute TTL) state machine that drives a single authentication round.
+It accepts factor challenges, verifies proofs, and completes into a session or handoff token.
+
+Accepts a project_id and challenge_nonce (from POST /bootstrap/challenge). For step-up re-auth,
+also include session_id to add factors to an existing session.
+
+* @summary Create a new authentication attempt
+*/
+const createAuthAttempt = async (createAuthAttemptBody, options) => {
+	return customFetch(getCreateAuthAttemptUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createAuthAttemptBody)
+	});
+};
+const getGetAuthAttemptUrl = (attemptId) => {
+	return `${getProxyPath()}/auth_attempts/${attemptId}`;
+};
+/**
+* Polls the current state of an authentication attempt.
+
+Returns the attempt's state, available factors for the next challenge,
+challenges issued so far, and any errors preventing progress.
+
+Use this for polling during long-running factor verifications (e.g., waiting for
+a federated IdP callback or a device flow).
+
+* @summary Get authentication attempt state
+*/
+const getAuthAttempt = async (attemptId, options) => {
+	return customFetch(getGetAuthAttemptUrl(attemptId), {
+		...options,
+		method: "GET"
+	});
+};
+const getIssueChallengeUrl = (attemptId) => {
+	return `${getProxyPath()}/auth_attempts/${attemptId}/challenges`;
+};
+/**
+* Issues a single-factor verification challenge within an auth attempt.
+
+This advances the authentication state machine by requesting a specific factor method
+(password, passkey, TOTP, OTP via SMS, etc.). The server responds with challenge details
+including method, metadata, and any UI hints. The client then verifies the proof
+by calling POST /auth_attempts/{attempt_id}/challenges/{challenge_id}/verify.
+
+* @summary Issue a factor challenge
+*/
+const issueChallenge = async (attemptId, issueChallengeBody, options) => {
+	return customFetch(getIssueChallengeUrl(attemptId), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(issueChallengeBody)
+	});
+};
+const getVerifyChallengeProofUrl = (attemptId, challengeId) => {
+	return `${getProxyPath()}/auth_attempts/${attemptId}/challenges/${challengeId}/verify`;
+};
+/**
+* Submits a proof (credential, code, assertion) to verify a factor challenge.
+
+The proof format depends on the challenge method. For example:
+- `password` method: { password: "…" }
+- `totp` method: { totp: { code: "123456" } }
+- `passkey` method: { passkey: { assertion: "…" } }
+- `recovery_code` method: { recovery_code: "…" }
+
+On successful verification, the factor is written to the auth attempt.
+The attempt moves to the next pending challenge or completes if all required factors are verified.
+
+* @summary Verify a factor proof
+*/
+const verifyChallengeProof = async (attemptId, challengeId, verifyChallengeProofBody, options) => {
+	return customFetch(getVerifyChallengeProofUrl(attemptId, challengeId), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(verifyChallengeProofBody)
+	});
+};
+const getCreateHandoffUrl = (attemptId) => {
+	return `${getProxyPath()}/auth_attempts/${attemptId}/handoff`;
+};
+/**
+* Completes the authentication attempt and mints a `handoff_token`.
+
+Call this after all required factors have been verified and the attempt is in `completed` state.
+The handoff token is short-lived (≤60 seconds) and must be exchanged at
+POST /sessions/exchange to receive the final session and session_token.
+
+The handoff token is:
+- Single-use (atomic exchange, no retry)
+- Audience-bound (requires matching project key for exchange)
+- Idempotency-safe within a 5-minute window (see conventions)
+
+* @summary Complete authentication and create handoff token
+*/
+const createHandoff = async (attemptId, options) => {
+	return customFetch(getCreateHandoffUrl(attemptId), {
+		...options,
+		method: "POST"
+	});
+};
+const getCreateProjectUrl = () => {
+	return `${getProxyPath()}/projects`;
+};
+/**
+* @summary Create project
+*/
+const createProject = async (createProjectBody, options) => {
+	return customFetch(getCreateProjectUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createProjectBody)
+	});
+};
+const getGetProjectUrl = (projectId) => {
+	return `${getProxyPath()}/projects/${projectId}`;
+};
+/**
+* Returns the current state of a project.
+
+* @summary Get project
+*/
+const getProject = async (projectId, options) => {
+	return customFetch(getGetProjectUrl(projectId), {
+		...options,
+		method: "GET"
+	});
+};
+const getCreateSessionUrl = () => {
+	return `${getProxyPath()}/sessions`;
+};
+/**
+* Creates an anonymous session shell with no user and no factors (`state: building`).
+
+This is optional — an `auth_attempt` will create a session implicitly if none is provided.
+Use this explicitly when you want to:
+- Pre-allocate a `session_id` before the user is known, so device/telemetry signals
+can be correlated with the eventual authenticated session from the start.
+- Track anonymous state (bot detection, device fingerprint) that survives until authentication.
+
+The returned `session_token` authorises GET and DELETE on this session.
+It is superseded when a handoff exchange completes — clients must replace it at that point.
+
+Anonymous sessions expire aggressively (10-minute TTL). The TTL resets to the configured
+full session TTL when the first authentication factor is written via a completing `auth_attempt`.
+
+* @summary Create an anonymous session shell
+*/
+const createSession = async (createSessionBody, options) => {
+	return customFetch(getCreateSessionUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createSessionBody)
+	});
+};
+const getListSessionsUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/sessions?${stringifiedParams}` : `${getProxyPath()}/sessions`;
+};
+/**
+* Returns a paginated list of sessions for a project.
+Requires a project service key (OAuth2 client credentials).
+
+* @summary List sessions
+*/
+const listSessions = async (params, options) => {
+	return customFetch(getListSessionsUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
+const getExchangeHandoffUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/sessions/exchange?${stringifiedParams}` : `${getProxyPath()}/sessions/exchange`;
+};
+/**
+* Consumes a one-time `handoff_token` minted by `POST /auth_attempts/{id}/handoff`
+and returns the resulting session and a `session_token`.
+
+The server resolves the originating `auth_attempt` from the token and then:
+
+| Originating auth_attempt | Outcome |
+|---|---|
+| No `session_id` | A new authenticated session is **created**. |
+| `session_id` points to an anonymous shell | Existing session is **upgraded** — user and factors written in, TTL reset to full session TTL. |
+| `session_id` points to an active session (step-up) | Existing session is **upgraded** — new factors merged, `assurance_levels[]` expanded. |
+
+The response shape is identical in all three cases.
+
+The `session_token` supersedes any previously issued `session_token` for the same session.
+Clients must replace their stored token at this point.
+
+Requires a project service key (OAuth2 client credentials).
+
+* @summary Exchange handoff token for a session
+*/
+const exchangeHandoff = async (exchangeHandoffBody, params, options) => {
+	return customFetch(getExchangeHandoffUrl(params), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(exchangeHandoffBody)
+	});
+};
+const getGetSessionUrl = (sessionId, params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/sessions/${sessionId}?${stringifiedParams}` : `${getProxyPath()}/sessions/${sessionId}`;
+};
+/**
+* Returns the current state of a session including its factors and all currently
+satisfied assurance levels.
+
+`assurance_levels[]` may shrink over time as factor freshness windows expire,
+without the session itself expiring. Use step-up authentication (a new `auth_attempt`
+against the same `session_id`) to restore a dropped assurance level.
+
+* @summary Get session state
+*/
+const getSession = async (sessionId, params, options) => {
+	return customFetch(getGetSessionUrl(sessionId, params), {
+		...options,
+		method: "GET"
+	});
+};
+const getRevokeSessionUrl = (sessionId, params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/sessions/${sessionId}?${stringifiedParams}` : `${getProxyPath()}/sessions/${sessionId}`;
+};
+/**
+* Revokes the session immediately (`state: revoked`). This is the logout operation.
+
+The session_token issued at creation (or superseded by a handoff exchange) is required.
+After revocation, any tokens derived from this session are invalidated.
+
+* @summary Revoke session
+*/
+const revokeSession = async (sessionId, params, options) => {
+	return customFetch(getRevokeSessionUrl(sessionId, params), {
+		...options,
+		method: "DELETE"
+	});
+};
+const getGetMySessionUrl = () => {
+	return `${getProxyPath()}/sessions/me`;
+};
+/**
+* Returns the current state of the current session including its factors and all currently
+satisfied assurance levels.
+
+`assurance_levels[]` may shrink over time as factor freshness windows expire,
+without the session itself expiring. Use step-up authentication (a new `auth_attempt`
+against the same `session_id`) to restore a dropped assurance level.
+
+* @summary Get my session state
+*/
+const getMySession = async (options) => {
+	return customFetch(getGetMySessionUrl(), {
+		...options,
+		method: "GET"
+	});
+};
+const getRevokeMySessionUrl = () => {
+	return `${getProxyPath()}/sessions/me`;
+};
+/**
+* Revokes the session immediately (`state: revoked`). This is the logout operation.
+
+The __nextgen_session cookie issued at creation (or superseded by a handoff exchange) is required.
+After revocation, any tokens derived from this session are invalidated including the cookie itself, which is cleared in the response.
+
+* @summary Revoke my session
+*/
+const revokeMySession = async (options) => {
+	return customFetch(getRevokeMySessionUrl(), {
+		...options,
+		method: "DELETE"
+	});
+};
+const getCreateSchemaUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/schemas?${stringifiedParams}` : `${getProxyPath()}/schemas`;
+};
+/**
+* Create a new schema. The schema definition must include a unique $id field,
+which will be used to identify the schema in future requests. The $id must
+be a valid URI and should ideally point to the location where the schema
+can be accessed.
+
+The schema can either be a concrete schema, e.g. a user schema, or a
+schema-url which will be resolved by the server.
+
+* @summary Create new schema
+*/
+const createSchema = async (createSchemaBody, params, options) => {
+	return customFetch(getCreateSchemaUrl(params), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createSchemaBody)
+	});
+};
+const getGetSchemaByIdUrl = (id, params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/schemas/${id}?${stringifiedParams}` : `${getProxyPath()}/schemas/${id}`;
+};
+/**
+* Get a schema by its ID. This will return the default revision of the schema.
+* @summary Get schema by ID
+*/
+const getSchemaById = async (id, params, options) => {
+	return customFetch(getGetSchemaByIdUrl(id, params), {
+		...options,
+		method: "GET"
+	});
+};
+const getCreateFlowDefinitionUrl = () => {
+	return `${getProxyPath()}/flow_definitions`;
+};
+/**
+* Creates a new flow definition.
+Flow definitions are templates that define the sequence of steps (capabilities)
+for a particular user journey (e.g., registration, login, password reset).
+
+Flow definitions are created based on the flow meta schema, which includes the flow's purpose, audience, and the steps involved.
+
+* @summary Create a new flow definition
+*/
+const createFlowDefinition = async (createFlowDefinitionBody, options) => {
+	return customFetch(getCreateFlowDefinitionUrl(), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createFlowDefinitionBody)
+	});
+};
+const getListFlowDefinitionsUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/flow_definitions?${stringifiedParams}` : `${getProxyPath()}/flow_definitions`;
+};
+/**
+* Retrieves a list of all flow definitions.
+This endpoint can be used to view existing flow definitions and their configurations.
+
+* @summary List flow definitions
+*/
+const listFlowDefinitions = async (params, options) => {
+	return customFetch(getListFlowDefinitionsUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
+const getGetFlowDefinitionUrl = (id) => {
+	return `${getProxyPath()}/flow_definitions/${id}`;
+};
+/**
+* Get a flow definition by id
+* @summary Get a flow definition by id
+*/
+const getFlowDefinition = async (id, options) => {
+	return customFetch(getGetFlowDefinitionUrl(id), {
+		...options,
+		method: "GET"
+	});
+};
+const getUpdateFlowDefinitionUrl = (id) => {
+	return `${getProxyPath()}/flow_definitions/${id}`;
+};
+/**
+* Update a flow definition by id
+* @summary Update a flow definition by id
+*/
+const updateFlowDefinition = async (id, updateFlowDefinitionBody, options) => {
+	return customFetch(getUpdateFlowDefinitionUrl(id), {
+		...options,
+		method: "PATCH",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(updateFlowDefinitionBody)
+	});
+};
+const getDeleteFlowDefinitionUrl = (id) => {
+	return `${getProxyPath()}/flow_definitions/${id}`;
+};
+/**
+* Delete a flow definition by id
+* @summary Delete a flow definition by id
+*/
+const deleteFlowDefinition = async (id, options) => {
+	return customFetch(getDeleteFlowDefinitionUrl(id), {
+		...options,
+		method: "DELETE"
+	});
+};
+const getCreateTeamUrl = (params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/teams?${stringifiedParams}` : `${getProxyPath()}/teams`;
+};
+/**
+* @summary Create team
+*/
+const createTeam = async (params, createTeamBody, options) => {
+	return customFetch(getCreateTeamUrl(params), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createTeamBody)
+	});
+};
+const getGetTeamUrl = (teamId, params) => {
+	const normalizedParams = new URLSearchParams();
+	Object.entries(params || {}).forEach(([key, value]) => {
+		if (value !== void 0) normalizedParams.append(key, value === null ? "null" : value.toString());
+	});
+	const stringifiedParams = normalizedParams.toString();
+	return stringifiedParams.length > 0 ? `${getProxyPath()}/teams/${teamId}?${stringifiedParams}` : `${getProxyPath()}/teams/${teamId}`;
+};
+/**
+* Returns the current state of a team.
+
+* @summary Get team
+*/
+const getTeam = async (teamId, params, options) => {
+	return customFetch(getGetTeamUrl(teamId, params), {
+		...options,
+		method: "GET"
+	});
+};
+//#endregion
+//#region ../api/dist/runtime/api-factory.mjs
+/**
+* Factory for the typed Zitadel client every consumer reaches for.
+*
+* Wraps the orval-generated endpoints in a {@link Proxy} so each
+* generated function sees the right base URL and (optionally) the
+* right bearer token at call time — without the caller having to
+* thread either through every operation, and without exposing the
+* module-globals (`setProxyPath` / `setApiAuthToken`) as part of the
+* public API.
+*
+* Per-instance isolation: multiple clients can coexist in one process
+* (different servers, different tokens). Their Proxy `get` traps set
+* the globals synchronously before invoking the underlying generated
+* function, which reads them at the top of `customFetch` before any
+* `await`. Two clients running interleaved within a single JS turn
+* are safe; two clients running in parallel across awaits could
+* clobber each other — not a pattern any current consumer uses.
+*/
+/**
+* Build a typed Zitadel client pre-bound to a base URL and (optionally)
+* a bearer token. Every method on the returned object mirrors a
+* generated orval function:
+*
+*     const client = createZitadelClient({ baseUrl, token });
+*     await client.createProject({ previewOrigins: [] });
+*     await client.createSchema(body, { project_id });
+*/
+function createZitadelClient(opts) {
+	const baseUrl = opts.baseUrl.replace(/\/+$/, "");
+	return new Proxy(zitadelNextGen_exports, { get(target, prop, receiver) {
+		const value = Reflect.get(target, prop, receiver);
+		if (typeof value !== "function") return value;
+		return (...args) => {
+			setProxyPath(baseUrl);
+			setApiAuthToken(opts.token);
+			return value(...args);
+		};
+	} });
+}
+/**
+* Legacy entry point: builds a client with only the base URL set, no
+* token. Components and SDKs that don't carry an auth token (browser
+* flows authenticated by platform cookies) still consume this name.
+* Equivalent to `createZitadelClient({ baseUrl: apiBase })`.
+*/
+function createApi(apiBase) {
+	return createZitadelClient({ baseUrl: apiBase });
+}
+//#endregion
+//#region ../api/dist/runtime/config.mjs
+let currentProject = null;
+/**
+* Per-project API client cache. Ensures `getApi(project)` returns the
+* same instance for the same project handle — no re-wrapping on every call.
+*/
+const apiCache = /* @__PURE__ */ new WeakMap();
+/**
+* Returns a typed API client for the given project, with the base URL
+* pre-bound. Cached per project handle — safe to call multiple times.
+*
+* ```ts
+* const project = configureZitadel({ ... });
+* export const api = getApi(project);
+* ```
+*/
+function getApi(project) {
+	let api = apiCache.get(project);
+	if (!api) {
+		api = createApi(project.proxyPath);
+		apiCache.set(project, api);
+	}
+	return api;
+}
+/**
+* Returns the current project handle, or `null` if {@link configureZitadel}
+* has not been called yet.
+*/
+function getZitadelConfig() {
+	return currentProject;
+}
+//#endregion
+//#region src/orchestrator/api-client.ts
+const apiRequestInit = { credentials: "include" };
+async function startFlow(api, input) {
+	return api.createFlow(input, apiRequestInit);
+}
+async function submitStep(api, id, body) {
+	try {
+		return await api.submitFlowStep(id, body, apiRequestInit);
+	} catch (error) {
+		if (error instanceof ApiError && error.status === 400 && isFlowResponse(error.body)) return error.body;
+		throw error;
+	}
+}
+function isFlowResponse(body) {
+	return typeof body === "object" && body !== null && "step" in body;
+}
+async function getCurrentStep(api, id) {
+	return api.getFlowStep(id, apiRequestInit);
+}
+/**
+* Exchange a terminal-flow `handoff_token` for an authenticated session.
+* The server sets the `__nextgen_session` HttpOnly cookie on success.
+*
+* Uses the generated `exchangeHandoff` client which handles the
+* `project_id` query parameter via {@link ExchangeHandoffParams}.
+*/
+async function exchangeSession(api, body, params) {
+	return api.exchangeHandoff(body, params, apiRequestInit);
+}
+//#endregion
+//#region src/orchestrator/branding-to-tokens.ts
+/**
+* Branding -> CSS token bridge.
+*
+* Per `docs/design/branding/README.md` the orchestrator owns theming. Templates
+* never emit `<style>` blocks; they only structure HTML. This module translates
+* the `Branding` JSON into a CSSStyleSheet of `:host { --zl-* }` declarations
+* and applies it via `shadowRoot.adoptedStyleSheets`.
+*
+* Dark-mode overrides are emitted as `:host([data-theme="dark"]) { ... }`
+* (matching `docs/design/branding/tokens.md`). Resolution between
+* `light | dark | auto` happens in `<zitadel-login>`.
+*
+* Base layer: the design-tokens package ships the full `--zl-*` set as both a
+* `.css` file (for host pages) and a `tokensCss` string (for shadow roots and
+* SSR). We adopt the string into every orchestrator shadow root so atoms
+* paint correctly even when the host page didn't `@import` tokens.css — the
+* orchestrator is meant to drop into any page.
+*/
+const RADIUS_MAP = {
+	none: "0",
+	sm: "0.25rem",
+	md: "0.5rem",
+	lg: "0.75rem",
+	full: "9999px"
+};
+const DENSITY_MAP = {
+	compact: {
+		"--zl-spacing-03": "0.75rem",
+		"--zl-spacing-05": "1.5rem"
+	},
+	regular: {},
+	comfortable: {
+		"--zl-spacing-03": "1.25rem",
+		"--zl-spacing-05": "2.25rem"
+	}
+};
+const PALETTE_MAP = {
+	primary: ["--zl-color-surface-default-white"],
+	on_primary: ["--zl-color-text-button-default"],
+	background: ["--zl-color-surface-default-black"],
+	surface: ["--zl-color-surface-default-primary-gray"],
+	muted: ["--zl-color-surface-default-secondary-gray"],
+	border: ["--zl-color-border-default-gray-200", "--zl-color-border-default-gray-100"],
+	text: ["--zl-color-text-primary-white"],
+	text_muted: ["--zl-color-text-secondary-gray"],
+	link: ["--zl-color-text-subtitle-pink"],
+	success: [
+		"--zl-color-text-success",
+		"--zl-color-border-success",
+		"--zl-color-icon-success"
+	],
+	warning: ["--zl-color-text-subtitle-orange"],
+	error: [
+		"--zl-color-text-error",
+		"--zl-color-border-error",
+		"--zl-color-icon-error"
+	]
+};
+/**
+* Build a CSS string of `:host { --zl-* }` declarations from a Branding
+* payload. Light values land on `:host`; dark overrides land on
+* `:host([data-theme="dark"])`.
+*/
+function buildBrandingStylesheet(branding, options = {}) {
+	const lightDecls = collectDeclarations(branding);
+	const darkPalette = branding?.theme?.dark?.palette;
+	const darkDecls = darkPalette ? mapPalette(darkPalette) : {};
+	const blocks = [];
+	if (Object.keys(lightDecls).length > 0) blocks.push(formatBlock(":host", lightDecls));
+	if (Object.keys(darkDecls).length > 0) blocks.push(formatBlock(":host([data-theme=\"dark\"])", darkDecls));
+	if (options.resolvedTheme === "dark" && darkPalette) {
+		const merged = {
+			...lightDecls,
+			...darkDecls
+		};
+		blocks.length = 0;
+		blocks.push(formatBlock(":host", merged));
+	}
+	return blocks.join("\n");
+}
+function collectDeclarations(branding) {
+	if (!branding) return {};
+	const decls = {};
+	Object.assign(decls, mapPalette(branding.palette));
+	Object.assign(decls, mapTypography(branding.typography));
+	Object.assign(decls, mapShape(branding.shape));
+	return decls;
+}
+function mapPalette(palette) {
+	if (!palette) return {};
+	const out = {};
+	for (const [key, varNames] of Object.entries(PALETTE_MAP)) {
+		const value = palette[key];
+		if (typeof value === "string" && value.length > 0) for (const varName of varNames) out[varName] = value;
+	}
+	return out;
+}
+function mapTypography(typography) {
+	if (!typography) return {};
+	const out = {};
+	if (typography.font_family) {
+		out["--zl-font-family-sans"] = typography.font_family;
+		out["--zl-font-family-heading"] = typography.font_family;
+	}
+	if (typography.font_family_mono) out["--zl-font-family-mono"] = typography.font_family_mono;
+	const scale = clamp(typography.scale ?? 1, .75, 1.25);
+	if (scale !== 1) out["--zl-font-scale"] = `${scale}`;
+	return out;
+}
+function mapShape(shape) {
+	if (!shape) return {};
+	const out = {};
+	if (shape.radius && RADIUS_MAP[shape.radius]) {
+		const radius = RADIUS_MAP[shape.radius];
+		out["--zl-radius-s"] = radius;
+		out["--zl-radius-m"] = radius === "0" ? "0" : `calc(${radius} * 1.5)`;
+		out["--zl-radius-l"] = radius === "0" ? "0" : `calc(${radius} * 2)`;
+	}
+	if (shape.density) Object.assign(out, DENSITY_MAP[shape.density]);
+	return out;
+}
+function formatBlock(selector, decls) {
+	return `${selector} {\n${Object.entries(decls).map(([prop, value]) => `  ${prop}: ${value};`).join("\n")}\n}`;
+}
+function clamp(value, min, max) {
+	if (Number.isNaN(value)) return min;
+	return Math.min(max, Math.max(min, value));
+}
+let baseTokenSheet;
+function getBaseTokenSheet() {
+	if (typeof CSSStyleSheet === "undefined") return void 0;
+	if (!baseTokenSheet) {
+		baseTokenSheet = new CSSStyleSheet();
+		baseTokenSheet.replaceSync(tokensCss.replaceAll(":root,\n[data-theme=\"dark\"]", ":host,\n:host([data-theme=\"dark\"])").replaceAll("[data-theme=\"light\"]", ":host([data-theme=\"light\"])"));
+	}
+	return baseTokenSheet;
+}
+/**
+* Adopt the design-system base token layer onto a `ShadowRoot`. Safe to call
+* many times — the underlying constructable sheet is shared across every
+* orchestrator instance and de-duplicated in the adopted list.
+*/
+function applyBaseTokens(shadowRoot) {
+	const sheet = getBaseTokenSheet();
+	if (!sheet) return;
+	const existing = Array.isArray(shadowRoot.adoptedStyleSheets) ? shadowRoot.adoptedStyleSheets : [];
+	if (existing.includes(sheet)) return;
+	try {
+		shadowRoot.adoptedStyleSheets = [sheet, ...existing];
+	} catch {}
+}
+/**
+* Apply a branding payload as a `--zl-*` overrides layer on top of the base
+* token sheet. Subsequent calls replace the previous override sheet so a new
+* branding payload paints cleanly without leaking older declarations.
+*
+* Callers should run `applyBaseTokens(shadowRoot)` first (once per shadow
+* root) so the base values exist before branding patches them.
+*/
+function applyBrandingTokens(shadowRoot, branding, resolvedTheme) {
+	const css = buildBrandingStylesheet(branding, { resolvedTheme });
+	if (typeof CSSStyleSheet === "undefined") return;
+	const sheet = new CSSStyleSheet();
+	sheet.replaceSync(css);
+	const previous = shadowRoot.__zlTokenSheet;
+	shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets.filter((s) => s !== previous), sheet];
+	shadowRoot.__zlTokenSheet = sheet;
+}
+function resolveTheme(branding) {
+	const mode = branding?.theme?.mode ?? "dark";
+	if (mode === "light") return "light";
+	if (mode === "dark") return "dark";
+	if (typeof matchMedia === "function") return matchMedia("(prefers-color-scheme: light)").matches ? "light" : "dark";
+	return "dark";
+}
+//#endregion
+//#region ../api/dist/generated/model/index.mjs
+const CreateFlow201BrandingLayout = {
+	centered: "centered",
+	split: "split"
+};
+//#endregion
+//#region src/orchestrator/branding-validator.ts
+/**
+* Lightweight paint-time validator for `Branding` payloads.
+*
+* Per `docs/design/branding/schema.md` §Shape invariants:
+*
+* 1. Every referenced URL is https.
+* 2. `layout` is in the documented enum.
+* 3. `liquid_template` shape checks happen elsewhere (security pipeline runs
+*    server-side; structural validator is deferred until the full atom set
+*    lands).
+*
+* Failures are non-fatal: we collect issues, log a dev-build warning, and
+* return a sanitised payload with the offending fields stripped (set to
+* `undefined`) so the orchestrator falls back to the bundled defaults.
+*/
+const VALID_LAYOUTS = new Set(Object.values(CreateFlow201BrandingLayout));
+function validateBranding(input) {
+	if (!input) return {
+		branding: void 0,
+		issues: []
+	};
+	const issues = [];
+	const out = { ...input };
+	if (out.layout && !VALID_LAYOUTS.has(out.layout)) {
+		issues.push(`Unknown layout "${out.layout}" — falling back to "centered".`);
+		out.layout = CreateFlow201BrandingLayout.centered;
+	}
+	out.logo_url = sanitiseUrl(out.logo_url, "logo_url", issues);
+	out.font_url = sanitiseUrl(out.font_url, "font_url", issues);
+	out.hero_url = sanitiseUrl(out.hero_url, "hero_url", issues);
+	if (out.assets) out.assets = {
+		logo_dark: sanitiseUrl(out.assets.logo_dark, "assets.logo_dark", issues),
+		favicon: sanitiseUrl(out.assets.favicon, "assets.favicon", issues),
+		background_image: sanitiseUrl(out.assets.background_image, "assets.background_image", issues)
+	};
+	return {
+		branding: out,
+		issues
+	};
+}
+function sanitiseUrl(value, field, issues) {
+	if (value == null || value === "") return;
+	try {
+		const parsed = new URL(value);
+		if (parsed.protocol !== "https:") {
+			issues.push(`${field} must use https (got "${parsed.protocol}") — dropped.`);
+			return;
+		}
+		return parsed.toString();
+	} catch {
+		issues.push(`${field} is not a valid URL — dropped.`);
+		return;
+	}
+}
+//#endregion
+//#region src/orchestrator/font-loader.ts
+/**
+* Inject `branding.font_url` as `<link rel="stylesheet">` inside the
+* `<zitadel-login>` Shadow DOM. Per `docs/design/branding/templates.md`:
+*
+*   "The `font_url` stylesheet is injected by the orchestrator; the template
+*    does not emit the `<link>` tag itself."
+*
+* Idempotent: calling with the same URL is a no-op; calling with a new URL
+* replaces the previous link. Calling with `null`/`undefined` removes any
+* previously injected link.
+*/
+const LINK_ID = "zl-font-link";
+function applyFontUrl(shadowRoot, fontUrl) {
+	const existing = shadowRoot.getElementById?.(LINK_ID);
+	if (!fontUrl) {
+		existing?.remove();
+		return;
+	}
+	if (existing && existing.href === fontUrl) return;
+	existing?.remove();
+	const link = (shadowRoot.ownerDocument ?? document).createElement("link");
+	link.id = LINK_ID;
+	link.rel = "stylesheet";
+	link.href = fontUrl;
+	shadowRoot.prepend(link);
+}
+//#endregion
+//#region src/orchestrator/mandatory-gates.ts
+const MANDATORY_GATES_MARKER = "ZL_MANDATORY_GATES";
+const mandatoryGatesMarkerComment = `<!--${MANDATORY_GATES_MARKER}-->`;
+function patchMandatoryGates(html, step, locale) {
+	const template = document.createElement("template");
+	template.innerHTML = html;
+	const fragment = template.content;
+	const additions = collectMissingAtoms(fragment, step, locale);
+	const marker = findMarkerComment(fragment);
+	if (marker?.parentNode) {
+		for (const node of additions) marker.parentNode.insertBefore(node, marker);
+		marker.remove();
+	} else for (const node of additions) fragment.appendChild(node);
+	return template.innerHTML;
+}
+function collectMissingAtoms(fragment, step, locale) {
+	const additions = [];
+	if (step.fields) for (const [name, field] of Object.entries(step.fields)) {
+		if (!field.required) continue;
+		if (hasFieldFor(fragment, name)) continue;
+		additions.push(buildField(name, field.text_key, field.type, locale, field.required));
+	}
+	if (step.actions && !hasPrimaryButton(fragment)) {
+		const primary = Object.entries(step.actions).find(([, action]) => action.primary);
+		if (primary) {
+			const [name, action] = primary;
+			additions.push(buildSubmit(name, action.text_key, locale));
+		}
+	}
+	return additions;
+}
+function hasPrimaryButton(fragment) {
+	return Boolean(fragment.querySelector("zl-button[hierarchy=\"primary\"]"));
+}
+function hasFieldFor(fragment, name) {
+	for (const field of fragment.querySelectorAll("zl-field")) if (field.getAttribute("name") === name) return true;
+	return false;
+}
+function findMarkerComment(fragment) {
+	const walker = (fragment.ownerDocument ?? document).createTreeWalker(fragment, NodeFilter.SHOW_COMMENT);
+	let node = walker.nextNode();
+	while (node) {
+		if (node.nodeValue?.trim() === "ZL_MANDATORY_GATES") return node;
+		node = walker.nextNode();
+	}
+	return null;
+}
+function buildField(name, textKey, type, locale, required) {
+	const el = document.createElement("zl-field");
+	el.setAttribute("name", name);
+	el.setAttribute("label", lookup(locale, textKey ?? name));
+	el.setAttribute("type", type);
+	if (required) el.setAttribute("required", "");
+	return el;
+}
+function buildSubmit(name, textKey, locale) {
+	const el = document.createElement("zl-button");
+	el.setAttribute("hierarchy", "primary");
+	el.setAttribute("size", "medium");
+	el.setAttribute("type", "submit");
+	el.setAttribute("block", "");
+	el.setAttribute("action", name);
+	el.setAttribute("label", lookup(locale, textKey ?? "submit.continue"));
+	return el;
+}
+function lookup(locale, key) {
+	return locale[key] ?? key;
+}
+//#endregion
+//#region src/orchestrator/templates/auth-form.liquid.ts
+/**
+* `auth-form` partial — Sign in and Sign up screens (Figma screens file).
+*
+* Sign up 2xl frame: `6593:141741` (card `6593:141743`, attribution `6593:141767`).
+* Sign in 2xl frame: `6593:141983`, card `6593:141985`, stack `6593:141989`
+* (email + password + forgot link + CTAs on one step).
+* Sign-in errors: wrong credentials `6602:180268`, server alert `6594:125237`.
+*
+* Figma `Field+CTAs` stacks fields + CTAs in one column at 16px (`spacing-03`).
+* Primary/secondary are 48px buttons; register / sign_in are body copy with a
+* purple text link (24px row) — not `<zl-button hierarchy="text">`.
+*/
+const authFormTemplate = String.raw`
+<zl-page-shell data-zl-template-root>
+  {% if branding.logo_url %}
+    <img slot="header" class="zl-card-logo" src="{{ branding.logo_url }}" alt="" />
+  {% endif %}
+  <zl-card>
+    <h1 slot="header" class="zl-card-title">{{ step.texts.title_key | t: identity.display_name }}</h1>
+    {% if step.texts.description_key %}
+      <p slot="header" class="zl-card-subtitle">{{ step.texts.description_key | t: identity.display_name }}</p>
+    {% endif %}
+
+    {% if errors and errors.size > 0 %}
+      {% for err in errors %}
+        {% if err | formLevelError %}
+          {% assign alert_heading = err.text_key | alertHeading %}
+          {% assign alert_body = err.text_key | alertBody %}
+          <zl-alert severity="error"{% if alert_heading != "" %} heading="{{ alert_heading | t }}"{% endif %}>
+            {% if alert_body != "" %}{{ alert_body | t }}{% elsif err.text_key %}{{ err.text_key | t }}{% else %}{{ err.message }}{% endif %}
+          </zl-alert>
+        {% endif %}
+      {% endfor %}
+    {% endif %}
+
+    {% for entry in fields %}
+      {% assign field_placeholder = entry[1].text_key | fieldPlaceholder %}
+      {% assign field_help = entry[1].text_key | fieldHelp %}
+      {% assign field_err = entry[0] | fieldError: errors %}
+      {% assign autocomplete_val = '' %}
+      {% if entry[0] == 'email' %}
+        {% assign autocomplete_val = 'email' %}
+      {% elsif entry[1].type == 'password' and step.name == 'register' %}
+        {% assign autocomplete_val = 'new-password' %}
+      {% elsif entry[1].type == 'password' %}
+        {% assign autocomplete_val = 'current-password' %}
+      {% endif %}
+      <zl-field
+        name="{{ entry[0] }}"
+        label="{{ entry[1].text_key | t }}"
+        type="{{ entry[1].type }}"
+        value="{{ entry[1].value }}"
+        {% if autocomplete_val != '' %}autocomplete="{{ autocomplete_val }}"{% endif %}
+        {% if entry[1].required %}required{% endif %}
+        {% if field_placeholder != "" %}placeholder="{{ field_placeholder }}"{% endif %}
+        {% if field_err != "" %}invalid error="{{ field_err }}"{% endif %}
+      >
+        {% if field_help != "" %}
+          <span slot="help">{{ field_help }}</span>
+        {% endif %}
+      </zl-field>
+    {% endfor %}
+
+    {% if fields.email and fields.password and step.name == 'identifier' %}
+      <p class="zl-card-forgot">
+        <a href="#" class="zl-card-forgot__link" data-action="recover">{{ 'action.forgot_password' | t }}</a>
+      </p>
+    {% endif %}
+
+    {% for entry in actions %}
+      {% if entry[1].primary %}
+        <zl-button
+          hierarchy="primary"
+          size="medium"
+          type="submit"
+          block
+          action="{{ entry[0] }}"
+          label="{{ entry[1].text_key | t }}"
+          {% if loading %}loading{% endif %}
+        ></zl-button>
+      {% endif %}
+    {% endfor %}
+
+    {% if actions.passkey %}
+      <zl-button
+        hierarchy="secondary"
+        size="medium"
+        block
+        action="passkey"
+        label="{{ actions.passkey.text_key | t }}"
+      ></zl-button>
+    {% endif %}
+
+    {% if actions.register %}
+      <p class="zl-card-nav">
+        {{ 'identifier.action.register.lead' | t }}<a href="#" class="zl-card-nav__link" data-action="register">{{ 'identifier.action.register.link' | t }}</a>
+      </p>
+    {% endif %}
+
+    {% if actions.sign_in %}
+      <p class="zl-card-nav">
+        {{ 'register.action.sign_in.lead' | t }}<a href="#" class="zl-card-nav__link" data-action="sign_in">{{ 'register.action.sign_in.link' | t }}</a>
+      </p>
+    {% endif %}
+
+    {% if challenge and challenge.method == "passkey" %}
+      <zl-passkey
+        ceremony="{{ challenge.options.ceremony | default: 'authenticate' }}"
+        challenge-id="{{ challenge.challenge_id }}"
+        options='{{ challenge.options | json }}'
+      ></zl-passkey>
+    {% endif %}
+
+    {% mandatory_gates %}
+  </zl-card>
+</zl-page-shell>
+`;
+//#endregion
+//#region src/orchestrator/templates/default.liquid.ts
+/**
+* Bundled `default.liquid` master template.
+*
+* Renders the four target Figma auth screens (Sign in, Sign up, Passkey
+* upsell, Signed in) by including the appropriate partial based on
+* `step.name`. Tenant-specific layouts (`branding.layout`) replace the
+* outer chrome only — the per-step partials stay shared so atom output
+* tracks the design system without each tenant re-implementing it.
+*
+* Spec: docs/design/branding/templates.md.
+*/
+const defaultTemplate = String.raw`
+{%- if step.name == 'signed-in' or step.complete == 'show' -%}
+  {%- include 'signed-in' -%}
+{%- elsif step.name == 'passkey' or step.name == 'passkey-upsell' or step.name == 'passkey-setup' or step.name == 'passkey-login' -%}
+  {%- include 'passkey-upsell' -%}
+{%- else -%}
+  {%- include 'auth-form' -%}
+{%- endif -%}
+`;
+/**
+* Layout chrome injected as an `adoptedStyleSheet` on the orchestrator's
+* shadow root. Provides the page background and the attribution-footer
+* positioning that lives *outside* any template — the rest of the visual
+* surface is owned by the `<zl-page-shell>` / `<zl-card>` atoms the
+* templates render. Token references resolve against the
+* `@zitadel/design-tokens` CSS variables that are present on
+* `:host` via the branding stylesheet.
+*/
+const layoutChromeCss = `
+:host {
+  display: block;
+  min-height: 100%;
+  background: var(--zl-color-surface-default-black, #0f0f11);
+  color: var(--zl-color-text-primary-white, #f4f4f6);
+  font-family: var(--zl-font-family-sans, system-ui, sans-serif);
+}
+.zl-mount {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+  background: inherit;
+  color: inherit;
+}
+.zl-mount > zl-page-shell,
+.zl-mount > [data-zl-template-root] {
+  flex: 1 1 auto;
+}
+.zl-attribution {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: transparent;
+}
+.zl-attribution[hidden] {
+  display: none;
+}
+/* Card header typography — Figma "Desktop/Headings/Small" + "Body Small
+   Regular" pattern shared by sign-in (6593:141740), passkey upsell
+   (6594:89142 / 6594:12796), and signed-in (6596:132845). Templates
+   slot raw <h1>/<p> elements into <zl-card>, which keeps them in the
+   light DOM where the orchestrator's stylesheet can reach them — the
+   atom intentionally doesn't dictate typography. */
+.zl-card-title {
+  margin: 0;
+  font-family: var(--zl-font-family-heading, var(--zl-font-family-sans, system-ui, sans-serif));
+  font-size: 2rem;
+  font-weight: 400;
+  line-height: 2.5rem;
+  letter-spacing: -0.02em;
+  color: var(--zl-color-text-primary-white, #f4f4f6);
+  text-align: left;
+}
+.zl-card-subtitle {
+  margin: 0;
+  font-family: var(--zl-font-family-sans, system-ui, sans-serif);
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  font-weight: 400;
+  color: var(--zl-color-text-primary-white, #f4f4f6);
+}
+/* Figma 6593:141989 / 6594:12882 — left-aligned in Field+CTAs (x=0, items-start). */
+.zl-card-nav {
+  margin: 0;
+  font-family: var(--zl-font-family-sans, system-ui, sans-serif);
+  font-size: 1rem;
+  line-height: 1.5rem;
+  font-weight: 400;
+  color: var(--zl-color-text-primary-white, #f4f4f6);
+  text-align: left;
+}
+.zl-card-nav__link {
+  display: inline;
+  margin: 0;
+  padding: 0;
+  border: none;
+  background: transparent;
+  font: inherit;
+  line-height: inherit;
+  color: var(--zl-color-icon-default-purple, #bba5e4);
+  text-decoration: none;
+  cursor: pointer;
+}
+.zl-card-nav__link:hover {
+  text-decoration: underline;
+}
+.zl-card-nav__link:focus-visible {
+  outline: var(--zl-focus-width, 2px) solid var(--zl-focus-color, #f4f4f6);
+  outline-offset: var(--zl-focus-offset, 2px);
+}
+/* Figma 6593:141989 — forgot password row (left-aligned, before CTAs). */
+.zl-card-forgot {
+  margin: 0;
+  text-align: left;
+}
+.zl-card-forgot__link {
+  display: inline;
+  margin: 0;
+  padding: 0;
+  border: none;
+  background: transparent;
+  font-family: var(--zl-font-family-sans, system-ui, sans-serif);
+  font-size: 1rem;
+  line-height: 1.5rem;
+  font-weight: 400;
+  color: var(--zl-color-icon-default-purple, #bba5e4);
+  text-decoration: none;
+  cursor: pointer;
+}
+.zl-card-forgot__link:hover {
+  text-decoration: underline;
+}
+.zl-card-forgot__link:focus-visible {
+  outline: var(--zl-focus-width, 2px) solid var(--zl-focus-color, #f4f4f6);
+  outline-offset: var(--zl-focus-offset, 2px);
+}
+`;
+//#endregion
+//#region src/orchestrator/templates/passkey-upsell.liquid.ts
+/**
+* `passkey-upsell` partial — third Figma target screen (file
+* `xkvBjkOJ8ENuHdTGZHXezK`, node `6594:630`).
+*
+* Differs from `auth-form`:
+*   - heading + subtitle live in a compact card (gap 24px instead of 32px),
+*   - primary "Set up passkey" CTA carries a trailing 24px passkey icon
+*     (Figma slots the icon to the right of the label, not above it),
+*   - secondary "Skip for now" uses the dark secondary hierarchy, not the
+*     `text` hierarchy — the Figma button has a solid #252528 background.
+*
+* Server-side errors land in a `<zl-alert>` the same way as the auth form.
+*/
+const passkeyUpsellTemplate = String.raw`
+<zl-page-shell data-zl-template-root>
+  {% if branding.logo_url %}
+    <img slot="header" class="zl-card-logo" src="{{ branding.logo_url }}" alt="" />
+  {% endif %}
+  <zl-card compact>
+    <h1 slot="header" class="zl-card-title">{{ step.texts.title_key | t: identity.display_name }}</h1>
+    <p slot="header" class="zl-card-subtitle">{{ 'passkey-upsell.description.line1' | t }}</p>
+    <p slot="header" class="zl-card-subtitle">{{ 'passkey-upsell.description.line2' | t }}</p>
+
+    {% if errors and errors.size > 0 %}
+      {% for err in errors %}
+        {% if err | formLevelError %}
+          <zl-alert severity="error">
+            {% if err.text_key %}{{ err.text_key | t }}{% else %}{{ err.message }}{% endif %}
+          </zl-alert>
+        {% endif %}
+      {% endfor %}
+    {% endif %}
+
+    {% for entry in actions %}
+      {% if entry[1].primary %}
+        <zl-button
+          slot="footer"
+          hierarchy="primary"
+          size="medium"
+          type="submit"
+          block
+          action="{{ entry[0] }}"
+          {% if loading %}loading disabled{% endif %}
+        >
+          {{ entry[1].text_key | t }}
+          <zl-icon slot="trailing" name="passkey" size="24"></zl-icon>
+        </zl-button>
+      {% endif %}
+    {% endfor %}
+
+    {% for entry in actions %}
+      {% unless entry[1].primary %}
+        <zl-button
+          slot="footer"
+          hierarchy="secondary"
+          size="medium"
+          type="button"
+          block
+          action="{{ entry[0] }}"
+          label="{{ entry[1].text_key | t }}"
+        ></zl-button>
+      {% endunless %}
+    {% endfor %}
+
+    {% mandatory_gates %}
+
+    {% if challenge and challenge.method == "passkey" %}
+      <zl-passkey
+        ceremony="{{ challenge.options.ceremony | default: 'register' }}"
+        challenge-id="{{ challenge.challenge_id }}"
+        options='{{ challenge.options | json }}'
+      ></zl-passkey>
+    {% endif %}
+  </zl-card>
+</zl-page-shell>
+`;
+//#endregion
+//#region src/orchestrator/templates/signed-in.liquid.ts
+/**
+* `signed-in` partial — fourth Figma target screen (file
+* `xkvBjkOJ8ENuHdTGZHXezK`, node `6596:132844`).
+*
+* Figma layout:
+*   - heading "You're signed in as" (left-aligned, full width)
+*   - body line with the authenticated email address (Arimo Regular 16/24)
+*   - "Continue" primary CTA
+*   - "Logout" secondary CTA
+*
+* No avatar / identity hero glyph: the Figma frame is intentionally a
+* pure modal layover and dropping the avatar keeps the orchestrator
+* default in lockstep with the spec.
+*
+* Rendered when the flow returns a terminal step (`complete: "show"`)
+* and no `post-sign-in-url` is configured, so the user can confirm the
+* identity before the host SPA takes over.
+*/
+const signedInTemplate = String.raw`
+<zl-page-shell data-zl-template-root>
+  {% if branding.logo_url %}
+    <img slot="header" class="zl-card-logo" src="{{ branding.logo_url }}" alt="" />
+  {% endif %}
+  <zl-card compact>
+    <h1 slot="header" class="zl-card-title">
+      {{ step.texts.title_key | t: identity.display_name }}
+    </h1>
+    {% if identity.email_address or identity.display_name %}
+      <p slot="header" class="zl-card-subtitle">
+        {{ identity.email_address | default: identity.display_name }}
+      </p>
+    {% endif %}
+
+    {% if errors and errors.size > 0 %}
+      {% for err in errors %}
+        <zl-alert severity="error">{{ err.text_key | t }}</zl-alert>
+      {% endfor %}
+    {% endif %}
+
+    {% if actions and actions.size > 0 %}
+      {% for entry in actions %}
+        {% if entry[1].primary %}
+          <zl-button
+            slot="footer"
+            hierarchy="primary"
+            size="medium"
+            type="submit"
+            block
+            action="{{ entry[0] }}"
+            label="{{ entry[1].text_key | t }}"
+            {% if loading %}loading{% endif %}
+          ></zl-button>
+        {% endif %}
+      {% endfor %}
+
+      {% for entry in actions %}
+        {% unless entry[1].primary %}
+          <zl-button
+            slot="footer"
+            hierarchy="secondary"
+            size="medium"
+            block
+            action="{{ entry[0] }}"
+            label="{{ entry[1].text_key | t }}"
+          ></zl-button>
+        {% endunless %}
+      {% endfor %}
+    {% else %}
+      {% comment %}
+        Fallback when the API ships a terminal step with no actions —
+        matches Figma node 6596:132844 which always renders Continue
+        + Logout. The orchestrator wires these to its built-in
+        continue / logout handlers.
+      {% endcomment %}
+      <zl-button
+        slot="footer"
+        hierarchy="primary"
+        size="medium"
+        type="submit"
+        block
+        action="continue"
+        label="{{ 'signed-in.continue' | t }}"
+      ></zl-button>
+      <zl-button
+        slot="footer"
+        hierarchy="secondary"
+        size="medium"
+        block
+        action="logout"
+        label="{{ 'signed-in.logout' | t }}"
+      ></zl-button>
+    {% endif %}
+
+    {% mandatory_gates %}
+  </zl-card>
+</zl-page-shell>
+`;
+//#endregion
+//#region src/orchestrator/template-names.ts
+/**
+* Names of the bundled Liquid templates the `<zitadel-login>` orchestrator
+* registers.
+*
+* This lives in its own module — separate from `liquid.ts` — so the public
+* barrel can re-export `TEMPLATE_NAMES` without dragging LiquidJS' `Liquid`
+* type (and its Node ambient-type requirements) into the published
+* declaration surface. See `liquid.ts` / the orchestrator barrel.
+*/
+const TEMPLATE_NAMES = {
+	default: "default",
+	authForm: "auth-form",
+	passkeyUpsell: "passkey-upsell",
+	signedIn: "signed-in"
+};
+//#endregion
+//#region src/orchestrator/liquid.ts
+/**
+* LiquidJS engine factory for the `<zitadel-login>` orchestrator.
+*
+* Configures the engine per the security pipeline in
+* `docs/design/flowengine/template-security.md` and registers the
+* `| t` filter and `{% mandatory_gates %}` tag from
+* `docs/design/branding/templates.md`.
+*
+* Hard rules:
+*
+* - `{{ }}` output is HTML-escaped (LiquidJS default since v10).
+* - The `| raw` filter is overridden to a no-op string passthrough that still
+*   escapes (Layer 1 of the security pipeline).
+* - Partials are loaded from an in-memory map; no filesystem access.
+*/
+function createLiquidEngine(options) {
+	const engine = new Liquid({
+		templates: {
+			[TEMPLATE_NAMES.default]: defaultTemplate,
+			[TEMPLATE_NAMES.authForm]: authFormTemplate,
+			[TEMPLATE_NAMES.passkeyUpsell]: passkeyUpsellTemplate,
+			[TEMPLATE_NAMES.signedIn]: signedInTemplate,
+			...options.templates ?? {}
+		},
+		cache: true,
+		jsTruthy: true,
+		relativeReference: false,
+		strictFilters: false,
+		strictVariables: false,
+		outputEscape: "escape"
+	});
+	engine.registerFilter("raw", (value) => stringify(value));
+	engine.registerFilter("t", function tFilter(key, ...args) {
+		const lookupKey = stringify(key);
+		return interpolate(options.locale[lookupKey] ?? lookupKey, args.map(stringify));
+	});
+	/** Resolves `{text_key}.placeholder` — empty when undefined (not the raw key). */
+	engine.registerFilter("fieldPlaceholder", (textKey) => {
+		const lookupKey = `${stringify(textKey)}.placeholder`;
+		return options.locale[lookupKey] ?? "";
+	});
+	/** Resolves `{text_key}.help` — empty when undefined. */
+	engine.registerFilter("fieldHelp", (textKey) => {
+		const lookupKey = `${stringify(textKey)}.help`;
+		return options.locale[lookupKey] ?? "";
+	});
+	/** Maps `error.*` text keys to a field name (Figma inline-error annotations). */
+	const fieldErrorKeys = {
+		"error.email_required": "email",
+		"error.email_invalid": "email",
+		"error.email_exists": "email",
+		"error.password_required": "password",
+		"error.password_incorrect": "password",
+		"error.invalid_credentials": "password"
+	};
+	/** Resolves `{text_key}.title` for form-level `<zl-alert heading>`. */
+	engine.registerFilter("alertHeading", (textKey) => {
+		const lookupKey = `${stringify(textKey)}.title`;
+		return options.locale[lookupKey] ?? "";
+	});
+	/** Resolves `{text_key}.body` for form-level `<zl-alert>` message slot. */
+	engine.registerFilter("alertBody", (textKey) => {
+		const lookupKey = `${stringify(textKey)}.body`;
+		return options.locale[lookupKey] ?? "";
+	});
+	/** Localized inline error for `fieldName`, or empty when none applies. */
+	engine.registerFilter("fieldError", (fieldName, errors) => {
+		const name = stringify(fieldName);
+		if (!Array.isArray(errors)) return "";
+		for (const item of errors) {
+			const key = item.text_key ?? "";
+			if (fieldErrorKeys[key] === name) return options.locale[key] ?? key;
+		}
+		return "";
+	});
+	/** True when the error should render as `<zl-alert>`, not on a field. */
+	engine.registerFilter("formLevelError", (err) => {
+		const key = err?.text_key ?? "";
+		return key === "" || !(key in fieldErrorKeys);
+	});
+	engine.registerTag("mandatory_gates", {
+		parse() {},
+		render() {
+			return mandatoryGatesMarkerComment;
+		}
+	});
+	return engine;
+}
+function stringify(value) {
+	if (value == null) return "";
+	if (typeof value === "string") return value;
+	if (typeof value === "number" || typeof value === "boolean") return String(value);
+	try {
+		return JSON.stringify(value);
+	} catch {
+		return String(value);
+	}
+}
+function interpolate(template, args) {
+	if (args.length === 0) return template;
+	return template.replace(/\{(\d+)\}/g, (match, index) => {
+		return args[Number(index)] ?? match;
+	});
+}
+//#endregion
+//#region src/orchestrator/locales/en.ts
+/**
+* Minimal English locale dictionary.
+*
+* The `| t` filter looks up `text_key` strings here. Missing keys fall through
+* to the raw key (matches the spec in
+* `docs/design/flowengine/flow-engine-guide.md`).
+*
+* Copy aligned to Figma screens file `xkvBjkOJ8ENuHdTGZHXezK` (May 2026).
+* MVP only — multi-locale support is deferred.
+*/
+const en = {
+	"identifier.title": "Sign in",
+	"identifier.field.email": "Work email",
+	"identifier.field.email.placeholder": "you@company.com",
+	"identifier.field.password": "Password",
+	"identifier.action.passkey": "Sign in with a passkey",
+	"identifier.action.register.lead": "Don't have an account? ",
+	"identifier.action.register.link": "Sign up",
+	"password.title": "Sign in",
+	"password.field.password": "Password",
+	"password.action.passkey": "Sign in with a passkey",
+	"password.action.register.lead": "Don't have an account? ",
+	"password.action.register.link": "Sign up",
+	"register.title": "Create your account",
+	"register.field.email": "Work email",
+	"register.field.email.placeholder": "you@company.com",
+	"register.field.password": "Password",
+	"register.field.password.help": "At least 8 characters, including a symbol and number.",
+	"register.action.submit": "Sign up",
+	"register.action.sign_in.lead": "Already have an account? ",
+	"register.action.sign_in.link": "Sign in",
+	"passkey-upsell.title": "Sign in faster next time",
+	"passkey-upsell.description.line1": "No password needed ever again.",
+	"passkey-upsell.description.line2": "Sign in with Face ID, Touch ID, or PIN.",
+	"passkey-upsell.action.setup": "Set up passkey",
+	"passkey-upsell.action.skip": "Skip for now",
+	/** Figma `6594:630` setup-passkey annotations — form-level `<zl-alert>`. */
+	"error.passkey_cancelled": "Passkey setup was cancelled",
+	"error.passkey_not_registered": "This passkey is not registered. Please sign in with your email and password.",
+	"error.passkey_setup_failed": "Passkey registration did not complete. Please try again.",
+	"error.passkey_unsupported": "This device does not support passkeys",
+	"error.passkey_failed": "Something went wrong. Please try again.",
+	"complete.title": "You're signed in as",
+	"signed-in.continue": "Continue",
+	"signed-in.logout": "Logout",
+	"recover.title": "Check your email",
+	"recover.description": "We sent a password reset link to your email address.",
+	"recover.action.back": "Back to sign in",
+	"passkey-login.title": "Sign in with your passkey",
+	"submit.continue": "Continue",
+	"submit.signin": "Sign in",
+	"action.forgot_password": "Forgot password?",
+	"action.cancel": "Cancel",
+	"sso.redirect.title": "Redirecting to your provider…",
+	"error.email_required": "Please enter an email address",
+	"error.email_invalid": "Please enter a valid email",
+	"error.password_required": "Please enter a password",
+	"error.password_incorrect": "Wrong email or password.",
+	"error.email_exists": "An account with this email already exists.",
+	/** Figma sign-in error `6602:180268` — inline on password field. */
+	"error.invalid_credentials": "Wrong email or password.",
+	"error.required": "This field is required.",
+	"error.sign_in_server.title": "We couldn't complete your sign in.",
+	"error.sign_in_server.body": "Please try again in a few minutes"
+};
+//#endregion
+//#region src/orchestrator/locales/de.ts
+const de = {
+	"identifier.title": "Anmelden",
+	"identifier.field.email": "E-Mail",
+	"identifier.field.email.placeholder": "du@unternehmen.com",
+	"identifier.field.password": "Passwort",
+	"identifier.action.passkey": "Mit Passkey anmelden",
+	"identifier.action.register.lead": "Noch kein Konto? ",
+	"identifier.action.register.link": "Registrieren",
+	"password.title": "Anmelden",
+	"password.field.password": "Passwort",
+	"password.action.passkey": "Mit Passkey anmelden",
+	"password.action.register.lead": "Noch kein Konto? ",
+	"password.action.register.link": "Registrieren",
+	"register.title": "Konto erstellen",
+	"register.field.email": "E-Mail",
+	"register.field.email.placeholder": "du@unternehmen.com",
+	"register.field.password": "Passwort",
+	"register.field.password.help": "Mindestens 8 Zeichen, einschließlich eines Sonderzeichens und einer Zahl.",
+	"register.action.submit": "Registrieren",
+	"register.action.sign_in.lead": "Bereits ein Konto? ",
+	"register.action.sign_in.link": "Anmelden",
+	"passkey-upsell.title": "Nächstes Mal schneller anmelden",
+	"passkey-upsell.description.line1": "Kein Passwort mehr nötig.",
+	"passkey-upsell.description.line2": "Melde dich mit Face ID, Touch ID oder PIN an.",
+	"passkey-upsell.action.setup": "Passkey einrichten",
+	"passkey-upsell.action.skip": "Vorerst überspringen",
+	"error.passkey_cancelled": "Passkey-Einrichtung wurde abgebrochen",
+	"error.passkey_not_registered": "Dieser Passkey ist nicht registriert. Bitte melde dich mit E-Mail und Passwort an.",
+	"error.passkey_setup_failed": "Passkey-Registrierung wurde nicht abgeschlossen. Bitte versuche es erneut.",
+	"error.passkey_unsupported": "Dieses Gerät unterstützt keine Passkeys",
+	"error.passkey_failed": "Etwas ist schiefgelaufen. Bitte versuche es erneut.",
+	"complete.title": "Du bist angemeldet als",
+	"signed-in.continue": "Weiter",
+	"signed-in.logout": "Abmelden",
+	"recover.title": "E-Mail prüfen",
+	"recover.description": "Wir haben einen Link zum Zurücksetzen des Passworts an deine E-Mail-Adresse gesendet.",
+	"recover.action.back": "Zurück zur Anmeldung",
+	"passkey-login.title": "Mit Passkey anmelden",
+	"submit.continue": "Weiter",
+	"submit.signin": "Anmelden",
+	"action.forgot_password": "Passwort vergessen?",
+	"action.cancel": "Abbrechen",
+	"sso.redirect.title": "Weiterleitung zum Anbieter…",
+	"error.email_required": "Bitte gib eine E-Mail-Adresse ein",
+	"error.email_invalid": "Bitte gib eine gültige E-Mail-Adresse ein",
+	"error.password_required": "Bitte gib ein Passwort ein",
+	"error.password_incorrect": "Falsche E-Mail oder falsches Passwort.",
+	"error.email_exists": "Ein Konto mit dieser E-Mail-Adresse existiert bereits.",
+	"error.invalid_credentials": "Falsche E-Mail oder falsches Passwort.",
+	"error.required": "Dieses Feld ist erforderlich.",
+	"error.sign_in_server.title": "Anmeldung konnte nicht abgeschlossen werden.",
+	"error.sign_in_server.body": "Bitte versuche es in einigen Minuten erneut"
+};
+//#endregion
+//#region src/orchestrator/locales/index.ts
+const builtinLocales = {
+	en,
+	de
+};
+//#endregion
+//#region ../shared-component-styles/dist/attribution-markup.mjs
+/**
+* Figma sign-in attribution chip (`6593:141767`): "Secured with" + 65×16 logotype.
+* Shared by Lit orchestrator HTML, dev playground, and paired React playgrounds.
+*/
+const ZITADEL_ATTRIBUTION_LOGOTYPE_SVG = "<svg class=\"zr-pill__logotype-svg\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 67.3501 15.1111\" width=\"65\" height=\"16\" fill=\"currentColor\" aria-hidden=\"true\" focusable=\"false\"><path d=\"M2.04839 4.265C2.06224 4.1284 2.1748 3.98591 2.32756 3.91161L8.98593 0.0494262C9.227 -0.0678242 9.45274 0.0334116 9.43089 0.248972V4.52681C9.41705 4.66341 9.30448 4.80589 9.15172 4.88019L2.49335 8.66426C2.25228 8.78151 2.02654 8.68027 2.04839 8.46471V4.265Z\"/><path d=\"M14.0086 5.25359C14.12 5.33388 14.1871 5.50261 14.1751 5.67205V13.2643C14.1561 13.5317 13.9555 13.6766 13.7798 13.5499L10.1005 11.4468C9.98908 11.3666 9.92196 11.1978 9.934 11.0284V3.32695C9.95299 3.05956 10.1535 2.91467 10.3293 3.04138L14.0086 5.25359Z\"/><path d=\"M7.37428 15.0817C7.24906 15.138 7.06938 15.1118 6.92865 15.0167L0.183465 11.1405C-0.038611 10.9903 -0.0638098 10.7442 0.133796 10.6554L3.76278 8.53833C3.888 8.48203 4.06767 8.50827 4.2084 8.60341L10.9046 12.5341C11.1267 12.6843 11.1557 12.9125 10.9543 13.0193L7.37428 15.0817Z\"/><path d=\"M65.6687 13.1043V2.00077H67.3501V13.1043H65.6687Z\"/><path d=\"M60.4255 13.2947C59.6535 13.2947 58.9715 13.1202 58.3793 12.7712C57.7871 12.4222 57.3218 11.9358 56.9834 11.3119C56.6556 10.688 56.4917 9.97418 56.4917 9.1705C56.4917 8.33509 56.6556 7.61073 56.9834 6.99739C57.3112 6.38405 57.7712 5.90819 58.3634 5.56979C58.9662 5.22083 59.6588 5.04634 60.4414 5.04634C61.2027 5.04634 61.869 5.21554 62.44 5.55393C63.011 5.88175 63.4552 6.33118 63.7724 6.90222C64.1002 7.47326 64.2642 8.12359 64.2642 8.85325C64.2642 9.0013 64.2589 9.1282 64.2483 9.23395C64.2483 9.33969 64.2377 9.46659 64.2166 9.61464H58.1731C58.2048 10.0588 58.3158 10.4553 58.5062 10.8043C58.6965 11.1427 58.9556 11.4124 59.2834 11.6133C59.6112 11.8036 59.9866 11.8988 60.4096 11.8988C60.8644 11.8988 61.2503 11.7983 61.5676 11.5974C61.8954 11.3859 62.1386 11.0898 62.2972 10.7091H64.0421C63.9046 11.185 63.672 11.6186 63.3441 12.0098C63.0269 12.4011 62.6251 12.7131 62.1386 12.9457C61.6522 13.1784 61.0811 13.2947 60.4255 13.2947ZM58.1889 8.42497H62.551C62.5299 7.81163 62.3131 7.3305 61.9007 6.98153C61.4883 6.62199 60.986 6.44222 60.3938 6.44222C59.865 6.44222 59.3839 6.60613 58.9503 6.93394C58.5168 7.26176 58.263 7.75876 58.1889 8.42497Z\"/><path d=\"M50.5389 13.2947C49.7563 13.2947 49.0796 13.1096 48.5085 12.7395C47.9481 12.3588 47.5145 11.8565 47.2078 11.2326C46.9117 10.6087 46.7637 9.91073 46.7637 9.13877C46.7637 8.37739 46.9117 7.69004 47.2078 7.0767C47.5145 6.45279 47.9481 5.96106 48.5085 5.60152C49.0796 5.2314 49.7563 5.04634 50.5389 5.04634C51.1205 5.04634 51.6492 5.16795 52.1251 5.41117C52.601 5.64382 52.9869 5.97692 53.283 6.41049V2.00077H54.9803V13.1043H53.3465L53.283 11.8829C53.0292 12.2954 52.6644 12.6337 52.1886 12.8981C51.7127 13.1625 51.1628 13.2947 50.5389 13.2947ZM50.872 11.8195C51.369 11.8195 51.7973 11.7032 52.1568 11.4705C52.5164 11.2379 52.7913 10.9206 52.9817 10.5188C53.172 10.1169 53.2672 9.66751 53.2672 9.1705C53.2672 8.59946 53.1561 8.1183 52.9341 7.72704C52.7226 7.33577 52.4318 7.0344 52.0617 6.82291C51.7021 6.61141 51.3003 6.50567 50.8561 6.50567C50.4014 6.50567 49.9943 6.6167 49.6347 6.83877C49.2752 7.06084 48.9897 7.36749 48.7782 7.75876C48.5773 8.15003 48.4768 8.61532 48.4768 9.15463C48.4768 9.68337 48.5825 10.1487 48.794 10.5505C49.0055 10.9524 49.2911 11.2643 49.6506 11.4864C50.0101 11.7085 50.4173 11.8195 50.872 11.8195Z\"/><path d=\"M40.7882 13.2947C40.2806 13.2947 39.8153 13.2048 39.3923 13.025C38.9693 12.8347 38.6309 12.5597 38.3771 12.2002C38.1233 11.8406 37.9965 11.4071 37.9965 10.8995C37.9965 10.2967 38.1445 9.81556 38.4406 9.45602C38.7473 9.0859 39.1544 8.81624 39.662 8.64704C40.1801 8.46727 40.7459 8.37739 41.3592 8.37739H43.3579C43.3579 7.92267 43.2839 7.55786 43.1358 7.28291C42.9878 6.99739 42.7868 6.79118 42.533 6.66429C42.2792 6.52681 41.9832 6.45808 41.6448 6.45808C41.2006 6.45808 40.8094 6.56383 40.471 6.77532C40.1431 6.97624 39.9369 7.29876 39.8523 7.7429H38.1551C38.2079 7.17186 38.3983 6.68544 38.7261 6.28359C39.0645 5.88175 39.4928 5.57508 40.011 5.36358C40.5291 5.15209 41.079 5.04634 41.6606 5.04634C42.422 5.04634 43.0512 5.1891 43.5482 5.47462C44.0558 5.74957 44.4312 6.13555 44.6744 6.63256C44.9282 7.12958 45.0551 7.69531 45.0551 8.3298V10.7409C45.0657 11.0475 45.1292 11.2749 45.2455 11.4229C45.3724 11.5604 45.5945 11.6397 45.9117 11.6609V13.1043C45.4887 13.1043 45.1186 13.0567 44.8013 12.9616C44.4947 12.8664 44.2409 12.7236 44.04 12.5333C43.839 12.3324 43.6804 12.0786 43.5641 11.7719C43.3103 12.1949 42.9402 12.5544 42.4537 12.8505C41.9673 13.1466 41.4121 13.2947 40.7882 13.2947ZM41.1848 11.9147C41.6183 11.9147 41.999 11.8089 42.3268 11.5974C42.6547 11.3753 42.9084 11.0898 43.0882 10.7409C43.268 10.3813 43.3579 9.99533 43.3579 9.58291V9.55119H41.4861C41.1795 9.55119 40.8887 9.5882 40.6137 9.66223C40.3493 9.73625 40.1326 9.86315 39.9634 10.0429C39.8047 10.2121 39.7254 10.45 39.7254 10.7567C39.7254 11.1586 39.8682 11.4547 40.1537 11.645C40.4392 11.8248 40.7829 11.9147 41.1848 11.9147Z\"/><path d=\"M35.5197 13.1043C34.7372 13.1043 34.1344 12.914 33.7114 12.5333C33.2884 12.1526 33.0769 11.5287 33.0769 10.6615V6.64842H31.8873V5.23669H33.0769V3.3332H34.7583V5.23669H36.757V6.64842H34.7583V10.6615C34.7583 11.0634 34.8482 11.333 35.028 11.4705C35.2078 11.608 35.488 11.6767 35.8687 11.6767H36.757V13.1043H35.5197Z\"/><path d=\"M29.6602 3.85668C29.3536 3.85668 29.0892 3.7509 28.8671 3.53941C28.6556 3.31734 28.5499 3.04768 28.5499 2.73043C28.5499 2.42376 28.6556 2.16468 28.8671 1.95319C29.0892 1.74169 29.3536 1.63594 29.6602 1.63594C29.9775 1.63594 30.2419 1.74169 30.4533 1.95319C30.6754 2.16468 30.7865 2.42376 30.7865 2.73043C30.7865 3.04768 30.6754 3.31734 30.4533 3.53941C30.2419 3.7509 29.9775 3.85668 29.6602 3.85668ZM28.8195 13.1043V5.23669H30.5009V13.1043H28.8195Z\"/><path d=\"M19.8276 13.1043V11.8036L25.1098 3.42837H19.8911V2.00077H27.0608V3.30147L21.7628 11.6609H27.1084V13.1043H19.8276Z\"/></svg>";
+/** Inner markup for the default Zitadel attribution pill (label + logotype). */
+function zitadelAttributionPillInnerHtml() {
+	return `Secured with <span class="zr-pill__logotype">${ZITADEL_ATTRIBUTION_LOGOTYPE_SVG}</span>`;
+}
+//#endregion
+//#region src/orchestrator/sanitiser.ts
+/**
+* Layer 2 of the template security pipeline (`docs/design/flowengine/template-security.md`).
+*
+* Wraps DOMPurify with the configuration the auth-UI templates need:
+*
+* - Allow every `<zl-*>` custom element registered in the manifest registry,
+*   plus the union of attributes declared on each manifest.
+* - Allow common HTML structural / typographic tags used by `default.liquid`.
+* - Strip `on*` event handlers and any `<script>` / `<style>` tags (theming is
+*   orchestrator-owned via `adoptedStyleSheets`).
+*
+* Runs after Liquid finishes rendering and before the HTML is handed to Lit's
+* `unsafeHTML` directive.
+*/
+/**
+* Standard HTML tags that templates may use as structural chrome around
+* `<zl-*>` atoms. Anything outside this list and the manifest registry is
+* stripped at sanitise-time.
+*/
+const STRUCTURAL_TAGS = [
+	"div",
+	"span",
+	"p",
+	"small",
+	"strong",
+	"em",
+	"br",
+	"hr",
+	"h1",
+	"h2",
+	"h3",
+	"h4",
+	"h5",
+	"h6",
+	"ul",
+	"ol",
+	"li",
+	"a",
+	"img",
+	"section",
+	"header",
+	"footer",
+	"main",
+	"nav",
+	"aside",
+	"article",
+	"figure",
+	"figcaption",
+	"label",
+	"fieldset",
+	"legend"
+];
+/**
+* Attributes templates may carry on structural tags. Per-atom attributes are
+* derived from the manifest registry below — manifests are the single source
+* of truth for "what attributes does `<zl-field>` accept?".
+*/
+const COMMON_ATTRS = [
+	"id",
+	"class",
+	"role",
+	"slot",
+	"tabindex",
+	"lang",
+	"dir",
+	"alt",
+	"title",
+	"src",
+	"srcset",
+	"sizes",
+	"href",
+	"target",
+	"rel",
+	"style",
+	"name",
+	"for",
+	"data-theme",
+	"hidden"
+];
+const CUSTOM_TAG_PATTERN = /^zl-[a-z0-9-]+$/;
+function buildAllowedTagList() {
+	const set = new Set(STRUCTURAL_TAGS);
+	for (const manifest of manifestRegistry) set.add(manifest.tag);
+	return [...set];
+}
+function buildAllowedAttrList() {
+	const set = new Set(COMMON_ATTRS);
+	for (const manifest of manifestRegistry) for (const attr of manifest.attrs) set.add(attr);
+	return [...set];
+}
+/**
+* Returns a sanitiser bound to the current manifest registry. Callers should
+* cache the result; rebuilding is cheap but allocates a fresh DOMPurify config.
+*/
+function createSanitiser() {
+	const config = {
+		USE_PROFILES: { html: true },
+		ADD_TAGS: buildAllowedTagList(),
+		ADD_ATTR: buildAllowedAttrList(),
+		FORBID_TAGS: [
+			"script",
+			"style",
+			"iframe",
+			"object",
+			"embed",
+			"form",
+			"input",
+			"button"
+		],
+		FORBID_ATTR: [
+			"onerror",
+			"onclick",
+			"onload",
+			"onfocus",
+			"onblur"
+		],
+		CUSTOM_ELEMENT_HANDLING: {
+			tagNameCheck: CUSTOM_TAG_PATTERN,
+			attributeNameCheck: /^(?:[a-z][a-z0-9-]*)$/,
+			allowCustomizedBuiltInElements: false
+		},
+		KEEP_CONTENT: true,
+		ALLOW_DATA_ATTR: true,
+		ALLOW_ARIA_ATTR: true,
+		RETURN_TRUSTED_TYPE: false
+	};
+	return function sanitise(html) {
+		const result = DOMPurify.sanitize(html, config);
+		return typeof result === "string" ? result : String(result);
+	};
+}
+//#endregion
+//#region src/orchestrator/theme-controller.ts
+const DARK_QUERY = "(prefers-color-scheme: dark)";
+var ThemeController = class {
+	host;
+	branding;
+	mediaQuery = null;
+	_theme = "dark";
+	constructor(host) {
+		this.host = host;
+		host.addController(this);
+	}
+	get theme() {
+		return this._theme;
+	}
+	setBranding(branding) {
+		this.branding = branding;
+		this.refresh();
+	}
+	hostConnected() {
+		this.refresh();
+	}
+	hostDisconnected() {
+		this.detach();
+	}
+	refresh() {
+		const mode = this.branding?.theme?.mode ?? "dark";
+		if (mode === "auto") {
+			this.attach();
+			this.update(this.mediaQuery?.matches === false ? "light" : "dark");
+			return;
+		}
+		this.detach();
+		this.update(mode === "light" ? "light" : "dark");
+	}
+	attach() {
+		if (this.mediaQuery || typeof matchMedia !== "function") return;
+		this.mediaQuery = matchMedia(DARK_QUERY);
+		this.mediaQuery.addEventListener("change", this.onMediaChange);
+	}
+	detach() {
+		if (!this.mediaQuery) return;
+		this.mediaQuery.removeEventListener("change", this.onMediaChange);
+		this.mediaQuery = null;
+	}
+	onMediaChange = (event) => {
+		this.update(event.matches ? "dark" : "light");
+	};
+	update(next) {
+		if (this._theme === next) return;
+		this._theme = next;
+		this.host.requestUpdate();
+	}
+};
+//#endregion
+//#region src/orchestrator/zitadel-login.ts
+let ZitadelLogin = class ZitadelLogin extends LitElement {
+	static shadowRootOptions = {
+		...LitElement.shadowRootOptions,
+		delegatesFocus: true
+	};
+	static styles = css`
+    :host {
+      display: block;
+      width: 100%;
+      min-height: 100vh;
+    }
+  `;
+	#_purpose_accessor_storage = "login";
+	get purpose() {
+		return this.#_purpose_accessor_storage;
+	}
+	set purpose(value) {
+		this.#_purpose_accessor_storage = value;
+	}
+	#_project_accessor_storage;
+	get project() {
+		return this.#_project_accessor_storage;
+	}
+	set project(value) {
+		this.#_project_accessor_storage = value;
+	}
+	#_postSignInUrl_accessor_storage = "";
+	get postSignInUrl() {
+		return this.#_postSignInUrl_accessor_storage;
+	}
+	set postSignInUrl(value) {
+		this.#_postSignInUrl_accessor_storage = value;
+	}
+	#_resumeFlowId_accessor_storage = "";
+	get resumeFlowId() {
+		return this.#_resumeFlowId_accessor_storage;
+	}
+	set resumeFlowId(value) {
+		this.#_resumeFlowId_accessor_storage = value;
+	}
+	#_lang_accessor_storage = "";
+	get lang() {
+		return this.#_lang_accessor_storage;
+	}
+	set lang(value) {
+		this.#_lang_accessor_storage = value;
+	}
+	#_locales_accessor_storage;
+	get locales() {
+		return this.#_locales_accessor_storage;
+	}
+	set locales(value) {
+		this.#_locales_accessor_storage = value;
+	}
+	#_response_accessor_storage = null;
+	get response() {
+		return this.#_response_accessor_storage;
+	}
+	set response(value) {
+		this.#_response_accessor_storage = value;
+	}
+	#_branding_accessor_storage = void 0;
+	get branding() {
+		return this.#_branding_accessor_storage;
+	}
+	set branding(value) {
+		this.#_branding_accessor_storage = value;
+	}
+	#_loading_accessor_storage = false;
+	get loading() {
+		return this.#_loading_accessor_storage;
+	}
+	set loading(value) {
+		this.#_loading_accessor_storage = value;
+	}
+	#_startupError_accessor_storage = null;
+	get startupError() {
+		return this.#_startupError_accessor_storage;
+	}
+	set startupError(value) {
+		this.#_startupError_accessor_storage = value;
+	}
+	#_formValues_accessor_storage = {};
+	get formValues() {
+		return this.#_formValues_accessor_storage;
+	}
+	set formValues(value) {
+		this.#_formValues_accessor_storage = value;
+	}
+	themeController = new ThemeController(this);
+	engine = null;
+	sanitise = createSanitiser();
+	/**
+	* Cached compiled tenant template, keyed by source string. Re-rendering on
+	* every `formValues` change otherwise re-parses the same template.
+	*/
+	tenantTemplateCache = null;
+	createRenderRoot() {
+		const root = super.createRenderRoot();
+		if (root instanceof ShadowRoot) {
+			const existing = Array.isArray(root.adoptedStyleSheets) ? root.adoptedStyleSheets : [];
+			const sheet = new CSSStyleSheet();
+			sheet.replaceSync(layoutChromeCss);
+			root.adoptedStyleSheets = [...existing, sheet];
+			root.addEventListener("zl-input", this.handleAtomInput);
+			root.addEventListener("zl-submit", this.handleAtomSubmit);
+			root.addEventListener("click", this.handleDelegatedAction);
+			root.addEventListener("submit", this.handleFormSubmit);
+			root.addEventListener("zl-passkey-result", this.handlePasskeyResult);
+			root.addEventListener("zl-passkey-error", this.handlePasskeyError);
+		}
+		return root;
+	}
+	/**
+	* Start the flow after the first render rather than in `connectedCallback`.
+	* Frameworks that wrap web components (e.g. `@lit/react` in the console)
+	* attach the element first and then assign object properties (`branding`,
+	* `locale`) via setters. `connectedCallback` runs synchronously on attach
+	* — before any setters from a wrapper's effects/refs — so reading those
+	* properties there sees stale defaults. `firstUpdated` runs after Lit's
+	* first render, by which time setters from the wrapping framework have
+	* fired.
+	*/
+	firstUpdated() {
+		queueMicrotask(() => void this.startFlow());
+	}
+	/**
+	* Resolves the effective locale dictionary. The built-in dictionary for the
+	* resolved language is used as the base; entries from the `locales` map (if
+	* set) are spread on top so partial overrides work without importing and
+	* spreading the full base dictionary.
+	*/
+	resolveLocale() {
+		const primary = ((this.lang || (typeof document !== "undefined" ? document.documentElement.lang : "") || (typeof navigator !== "undefined" ? navigator.language : "")).split("-")[0] ?? "").toLowerCase();
+		const builtin = builtinLocales[primary] ?? en;
+		const custom = this.locales?.[primary];
+		return custom ? {
+			...builtin,
+			...custom
+		} : builtin;
+	}
+	willUpdate(changed) {
+		if (!this.engine || changed.has("locales") || changed.has("lang")) this.engine = createLiquidEngine({ locale: this.resolveLocale() });
+		const root = this.shadowRoot;
+		if (root) {
+			applyBaseTokens(root);
+			applyBrandingTokens(root, this.branding, this.themeController.theme);
+			applyFontUrl(root, this.branding?.font_url ?? null);
+		}
+		this.dataset.theme = this.themeController.theme;
+		this.toggleAttribute("data-theme-dark", this.themeController.theme === "dark");
+		this.setAttribute("aria-busy", this.loading ? "true" : "false");
+	}
+	updated(changed) {
+		if (!changed.has("response")) return;
+		requestAnimationFrame(() => {
+			this.applyValuesToFields();
+			this.moveFocusToFirstField();
+		});
+	}
+	render() {
+		if (this.startupError) return html`<form class="zl-mount" novalidate>
+        <zl-alert severity="error">${this.startupError}</zl-alert>
+      </form>`;
+		if (!this.response || !this.engine) return html`<slot name="loader"></slot>`;
+		const rendered = this.injectAttribution(this.renderStep(this.response.step, this.engine));
+		return html`<form
+      class="zl-mount"
+      part="form"
+      novalidate
+      aria-busy=${this.loading ? "true" : "false"}
+    >
+      ${unsafeHTML(rendered)}
+    </form>`;
+	}
+	/**
+	* Inject the attribution badge into the rendered template's
+	* `<zl-page-shell>` footer slot. The attribution must live INSIDE the
+	* page-shell so it sits within the 100vh viewport rhythm (matching the
+	* Figma sign-in frame where the pill sits 24px below the card, both
+	* centred on the page). It can't be a sibling of the page-shell because
+	* the page-shell already occupies the full viewport height.
+	*/
+	injectAttribution(rendered) {
+		const html = this.renderAttributionHtml();
+		if (!html) return rendered;
+		if (rendered.includes("</zl-page-shell>")) return rendered.replace("</zl-page-shell>", `${html}</zl-page-shell>`);
+		return rendered + html;
+	}
+	/**
+	* "Secured with Zitadel" attribution chrome injected into every
+	* template's page-shell footer slot. Controlled by
+	* `branding.attribution.show_zitadel` — defaults to `true` for
+	* community / OSS deployments. Licensed tenants can suppress the badge
+	* entirely or swap it for a `custom_link` value.
+	*/
+	renderAttributionHtml() {
+		const attribution = this.branding?.attribution;
+		const show = attribution?.show_zitadel !== false;
+		const custom = attribution?.custom_link;
+		if (!show && !custom) return "";
+		if (custom) return `<div slot="footer" part="attribution" class="zl-attribution"><zl-pill tone="neutral" href="${String(custom.href).replace(/"/g, "&quot;")}">${String(custom.label).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;")}</zl-pill></div>`;
+		return `<div slot="footer" part="attribution" class="zl-attribution"><zl-pill tone="neutral" href="https://zitadel.com" part="attribution-pill" aria-label="Secured with Zitadel">${zitadelAttributionPillInnerHtml()}</zl-pill></div>`;
+	}
+	async startFlow() {
+		const cfg = this.project ?? getZitadelConfig();
+		const projectId = cfg?.projectId || "";
+		if (!cfg) throw new Error("<zitadel-login> requires a `config` prop (from configureZitadel()) or configureZitadel() must be called before use.");
+		const api = getApi(cfg);
+		this.loading = true;
+		this.startupError = null;
+		try {
+			let wire;
+			if (this.resumeFlowId) wire = await getCurrentStep(api, this.resumeFlowId);
+			else {
+				if (!projectId) throw new Error("<zitadel-login> requires a `project-id` attribute (or configureZitadel()) to start a flow.");
+				wire = await startFlow(api, {
+					project_id: projectId,
+					purpose: this.purpose
+				});
+			}
+			this.applyResponse(wire);
+		} catch (error) {
+			this.handleTransportError(error);
+		} finally {
+			this.loading = false;
+		}
+	}
+	applyResponse(wire) {
+		this.response = wire;
+		const { branding, issues } = validateBranding(wire.branding);
+		this.branding = branding;
+		this.themeController.setBranding(branding);
+		if (issues.length > 0) console.warn("[zitadel-login] branding payload has issues:", issues);
+		this.formValues = {
+			...collectInitialValues(wire.step),
+			...this.formValues
+		};
+		this.maybeCompleteFlow(wire);
+	}
+	/**
+	* Acts on terminal flow steps. The wire surfaces two kinds of completion:
+	*
+	* - `step.complete === "redirect"` — navigate the browser to
+	*   `response.redirect_uri` (OIDC/SAML `auth_request_id` resolved). This
+	*   takes precedence over `post-sign-in-url`.
+	* - `step.complete === "show"` — when `post-sign-in-url` is set, exchange
+	*   the `handoff_token` for a session cookie and navigate there.
+	*
+	* `zitadel-flow-complete` is always emitted so hosts with custom post-sign-in
+	* flows can handle the handoff themselves when `post-sign-in-url` is omitted.
+	*/
+	async maybeCompleteFlow(response) {
+		const behavior = response.step.complete;
+		if (!behavior) return;
+		this.dispatchEvent(new CustomEvent("zitadel-flow-complete", {
+			bubbles: true,
+			composed: true,
+			detail: {
+				behavior,
+				redirect_uri: response.redirect_uri,
+				handoff_token: response.handoff_token,
+				handoff_token_expires_at: response.handoff_token_expires_at
+			}
+		}));
+		if (typeof window === "undefined") return;
+		if (behavior === "redirect" && response.redirect_uri) {
+			window.location.assign(response.redirect_uri);
+			return;
+		}
+		const handoffToken = response.handoff_token;
+		if (behavior === "show" && handoffToken && this.postSignInUrl) {
+			this.loading = true;
+			try {
+				const cfg = this.project ?? getZitadelConfig();
+				if (!cfg) throw new Error("<zitadel-login> config is required for exchange.");
+				await exchangeSession(getApi(cfg), { handoff_token: handoffToken }, { project_id: cfg.projectId });
+				window.location.assign(this.postSignInUrl);
+			} catch (error) {
+				this.handleTransportError(error);
+			} finally {
+				this.loading = false;
+			}
+		}
+	}
+	renderStep(step, engine) {
+		const tenantSource = typeof this.branding?.liquid_template === "string" && this.branding.liquid_template.length > 0 ? this.branding.liquid_template : null;
+		const errors = step.error ? step.error.startsWith("error.") ? [{ text_key: step.error }] : [{ message: step.error }] : [];
+		const context = {
+			step: {
+				name: step.name,
+				complete: step.complete,
+				texts: step.texts ?? {}
+			},
+			fields: step.fields ?? {},
+			actions: step.actions ?? {},
+			gates: step.gates ?? {},
+			sso_providers: step.sso_providers ?? [],
+			challenge: step.challenge ?? null,
+			messages: [],
+			identity: this.deriveIdentity(),
+			errors,
+			branding: this.branding ?? {},
+			loading: this.loading
+		};
+		let raw;
+		try {
+			if (tenantSource) {
+				const compiled = this.tenantTemplateCache?.source === tenantSource ? this.tenantTemplateCache.template : engine.parse(tenantSource);
+				this.tenantTemplateCache = {
+					source: tenantSource,
+					template: compiled
+				};
+				raw = engine.renderSync(compiled, context);
+			} else raw = engine.renderFileSync(TEMPLATE_NAMES.default, context);
+		} catch (error) {
+			console.error("[zitadel-login] Liquid render failed:", error);
+			try {
+				raw = engine.renderFileSync(TEMPLATE_NAMES.default, context);
+			} catch {
+				return `<zl-alert severity="error">We couldn't render this step.</zl-alert>`;
+			}
+		}
+		const patched = patchMandatoryGates(raw, step, this.resolveLocale());
+		return this.sanitise(patched);
+	}
+	/**
+	* Build a `FlowIdentity` from the orchestrator's captured form values so
+	* the signed-in template can greet the user by email without the API
+	* having to round-trip identity claims. Email comes from the
+	* identifier step; display name composes from `given_name` /
+	* `family_name` when the register step ran.
+	*/
+	deriveIdentity() {
+		const email = this.formValues.email?.trim();
+		const display = [this.formValues.given_name?.trim(), this.formValues.family_name?.trim()].filter(Boolean).join(" ").trim();
+		if (!email && !display) return null;
+		return {
+			...email ? { email_address: email } : {},
+			...display ? { display_name: display } : email ? { display_name: email } : {}
+		};
+	}
+	applyValuesToFields() {
+		const root = this.shadowRoot;
+		if (!root) return;
+		const fields = root.querySelectorAll("zl-field");
+		if (fields.length === 0) return;
+		for (const field of fields) {
+			const name = field.getAttribute("name");
+			if (!name || !(name in this.formValues)) continue;
+			const next = this.formValues[name];
+			if (field.value !== next) field.value = next;
+		}
+	}
+	handleAtomInput = (event) => {
+		if (!event.detail) return;
+		const { name, value } = event.detail;
+		if (!name) return;
+		this.formValues = {
+			...this.formValues,
+			[name]: value
+		};
+		this.dispatchEvent(new CustomEvent("zitadel-flow-input", {
+			bubbles: true,
+			composed: true,
+			detail: {
+				name,
+				value
+			}
+		}));
+	};
+	handleAtomSubmit = (event) => {
+		if (this.loading) return;
+		this.submit(event.detail?.action ?? null);
+	};
+	/** Secondary navigation rows (`data-action` on `.zl-card-nav__link`). */
+	handleDelegatedAction = (event) => {
+		const target = event.target?.closest("[data-action]");
+		if (!target || target.closest("zl-button") || this.loading) return;
+		const action = target.getAttribute("data-action");
+		if (!action) return;
+		event.preventDefault();
+		this.submit(action);
+	};
+	handleFormSubmit = (event) => {
+		event.preventDefault();
+		if (this.loading) return;
+		const action = event.submitter?.getAttribute?.("action") ?? null ?? this.findPrimaryAction();
+		this.submit(action);
+	};
+	/**
+	* Handle a successful WebAuthn ceremony. Auto-submit with the proof
+	* as `challenge_response` so the flow advances without extra user
+	* interaction — the ceremony IS the factor verification (ADR 013).
+	*/
+	handlePasskeyResult = (event) => {
+		if (this.loading) return;
+		const { challenge_id, method, proof } = event.detail;
+		this.submit("submit", {
+			challenge_id,
+			method,
+			proof
+		});
+	};
+	/**
+	* Handle a WebAuthn ceremony error. Re-render the current step with
+	* an error message so the user sees feedback and can retry or skip.
+	*
+	* Guard: if the step already carries the same error key, skip the update.
+	* Mutating `this.response` triggers `unsafeHTML` to replace the DOM tree,
+	* which reconnects a fresh `<zl-passkey>` that immediately re-starts the
+	* ceremony — creating an infinite loop. The guard breaks the cycle.
+	*
+	* We also strip the `challenge` from the step so the template does not
+	* render a new `<zl-passkey>` on re-render. Without this, the first
+	* cancel would trigger a second ceremony (the guard prevents a third).
+	*/
+	handlePasskeyError = (event) => {
+		if (!this.response) return;
+		const { error: message, aborted } = event.detail;
+		const errorKey = aborted ? "error.passkey_cancelled" : "error.passkey_failed";
+		if (this.response.step.error === errorKey) return;
+		const { challenge: _dropped, ...stepWithoutChallenge } = this.response.step;
+		this.response = {
+			...this.response,
+			step: {
+				...stepWithoutChallenge,
+				error: errorKey
+			}
+		};
+		console.warn(`[zitadel-login] passkey ceremony ${aborted ? "cancelled" : "failed"}: ${message}`);
+	};
+	findPrimaryAction() {
+		const root = this.shadowRoot;
+		if (!root) return null;
+		return (root.querySelector("zl-button[hierarchy=\"primary\"][type=\"submit\"]") ?? root.querySelector("zl-button[hierarchy=\"primary\"]"))?.getAttribute("action") || null;
+	}
+	moveFocusToFirstField() {
+		const root = this.shadowRoot;
+		if (!root) return;
+		requestAnimationFrame(() => {
+			const focusables = root.querySelectorAll("zl-field, zl-button");
+			Array.from(focusables).find((el) => !el.hasAttribute("disabled"))?.focus();
+		});
+	}
+	async submit(action, challengeResponse) {
+		if (!this.response || this.loading) return;
+		const { id, session_token } = this.response;
+		this.loading = true;
+		try {
+			const stepFieldKeys = Object.keys(this.response.step.fields ?? {});
+			const fields = {};
+			for (const key of stepFieldKeys) {
+				const value = this.formValues[key];
+				if (value !== void 0) fields[key] = value;
+			}
+			const body = {
+				session_token,
+				action: action ?? "submit",
+				fields,
+				...challengeResponse ? { challenge_response: challengeResponse } : {}
+			};
+			const cfg = this.project ?? getZitadelConfig();
+			if (!cfg) throw new Error("<zitadel-login> config is required for submit.");
+			const wire = await submitStep(getApi(cfg), id, body);
+			this.applyResponse(wire);
+			this.dispatchEvent(new CustomEvent("zitadel-flow-step", {
+				bubbles: true,
+				composed: true,
+				detail: { step: wire.step }
+			}));
+		} catch (error) {
+			this.handleTransportError(error);
+		} finally {
+			this.loading = false;
+		}
+	}
+	handleTransportError(error) {
+		const message = error instanceof Error ? error.message : "Unexpected error contacting the Flow API.";
+		this.startupError = message;
+		console.error("[zitadel-login]", error);
+		this.dispatchEvent(new CustomEvent("zitadel-flow-error", {
+			bubbles: true,
+			composed: true,
+			detail: { message }
+		}));
+	}
+};
+__decorate([property({ type: String })], ZitadelLogin.prototype, "purpose", null);
+__decorate([property({ attribute: false })], ZitadelLogin.prototype, "project", null);
+__decorate([property({
+	type: String,
+	attribute: "post-sign-in-url"
+})], ZitadelLogin.prototype, "postSignInUrl", null);
+__decorate([property({
+	type: String,
+	attribute: "resume-flow-id"
+})], ZitadelLogin.prototype, "resumeFlowId", null);
+__decorate([property({ type: String })], ZitadelLogin.prototype, "lang", null);
+__decorate([property({ attribute: false })], ZitadelLogin.prototype, "locales", null);
+__decorate([state()], ZitadelLogin.prototype, "response", null);
+__decorate([state()], ZitadelLogin.prototype, "branding", null);
+__decorate([state()], ZitadelLogin.prototype, "loading", null);
+__decorate([state()], ZitadelLogin.prototype, "startupError", null);
+__decorate([state()], ZitadelLogin.prototype, "formValues", null);
+ZitadelLogin = __decorate([customElement("zitadel-login")], ZitadelLogin);
+function collectInitialValues(step) {
+	const values = {};
+	if (!step.fields) return values;
+	for (const [name, field] of Object.entries(step.fields)) values[name] = typeof field.value === "string" ? field.value : "";
+	return values;
+}
+//#endregion
+//#region src/orchestrator/zitadel-logout.ts
+const DISPLAY_COOKIE_NAME = "__nextgen_display";
+let ZitadelLogout = class ZitadelLogout extends LitElement {
+	static styles = [baseHostStyles, css`
+      :host {
+        display: inline-block;
+        position: relative;
+      }
+
+      .trigger {
+        all: unset;
+        cursor: pointer;
+        width: 2.5rem;
+        height: 2.5rem;
+        border-radius: 9999px;
+        background: ${t.color.surface.defaultWhite};
+        color: ${t.color.text.buttonDefault};
+        font-size: 0.875rem;
+        font-weight: 600;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        letter-spacing: 0.02em;
+        user-select: none;
+        transition: box-shadow ${t.motion.duration.fast} ${t.motion.easing.standard};
+      }
+      .trigger:focus-visible {
+        ${focusVisibleStyles};
+      }
+      .trigger[aria-expanded="true"] {
+        box-shadow: 0 0 0 2px ${t.focus.color};
+      }
+
+      .dropdown {
+        position: absolute;
+        top: calc(100% + ${t.spacing["02"]});
+        right: 0;
+        width: 14rem;
+        background: ${t.color.surface.defaultPrimaryGray};
+        border: 1px solid ${t.color.border.defaultGray100};
+        border-radius: ${t.radius.m};
+        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.32);
+        z-index: 9999;
+        overflow: hidden;
+      }
+
+      .preview {
+        display: flex;
+        align-items: center;
+        gap: ${t.spacing["03"]};
+        padding: ${t.spacing["03"]};
+        border-bottom: 1px solid ${t.color.border.defaultGray100};
+      }
+      .preview-avatar {
+        flex-shrink: 0;
+        width: 2.5rem;
+        height: 2.5rem;
+        border-radius: 9999px;
+        background: ${t.color.surface.defaultWhite};
+        color: ${t.color.text.buttonDefault};
+        font-size: 0.875rem;
+        font-weight: 600;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+      }
+      .preview-info {
+        min-width: 0;
+        flex: 1;
+      }
+      .preview-name {
+        font-size: 0.875rem;
+        font-weight: 600;
+        color: ${t.color.text.primaryWhite};
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      .preview-email {
+        font-size: 0.75rem;
+        color: ${t.color.text.secondaryGray};
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        margin-top: 2px;
+      }
+
+      .actions {
+        padding: ${t.spacing["02"]};
+      }
+      .signout-btn {
+        all: unset;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        gap: ${t.spacing["02"]};
+        width: 100%;
+        padding: ${t.spacing["02"]} ${t.spacing["03"]};
+        border-radius: ${t.radius.s};
+        color: ${t.color.text.error};
+        font-size: 0.875rem;
+        font-weight: 500;
+        box-sizing: border-box;
+      }
+      .signout-btn:hover:not([disabled]) {
+        background: color-mix(in srgb, ${t.color.text.error} 12%, transparent);
+      }
+      .signout-btn:focus-visible {
+        ${focusVisibleStyles};
+      }
+      .signout-btn[disabled] {
+        cursor: not-allowed;
+        opacity: 0.6;
+      }
+      .signout-btn svg {
+        flex-shrink: 0;
+      }
+
+      .spinner {
+        width: 1em;
+        height: 1em;
+        border-radius: 9999px;
+        border: 2px solid currentColor;
+        border-top-color: transparent;
+        animation: zl-logout-spin 600ms linear infinite;
+      }
+      @keyframes zl-logout-spin {
+        to {
+          transform: rotate(360deg);
+        }
+      }
+
+      .error-bar {
+        padding: ${t.spacing["02"]} ${t.spacing["03"]};
+        font-size: 0.75rem;
+        color: ${t.color.text.error};
+        background: color-mix(in srgb, ${t.color.text.error} 12%, transparent);
+        border-top: 1px solid ${t.color.border.defaultGray100};
+      }
+    `];
+	#_project_accessor_storage;
+	get project() {
+		return this.#_project_accessor_storage;
+	}
+	set project(value) {
+		this.#_project_accessor_storage = value;
+	}
+	#_postSignOutUrl_accessor_storage = "";
+	get postSignOutUrl() {
+		return this.#_postSignOutUrl_accessor_storage;
+	}
+	set postSignOutUrl(value) {
+		this.#_postSignOutUrl_accessor_storage = value;
+	}
+	#_clientId_accessor_storage = "";
+	get clientId() {
+		return this.#_clientId_accessor_storage;
+	}
+	set clientId(value) {
+		this.#_clientId_accessor_storage = value;
+	}
+	#_displayName_accessor_storage = "";
+	get displayName() {
+		return this.#_displayName_accessor_storage;
+	}
+	set displayName(value) {
+		this.#_displayName_accessor_storage = value;
+	}
+	#_displayEmail_accessor_storage = "";
+	get displayEmail() {
+		return this.#_displayEmail_accessor_storage;
+	}
+	set displayEmail(value) {
+		this.#_displayEmail_accessor_storage = value;
+	}
+	#_open_accessor_storage = false;
+	get open() {
+		return this.#_open_accessor_storage;
+	}
+	set open(value) {
+		this.#_open_accessor_storage = value;
+	}
+	#_loading_accessor_storage = false;
+	get loading() {
+		return this.#_loading_accessor_storage;
+	}
+	set loading(value) {
+		this.#_loading_accessor_storage = value;
+	}
+	#_errorMessage_accessor_storage = "";
+	get errorMessage() {
+		return this.#_errorMessage_accessor_storage;
+	}
+	set errorMessage(value) {
+		this.#_errorMessage_accessor_storage = value;
+	}
+	templateMode = false;
+	connectedCallback() {
+		super.connectedCallback();
+		this.dataset.theme = "dark";
+		this.readDisplayCookie();
+		const tmpl = this.querySelector("template");
+		if (tmpl instanceof HTMLTemplateElement) {
+			this.templateMode = true;
+			this.renderTemplate(tmpl);
+		}
+		document.addEventListener("click", this.handleDocumentClick);
+		document.addEventListener("keydown", this.handleDocumentKeydown);
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		document.removeEventListener("click", this.handleDocumentClick);
+		document.removeEventListener("keydown", this.handleDocumentKeydown);
+	}
+	updated() {
+		const root = this.shadowRoot;
+		if (root && !this.templateMode) applyBaseTokens(root);
+	}
+	/**
+	* Decodes the `__nextgen_display` cookie (base64-encoded JSON, set by the
+	* auth backend on sign-in) and populates `displayName` / `displayEmail`.
+	* A missing or malformed cookie is intentionally non-fatal — the dropdown
+	* still renders, just with empty values.
+	*/
+	readDisplayCookie() {
+		if (typeof document === "undefined") return;
+		const match = document.cookie.match(new RegExp(`(?:^|;\\s*)${DISPLAY_COOKIE_NAME}=([^;]+)`));
+		if (!match || !match[1]) return;
+		try {
+			const data = JSON.parse(atob(match[1]));
+			this.displayName = typeof data.name === "string" ? data.name : "";
+			this.displayEmail = typeof data.email === "string" ? data.email : "";
+		} catch {}
+	}
+	get initial() {
+		const source = this.displayName || this.displayEmail;
+		return source ? source.charAt(0).toUpperCase() : "?";
+	}
+	/**
+	* Clones a consumer-supplied `<template>` into the light DOM, fills the
+	* `{{name}}`, `{{email}}`, and `{{initial}}` tokens via a TreeWalker, and
+	* wires every element with `data-action="logout"` to trigger sign-out.
+	* Light-DOM mounting is deliberate so the consumer's existing CSS applies.
+	*/
+	renderTemplate(tmpl) {
+		const clone = tmpl.content.cloneNode(true);
+		fillTemplateTokens(clone, this.displayName, this.displayEmail, this.initial);
+		const container = document.createElement("span");
+		container.appendChild(clone);
+		this.appendChild(container);
+		container.querySelectorAll("[data-action=\"logout\"]").forEach((el) => {
+			el.addEventListener("click", (event) => {
+				event.preventDefault();
+				this.doLogout();
+			});
+		});
+	}
+	handleDocumentClick = (event) => {
+		if (!this.open) return;
+		if (event.composedPath().includes(this)) return;
+		this.open = false;
+	};
+	handleDocumentKeydown = (event) => {
+		if (!this.open) return;
+		if (event.key !== "Escape") return;
+		this.open = false;
+		this.shadowRoot?.querySelector(".trigger")?.focus();
+	};
+	toggleOpen() {
+		this.open = !this.open;
+		this.errorMessage = "";
+	}
+	/**
+	* Calls the typed `endSession` operation (`GET /auth/end-session`) with
+	* `credentials: "include"`. The server clears the session cookie via
+	* `Set-Cookie: Max-Age=0`; on success this element fires `zitadel-signout`
+	* and optionally navigates to `postSignOutUrl`.
+	*/
+	async doLogout() {
+		this.loading = true;
+		this.errorMessage = "";
+		const params = {
+			...this.clientId ? { client_id: this.clientId } : {},
+			...this.postSignOutUrl ? { post_logout_redirect_uri: this.postSignOutUrl } : {}
+		};
+		try {
+			const cfg = this.project ?? getZitadelConfig();
+			if (!cfg) throw new Error("<zitadel-logout> requires a `config` prop (from configureZitadel()).");
+			await getApi(cfg).endSession(params, { credentials: "include" });
+		} catch (error) {
+			const message = error instanceof Error ? error.message : "";
+			this.errorMessage = message || "Sign-out failed. Please try again.";
+			this.loading = false;
+			return;
+		}
+		this.open = false;
+		this.loading = false;
+		const detail = {
+			name: this.displayName,
+			email: this.displayEmail
+		};
+		this.dispatchEvent(new CustomEvent("zitadel-signout", {
+			bubbles: true,
+			composed: true,
+			detail
+		}));
+		if (this.postSignOutUrl && typeof window !== "undefined") window.location.href = this.postSignOutUrl;
+	}
+	/**
+	* Returns the absolute URL the end-session request will hit. Useful for
+	* test assertions and for consumers that prefer to navigate the browser
+	* directly (instead of fetching) so the OIDC session-end redirect is
+	* driven by the user agent.
+	*/
+	getEndSessionUrl() {
+		const params = {
+			...this.clientId ? { client_id: this.clientId } : {},
+			...this.postSignOutUrl ? { post_logout_redirect_uri: this.postSignOutUrl } : {}
+		};
+		const cfg = this.project ?? getZitadelConfig();
+		if (!cfg) throw new Error("<zitadel-logout> requires a `config` prop (from configureZitadel()).");
+		return getApi(cfg).getEndSessionUrl(params);
+	}
+	handleSignOutClick(event) {
+		event.preventDefault();
+		this.doLogout();
+	}
+	render() {
+		if (this.templateMode) return nothing;
+		return html`
+      <button
+        class="trigger"
+        type="button"
+        aria-label=${this.open ? "Close user menu" : "Open user menu"}
+        aria-expanded=${this.open ? "true" : "false"}
+        aria-haspopup="dialog"
+        @click=${this.toggleOpen}
+      >
+        ${this.initial}
+      </button>
+
+      ${this.open ? html`
+            <div class="dropdown" role="dialog" aria-label="User menu">
+              <div class="preview">
+                <div class="preview-avatar" aria-hidden="true">${this.initial}</div>
+                <div class="preview-info">
+                  <div class="preview-name">${this.displayName || this.displayEmail}</div>
+                  ${this.displayName ? html`<div class="preview-email">${this.displayEmail}</div>` : nothing}
+                </div>
+              </div>
+
+              <div class="actions">
+                <button
+                  class="signout-btn"
+                  type="button"
+                  ?disabled=${this.loading}
+                  @click=${this.handleSignOutClick}
+                >
+                  ${this.loading ? html`<span class="spinner" aria-hidden="true"></span>` : html`
+                        <svg
+                          width="14"
+                          height="14"
+                          viewBox="0 0 24 24"
+                          fill="none"
+                          stroke="currentColor"
+                          stroke-width="2"
+                          stroke-linecap="round"
+                          stroke-linejoin="round"
+                          aria-hidden="true"
+                        >
+                          <path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" />
+                          <polyline points="16 17 21 12 16 7" />
+                          <line x1="21" y1="12" x2="9" y2="12" />
+                        </svg>
+                      `}
+                  <span>${this.loading ? "Signing out…" : "Sign out"}</span>
+                </button>
+              </div>
+
+              ${this.errorMessage ? html`<div class="error-bar" role="alert">${this.errorMessage}</div>` : nothing}
+            </div>
+          ` : nothing}
+    `;
+	}
+};
+__decorate([property({ attribute: false })], ZitadelLogout.prototype, "project", null);
+__decorate([property({
+	type: String,
+	attribute: "post-sign-out-url"
+})], ZitadelLogout.prototype, "postSignOutUrl", null);
+__decorate([property({
+	type: String,
+	attribute: "client-id"
+})], ZitadelLogout.prototype, "clientId", null);
+__decorate([state()], ZitadelLogout.prototype, "displayName", null);
+__decorate([state()], ZitadelLogout.prototype, "displayEmail", null);
+__decorate([state()], ZitadelLogout.prototype, "open", null);
+__decorate([state()], ZitadelLogout.prototype, "loading", null);
+__decorate([state()], ZitadelLogout.prototype, "errorMessage", null);
+ZitadelLogout = __decorate([customElement("zitadel-logout")], ZitadelLogout);
+/**
+* Substitutes `{{name}}`, `{{email}}`, and `{{initial}}` placeholders inside
+* a fragment's text nodes. Walking text nodes (rather than running a regex
+* over `outerHTML`) keeps attributes and structural markup untouched.
+*/
+function fillTemplateTokens(fragment, name, email, initial) {
+	const walker = document.createTreeWalker(fragment, NodeFilter.SHOW_TEXT);
+	let node = walker.nextNode();
+	while (node) {
+		if (node.textContent) node.textContent = node.textContent.replace(/\{\{name\}\}/g, name).replace(/\{\{email\}\}/g, email).replace(/\{\{initial\}\}/g, initial);
+		node = walker.nextNode();
+	}
+}
+//#endregion
+export { startFlow as C, getCurrentStep as S, applyFontUrl as _, builtinLocales as a, buildBrandingStylesheet as b, TEMPLATE_NAMES as c, defaultTemplate as d, layoutChromeCss as f, patchMandatoryGates as g, mandatoryGatesMarkerComment as h, createSanitiser as i, signedInTemplate as l, MANDATORY_GATES_MARKER as m, ZitadelLogin as n, de as o, authFormTemplate as p, ThemeController as r, en as s, ZitadelLogout as t, passkeyUpsellTemplate as u, validateBranding as v, submitStep as w, resolveTheme as x, applyBrandingTokens as y };
+
+//# sourceMappingURL=orchestrator-CNKo2WQG.mjs.map