@zitadel/components 1.0.0-alpha.22 → 1.0.0-alpha.23

package/dist/standalone.mjs

@@ -2638,6 +2638,7 @@ let ZlField = class ZlField extends i$2 {
           class="zr-field__trailing-action"
           part="trailing-action"
           aria-label="Clear"
+          tabindex="-1"
           ?disabled=${this.disabled}
           @click=${this.handleClear}
         >
@@ -4023,18 +4024,28 @@ function validateBranding(input, context = {}) {
 		out.layout = CreateFlow201BrandingLayout.centered;
 	}
 	out.logo_url = sanitiseUrl(out.logo_url, "logo_url", issues, { allowed: allowLoopbackHttp });
-	out.font_url = sanitiseUrl(out.font_url, "font_url", issues);
+	if (out.typography?.font_url) out.typography = {
+		...out.typography,
+		font_url: sanitiseUrl(out.typography.font_url, "typography.font_url", issues)
+	};
 	out.hero_url = sanitiseUrl(out.hero_url, "hero_url", issues, { allowed: allowLoopbackHttp });
-	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)
+	if (out.theme?.light || out.theme?.dark) out.theme = {
+		...out.theme,
+		...sanitiseSideLogo(out.theme.light, "light", issues, allowLoopbackHttp),
+		...sanitiseSideLogo(out.theme.dark, "dark", issues, allowLoopbackHttp)
 	};
 	return {
 		branding: out,
 		issues
 	};
 }
+function sanitiseSideLogo(side, name, issues, allowLoopbackHttp) {
+	if (!side) return {};
+	return { [name]: {
+		...side,
+		logo_url: sanitiseUrl(side.logo_url, `theme.${name}.logo_url`, issues, { allowed: allowLoopbackHttp })
+	} };
+}
 function sanitiseUrl(value, field, issues, loopbackHttp) {
 	if (value == null || value === "") return;
 	try {
@@ -4052,6 +4063,34 @@ function sanitiseUrl(value, field, issues, loopbackHttp) {
 	}
 }
 //#endregion
+//#region src/orchestrator/branding.ts
+/**
+* Which sides the revision actually publishes. A side is published when the
+* revision names it at all — an empty side object still says "this surface is
+* mine", it just takes the maintained defaults for every key.
+*/
+function publishedSides(branding) {
+	const theme = branding?.theme;
+	const sides = [];
+	if (theme?.light) sides.push("light");
+	if (theme?.dark) sides.push("dark");
+	return sides;
+}
+/**
+* The mark for the resolved surface. A logo is pixels and is never recoloured,
+* so a side without its own file shows no mark rather than borrowing the other
+* side's. The legacy top-level `logo_url` is a single-mark fallback and applies
+* only when neither side names one.
+*/
+function resolveLogoUrl(branding, theme) {
+	if (!branding) return void 0;
+	const sides = branding.theme;
+	const sideLogo = theme === "light" ? sides?.light?.logo_url : sides?.dark?.logo_url;
+	if (sideLogo) return sideLogo;
+	if (sides?.light?.logo_url || sides?.dark?.logo_url) return void 0;
+	return branding.logo_url;
+}
+//#endregion
 //#region src/manifests.ts
 /**
 * Aggregate registry of every shipped `<zl-*>` atom's manifest.
@@ -6982,7 +7021,7 @@ const minus = argumentsToNumber((v, arg) => v - arg);
 const plus = argumentsToNumber((lhs, rhs) => lhs + rhs);
 const modulo = argumentsToNumber((v, arg) => (v % arg + arg) % arg);
 const times = argumentsToNumber((v, arg) => v * arg);
-function round(v, arg = 0) {
+function round$1(v, arg = 0) {
 	v = toNumber(v);
 	arg = toNumber(arg);
 	const amp = Math.pow(10, arg);
@@ -7001,7 +7040,7 @@ var mathFilters = /* @__PURE__ */ Object.freeze({
 	plus,
 	modulo,
 	times,
-	round
+	round: round$1
 });
 const url_decode = (x) => decodeURIComponent(stringify$1(x)).replace(/\+/g, " ");
 const url_encode = (x) => encodeURIComponent(stringify$1(x)).replace(/%20/g, "+");
@@ -9087,7 +9126,7 @@ const en = {
 	"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. */
+	/** Sign-in error, inline on the password field. */
 	"error.invalid_credentials": "Wrong email or password.",
 	"error.required": "This field is required.",
 	"error.field_required": "{0} is required.",
@@ -9410,16 +9449,17 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	createFlowDefinition: () => createFlowDefinition,
 	createGrant: () => createGrant,
 	createHandoff: () => createHandoff,
+	createIdp: () => createIdp,
 	createProject: () => createProject,
 	createRelease: () => createRelease,
 	createSchema: () => createSchema,
 	createSession: () => createSession,
 	createTeam: () => createTeam,
 	createUser: () => createUser,
-	deleteFlowDefinition: () => deleteFlowDefinition,
 	deleteGrant: () => deleteGrant,
 	deleteTeam: () => deleteTeam,
 	deleteUserByID: () => deleteUserByID,
+	deleteVariable: () => deleteVariable,
 	exchangeHandoff: () => exchangeHandoff,
 	finishUserPasskeyRegistration: () => finishUserPasskeyRegistration,
 	getAuthAttempt: () => getAuthAttempt,
@@ -9434,16 +9474,17 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	getCreateFlowUrl: () => getCreateFlowUrl,
 	getCreateGrantUrl: () => getCreateGrantUrl,
 	getCreateHandoffUrl: () => getCreateHandoffUrl,
+	getCreateIdpUrl: () => getCreateIdpUrl,
 	getCreateProjectUrl: () => getCreateProjectUrl,
 	getCreateReleaseUrl: () => getCreateReleaseUrl,
 	getCreateSchemaUrl: () => getCreateSchemaUrl,
 	getCreateSessionUrl: () => getCreateSessionUrl,
 	getCreateTeamUrl: () => getCreateTeamUrl,
 	getCreateUserUrl: () => getCreateUserUrl,
-	getDeleteFlowDefinitionUrl: () => getDeleteFlowDefinitionUrl,
 	getDeleteGrantUrl: () => getDeleteGrantUrl,
 	getDeleteTeamUrl: () => getDeleteTeamUrl,
 	getDeleteUserByIDUrl: () => getDeleteUserByIDUrl,
+	getDeleteVariableUrl: () => getDeleteVariableUrl,
 	getEnvironmentByName: () => getEnvironmentByName,
 	getEvent: () => getEvent,
 	getExchangeHandoffUrl: () => getExchangeHandoffUrl,
@@ -9460,6 +9501,8 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	getGetFlowStepUrl: () => getGetFlowStepUrl,
 	getGetGrantUrl: () => getGetGrantUrl,
 	getGetHealthUrl: () => getGetHealthUrl,
+	getGetIdpByIdUrl: () => getGetIdpByIdUrl,
+	getGetIdpRevisionByIdUrl: () => getGetIdpRevisionByIdUrl,
 	getGetLiveUrl: () => getGetLiveUrl,
 	getGetMySessionUrl: () => getGetMySessionUrl,
 	getGetMyUserUrl: () => getGetMyUserUrl,
@@ -9470,14 +9513,20 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	getGetSessionUrl: () => getGetSessionUrl,
 	getGetTeamUrl: () => getGetTeamUrl,
 	getGetUserByIDUrl: () => getGetUserByIDUrl,
+	getGetVariableUrl: () => getGetVariableUrl,
+	getGetVariablesUrl: () => getGetVariablesUrl,
 	getGrant: () => getGrant,
 	getHealth: () => getHealth,
+	getIdpById: () => getIdpById,
+	getIdpRevisionById: () => getIdpRevisionById,
 	getInitClaimUrl: () => getInitClaimUrl,
 	getIssueChallengeUrl: () => getIssueChallengeUrl,
 	getListBrandingUrl: () => getListBrandingUrl,
 	getListEnvironmentsUrl: () => getListEnvironmentsUrl,
 	getListEventsUrl: () => getListEventsUrl,
 	getListFlowDefinitionsUrl: () => getListFlowDefinitionsUrl,
+	getListIdpRevisionsUrl: () => getListIdpRevisionsUrl,
+	getListMyProjectsUrl: () => getListMyProjectsUrl,
 	getListReleasesUrl: () => getListReleasesUrl,
 	getListSchemasUrl: () => getListSchemasUrl,
 	getListUserPasskeysUrl: () => getListUserPasskeysUrl,
@@ -9485,9 +9534,12 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	getLive: () => getLive,
 	getMySession: () => getMySession,
 	getMyUser: () => getMyUser,
+	getPatchMyUserUrl: () => getPatchMyUserUrl,
 	getPatchProjectUrl: () => getPatchProjectUrl,
+	getPatchUserByIDUrl: () => getPatchUserByIDUrl,
 	getProject: () => getProject,
 	getQueryGrantsUrl: () => getQueryGrantsUrl,
+	getQueryIdpsUrl: () => getQueryIdpsUrl,
 	getQueryProjectsUrl: () => getQueryProjectsUrl,
 	getQuerySessionsUrl: () => getQuerySessionsUrl,
 	getQueryTeamsUrl: () => getQueryTeamsUrl,
@@ -9501,9 +9553,11 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	getSetUserPasswordUrl: () => getSetUserPasswordUrl,
 	getSubmitFlowStepUrl: () => getSubmitFlowStepUrl,
 	getTeam: () => getTeam,
-	getUpdateFlowDefinitionUrl: () => getUpdateFlowDefinitionUrl,
 	getUpdateTeamUrl: () => getUpdateTeamUrl,
+	getUpdateVariablesUrl: () => getUpdateVariablesUrl,
 	getUserByID: () => getUserByID,
+	getVariable: () => getVariable,
+	getVariables: () => getVariables,
 	getVerifyChallengeProofUrl: () => getVerifyChallengeProofUrl,
 	initClaim: () => initClaim,
 	issueChallenge: () => issueChallenge,
@@ -9511,12 +9565,17 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	listEnvironments: () => listEnvironments,
 	listEvents: () => listEvents,
 	listFlowDefinitions: () => listFlowDefinitions,
+	listIdpRevisions: () => listIdpRevisions,
+	listMyProjects: () => listMyProjects,
 	listReleases: () => listReleases,
 	listSchemas: () => listSchemas,
 	listUserPasskeys: () => listUserPasskeys,
 	listUserTeams: () => listUserTeams,
+	patchMyUser: () => patchMyUser,
 	patchProject: () => patchProject,
+	patchUserByID: () => patchUserByID,
 	queryGrants: () => queryGrants,
+	queryIdps: () => queryIdps,
 	queryProjects: () => queryProjects,
 	querySessions: () => querySessions,
 	queryTeams: () => queryTeams,
@@ -9525,8 +9584,8 @@ var zitadelNextGen_exports = /* @__PURE__ */ __exportAll({
 	revokeSession: () => revokeSession,
 	setUserPassword: () => setUserPassword,
 	submitFlowStep: () => submitFlowStep,
-	updateFlowDefinition: () => updateFlowDefinition,
 	updateTeam: () => updateTeam,
+	updateVariables: () => updateVariables,
 	verifyChallengeProof: () => verifyChallengeProof
 });
 const getGetHealthUrl = () => {
@@ -9596,9 +9655,14 @@ const getQueryUsersUrl = () => {
 /**
 * Returns the users of a project, paginated with a cursor.
 
-The project comes from the credential, not from a parameter: the operation
-is bound to the token's own project by construction. This is why it takes
-no `project_id`, unlike the other query endpoints.
+The project comes from the credential, not from a parameter: the
+operation is bound to the credential's home project by construction
+(oauth2 secret or user-bound session). This is why it takes no
+`project_id`, unlike the other query endpoints.
+
+Accepts either a project secret (`oauth2`) or a user-bound Console
+session cookie (`nextgenSession`). CSRF/Origin for cookie mutations
+is a follow-up (#1140).
 
 * @summary Query users
 */
@@ -9630,6 +9694,28 @@ const getUserByID = async (userId, params, options) => {
 		method: "GET"
 	});
 };
+const getPatchUserByIDUrl = (userId) => {
+	return `${getProxyPath()}/users/${userId}`;
+};
+/**
+* Partially updates a user's schema-defined attributes, and optionally
+moves the user to another registered schema. The merged result is
+validated against the schema before commit. Concurrent writes are
+last-write-wins.
+
+* @summary Update user by ID
+*/
+const patchUserByID = async (userId, patchUserByIDBody, options) => {
+	return customFetch(getPatchUserByIDUrl(userId), {
+		...options,
+		method: "PATCH",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(patchUserByIDBody)
+	});
+};
 const getDeleteUserByIDUrl = (userId) => {
 	return `${getProxyPath()}/users/${userId}`;
 };
@@ -9760,6 +9846,52 @@ const getMyUser = async (options) => {
 		method: "GET"
 	});
 };
+const getPatchMyUserUrl = () => {
+	return `${getProxyPath()}/users/me`;
+};
+/**
+* Partially updates the caller's own schema-defined attributes. The merged
+result is validated against the user's schema before commit. Concurrent
+writes are last-write-wins.
+
+* @summary Update my user information
+*/
+const patchMyUser = async (patchMyUserBody, options) => {
+	return customFetch(getPatchMyUserUrl(), {
+		...options,
+		method: "PATCH",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(patchMyUserBody)
+	});
+};
+const getListMyProjectsUrl = (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()}/users/me/projects?${stringifiedParams}` : `${getProxyPath()}/users/me/projects`;
+};
+/**
+* The projects the signed-in user holds an active grant on, either directly or
+through a team they are a member of. Ordered by project id and paged with an
+opaque cursor.
+
+This is not the same question as `queryProjects`, which answers with the one
+project the calling credential is bound to. Here the session is the caller
+and the grants are the answer, so the list spans projects.
+
+* @summary List the projects I can act on
+*/
+const listMyProjects = async (params, options) => {
+	return customFetch(getListMyProjectsUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
 const getCreateFlowUrl = () => {
 	return `${getProxyPath()}/flow`;
 };
@@ -10445,42 +10577,6 @@ const getFlowDefinition = async (id, options) => {
 		method: "GET"
 	});
 };
-const getUpdateFlowDefinitionUrl = (id) => {
-	return `${getProxyPath()}/flow_definitions/${id}`;
-};
-/**
-* Update a flow definition by id. This endpoint replaces the existing flow definition.
-If `flow_definition.status` is omitted, the current status is preserved
-
-* @summary Update a flow definition by id
-*/
-const updateFlowDefinition = async (id, updateFlowDefinitionBody, options) => {
-	return customFetch(getUpdateFlowDefinitionUrl(id), {
-		...options,
-		method: "PUT",
-		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.
-If the flow definition is currently being used by a flow, the deletion will fail.
-If the flow definition is the last active flow definition for a given purpose, the deletion will fail to prevent disruption of new flows being started for that purpose.
-
-* @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]) => {
@@ -10554,6 +10650,11 @@ users whose lifecycle it owns are deactivated with it.
 The request is idempotent. Deleting a team that is already deactivated
 or doesn't exist succeeds without changing anything.
 
+A team that still owns a project is refused with `409
+team.owns_project`: deactivating it would leave the project owned by a
+dead team and so unmanageable. No endpoint releases that ownership yet,
+so such a team cannot currently be deactivated through the API.
+
 * @summary Delete team
 */
 const deleteTeam = async (teamId, options) => {
@@ -10633,8 +10734,7 @@ const getCreateBrandingUrl = (params) => {
 /**
 * Publishes a new immutable branding revision for the project. Branding
 revisions cannot be updated or deleted; every edit publishes a new
-revision, and flow responses resolve the latest revision per project
-(see ADR 040).
+revision, and flow responses resolve the latest revision per project.
 
 The `liquid_template` is validated lexically on save (size, encoding,
 banned patterns such as `<script>` tags, inline event handlers, and the
@@ -10665,9 +10765,9 @@ const getListBrandingUrl = (params) => {
 /**
 * Lists branding revisions for the project, newest first, capped at the
 100 most recent. The first entry is the revision flow responses
-currently resolve. Deliberately unpaginated in v1 — list endpoints
-gain a real query mechanism together (ADR 031); advertising pagination
-parameters the server ignores would be worse than none.
+currently resolve. Deliberately unpaginated in v1 — list endpoints gain a
+real query mechanism together; advertising pagination parameters the
+server ignores would be worse than none.
 
 * @summary List branding revisions
 */
@@ -10690,6 +10790,142 @@ const getBrandingById = async (id, options) => {
 		method: "GET"
 	});
 };
+const getCreateIdpUrl = (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()}/idps?${stringifiedParams}` : `${getProxyPath()}/idps`;
+};
+/**
+* Creates or revises a connection document. If the slug does not already
+exist, a new connection is created. If a connection with that slug already
+exists, a revision is created.
+
+A revision gets a new `revision_id` and does not modify the connection
+`id`, so identity links that reference the connection keep resolving while
+releases and auth attempts stay pinned to the revision they captured.
+
+Identity fields are fixed for the life of the connection and a revision
+that changes one is rejected: `protocol`, `subject_claim`, and the
+endpoints that name the authority (`issuer` for OIDC, `token_endpoint`
+and `userinfo_endpoint` for OAuth 2.0). Their values decide which provider
+account a stored subject belongs to, so changing one would silently
+repoint existing identities at a different provider.
+
+`subject_claim` is optional for OIDC and required for OAuth 2.0. For an
+OIDC connection, `sub` is used as the default value. If a revision updates
+`subject_claim` to a different value than the one set during creation, the
+request is rejected.
+
+The document is validated against the `idp-connection.json` schema before
+anything is stored.
+
+* @summary Create or revise an identity provider connection
+*/
+const createIdp = async (createIdpBody, params, options) => {
+	return customFetch(getCreateIdpUrl(params), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(createIdpBody)
+	});
+};
+const getQueryIdpsUrl = (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()}/idps/query?${stringifiedParams}` : `${getProxyPath()}/idps/query`;
+};
+/**
+* Returns the identity provider connections of a project, paginated with a
+cursor. One row per connection, carrying its newest revision.
+
+* @summary Query identity provider connections
+*/
+const queryIdps = async (queryIdpsBody, params, options) => {
+	return customFetch(getQueryIdpsUrl(params), {
+		...options,
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(queryIdpsBody)
+	});
+};
+const getGetIdpByIdUrl = (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()}/idps/${id}?${stringifiedParams}` : `${getProxyPath()}/idps/${id}`;
+};
+/**
+* Reads a connection by its id, at its newest revision.
+`GET /idps/{id}/revisions` lists every revision of the connection.
+
+The lookup is scoped to the project in `project_id`.
+
+* @summary Get an identity provider connection by id
+*/
+const getIdpById = async (id, params, options) => {
+	return customFetch(getGetIdpByIdUrl(id, params), {
+		...options,
+		method: "GET"
+	});
+};
+const getListIdpRevisionsUrl = (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()}/idps/${id}/revisions?${stringifiedParams}` : `${getProxyPath()}/idps/${id}/revisions`;
+};
+/**
+* Returns every revision of one connection, newest first, paginated with a
+cursor. The order is fixed, so there is no `sorting`.
+
+The lookup is scoped to the project in `project_id`.
+
+* @summary List the revisions of an identity provider connection
+*/
+const listIdpRevisions = async (id, params, options) => {
+	return customFetch(getListIdpRevisionsUrl(id, params), {
+		...options,
+		method: "GET"
+	});
+};
+const getGetIdpRevisionByIdUrl = (revisionId, 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()}/idps/revisions/${revisionId}?${stringifiedParams}` : `${getProxyPath()}/idps/revisions/${revisionId}`;
+};
+/**
+* Reads one revision of a connection by its `revision_id`, the value an auth
+attempt or a release pins.
+
+The lookup is scoped to the project in `project_id`.
+
+* @summary Get one revision of an identity provider connection
+*/
+const getIdpRevisionById = async (revisionId, params, options) => {
+	return customFetch(getGetIdpRevisionByIdUrl(revisionId, params), {
+		...options,
+		method: "GET"
+	});
+};
 const getCreateReleaseUrl = (params) => {
 	const normalizedParams = new URLSearchParams();
 	Object.entries(params || {}).forEach(([key, value]) => {
@@ -10789,10 +11025,23 @@ const getCreateGrantUrl = (params) => {
 /**
 * Bind a user or team to `project.viewer`, `project.editor`, or
 `project.admin` on the project identified by the `project-id` header.
-IDs are `asgn_<opaque>`. Owning-team (`project.team`) grants are not
-created here — claim owns that path. An unrevoked grant with the same
-principal and relation occupies the unique key even after `expires_at`;
-DELETE it before re-creating.
+Name the principal with `user` (`user_id` or `identifier`) or `team`
+(`team_id` or `name`). IDs are `asgn_<opaque>`. Owning-team
+(`project.team`) grants are not created here — claim owns that path. An
+unrevoked grant with the same principal and relation occupies the unique
+key even after `expires_at`; DELETE it before re-creating.
+Create does not accept `expand`. The `user_id` and team locators
+return 201, whose `user` / `team` carry only `user_id` / `team_id`,
+and still 404 / 409 when the principal is missing or the tuple
+already exists. Creating by `user.identifier` answers 202 with no
+body on every outcome. Granting the session caller's own user is
+`grant.invalid` on either user locator. Read the grant back for
+identifier and display.
+
+Accepts either a project secret (`oauth2`) or a user-bound Console
+session cookie (`nextgenSession`). Session callers are authorized as
+the human against the target project (home may differ). CSRF/Origin
+for cookie mutations is a follow-up (#1140).
 
 * @summary Create grant
 */
@@ -10822,10 +11071,16 @@ viewer, editor, or admin), including expired grants so a client can
 DELETE before re-granting. Project-secret setup (`sk_proj`) and
 owning-team (`relation=team`) rows are not returned. Grants are not in
 `resource_scope_index`; project scope is required on the query (same as
-get). Requires `project.read`. `expand: ["principal"]` additionally
-requires `user.read` and `team.read` (documented on the expand enum;
-those scopes cannot be ANDed onto this security block because they are
-body-conditional).
+get). Requires `project.read`. `expand: ["principal"]` adds envelope
+fields on `user` / `team` and additionally requires `user.read` and
+`team.read` for project secrets (documented on the expand enum; those
+scopes cannot be ANDed onto this security block because they are
+body-conditional). A user-bound Console session that already passed
+the project Check may expand without those scopes.
+
+Accepts either a project secret (`oauth2`) or a user-bound Console
+session cookie (`nextgenSession`). CSRF/Origin for cookie mutations
+is a follow-up (#1140).
 
 * @summary Query grants
 */
@@ -10857,6 +11112,14 @@ still ignores expired grants. Grants are not registered in
 `resource_scope_index`; project scope is required on the query (same as
 events). Misses, revoked rows, project-secret setup (`sk_proj`),
 owning-team (`relation=team`) rows, and cross-project ids return 404.
+`expand=principal` adds envelope fields on `user` or `team` and requires
+`user.read` and `team.read` in addition to `project.read` for project
+secrets. A user-bound Console session that already passed the project
+Check may expand without those scopes.
+
+Accepts either a project secret (`oauth2`) or a user-bound Console
+session cookie (`nextgenSession`). CSRF/Origin for cookie mutations
+is a follow-up (#1140).
 
 * @summary Get grant
 */
@@ -10880,6 +11143,10 @@ Already-revoked, missing, project-secret setup, and owning-team grants
 return 404. The row is not un-revoked. Expired grants can still be
 revoked so the unique binding can be reused.
 
+Accepts either a project secret (`oauth2`) or a user-bound Console
+session cookie (`nextgenSession`). CSRF/Origin for cookie mutations
+is a follow-up (#1140).
+
 * @summary Revoke grant
 */
 const deleteGrant = async (id, params, options) => {
@@ -10946,6 +11213,122 @@ const getEvent = async (id, params, options) => {
 		method: "GET"
 	});
 };
+const getGetVariablesUrl = (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()}/variables?${stringifiedParams}` : `${getProxyPath()}/variables`;
+};
+/**
+* Returns the variables entered at the owner this request addresses, keyed by
+name — one environment of the project with `environment_name`, the project
+level itself without it.
+
+Owners are separate, not a ladder: an environment does not inherit the
+project's variables and the project does not see its environments'. Reading
+everything a project holds therefore means reading each owner in turn.
+
+Secret values are not returned. A secret appears as `{"secret": true}`,
+which says a value is held without disclosing it.
+
+* @summary Get variables
+*/
+const getVariables = async (params, options) => {
+	return customFetch(getGetVariablesUrl(params), {
+		...options,
+		method: "GET"
+	});
+};
+const getUpdateVariablesUrl = (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()}/variables?${stringifiedParams}` : `${getProxyPath()}/variables`;
+};
+/**
+* Enters, replaces and removes variables at the owner this request
+addresses.
+
+Every name in the body is applied at exactly that owner — the project, or
+the environment named by `environment_name` — and reaches no other. Names
+not in the body are untouched.
+
+A bare scalar enters a non-secret value. `{"value": …, "secret": true}`
+stores the value encrypted under the project's active `secret` key, after
+which it can be referenced but not read back. `null` removes the name from
+this owner (RFC 7386), which is how several variables are removed in one
+request; removing a name this owner does not hold is a no-op rather than an
+error.
+
+The body is applied whole or not at all, so a rejected request leaves the
+owner exactly as it was. Writing the same name and owner twice replaces the
+value rather than duplicating it, which makes a retry safe.
+
+* @summary Update variables
+*/
+const updateVariables = async (updateVariablesBody, params, options) => {
+	return customFetch(getUpdateVariablesUrl(params), {
+		...options,
+		method: "PATCH",
+		headers: {
+			"Content-Type": "application/json",
+			...options?.headers
+		},
+		body: JSON.stringify(updateVariablesBody)
+	});
+};
+const getGetVariableUrl = (variableName, 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()}/variables/${variableName}?${stringifiedParams}` : `${getProxyPath()}/variables/${variableName}`;
+};
+/**
+* Reads one variable by name from the owner this request addresses — one
+environment of the project with `environment_name`, the project level
+itself without it.
+
+A name that owner has not entered answers `var.not_found`, even when
+another owner of the same project holds it: nothing is inherited. A secret
+is found but not disclosed: the response is `{"secret": true}`.
+
+* @summary Get a variable
+*/
+const getVariable = async (variableName, params, options) => {
+	return customFetch(getGetVariableUrl(variableName, params), {
+		...options,
+		method: "GET"
+	});
+};
+const getDeleteVariableUrl = (variableName, 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()}/variables/${variableName}?${stringifiedParams}` : `${getProxyPath()}/variables/${variableName}`;
+};
+/**
+* Removes the variable this owner entered under this name.
+
+A variable is deletable only by the owner that entered it. Deleting a name
+another owner of the same project holds answers `var.not_found` and leaves
+that owner's value standing.
+
+* @summary Delete a variable
+*/
+const deleteVariable = async (variableName, params, options) => {
+	return customFetch(getDeleteVariableUrl(variableName, params), {
+		...options,
+		method: "DELETE"
+	});
+};
 //#endregion
 //#region ../api/dist/runtime/api-factory.mjs
 /**
@@ -13489,9 +13872,10 @@ function createSanitiser() {
 * 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>`.
+* Light and dark are independent surfaces: each side's palette is emitted under
+* its own `data-theme` selector only, so a key the revision left unset on one
+* side takes the maintained default for that side rather than the other side's
+* colour. 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
@@ -13499,13 +13883,32 @@ function createSanitiser() {
 * 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 RADIUS_STEPS = [
+	"xs",
+	"sm",
+	"md",
+	"lg",
+	"xl"
+];
+const RADIUS_RATIOS = (() => {
+	const base = remToNumber(tokens.radius.md);
+	const ratios = {};
+	for (const step of RADIUS_STEPS) ratios[step] = remToNumber(tokens.radius[step]) / base;
+	return ratios;
+})();
+const RADIUS_PRESETS = {
+	none: 0,
+	sm: .25,
+	md: .5,
+	lg: .75
+};
+const TEXT_STEPS = [
+	"xs",
+	"sm",
+	"base",
+	"lg",
+	"xl"
+];
 const DENSITY_MAP = {
 	compact: {
 		"--zl-spacing-4": "0.75rem",
@@ -13557,34 +13960,35 @@ const PALETTE_MAP = {
 * the moment before a theme resolves.
 */
 const BRANDING_SELECTOR = ":host, :host([data-theme=\"light\"]), :host([data-theme=\"dark\"])";
-/** Dark-only overrides. Emitted after {@link BRANDING_SELECTOR}, so it wins on order. */
+/** Per-side palettes. Emitted after {@link BRANDING_SELECTOR}, so they win on order. */
+const LIGHT_SELECTOR = ":host([data-theme=\"light\"])";
 const DARK_SELECTOR = ":host([data-theme=\"dark\"])";
 /**
 * 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) : {};
+* payload. Shape and typography are shared across the sides and land on the
+* shared selector; each side's palette lands only under its own `data-theme`
+* selector, and nowhere else.
+*
+* No copy of the resolved side goes on the shared selector. That copy would
+* reach `[data-theme="light"]` as well, so a key set on the dark side and not
+* the light one would paint on both, with nothing in the light block to
+* override it. Callers stamp `data-theme` on the host — `applySurfaceTheme`
+* does it in the same update that adopts this sheet — so the per-side block is
+* already matching by the time anything paints.
+*/
+function buildBrandingStylesheet(branding) {
+	const shared = collectDeclarations(branding);
+	const light = mapPalette(branding?.theme?.light?.palette);
+	const dark = mapPalette(branding?.theme?.dark?.palette);
 	const blocks = [];
-	if (Object.keys(lightDecls).length > 0) blocks.push(formatBlock(BRANDING_SELECTOR, lightDecls));
-	if (Object.keys(darkDecls).length > 0) blocks.push(formatBlock(DARK_SELECTOR, darkDecls));
-	if (options.resolvedTheme === "dark" && darkPalette) {
-		const merged = {
-			...lightDecls,
-			...darkDecls
-		};
-		blocks.length = 0;
-		blocks.push(formatBlock(BRANDING_SELECTOR, merged));
-	}
+	if (Object.keys(shared).length > 0) blocks.push(formatBlock(BRANDING_SELECTOR, shared));
+	if (Object.keys(light).length > 0) blocks.push(formatBlock(LIGHT_SELECTOR, light));
+	if (Object.keys(dark).length > 0) blocks.push(formatBlock(DARK_SELECTOR, dark));
 	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;
@@ -13605,24 +14009,52 @@ function mapTypography(typography) {
 		out["--zl-font-family-sans"] = typography.font_family;
 		out["--zl-font-family-heading"] = typography.font_family;
 	}
-	if (typography.font_family_heading) out["--zl-font-family-heading"] = typography.font_family_heading;
-	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}`;
+	if (scale !== 1) for (const step of TEXT_STEPS) {
+		out[`--zl-text-${step}-size`] = scaleRem(tokens.text[step].size, scale);
+		out[`--zl-text-${step}-leading`] = scaleRem(tokens.text[step].leading, 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-md"] = radius;
-		out["--zl-radius-lg"] = radius === "0" ? "0" : `calc(${radius} * 1.25)`;
-		out["--zl-radius-xl"] = radius === "0" ? "0" : `calc(${radius} * 1.75)`;
-	}
+	Object.assign(out, mapRadius(shape.radius));
 	if (shape.density) Object.assign(out, DENSITY_MAP[shape.density]);
+	const logoScale = shape.logo_scale;
+	if (typeof logoScale === "number" && Number.isFinite(logoScale)) out["--zl-logo-scale"] = `${clamp(logoScale, .5, 2)}`;
+	return out;
+}
+/**
+* A brand picks one corner value and the whole ramp follows it in proportion,
+* which is what keeps the card rounder than the controls inside it. Both forms
+* the revision accepts land here: a preset name, or an integer number of pixels
+* for the brand that has a specific value.
+*/
+function mapRadius(radius) {
+	if (radius == null) return {};
+	const out = {};
+	if (radius === "full") {
+		for (const step of RADIUS_STEPS) out[`--zl-radius-${step}`] = tokens.radius.full;
+		return out;
+	}
+	const [base, unit] = typeof radius === "number" ? [radius, "px"] : radius in RADIUS_PRESETS ? [RADIUS_PRESETS[radius], "rem"] : [NaN, ""];
+	if (Number.isNaN(base)) return {};
+	for (const step of RADIUS_STEPS) {
+		const value = base * RADIUS_RATIOS[step];
+		out[`--zl-radius-${step}`] = value === 0 ? "0" : `${round(value)}${unit}`;
+	}
 	return out;
 }
+function scaleRem(value, scale) {
+	return `${round(remToNumber(value) * scale)}rem`;
+}
+function remToNumber(value) {
+	return Number.parseFloat(value);
+}
+function round(value) {
+	return Math.round(value * 1e4) / 1e4;
+}
 function formatBlock(selector, decls) {
 	return `${selector} {\n${Object.entries(decls).map(([prop, value]) => `  ${prop}: ${value};`).join("\n")}\n}`;
 }
@@ -13662,8 +14094,8 @@ function applyBaseTokens(shadowRoot) {
 * 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 });
+function applyBrandingTokens(shadowRoot, branding) {
+	const css = buildBrandingStylesheet(branding);
 	if (typeof CSSStyleSheet === "undefined") return;
 	const sheet = new CSSStyleSheet();
 	sheet.replaceSync(css);
@@ -13678,9 +14110,11 @@ function applyBrandingTokens(shadowRoot, branding, resolvedTheme) {
 * and a variant-derived fallback on top of the same branding input.
 *
 * Defaults to dark: the design system's primary surface, and the mode a
-* hosted login page renders when a tenant states no preference.
+* hosted login page renders when a revision states no preference.
 */
 function resolveTheme(branding) {
+	const [only, second] = publishedSides(branding);
+	if (only && !second) return only;
 	const mode = branding?.theme?.mode ?? "dark";
 	if (mode === "light") return "light";
 	if (mode === "dark") return "dark";
@@ -13698,7 +14132,7 @@ function resolveTheme(branding) {
 *   (Arimo, named first in `--zl-font-family-sans`). The component ships this
 *   so the auth screens render in the brand font out of the box, even when the
 *   server returns no branding. This is the "default users can override" layer.
-* - The **tenant override** (`applyFontUrl`) — `branding.font_url`, resolved
+* - The **tenant override** (`applyFontUrl`) — `branding.typography.font_url`, resolved
 *   server-side from the app → team → project branding hierarchy.
 *
 * Both must live at document level, not inside the shadow root: browsers ignore
@@ -13727,7 +14161,7 @@ const DEFAULT_LINK_ID = "zl-default-font-link";
 * Design-system default brand font. Arimo is the Figma body face and leads the
 * `--zl-font-family-sans` stack; loading it here makes the unbranded auth UI
 * paint in the brand font instead of the system fallback. Tenants override it
-* with `branding.font_url`. Exported so a privacy- or offline-sensitive
+* with `branding.typography.font_url`. Exported so a privacy- or offline-sensitive
 * deployment can self-host the same face and swap this single URL.
 */
 const DEFAULT_BRAND_FONT_HREF = "https://fonts.googleapis.com/css2?family=Arimo:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap";
@@ -13747,7 +14181,7 @@ const DEFAULT_BRAND_FONT_HREF = "https://fonts.googleapis.com/css2?family=Arimo:
 /** Per-document, per-link-id map of each owner's desired href. */
 const registries = /* @__PURE__ */ new WeakMap();
 /**
-* Inject the tenant's `branding.font_url` stylesheet. Pass `null`/`undefined`
+* Inject the tenant's `branding.typography.font_url` stylesheet. Pass `null`/`undefined`
 * to withdraw this surface's registration (e.g. when a flow resolves with no
 * tenant font); the link disappears once no surface registers a URL.
 */
@@ -13757,7 +14191,7 @@ function applyFontUrl(shadowRoot, fontUrl) {
 /**
 * Inject the design-system default font stylesheet. Defaults to
 * {@link DEFAULT_BRAND_FONT_HREF}; pass `null` to withdraw this surface's
-* registration (the orchestrator does this when a tenant `font_url` takes
+* registration (the orchestrator does this when a tenant font stylesheet takes
 * over, to avoid a redundant request).
 */
 function applyDefaultFont(shadowRoot, href = DEFAULT_BRAND_FONT_HREF) {
@@ -13824,7 +14258,10 @@ var ThemeController = class {
 	* element nor the branding payload names a mode. Precedence, strongest
 	* first: element `theme` property → `branding.theme.mode` → fallback. The
 	* element wins because the page embedding the widget knows its own surface
-	* better than the tenant's stored branding does.
+	* better than the tenant's stored branding does — but it selects among the
+	* sides the revision published, and cannot reach one it did not. A revision
+	* with a single published side therefore ignores this property: an embedder
+	* pinning `theme="light"` against a dark-only revision gets dark.
 	*/
 	setModePreference(explicit, fallback) {
 		if (this.explicitMode === explicit && this.fallbackMode === fallback) return;
@@ -13839,6 +14276,12 @@ var ThemeController = class {
 		this.detach();
 	}
 	refresh() {
+		const [only, second] = publishedSides(this.branding);
+		if (only && !second) {
+			this.detach();
+			this.update(only);
+			return;
+		}
 		const mode = this.explicitMode ?? this.branding?.theme?.mode ?? this.fallbackMode;
 		if (mode === "auto") {
 			this.attach();
@@ -13917,9 +14360,10 @@ var ZitadelSurface = class extends i$2 {
 		const root = this.shadowRoot;
 		if (root) {
 			applyBaseTokens(root);
-			applyBrandingTokens(root, branding, this.themeController.theme);
-			const tenantFontUrl = branding?.font_url ?? null;
-			applyDefaultFont(root, this.variant === "page" && !tenantFontUrl ? void 0 : null);
+			applyBrandingTokens(root, branding);
+			const page = this.variant === "page";
+			const tenantFontUrl = page ? branding?.typography?.font_url ?? null : null;
+			applyDefaultFont(root, page && !tenantFontUrl ? void 0 : null);
 			applyFontUrl(root, tenantFontUrl);
 		}
 		this.dataset.theme = this.themeController.theme;
@@ -13955,7 +14399,7 @@ const TEMPLATE_NAMES = {
 };
 //#endregion
 //#region src/orchestrator/templates/layout-chrome.css?inline
-var layout_chrome_default = ":host {\n  color: var(--zl-foreground);\n  font-family: var(--zl-font-family-sans);\n  background: none;\n  display: block;\n}\n\n:host([variant=\"page\"]) {\n  background: var(--zl-background);\n  min-height: 100%;\n}\n\nimg[data-zl-asset-broken] {\n  display: none;\n}\n\n.zl-mount {\n  min-height: var(--zl-page-min-height, auto);\n  background: inherit;\n  color: inherit;\n  flex-direction: column;\n  display: flex;\n  container-type: inline-size;\n}\n\n:host([variant=\"page\"]) .zl-mount {\n  min-height: var(--zl-page-min-height, 100vh);\n}\n\n.zl-mount > zl-page-shell, .zl-mount > [data-zl-template-root] {\n  flex: auto;\n}\n\n.zl-attribution {\n  background: none;\n  justify-content: center;\n  align-items: center;\n  display: flex;\n}\n\n.zl-attribution[hidden] {\n  display: none;\n}\n\n.zl-trustmark {\n  gap: var(--zl-spacing-2-5);\n  flex-wrap: wrap;\n}\n\n.zl-trustmark__mark {\n  align-items: center;\n  gap: var(--zl-spacing-2);\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  color: var(--zl-foreground);\n  text-decoration: none;\n  display: inline-flex;\n}\n\n.zl-trustmark__mark:hover {\n  text-underline-offset: 4px;\n  text-decoration: underline;\n}\n\n.zl-trustmark__mark:focus-visible {\n  outline: var(--zl-focus-width) solid var(--zl-ring);\n  outline-offset: var(--zl-focus-offset);\n  border-radius: var(--zl-radius-sm);\n}\n\n.zl-trustmark__logotype {\n  flex-shrink: 0;\n  width: 65px;\n  height: 16px;\n  line-height: 0;\n  display: block;\n}\n\n.zl-trustmark__logotype-svg {\n  width: 100%;\n  height: 100%;\n  display: block;\n}\n\n.zl-card-logo {\n  width: auto;\n  max-width: min(12rem, 60%);\n  max-height: var(--zl-card-logo-max-height, 2.5rem);\n  object-fit: contain;\n}\n\n.zl-card-title {\n  font-family: var(--zl-font-family-heading);\n  font-size: var(--zl-text-xl-size);\n  font-weight: var(--zl-font-weight-medium);\n  color: var(--zl-card-foreground);\n  text-align: left;\n  margin: 0;\n  line-height: 1;\n}\n\n.zl-card-subtitle {\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  font-weight: var(--zl-font-weight-normal);\n  color: var(--zl-muted-foreground);\n  margin: 0;\n}\n\n.zl-field-group {\n  gap: var(--zl-spacing-7);\n  flex-direction: column;\n  display: flex;\n}\n\n.zl-field-group:not(:has(*)) {\n  display: none;\n}\n\n.zl-card-actions {\n  gap: var(--zl-spacing-3);\n  flex-direction: column;\n  display: flex;\n}\n\n[data-suppress-header] .zl-card-title, [data-suppress-header] .zl-card-subtitle {\n  clip-path: inset(50%);\n  white-space: nowrap;\n  border: 0;\n  width: 1px;\n  height: 1px;\n  margin: -1px;\n  padding: 0;\n  position: absolute;\n  overflow: hidden;\n}\n\n.zl-card-nav {\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  font-weight: var(--zl-font-weight-normal);\n  color: var(--zl-muted-foreground);\n  text-align: center;\n  margin: 0;\n}\n\n.zl-card-nav__link {\n  font: inherit;\n  line-height: inherit;\n  color: var(--zl-link);\n  text-underline-offset: 4px;\n  cursor: pointer;\n  background: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  text-decoration: underline;\n  display: inline;\n}\n\n.zl-card-nav__link:hover {\n  color: var(--zl-foreground);\n}\n\n.zl-card-nav__link:focus-visible {\n  outline: var(--zl-focus-width) solid var(--zl-ring);\n  outline-offset: var(--zl-focus-offset);\n}\n\n.zl-card-forgot {\n  text-align: right;\n  margin: 0;\n}\n\n.zl-card-forgot__link {\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  font-weight: var(--zl-font-weight-normal);\n  color: var(--zl-link);\n  text-underline-offset: 4px;\n  cursor: pointer;\n  background: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  text-decoration: none;\n  display: inline;\n}\n\n.zl-card-forgot__link:hover {\n  text-decoration: underline;\n}\n\n.zl-card-forgot__link:focus-visible {\n  outline: var(--zl-focus-width) solid var(--zl-ring);\n  outline-offset: var(--zl-focus-offset);\n}\n\n.zl-split {\n  grid-template-columns: var(--zl-split-columns, minmax(0, 1fr) minmax(0, 1fr));\n  align-items: var(--zl-split-align, center);\n  gap: var(--zl-spacing-8);\n  width: 100%;\n  min-height: 100%;\n  display: grid;\n}\n\n.zl-split__brand {\n  justify-content: center;\n  align-items: center;\n  gap: var(--zl-spacing-6);\n  padding: var(--zl-spacing-8) var(--zl-spacing-4);\n  flex-direction: column;\n  display: flex;\n}\n\n.zl-split__logo {\n  max-width: min(16rem, 60%);\n  max-height: var(--zl-split-logo-max-height, 16rem);\n}\n\n.zl-split__logo:has( + .zl-split__hero) {\n  max-height: var(--zl-split-logo-max-height, 8rem);\n}\n\n.zl-split__logo:has( + .zl-split__hero) + .zl-split__hero {\n  max-height: min(var(--zl-split-hero-max-height, 22.5rem),\n    max(6rem,\n      calc(100vh - 104px - var(--zl-spacing-8) - var(--zl-spacing-8) -\n          2.5rem - var(--zl-spacing-6) - var(--zl-spacing-6) -\n          var(--zl-split-logo-max-height, 8rem))));\n}\n\n.zl-split__hero {\n  width: 100%;\n  max-height: var(--zl-split-hero-max-height, min(22.5rem, 60vh));\n  border-radius: var(--zl-radius-lg);\n  object-fit: cover;\n}\n\n.zl-split__placeholder {\n  aspect-ratio: 4 / 5;\n  border-radius: var(--zl-radius-lg);\n  background: radial-gradient(120% 120% at 18% 12%,\n      var(--zl-gradient-lavender-start) 0%,\n      transparent 60%),\n    radial-gradient(130% 130% at 85% 92%,\n      var(--zl-gradient-rose-start) 0%,\n      transparent 60%),\n    var(--zl-card);\n  width: min(18rem, 85%);\n}\n\n.zl-split__form {\n  justify-content: center;\n  align-items: center;\n  gap: var(--zl-spacing-6);\n  flex-direction: column;\n  padding: 16px;\n  display: flex;\n}\n\n.zl-split__compact {\n  max-width: min(12rem, 60%);\n  display: none;\n}\n\nimg.zl-split__compact {\n  max-height: 2.5rem;\n}\n\nimg.zl-split__compact--hero {\n  border-radius: var(--zl-radius-lg);\n  object-fit: cover;\n  width: 100%;\n  max-width: 100%;\n  max-height: 6rem;\n}\n\n.zl-split--right .zl-split__brand {\n  order: 2;\n}\n\n.zl-split--right .zl-split__form {\n  order: 1;\n}\n\nzl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution {\n  grid-template-columns: var(--zl-split-columns, minmax(0, 1fr) minmax(0, 1fr));\n  gap: var(--zl-spacing-8);\n  width: 100%;\n  display: grid;\n}\n\nzl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution > * {\n  grid-column: 2;\n  justify-self: center;\n}\n\nzl-page-shell:has(.zl-split--right) [slot=\"footer\"].zl-attribution > * {\n  grid-column: 1;\n}\n\nzl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution ::slotted(*) {\n  grid-column: 2;\n  justify-self: center;\n}\n\nzl-page-shell:has(.zl-split--right) [slot=\"footer\"].zl-attribution ::slotted(*) {\n  grid-column: 1;\n}\n\n@container (width <= 48rem) {\n  .zl-split {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .zl-split__brand {\n    display: var(--zl-split-brand-mobile, none);\n  }\n\n  .zl-split__compact {\n    display: block;\n  }\n\n  zl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  zl-page-shell:has(.zl-split) .zl-attribution > *, zl-page-shell:has(.zl-split--right) [slot=\"footer\"].zl-attribution > * {\n    grid-column: 1;\n  }\n}\n\n.zl-hero {\n  text-align: left;\n  width: 100%;\n  max-width: 34rem;\n  color: var(--zl-foreground);\n  font-family: var(--zl-font-family-sans);\n  flex-direction: column;\n  display: flex;\n}\n\n.zl-hero__nav {\n  margin-bottom: var(--zl-spacing-8);\n  justify-content: space-between;\n  align-items: center;\n  display: flex;\n}\n\n.zl-hero__brand {\n  align-items: center;\n  gap: var(--zl-spacing-2);\n  letter-spacing: -.01em;\n  font-size: 1.125rem;\n  font-weight: 700;\n  display: inline-flex;\n}\n\n.zl-hero__brand-logo {\n  max-height: 1.75rem;\n}\n\n.zl-hero__brand-mark {\n  border-radius: var(--zl-radius-md);\n  background: linear-gradient(135deg,\n    var(--zl-gradient-lavender-start),\n    var(--zl-gradient-rose-start));\n  width: 1.75rem;\n  height: 1.75rem;\n  display: inline-flex;\n}\n\n.zl-hero__compact-brand {\n  overflow-wrap: anywhere;\n  letter-spacing: -.01em;\n  max-width: 100%;\n  color: var(--zl-foreground);\n  margin: 0;\n  font-size: 1.125rem;\n  font-weight: 700;\n}\n\n.zl-hero__nav-links {\n  gap: var(--zl-spacing-6);\n  color: var(--zl-muted-foreground);\n  font-size: .9375rem;\n  display: flex;\n}\n\n.zl-hero__nav-links a {\n  color: inherit;\n  text-decoration: none;\n}\n\n.zl-hero__nav-links a:hover {\n  text-decoration: underline;\n}\n\n.zl-hero__eyebrow {\n  margin: 0 0 var(--zl-spacing-4);\n  letter-spacing: .08em;\n  text-transform: uppercase;\n  color: var(--zl-muted-foreground);\n  font-size: .8125rem;\n  font-weight: 600;\n}\n\n.zl-hero__headline {\n  margin: 0 0 var(--zl-spacing-4);\n  font-family: var(--zl-font-family-heading);\n  letter-spacing: -.02em;\n  font-size: 2.75rem;\n  font-weight: 700;\n  line-height: 1.1;\n}\n\n.zl-hero__sub {\n  margin: 0 0 var(--zl-spacing-8);\n  max-width: 30rem;\n  color: var(--zl-muted-foreground);\n  font-size: 1.0625rem;\n  line-height: 1.6;\n}\n\n.zl-hero__bullets {\n  gap: var(--zl-spacing-2);\n  margin: 0 0 var(--zl-spacing-8);\n  flex-direction: column;\n  padding: 0;\n  list-style: none;\n  display: flex;\n}\n\n.zl-hero__bullets li {\n  align-items: center;\n  gap: var(--zl-spacing-2);\n  font-size: 1rem;\n  display: flex;\n}\n\n.zl-hero__bullets li:before {\n  content: \"✓\";\n  color: var(--zl-success);\n  font-weight: 700;\n}\n\n.zl-hero__footnote {\n  padding-top: var(--zl-spacing-6);\n  border-top: 1px solid var(--zl-border);\n  color: var(--zl-muted-foreground);\n  margin: 0;\n  font-size: .8125rem;\n}\n\n.zl-hero__footnote strong {\n  color: var(--zl-muted-foreground);\n  font-weight: 600;\n}\n\n.zl-minimal {\n  gap: var(--zl-spacing-6);\n  flex-direction: column;\n  width: min(24rem, 100%);\n  margin-inline: auto;\n  display: flex;\n}\n\n:host([variant=\"page\"]) .zl-minimal {\n  padding: 52px 16px;\n}\n";
+var layout_chrome_default = ":host {\n  color: var(--zl-foreground);\n  font-family: var(--zl-font-family-sans);\n  background: none;\n  display: block;\n}\n\n:host([variant=\"page\"]) {\n  background: var(--zl-background);\n  min-height: 100%;\n}\n\nimg[data-zl-asset-broken] {\n  display: none;\n}\n\n.zl-mount {\n  min-height: var(--zl-page-min-height, auto);\n  background: inherit;\n  color: inherit;\n  flex-direction: column;\n  display: flex;\n  container-type: inline-size;\n}\n\n:host([variant=\"page\"]) .zl-mount {\n  min-height: var(--zl-page-min-height, 100vh);\n}\n\n.zl-mount > zl-page-shell, .zl-mount > [data-zl-template-root] {\n  flex: auto;\n}\n\n.zl-attribution {\n  background: none;\n  justify-content: center;\n  align-items: center;\n  display: flex;\n}\n\n.zl-attribution[hidden] {\n  display: none;\n}\n\n.zl-trustmark {\n  gap: var(--zl-spacing-2-5);\n  flex-wrap: wrap;\n}\n\n.zl-trustmark__mark {\n  align-items: center;\n  gap: var(--zl-spacing-2);\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  color: var(--zl-foreground);\n  text-decoration: none;\n  display: inline-flex;\n}\n\n.zl-trustmark__mark:hover {\n  text-underline-offset: 4px;\n  text-decoration: underline;\n}\n\n.zl-trustmark__mark:focus-visible {\n  outline: var(--zl-focus-width) solid var(--zl-ring);\n  outline-offset: var(--zl-focus-offset);\n  border-radius: var(--zl-radius-sm);\n}\n\n.zl-trustmark__logotype {\n  flex-shrink: 0;\n  width: 65px;\n  height: 16px;\n  line-height: 0;\n  display: block;\n}\n\n.zl-trustmark__logotype-svg {\n  width: 100%;\n  height: 100%;\n  display: block;\n}\n\n.zl-card-logo {\n  width: auto;\n  max-width: min(12rem, 60%);\n  max-height: calc(var(--zl-card-logo-max-height, 2.5rem) * var(--zl-logo-scale, 1));\n  object-fit: contain;\n}\n\n.zl-card-title {\n  font-family: var(--zl-font-family-heading);\n  font-size: var(--zl-text-xl-size);\n  font-weight: var(--zl-font-weight-medium);\n  color: var(--zl-card-foreground);\n  text-align: left;\n  margin: 0;\n  line-height: 1;\n}\n\n.zl-card-subtitle {\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  font-weight: var(--zl-font-weight-normal);\n  color: var(--zl-muted-foreground);\n  margin: 0;\n}\n\n.zl-field-group {\n  gap: var(--zl-spacing-7);\n  flex-direction: column;\n  display: flex;\n}\n\n.zl-field-group:not(:has(*)) {\n  display: none;\n}\n\n.zl-card-actions {\n  gap: var(--zl-spacing-3);\n  flex-direction: column;\n  display: flex;\n}\n\n[data-suppress-header] .zl-card-title, [data-suppress-header] .zl-card-subtitle {\n  clip-path: inset(50%);\n  white-space: nowrap;\n  border: 0;\n  width: 1px;\n  height: 1px;\n  margin: -1px;\n  padding: 0;\n  position: absolute;\n  overflow: hidden;\n}\n\n.zl-card-nav {\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  font-weight: var(--zl-font-weight-normal);\n  color: var(--zl-muted-foreground);\n  text-align: center;\n  margin: 0;\n}\n\n.zl-card-nav__link {\n  font: inherit;\n  line-height: inherit;\n  color: var(--zl-link);\n  text-underline-offset: 4px;\n  cursor: pointer;\n  background: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  text-decoration: underline;\n  display: inline;\n}\n\n.zl-card-nav__link:hover {\n  color: var(--zl-foreground);\n}\n\n.zl-card-nav__link:focus-visible {\n  outline: var(--zl-focus-width) solid var(--zl-ring);\n  outline-offset: var(--zl-focus-offset);\n}\n\n.zl-card-forgot {\n  text-align: right;\n  margin: 0;\n}\n\n.zl-card-forgot__link {\n  font-family: var(--zl-font-family-sans);\n  font-size: var(--zl-text-sm-size);\n  line-height: var(--zl-text-sm-leading);\n  font-weight: var(--zl-font-weight-normal);\n  color: var(--zl-link);\n  text-underline-offset: 4px;\n  cursor: pointer;\n  background: none;\n  border: none;\n  margin: 0;\n  padding: 0;\n  text-decoration: none;\n  display: inline;\n}\n\n.zl-card-forgot__link:hover {\n  text-decoration: underline;\n}\n\n.zl-card-forgot__link:focus-visible {\n  outline: var(--zl-focus-width) solid var(--zl-ring);\n  outline-offset: var(--zl-focus-offset);\n}\n\n.zl-split {\n  grid-template-columns: var(--zl-split-columns, minmax(0, 1fr) minmax(0, 1fr));\n  align-items: var(--zl-split-align, center);\n  gap: var(--zl-spacing-8);\n  width: 100%;\n  min-height: 100%;\n  display: grid;\n}\n\n.zl-split__brand {\n  justify-content: center;\n  align-items: center;\n  gap: var(--zl-spacing-6);\n  padding: var(--zl-spacing-8) var(--zl-spacing-4);\n  flex-direction: column;\n  display: flex;\n}\n\n.zl-split__logo {\n  max-width: min(16rem, 60%);\n  max-height: calc(var(--zl-split-logo-max-height, 16rem) * var(--zl-logo-scale, 1));\n}\n\n.zl-split__logo:has( + .zl-split__hero) {\n  max-height: calc(var(--zl-split-logo-max-height, 8rem) * var(--zl-logo-scale, 1));\n}\n\n.zl-split__logo:has( + .zl-split__hero) + .zl-split__hero {\n  max-height: min(var(--zl-split-hero-max-height, 22.5rem),\n    max(6rem,\n      calc(100vh - 104px - var(--zl-spacing-8) - var(--zl-spacing-8) -\n          2.5rem - var(--zl-spacing-6) - var(--zl-spacing-6) -\n          calc(var(--zl-split-logo-max-height, 8rem) * var(--zl-logo-scale, 1)))));\n}\n\n.zl-split__hero {\n  width: 100%;\n  max-height: var(--zl-split-hero-max-height, min(22.5rem, 60vh));\n  border-radius: var(--zl-radius-lg);\n  object-fit: cover;\n}\n\n.zl-split__placeholder {\n  aspect-ratio: 4 / 5;\n  border-radius: var(--zl-radius-lg);\n  background: radial-gradient(120% 120% at 18% 12%,\n      var(--zl-gradient-lavender-start) 0%,\n      transparent 60%),\n    radial-gradient(130% 130% at 85% 92%,\n      var(--zl-gradient-rose-start) 0%,\n      transparent 60%),\n    var(--zl-card);\n  width: min(18rem, 85%);\n}\n\n.zl-split__form {\n  justify-content: center;\n  align-items: center;\n  gap: var(--zl-spacing-6);\n  flex-direction: column;\n  padding: 16px;\n  display: flex;\n}\n\n.zl-split__compact {\n  max-width: min(12rem, 60%);\n  display: none;\n}\n\nimg.zl-split__compact {\n  max-height: calc(2.5rem * var(--zl-logo-scale, 1));\n}\n\nimg.zl-split__compact--hero {\n  border-radius: var(--zl-radius-lg);\n  object-fit: cover;\n  width: 100%;\n  max-width: 100%;\n  max-height: 6rem;\n}\n\n.zl-split--right .zl-split__brand {\n  order: 2;\n}\n\n.zl-split--right .zl-split__form {\n  order: 1;\n}\n\nzl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution {\n  grid-template-columns: var(--zl-split-columns, minmax(0, 1fr) minmax(0, 1fr));\n  gap: var(--zl-spacing-8);\n  width: 100%;\n  display: grid;\n}\n\nzl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution > * {\n  grid-column: 2;\n  justify-self: center;\n}\n\nzl-page-shell:has(.zl-split--right) [slot=\"footer\"].zl-attribution > * {\n  grid-column: 1;\n}\n\nzl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution ::slotted(*) {\n  grid-column: 2;\n  justify-self: center;\n}\n\nzl-page-shell:has(.zl-split--right) [slot=\"footer\"].zl-attribution ::slotted(*) {\n  grid-column: 1;\n}\n\n@container (width <= 48rem) {\n  .zl-split {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .zl-split__brand {\n    display: var(--zl-split-brand-mobile, none);\n  }\n\n  .zl-split__compact {\n    display: block;\n  }\n\n  zl-page-shell:has(.zl-split) [slot=\"footer\"].zl-attribution {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  zl-page-shell:has(.zl-split) .zl-attribution > *, zl-page-shell:has(.zl-split--right) [slot=\"footer\"].zl-attribution > * {\n    grid-column: 1;\n  }\n}\n\n.zl-hero {\n  text-align: left;\n  width: 100%;\n  max-width: 34rem;\n  color: var(--zl-foreground);\n  font-family: var(--zl-font-family-sans);\n  flex-direction: column;\n  display: flex;\n}\n\n.zl-hero__nav {\n  margin-bottom: var(--zl-spacing-8);\n  justify-content: space-between;\n  align-items: center;\n  display: flex;\n}\n\n.zl-hero__brand {\n  align-items: center;\n  gap: var(--zl-spacing-2);\n  letter-spacing: -.01em;\n  font-size: 1.125rem;\n  font-weight: 700;\n  display: inline-flex;\n}\n\n.zl-hero__brand-logo {\n  max-height: calc(1.75rem * var(--zl-logo-scale, 1));\n}\n\n.zl-hero__brand-mark {\n  border-radius: var(--zl-radius-md);\n  background: linear-gradient(135deg,\n    var(--zl-gradient-lavender-start),\n    var(--zl-gradient-rose-start));\n  width: 1.75rem;\n  height: 1.75rem;\n  display: inline-flex;\n}\n\n.zl-hero__compact-brand {\n  overflow-wrap: anywhere;\n  letter-spacing: -.01em;\n  max-width: 100%;\n  color: var(--zl-foreground);\n  margin: 0;\n  font-size: 1.125rem;\n  font-weight: 700;\n}\n\n.zl-hero__nav-links {\n  gap: var(--zl-spacing-6);\n  color: var(--zl-muted-foreground);\n  font-size: .9375rem;\n  display: flex;\n}\n\n.zl-hero__nav-links a {\n  color: inherit;\n  text-decoration: none;\n}\n\n.zl-hero__nav-links a:hover {\n  text-decoration: underline;\n}\n\n.zl-hero__eyebrow {\n  margin: 0 0 var(--zl-spacing-4);\n  letter-spacing: .08em;\n  text-transform: uppercase;\n  color: var(--zl-muted-foreground);\n  font-size: .8125rem;\n  font-weight: 600;\n}\n\n.zl-hero__headline {\n  margin: 0 0 var(--zl-spacing-4);\n  font-family: var(--zl-font-family-heading);\n  letter-spacing: -.02em;\n  font-size: 2.75rem;\n  font-weight: 700;\n  line-height: 1.1;\n}\n\n.zl-hero__sub {\n  margin: 0 0 var(--zl-spacing-8);\n  max-width: 30rem;\n  color: var(--zl-muted-foreground);\n  font-size: 1.0625rem;\n  line-height: 1.6;\n}\n\n.zl-hero__bullets {\n  gap: var(--zl-spacing-2);\n  margin: 0 0 var(--zl-spacing-8);\n  flex-direction: column;\n  padding: 0;\n  list-style: none;\n  display: flex;\n}\n\n.zl-hero__bullets li {\n  align-items: center;\n  gap: var(--zl-spacing-2);\n  font-size: 1rem;\n  display: flex;\n}\n\n.zl-hero__bullets li:before {\n  content: \"✓\";\n  color: var(--zl-success);\n  font-weight: 700;\n}\n\n.zl-hero__footnote {\n  padding-top: var(--zl-spacing-6);\n  border-top: 1px solid var(--zl-border);\n  color: var(--zl-muted-foreground);\n  margin: 0;\n  font-size: .8125rem;\n}\n\n.zl-hero__footnote strong {\n  color: var(--zl-muted-foreground);\n  font-weight: 600;\n}\n\n.zl-minimal {\n  gap: var(--zl-spacing-6);\n  flex-direction: column;\n  width: min(24rem, 100%);\n  margin-inline: auto;\n  display: flex;\n}\n\n:host([variant=\"page\"]) .zl-minimal {\n  padding: 52px 16px;\n}\n";
 //#endregion
 //#region src/orchestrator/zitadel-login.ts
 /** Narrow a rendered named element to the `formValue` field-atom contract. */
@@ -14086,6 +14530,13 @@ let ZitadelLogin = class ZitadelLogin extends ZitadelSurface {
 		this.#_formValues_accessor_storage = value;
 	}
 	engine = null;
+	/**
+	* The theme the last commit rendered with. The template output carries the
+	* resolved side's mark, so a theme change rewrites the string and
+	* `unsafeHTML` rebuilds the form — which drops what the visitor had typed
+	* unless it is put back.
+	*/
+	lastRenderedTheme = null;
 	sanitise = createSanitiser();
 	/**
 	* Cached compiled tenant template, keyed by source string. Re-rendering on
@@ -14184,9 +14635,14 @@ let ZitadelLogin = class ZitadelLogin extends ZitadelSurface {
 			}
 			for (const card of this.shadowRoot.querySelectorAll("zl-card")) card.toggleAttribute("data-suppress-header", this.suppressHeader);
 		}
+		const previousTheme = this.lastRenderedTheme;
+		this.lastRenderedTheme = this.themeController.theme;
 		const props = changed;
-		if (!props.has("response")) return;
-		this.hydrateStepAfterRender(props.get("response") == null);
+		if (props.has("response")) {
+			this.hydrateStepAfterRender(props.get("response") == null);
+			return;
+		}
+		if (previousTheme !== null && previousTheme !== this.lastRenderedTheme) this.restoreValuesAfterRender();
 	}
 	/**
 	* Apply captured values and move focus once the new step has fully
@@ -14201,11 +14657,19 @@ let ZitadelLogin = class ZitadelLogin extends ZitadelSurface {
 	* swaps are user-initiated, so focus moves in both modes.
 	*/
 	async hydrateStepAfterRender(initial = false) {
+		await this.restoreValuesAfterRender();
+		if (!initial || this.variant === "page") this.moveFocusToFirstField(initial && this.variant === "page");
+	}
+	/**
+	* Put captured values back once the rebuilt subtree has rendered. Awaits the
+	* child atoms' own first render before touching them, rather than guessing a
+	* frame with `requestAnimationFrame`.
+	*/
+	async restoreValuesAfterRender() {
 		await this.updateComplete;
 		const atoms = this.shadowRoot?.querySelectorAll("zl-field, zl-select, zl-checkbox, zl-button");
 		if (atoms) await Promise.all(Array.from(atoms).map((atom) => atom.updateComplete));
 		this.applyValuesToFields();
-		if (!initial || this.variant === "page") this.moveFocusToFirstField(initial && this.variant === "page");
 	}
 	render() {
 		if (this.startupError) return b`<form class="zl-mount" novalidate>
@@ -14247,6 +14711,20 @@ let ZitadelLogin = class ZitadelLogin extends ZitadelSurface {
 		return rendered + html;
 	}
 	/**
+	* The branding a template renders against, with `logo_url` already resolved
+	* to the mark for the active side. Templates read one logo field and get the
+	* right file per surface; the per-side URLs stay on `theme` for a template
+	* that wants to reach them itself.
+	*/
+	brandingForTemplate() {
+		if (!this.branding) return {};
+		const logoUrl = resolveLogoUrl(this.branding, this.themeController.theme);
+		return {
+			...this.branding,
+			logo_url: logoUrl
+		};
+	}
+	/**
 	* "Secured with Zitadel" attribution chrome injected into every
 	* template's page-shell footer slot. Controlled by
 	* `branding.attribution.show_zitadel` — defaults to `true` for
@@ -14327,7 +14805,11 @@ let ZitadelLogin = class ZitadelLogin extends ZitadelSurface {
 				this.armed = true;
 			} else if (!hasBack && this.armed) {
 				this.armed = false;
-				if (history.state?.zl === true) {
+				if (history.state?.zl === true) if (this.completing) history.replaceState({
+					...history.state,
+					zl: false
+				}, "");
+				else {
 					this.ignoreNextPop = true;
 					history.back();
 				}
@@ -14399,7 +14881,7 @@ let ZitadelLogin = class ZitadelLogin extends ZitadelSurface {
 			messages: [],
 			identity: this.deriveIdentity(),
 			errors,
-			branding: this.branding ?? {},
+			branding: this.brandingForTemplate(),
 			loading: this.loading
 		};
 		let raw;
@@ -15063,7 +15545,7 @@ let ZitadelLogout = class ZitadelLogout extends i$2 {
 		const root = this.shadowRoot;
 		if (root && !this.templateMode) {
 			applyBaseTokens(root);
-			applyBrandingTokens(root, void 0, this.themeController.theme);
+			applyBrandingTokens(root, void 0);
 		}
 		this.dataset.theme = this.themeController.theme;
 		this.toggleAttribute("data-theme-dark", this.themeController.theme === "dark");
@@ -15547,4 +16029,4 @@ __decorate([r$1()], ZitadelSession.prototype, "loading", null);
 __decorate([r$1()], ZitadelSession.prototype, "errorMessage", null);
 ZitadelSession = __decorate([t$4("zitadel-session")], ZitadelSession);
 //#endregion
-export { TEMPLATE_NAMES, ThemeController, ZITADEL_ATTRIBUTION_LOGOTYPE_SVG, ZitadelLogin, ZitadelLogout, ZitadelSession, ZlAlert, ZlButton, ZlCard, ZlCheckbox, ZlField, ZlIcon, ZlPageShell, ZlPill, ZlSelect, applyBrandingTokens, applyFontUrl, baseHostStyles, buildBrandingStylesheet, builtinLocales, businessLocales, createSanitiser, cssVars, de, default_default as defaultTemplate, en, findManifest, focusVisibleStyles, getCurrentStep, it, layout_chrome_default as layoutChromeCss, listKnownTags, manifestRegistry, patchMandatoryGates, resolveTheme, startFlow, submitStep, t, tokens, validateBranding, zitadelTrustmarkInnerHtml, zlAlertManifest, zlButtonManifest, zlCardManifest, zlCheckboxManifest, zlFieldManifest, zlIconManifest, zlPageShellManifest, zlPillManifest, zlSelectManifest };
+export { TEMPLATE_NAMES, ThemeController, ZITADEL_ATTRIBUTION_LOGOTYPE_SVG, ZitadelLogin, ZitadelLogout, ZitadelSession, ZlAlert, ZlButton, ZlCard, ZlCheckbox, ZlField, ZlIcon, ZlPageShell, ZlPill, ZlSelect, applyBrandingTokens, applyFontUrl, baseHostStyles, buildBrandingStylesheet, builtinLocales, businessLocales, createSanitiser, cssVars, de, default_default as defaultTemplate, en, findManifest, focusVisibleStyles, getCurrentStep, it, layout_chrome_default as layoutChromeCss, listKnownTags, manifestRegistry, patchMandatoryGates, publishedSides, resolveLogoUrl, resolveTheme, startFlow, submitStep, t, tokens, validateBranding, zitadelTrustmarkInnerHtml, zlAlertManifest, zlButtonManifest, zlCardManifest, zlCheckboxManifest, zlFieldManifest, zlIconManifest, zlPageShellManifest, zlPillManifest, zlSelectManifest };