@tamagui/web 3.0.0-beta.765.1 → 3.0.0-beta.804.1

package/dist/cjs/helpers/getSplitStyles.cjs

@@ -1,8 +1,6 @@
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
 	for (var name in all) __defProp(target, name, {
@@ -19,315 +17,768 @@ var __copyProps = (to, from, except, desc) => {
 	}
 	return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-	value: mod,
-	enumerable: true
-}) : target, mod));
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var getSplitStyles_exports = {};
 __export(getSplitStyles_exports, {
 	STYLE_TOKEN_PROVENANCE_KEY: () => import_styleProvenance2.STYLE_TOKEN_PROVENANCE_KEY,
+	clearDirectStyle: () => clearDirectStyle,
+	contributeStyleString: () => contributeStyleString,
+	directStyleSignature: () => import_directStyleCSS2.directStyleSignature,
+	flushDirectStyles: () => import_directStyleCSS2.flushDirectStyles,
+	getContextPropSet: () => getContextPropSet,
+	getDirectDynamicThemeAccess: () => getDirectDynamicThemeAccess,
+	getFontFamilyFromNameOrVariable: () => getFontFamilyFromNameOrVariable,
 	getSplitStyles: () => getSplitStyles,
 	getStyleTokenProvenance: () => import_styleProvenance2.getStyleTokenProvenance,
-	getSubStyle: () => getSubStyle,
 	isValidStyleKey: () => isValidStyleKey,
-	styleOriginalValues: () => import_styleOriginalValues.styleOriginalValues,
-	useSplitStyles: () => useSplitStyles
+	prepareStyleStaticConfig: () => prepareStyleStaticConfig,
+	styleOriginalValues: () => import_styleOriginalValues.styleOriginalValues
 });
 module.exports = __toCommonJS(getSplitStyles_exports);
 var import_constants = require("@tamagui/constants");
 var import_helpers = require("@tamagui/helpers");
-var import_react = __toESM(require("react"), 1);
-var import_styleFrontend = require("./styleFrontend.cjs");
 var import_config = require("../config.cjs");
 var import_createVariable = require("../createVariable.cjs");
 var import_isDevTools = require("../constants/isDevTools.cjs");
 var import_mediaState = require("./mediaState.cjs");
+var import_types = require("../types.cjs");
 var import_runtime = require("@tamagui/style-grammar/runtime");
+var import_mediaState2 = require("./mediaState.cjs");
+var import_warnOnce = require("./warnOnce.cjs");
+var import_expandStyle = require("./expandStyle.cjs");
 var import_expandStyles = require("./expandStyles.cjs");
-var import_getCSSStylesAtomic = require("./getCSSStylesAtomic.cjs");
+var import_styleToCSS = require("./styleToCSS.cjs");
+var import_directStyleCSS = require("./directStyleCSS.cjs");
+var import_directStyleCSS2 = require("./directStyleCSS.cjs");
+var import_grammarConfig = require("./grammarConfig.cjs");
+require("./getDynamicVal.cjs");
 var import_getDefaultProps = require("./getDefaultProps.cjs");
-var import_insertStyleRule = require("./insertStyleRule.cjs");
+require("./insertStyleRule.cjs");
 var import_isObj = require("./isObj.cjs");
+var import_isObj2 = require("./isObj.cjs");
 var import_log = require("./log.cjs");
+var import_normalizeStyle = require("./normalizeStyle.cjs");
+var import_normalizeColor = require("./normalizeColor.cjs");
 var import_normalizeValueWithProperty = require("./normalizeValueWithProperty.cjs");
-var import_propMapper = require("./propMapper.cjs");
-var import_directStyle = require("./directStyle.cjs");
-var import_frontendProgram = require("./frontendProgram.cjs");
+require("./parseNativeStyle.native.cjs");
+require("./parseNativeTransform.native.cjs");
+var import_getVariantExtras = require("./getVariantExtras.cjs");
+var import_resolveRem = require("./resolveRem.cjs");
+var import_resolveSafeArea = require("./resolveSafeArea.cjs");
+var import_resolveSafeAreaVariable = require("./resolveSafeAreaVariable.cjs");
+var import_resolveVariableValue = require("./resolveVariableValue.cjs");
+var import_themeRef = require("./themeRef.cjs");
+var import_tokenCategories = require("./tokenCategories.cjs");
 var import_skipProps = require("./skipProps.cjs");
-var import_sortString = require("./sortString.cjs");
 var import_styleOriginalValues = require("./styleOriginalValues.cjs");
 var import_styleProvenance = require("./styleProvenance.cjs");
 var import_transformsToString = require("./transformsToString.cjs");
 var import_styleProvenance2 = require("./styleProvenance.cjs");
+__reExport(getSplitStyles_exports, require("./tokenCategories.cjs"), module.exports);
+const TAMAGUI_CLASS_PROPS = "$$tamaguiClassProps";
 const shouldTrackStyleTokenProvenance = process.env.NODE_ENV === "development" && process.env.TAMAGUI_ENABLE_STYLE_TOKEN_PROVENANCE === "1";
-const validComponentClassName = /^[A-Za-z_][A-Za-z0-9_-]*$/;
 function compoundMatcherMatches(expected, actual) {
-	if (Array.isArray(expected)) return expected.some((value) => Object.is(value, actual));
-	return Object.is(expected, actual);
+	if (Array.isArray(expected)) {
+		for (let index = 0; index < expected.length; index++) if (expected[index] === actual) return true;
+		return false;
+	}
+	return expected === actual;
 }
-function compoundMatcherMatchesPayload(expected, payload) {
-	if (Array.isArray(expected)) return expected.some((value) => compoundMatcherMatchesPayload(value, payload));
-	return typeof expected === "string" ? expected === payload : String(expected) === payload;
+function compoundMatcherMatchesPayload(expected, source, start, end) {
+	if (Array.isArray(expected)) {
+		for (let index = 0; index < expected.length; index++) if (compoundMatcherMatchesPayload(expected[index], source, start, end)) return true;
+		return false;
+	}
+	const expectedValue = typeof expected === "string" ? expected : String(expected);
+	if (expectedValue.length !== end - start) return false;
+	for (let index = 0; index < expectedValue.length; index++) if (expectedValue.charCodeAt(index) !== source.charCodeAt(start + index)) return false;
+	return true;
 }
-const compoundScanHandler = {
-	segment(ctx, start, end, isBase, valid, source, chainStart, chainEnd, chainValid) {
-		if (!valid || start >= end) return;
-		if (!compoundMatcherMatchesPayload(ctx[1], source.slice(start, end))) return;
+const preparedCompoundsKey = /* @__PURE__ */ Symbol();
+function prepareStaticConfigCompounds(staticConfig) {
+	const compoundVariants = staticConfig.compoundVariants;
+	const preparedConfig = staticConfig;
+	if (!compoundVariants?.length) {
+		preparedConfig[preparedCompoundsKey] = null;
+		return;
+	}
+	const selectorCounts = [];
+	const indexesByKey = /* @__PURE__ */ Object.create(null);
+	indexesByKey[preparedCompoundsKey] = selectorCounts;
+	for (let index = 0; index < compoundVariants.length; index++) {
+		const compoundVariant = compoundVariants[index];
+		let selectorCount = 0;
+		for (const key in compoundVariant) {
+			if (key === "style") continue;
+			selectorCount++;
+			(indexesByKey[key] ||= []).push(index);
+		}
+		selectorCounts[index] = selectorCount;
+	}
+	preparedConfig[preparedCompoundsKey] = indexesByKey;
+}
+const conditionWidth = 4;
+const conditionValueOffset = 0;
+const conditionFlagsOffset = 1;
+const conditionPrecedenceOffset = 2;
+const conditionWrapperOffset = 3;
+const conditionActiveFlag = 1;
+const conditionEmitFlag = 2;
+const conditionResolvedFlag = 4;
+const conditionEnterFlag = 8;
+const conditionExitFlag = 16;
+const conditionPlatformPseudoFlag = 32;
+const conditionInitialFlags = conditionEmitFlag | 5;
+const conditionTextWidth = 5;
+const conditionKeyOffset = 0;
+const conditionSelectorOffset = 1;
+const conditionThemeOffset = 2;
+const conditionUnsupportedStateOffset = 3;
+const conditionUnresolvedNameOffset = 4;
+let conditionNumbers = new Float64Array(2048);
+const conditionTexts = [];
+const conditionWrappers = [];
+let conditionWrapperTop = 0;
+let conditionCursorTop = conditionWidth;
+function reserveConditionCursor(cursor) {
+	const required = cursor + conditionWidth;
+	if (required > conditionTexts.length) {
+		const previous2 = conditionTexts.length;
+		conditionTexts.length = required;
+		conditionTexts.fill("", previous2);
+	}
+	if (required <= conditionNumbers.length) return;
+	let length = conditionNumbers.length * 2;
+	while (length < required) length *= 2;
+	const previous = conditionNumbers;
+	conditionNumbers = new Float64Array(length);
+	conditionNumbers.set(previous);
+}
+function conditionWrapperCopy(cursor) {
+	const wrapper = conditionNumbers[cursor + conditionWrapperOffset];
+	const count = wrapper & 7;
+	if (!count) return void 0;
+	const start = wrapper >> 3;
+	const wrappers = new Array(count);
+	for (let index = 0; index < count; index++) wrappers[index] = conditionWrappers[start + index];
+	return wrappers;
+}
+function setConditionUnresolved(cursor, name = "") {
+	conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionResolvedFlag;
+	if (name) {
+		const text = cursor + conditionUnresolvedNameOffset;
+		conditionTexts[text] ||= name;
+	}
+}
+function appendConditionWrapper(cursor, wrapper) {
+	conditionWrappers[conditionWrapperTop++] = wrapper;
+	conditionNumbers[cursor + conditionWrapperOffset]++;
+}
+function copyConditionCursor(target, source) {
+	for (let offset = 0; offset <= conditionPrecedenceOffset; offset++) conditionNumbers[target + offset] = conditionNumbers[source + offset];
+	for (let offset = 0; offset < conditionTextWidth; offset++) conditionTexts[target + offset] = conditionTexts[source + offset] || "";
+	const wrapper = conditionNumbers[source + conditionWrapperOffset];
+	const wrapperStart = wrapper >> 3;
+	const wrapperCount = wrapper & 7;
+	for (let index = 0; index < wrapperCount; index++) conditionWrappers[conditionWrapperTop++] = conditionWrappers[wrapperStart + index];
+	conditionNumbers[target + conditionWrapperOffset] += wrapperCount;
+}
+function resetConditionCursor(cursor, parent) {
+	conditionNumbers[cursor + conditionValueOffset] = 0;
+	conditionNumbers[cursor + conditionFlagsOffset] = conditionInitialFlags;
+	conditionNumbers[cursor + conditionPrecedenceOffset] = 0;
+	conditionNumbers[cursor + conditionWrapperOffset] = conditionWrapperTop << 3;
+	conditionTexts.fill("", cursor, cursor + conditionTextWidth);
+	if (parent) copyConditionCursor(cursor, parent);
+}
+function acquireConditionCursor(parent = 0) {
+	const cursor = conditionCursorTop;
+	conditionCursorTop += conditionWidth;
+	reserveConditionCursor(cursor);
+	resetConditionCursor(cursor, parent);
+	return cursor;
+}
+function releaseConditionCursors(watermark) {
+	if (watermark >= conditionCursorTop) return;
+	conditionTexts.fill("", watermark, conditionCursorTop);
+	conditionCursorTop = watermark;
+}
+function releaseConditionPayloads(wrapperBase) {
+	conditionWrappers.fill("", wrapperBase, conditionWrapperTop);
+	conditionWrapperTop = wrapperBase;
+}
+function accumulateConditionAtom(state, cursor, kind, rank, name) {
+	const keySlot = cursor + conditionKeyOffset;
+	const key = conditionTexts[keySlot];
+	if (!key) conditionTexts[keySlot] = name;
+	else {
+		let slotStart = 0;
+		let inserted = false;
+		while (slotStart <= key.length) {
+			let slotEnd = key.indexOf(":", slotStart);
+			if (slotEnd === -1) slotEnd = key.length;
+			let order = 0;
+			const compareLength = Math.min(name.length, slotEnd - slotStart);
+			for (let offset = 0; offset < compareLength; offset++) {
+				order = name.charCodeAt(offset) - key.charCodeAt(slotStart + offset);
+				if (order) break;
+			}
+			order ||= name.length - (slotEnd - slotStart);
+			if (!order) return;
+			if (order < 0) {
+				conditionTexts[keySlot] = `${key.slice(0, slotStart)}${name}:${key.slice(slotStart)}`;
+				inserted = true;
+				break;
+			}
+			if (slotEnd === key.length) break;
+			slotStart = slotEnd + 1;
+		}
+		if (!inserted) conditionTexts[keySlot] = `${key}:${name}`;
+	}
+	if (kind === import_runtime.modifierKindPlatform) {
+		const precedence2 = conditionNumbers[cursor + conditionPrecedenceOffset];
+		if (rank > precedence2 >>> 26) conditionNumbers[cursor + conditionPrecedenceOffset] = precedence2 & 67108863 | rank << 26;
+		if (!(0, import_constants.platformMatches)(name)) conditionNumbers[cursor + conditionFlagsOffset] &= ~(conditionActiveFlag | conditionEmitFlag);
+		return;
+	}
+	let precedence = conditionNumbers[cursor + conditionPrecedenceOffset];
+	const depth = Math.min((precedence >> 23 & 7) + 1, 7);
+	const nextCategory = kind === import_runtime.modifierKindMedia ? 0 : kind === 6 ? 1 : kind === import_runtime.modifierKindTheme ? 2 : kind === 5 ? 3 : 4;
+	let categoryRank = precedence >> 20 & 7;
+	let withinRank = precedence & 1048575;
+	if (nextCategory > categoryRank) {
+		categoryRank = nextCategory;
+		withinRank = rank;
+	} else if (nextCategory === categoryRank && rank > withinRank) withinRank = rank;
+	precedence = precedence & -67108864 | depth << 23 | categoryRank << 20 | withinRank;
+	conditionNumbers[cursor + conditionPrecedenceOffset] = precedence;
+	const buildCSS = import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses;
+	if (kind === import_runtime.modifierKindMedia) {
+		const query = (0, import_grammarConfig.getConfigRevisionState)(state.conf).mediaQueries[name];
+		if (!query) {
+			setConditionUnresolved(cursor, name);
+			return;
+		}
+		if (buildCSS) appendConditionWrapper(cursor, `@media ${query}`);
+		if (!state.flatMediaState?.[name]) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
+		(state.flatMediaKeys ||= /* @__PURE__ */ new Set()).add(name);
+	} else if (kind === import_runtime.modifierKindTheme) {
+		conditionTexts[cursor + conditionThemeOffset] = name;
+		if (buildCSS) {
+			const selector = cursor + conditionSelectorOffset;
+			conditionTexts[selector] += `:where(.t_${name}, .t_${name} *)`;
+		}
+		if (state.flatThemeName !== name && state.flatThemeName?.startsWith(`${name}_`) !== true) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
+	} else if (kind === 5) {
+		const slash = name.indexOf("/");
+		const groupName = slash === -1 ? "true" : name.slice(slash + 1);
+		const stateSelector = import_runtime.stateModifierSelectors[rank];
+		const conditionStateName = import_runtime.canonicalStateModifierNames[rank];
+		if (buildCSS) {
+			const selector = cursor + conditionSelectorOffset;
+			conditionTexts[selector] += `:where(.t_group_${groupName}${stateSelector} *)`;
+			if (rank === 0) appendConditionWrapper(cursor, "@media (hover: hover)");
+		}
+		const component = state.componentState.group?.[groupName];
+		const context = state.flatGroupContext?.[groupName];
+		if (!(component?.pseudo ?? context?.state.pseudo)?.[conditionStateName]) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
+		(state.flatGroupKeys ||= /* @__PURE__ */ new Set()).add(groupName);
+	} else if (kind === 6) {
+		const slash = name.indexOf("/");
+		const containerSize = name.slice(1, slash === -1 ? name.length : slash);
+		const containerName = slash === -1 ? "" : name.slice(slash + 1);
+		const containerQuery = (0, import_grammarConfig.getConfigRevisionState)(state.conf).mediaQueries[containerSize];
+		const groupKey = `@${containerName}`;
+		if (buildCSS) appendConditionWrapper(cursor, containerName ? `@container ${containerName} ${containerQuery}` : `@container ${containerQuery}`);
+		const component = state.componentState.group?.[groupKey];
+		const context = state.flatGroupContext?.[groupKey];
+		if (process.env.NODE_ENV === "development" && containerName && !component && !context && state.flatGroupContext?.[containerName]) (0, import_warnOnce.warnOnce)(`group-container:${containerName}`, `@${containerSize}/${containerName}: targets group="${containerName}", but groups no longer establish query containers. Add container="${containerName}" to that group.`);
+		const match = component?.media?.[containerSize];
+		if (!(match === void 0 ? context?.state.layout && (0, import_mediaState2.mediaKeyMatch)(containerSize, context.state.layout) : match)) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
+		(state.flatGroupKeys ||= /* @__PURE__ */ new Set()).add(groupKey);
+		(state.flatGroupMedia ||= /* @__PURE__ */ new Set()).add(containerSize);
+	} else {
+		const stateSelector = import_runtime.stateModifierSelectors[rank];
+		conditionNumbers[cursor + conditionFlagsOffset] += 64;
+		if (rank === 6) conditionNumbers[cursor + conditionFlagsOffset] |= conditionEnterFlag;
+		else if (rank === 7) conditionNumbers[cursor + conditionFlagsOffset] |= conditionExitFlag;
+		else if (rank === 0 || rank === 2 || rank === 4) conditionNumbers[cursor + conditionFlagsOffset] |= conditionPlatformPseudoFlag;
+		if (buildCSS) {
+			const selector = cursor + conditionSelectorOffset;
+			if (stateSelector[0] === ".") conditionTexts[selector] += `:is(${stateSelector}, ${stateSelector} *)`;
+			else conditionTexts[selector] += stateSelector;
+			if (rank === 0) appendConditionWrapper(cursor, "@media (hover: hover)");
+		}
+		const component = state.componentState;
+		if (!(rank === 0 ? !!component.hover : rank === 4 ? !!(component.press || component.pressIn) : rank === 2 ? !!component.focus : rank === 3 ? !!component.focusVisible : rank === 1 ? !!component.focusWithin : rank === 5 ? !!(component.disabled || state.props.disabled) : rank === 6 ? !!component.unmounted : rank === 7 ? !!state.styleProps.isExiting : false)) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
+		if (stateSelector[0] === ":") (state.flatStateKeys ||= /* @__PURE__ */ new Set()).add(name);
+	}
+}
+function resolveConditionModifier(state, cursor, modifier) {
+	const compiled = (0, import_grammarConfig.getConfigRevisionState)(state.conf);
+	let code = compiled.modifiers[modifier];
+	let kind = code & 7;
+	let rank = code >> 3;
+	if (kind === import_runtime.modifierKindState) {
+		accumulateConditionAtom(state, cursor, kind, rank, import_runtime.canonicalStateModifierNames[rank]);
+		return;
+	}
+	if (!kind && modifier.startsWith("group-")) {
+		const slash = modifier.indexOf("/");
+		const authoredState = modifier.slice(6, slash === -1 ? void 0 : slash);
+		code = compiled.modifiers[authoredState];
+		if ((code & 7) === import_runtime.modifierKindState) {
+			rank = code >> 3;
+			const groupName = slash === -1 ? "true" : modifier.slice(slash + 1);
+			if (rank !== 6 && rank !== 7 && (slash === -1 || (0, import_runtime.isModifierName)(groupName, 0, groupName.length))) {
+				const stateName = import_runtime.canonicalStateModifierNames[rank];
+				accumulateConditionAtom(state, cursor, 5, rank, `group-${stateName}${slash === -1 ? "" : modifier.slice(slash)}`);
+				return;
+			}
+		}
+	} else if (!kind && modifier.charCodeAt(0) === 64) {
+		const slash = modifier.indexOf("/");
+		const containerSize = modifier.slice(1, slash === -1 ? void 0 : slash);
+		const containerName = slash === -1 ? "" : modifier.slice(slash + 1);
+		let containerQuery = "";
+		if ((0, import_runtime.isModifierName)(containerSize, 0, containerSize.length) && (slash === -1 || (0, import_runtime.isModifierName)(containerName, 0, containerName.length)) && ((code = compiled.modifiers[containerSize]) & 7) === import_runtime.modifierKindMedia && (containerQuery = compiled.mediaQueries[containerSize]) && (0, import_runtime.isContainerSizeQueryText)(containerQuery)) {
+			accumulateConditionAtom(state, cursor, 6, code >> 3, modifier);
+			return;
+		}
+	} else if (kind) {
+		accumulateConditionAtom(state, cursor, kind, rank, modifier);
+		return;
+	}
+	setConditionUnresolved(cursor, modifier);
+}
+function resolveConditionText(state, cursor, text) {
+	let start = 0;
+	for (let index = 0; index <= text.length; index++) {
+		if (index !== text.length && text.charCodeAt(index) !== 58) continue;
+		if (index === start) {
+			setConditionUnresolved(cursor);
+			return;
+		}
+		if (!(conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag)) return;
+		resolveConditionModifier(state, cursor, text.slice(start, index));
+		start = index + 1;
+	}
+}
+function commitConditionCursor(state, cursor) {
+	if (!(conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag)) {
+		conditionNumbers[cursor + conditionValueOffset] = 0;
+		return 0;
+	}
+	const key = conditionTexts[cursor + conditionKeyOffset] || "";
+	const precedence = conditionNumbers[cursor + conditionPrecedenceOffset];
+	const depth = precedence >> 23 & 7;
+	if (depth > 5) throw new Error(`a flat value clause supports at most 5 non-platform conditions; received ${depth} in "${key}:"`);
+	const flags = conditionNumbers[cursor + conditionFlagsOffset];
+	const condition = precedence * 256 + (flags >> 6) * 32 + 16 + (flags & conditionActiveFlag ? 1 : 0) + (flags & conditionEmitFlag ? 2 : 0) + (flags & conditionEnterFlag ? 4 : 0) + (flags & conditionExitFlag ? 8 : 0);
+	conditionNumbers[cursor + conditionValueOffset] = condition;
+	return condition;
+}
+function acquireConditionKeyCursor(state, key) {
+	const cursor = acquireConditionCursor();
+	if (key) {
+		resolveConditionText(state, cursor, key);
+		commitConditionCursor(state, cursor);
+	}
+	return cursor;
+}
+function combineConditionKeys(state, first, second) {
+	if (!first) return second;
+	if (!second || first === second) return first;
+	const watermark = conditionCursorTop;
+	const target = acquireConditionKeyCursor(state, first);
+	resolveConditionText(state, target, second);
+	commitConditionCursor(state, target);
+	const key = conditionTexts[target + conditionKeyOffset] || "";
+	releaseConditionCursors(watermark);
+	return key;
+}
+function freshCompoundState() {
+	return {
+		seen: 0,
+		failed: false,
+		matchedBase: false,
+		scanned: false,
+		pending: null,
+		combinations: null
+	};
+}
+function beginCompoundEdges(indexes, states) {
+	if (!indexes) return;
+	for (let index = 0; index < indexes.length; index++) {
+		const state = states[indexes[index]] ||= freshCompoundState();
+		state.pending = null;
+		state.matchedBase = false;
+		state.scanned = false;
+	}
+}
+function feedCompoundSegment(state, source, start, end, isBase, valid, conditionKey) {
+	if (state.flatCompoundOutputDepth) return;
+	const pass = state.flatPass;
+	const indexes = pass[passCompoundIndexes];
+	const states = pass[passCompoundStates];
+	const key = pass[passCompoundKey];
+	if (!indexes || !states || !key) return;
+	const compoundVariants = state.staticConfig.compoundVariants;
+	for (let index = 0; index < indexes.length; index++) {
+		const compoundIndex = indexes[index];
+		const compoundState = states[compoundIndex] ||= freshCompoundState();
+		compoundState.scanned = true;
+		if (!valid || start === end || !compoundMatcherMatchesPayload(compoundVariants[compoundIndex][key], source, start, end)) continue;
+		if (isBase) compoundState.matchedBase = true;
+		else if (!compoundState.matchedBase) (compoundState.pending ||= []).push(conditionKey);
+	}
+}
+const compoundOnlyHandler = {
+	segment(state, start, end, isBase, valid, source, chainStart, chainEnd, chainValid) {
 		if (isBase) {
-			ctx[4] = true;
+			feedCompoundSegment(state, source, start, end, true, valid, "");
+			return;
+		}
+		const cursor = state.flatScanCursor;
+		if (!chainValid || !cursor || !(conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) || !conditionNumbers[cursor + conditionValueOffset]) {
+			feedCompoundSegment(state, source, start, end, false, false, "");
 			return;
 		}
-		if (!chainValid) return;
-		const chain = source.slice(chainStart, chainEnd);
-		if (ctx[2](chain)) ctx[3].push(chain);
+		feedCompoundSegment(state, source, start, end, false, valid, conditionTexts[cursor + conditionKeyOffset] || "");
 	},
-	chain() {
-		return true;
+	modifier(state, start, end, valid, first, source) {
+		let cursor = state.flatScanCursor;
+		if (!cursor) cursor = state.flatScanCursor = acquireConditionCursor();
+		else if (first) resetConditionCursor(cursor, 0);
+		if (!valid) {
+			setConditionUnresolved(cursor);
+			return;
+		}
+		if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) resolveConditionModifier(state, cursor, source.slice(start, end));
 	},
-	error() {}
+	chain(state, _start, _end, valid) {
+		const cursor = state.flatScanCursor;
+		if (cursor) {
+			if (!valid) setConditionUnresolved(cursor);
+			if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) commitConditionCursor(state, cursor);
+		}
+		return true;
+	}
 };
-function matcherChains(expected, actual, isChain) {
-	if (typeof actual === "string" && actual.indexOf(":") !== -1) {
-		const scan = [
-			actual,
-			expected,
-			isChain,
-			[],
-			false
-		];
-		(0, import_runtime.scanFlatValue)(actual, compoundScanHandler, scan);
-		if (scan[4]) return [""];
-		return scan[3].length ? scan[3] : null;
-	}
-	if (actual && typeof actual === "object" && !Array.isArray(actual) && !(0, import_createVariable.isVariable)(actual)) {
-		let conditional = Object.prototype.hasOwnProperty.call(actual, "default");
-		if (!conditional) for (const key in actual) {
-			conditional = key.length > 0 && isChain(key);
-			break;
+function finishCompoundEdges(pass, key, value, indexes, states) {
+	if (!indexes) return;
+	const state = pass[passStyleState];
+	pass[passCompoundIndexes] = indexes;
+	pass[passCompoundKey] = key;
+	pass[passCompoundStates] = states;
+	let needsScan = false;
+	for (let index = 0; index < indexes.length; index++) if (!(states[indexes[index]] ||= freshCompoundState()).scanned) {
+		needsScan = true;
+		break;
+	}
+	if (needsScan) if (typeof value === "string") {
+		const watermark = conditionCursorTop;
+		const previousCursor = state.flatScanCursor;
+		state.flatScanCursor = null;
+		try {
+			(0, import_runtime.scanFlatValue)(value, compoundOnlyHandler, state);
+		} finally {
+			state.flatScanCursor = previousCursor;
+			releaseConditionCursors(watermark);
 		}
-		if (conditional) {
-			const chains = [];
-			for (const key in actual) {
-				const payload = actual[key];
-				if (payload == null || !compoundMatcherMatches(expected, payload)) continue;
-				if (key === "default") return [""];
-				if (isChain(key)) chains.push(key);
+	} else if (value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value) && Object.prototype.hasOwnProperty.call(value, "default")) for (const conditionKey in value) {
+		const payload = value[conditionKey];
+		if (conditionKey === "default") {
+			const payloadString = String(payload);
+			feedCompoundSegment(state, payloadString, 0, payloadString.length, true, true, "");
+		} else {
+			const watermark = conditionCursorTop;
+			const cursor = acquireConditionCursor();
+			resolveConditionText(state, cursor, conditionKey);
+			const condition = commitConditionCursor(state, cursor);
+			const payloadString = String(payload);
+			feedCompoundSegment(state, payloadString, 0, payloadString.length, false, Boolean(condition), condition ? conditionTexts[cursor + conditionKeyOffset] || "" : "");
+			releaseConditionCursors(watermark);
+		}
+	}
+	else {
+		const variants2 = state.staticConfig.compoundVariants;
+		for (let index = 0; index < indexes.length; index++) {
+			const compoundIndex = indexes[index];
+			const compoundState = states[compoundIndex] ||= freshCompoundState();
+			compoundState.scanned = true;
+			if (compoundMatcherMatches(variants2[compoundIndex][key], value)) compoundState.matchedBase = true;
+		}
+	}
+	const variants = state.staticConfig.compoundVariants;
+	const selectorCounts = state.staticConfig[preparedCompoundsKey][preparedCompoundsKey];
+	for (let index = 0; index < indexes.length; index++) {
+		const compoundIndex = indexes[index];
+		const compoundState = states[compoundIndex];
+		if (compoundState.failed) continue;
+		const branches = compoundState.matchedBase ? [""] : compoundState.pending;
+		if (!branches || !branches.length) {
+			compoundState.failed = true;
+			continue;
+		}
+		if (!compoundState.seen) compoundState.combinations = branches;
+		else {
+			const previous = compoundState.combinations;
+			const next = [];
+			for (let left = 0; left < previous.length; left++) for (let right = 0; right < branches.length; right++) {
+				const conditionKey = combineConditionKeys(state, previous[left], branches[right]);
+				if (!next.includes(conditionKey)) next.push(conditionKey);
 			}
-			return chains.length ? chains : null;
+			compoundState.combinations = next;
 		}
+		compoundState.seen++;
+		if (compoundState.seen !== selectorCounts[compoundIndex]) continue;
+		const style = variants[compoundIndex].style;
+		if (!(0, import_isObj.isPlainObject)(style)) continue;
+		const combinations = compoundState.combinations;
+		for (let combination = 0; combination < combinations.length; combination++) for (const styleKey in style) contributeProp(pass, styleKey, style[styleKey], void 0, states, combinations[combination]);
 	}
-	return compoundMatcherMatches(expected, actual) ? [""] : null;
 }
-function isConditionalObjectValue(value, isChain) {
-	if (Object.prototype.hasOwnProperty.call(value, "default")) return true;
-	for (const key in value) return key.length > 0 && isChain(key);
-	return false;
-}
-const joinChains = (a, b) => {
-	if (!a) return b;
-	if (!b) return a;
-	const segments = a.split(":");
-	for (const segment of b.split(":")) if (!segments.includes(segment)) segments.push(segment);
-	return segments.join(":");
-};
-function compoundVariantMatchChains(compoundVariant, props, isChain) {
-	let chains = [""];
-	for (const key in compoundVariant) {
-		if (key === "style") continue;
-		const keyChains = matcherChains(compoundVariant[key], props[key], isChain);
-		if (!keyChains) return null;
-		const next = [];
-		for (const a of chains) for (const b of keyChains) {
-			const joined = joinChains(a, b);
-			if (!next.includes(joined)) next.push(joined);
+function classifyConditionalObject(value, state, isChain, firstCursor) {
+	if (Object.prototype.hasOwnProperty.call(value, "default")) return -1;
+	for (const key in value) {
+		if (!key.length) return 0;
+		if (!state) return isChain?.(key) ? 1 : 0;
+		const watermark = conditionCursorTop;
+		const cursor = firstCursor || acquireConditionCursor();
+		try {
+			resolveConditionText(state, cursor, key);
+			return commitConditionCursor(state, cursor);
+		} finally {
+			if (!firstCursor) releaseConditionCursors(watermark);
 		}
-		chains = next;
 	}
-	return chains;
+	return 0;
 }
+const passStyleState = 0;
+const passClassName = 21;
+const passShouldDoClasses = 22;
+const passContainerValue = 23;
+const passContainerName = 24;
+const passContainerType = 25;
+const passFrontendGroup = 26;
+const passFrontendContainer = 27;
+const passFrontendContainerType = 28;
+const passHocMappedProperties = 29;
+const passHocMappedClasses = 30;
+const passCompoundIndexes = 31;
+const passCompoundKey = 32;
+const passCompoundStates = 33;
+const passParentCursor = 35;
+const passMapSourceKey = 36;
+const passMapFlags = 37;
+const passNoSkipFlag = 1;
+const passDisableShorthandsFlag = 2;
+const passNoExpandFlag = 4;
+const passNoMergeFlag = 8;
+const passHocFlag = 16;
+const passTextFlag = 32;
+const passInputFlag = 64;
+const passAsChildStyleFlag = 128;
 const styledDefaultsCache = /* @__PURE__ */ new WeakMap();
-function getStyledDefaults(staticConfig) {
-	let entries = styledDefaultsCache.get(staticConfig);
-	if (entries === void 0) {
-		entries = null;
+function getStyledDefaults(staticConfig, shorthands) {
+	let prepared = styledDefaultsCache.get(staticConfig);
+	if (prepared === void 0) {
+		let entries = null;
 		const defaults = staticConfig.defaultProps;
-		if (defaults) for (const key in defaults) (entries ||= []).push([key, defaults[key]]);
-		styledDefaultsCache.set(staticConfig, entries);
+		if (defaults) for (const key in defaults) {
+			if (!(key in import_helpers.stylePropsAll || key in shorthands)) continue;
+			const value = defaults[key];
+			if (maybeStyleProgram(value)) (entries ||= []).push(key, value);
+		}
+		prepared = entries;
+		styledDefaultsCache.set(staticConfig, prepared);
 	}
-	return entries;
+	return prepared;
 }
-const maybeStyleProgram = (value) => typeof value === "string" ? value.includes(":") : !!value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value);
-function contributeDisplacedStyledDefaults(styledDefaults, processedProps, shorthands, contribute) {
+const maybeStyleProgram = (value) => typeof value === "string" ? value.indexOf(":") !== -1 : !!value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value);
+function contributeDisplacedStyledDefaults(styledDefaults, processedProps, pass) {
 	if (!styledDefaults) return;
-	for (let index = 0; index < styledDefaults.length; index++) {
-		const key = styledDefaults[index][0];
-		const styledValue = styledDefaults[index][1];
+	for (let offset = 0; offset < styledDefaults.length; offset += 2) {
+		const key = styledDefaults[offset];
+		const value = styledDefaults[offset + 1];
 		const propValue = processedProps[key];
-		if (!(key in import_helpers.stylePropsAll) && !(key in shorthands)) continue;
-		if (propValue !== void 0 && propValue !== styledValue && (maybeStyleProgram(styledValue) || maybeStyleProgram(propValue))) contribute(key, styledValue);
+		if (propValue !== void 0 && propValue !== value) contributeProp(pass, key, value);
+	}
+}
+function injectDisplacedStyledDefault(pass, key, value) {
+	const defaultValue = pass[4].defaultProps?.[key];
+	if (defaultValue === void 0 || value === void 0 || value === defaultValue || maybeStyleProgram(defaultValue)) return;
+	const state = pass[passStyleState];
+	state.flatWeakContribution = true;
+	try {
+		contributeProp(pass, key, defaultValue);
+	} finally {
+		state.flatWeakContribution = false;
 	}
 }
-function forEachPropInForwardOrder(processedProps, staticConfig, shorthands, contribute, isChain) {
+function forEachPropInForwardOrder(pass) {
+	const styleState = pass[passStyleState];
+	const staticConfig = styleState.staticConfig;
+	const processedProps = styleState.props;
+	const shorthands = styleState.conf.shorthands;
 	const processedBaseStyle = staticConfig.baseStyle;
-	const compoundVariants = staticConfig.compoundVariants;
-	const styledDefaults = getStyledDefaults(staticConfig);
-	if (!compoundVariants?.length) {
-		if (processedBaseStyle) for (const key in processedBaseStyle) contribute(key, processedBaseStyle[key]);
-		contributeDisplacedStyledDefaults(styledDefaults, processedProps, shorthands, contribute);
-		for (const key in processedProps) contribute(key, processedProps[key]);
+	const styledDefaults = getStyledDefaults(staticConfig, shorthands);
+	const directState = styleState;
+	const preparedCompounds = staticConfig[preparedCompoundsKey];
+	if (preparedCompounds === void 0 && staticConfig.compoundVariants?.length) throw new Error("A component with compoundVariants reached style resolution before its static config was prepared.");
+	const conditionWrapperBase = conditionWrapperTop;
+	if (!preparedCompounds) {
+		try {
+			if (processedBaseStyle) for (const key in processedBaseStyle) contributeProp(pass, key, processedBaseStyle[key]);
+			contributeDisplacedStyledDefaults(styledDefaults, processedProps, pass);
+			for (const key in processedProps) {
+				const value = processedProps[key];
+				directState.flatPropSawCondition = false;
+				contributeProp(pass, key, value);
+				if (directState.flatPropSawCondition) injectDisplacedStyledDefault(pass, key, value);
+			}
+		} finally {
+			releaseConditionPayloads(conditionWrapperBase);
+		}
 		return;
 	}
-	const propEntries = Object.entries(processedProps);
-	const orderedEntries = processedBaseStyle ? Object.entries(processedBaseStyle) : [];
-	contributeDisplacedStyledDefaults(styledDefaults, processedProps, shorthands, (k, v) => orderedEntries.push([k, v]));
-	const compoundsByAnchor = /* @__PURE__ */ new Map();
-	for (const compoundVariant of compoundVariants) {
-		const chains = compoundVariantMatchChains(compoundVariant, processedProps, isChain);
-		if (!chains) continue;
-		const { style } = compoundVariant;
-		if (!(0, import_isObj.isPlainObject)(style)) continue;
-		let anchor = -1;
-		for (const selectorKey in compoundVariant) {
-			if (selectorKey === "style") continue;
-			for (let index = propEntries.length - 1; index >= 0; index--) if (propEntries[index][0] === selectorKey) {
-				anchor = Math.max(anchor, index);
-				break;
-			}
+	const compoundVariants = staticConfig.compoundVariants;
+	const compoundStates = new Array(compoundVariants.length);
+	try {
+		if (processedBaseStyle) for (const key in processedBaseStyle) contributeProp(pass, key, processedBaseStyle[key]);
+		contributeDisplacedStyledDefaults(styledDefaults, processedProps, pass);
+		const selectorCounts = preparedCompounds[preparedCompoundsKey];
+		for (let compoundIndex = 0; compoundIndex < compoundVariants.length; compoundIndex++) {
+			if (selectorCounts[compoundIndex]) continue;
+			const style = compoundVariants[compoundIndex].style;
+			if (!(0, import_isObj.isPlainObject)(style)) continue;
+			for (const key in style) contributeProp(pass, key, style[key]);
 		}
-		const entries = compoundsByAnchor.get(anchor) || [];
-		for (const key in style) {
-			const value = style[key];
-			for (const chain of chains) {
-				if (!chain) {
-					entries.push([key, value]);
-					continue;
-				}
-				if (value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value) && isConditionalObjectValue(value, isChain)) {
-					const composed = {};
-					for (const inner in value) composed[inner === "default" ? chain : `${chain}:${inner}`] = value[inner];
-					entries.push([key, composed]);
-					continue;
-				}
-				if (typeof value === "string" && value.includes(":")) {
-					if (process.env.NODE_ENV === "development") console.warn(`[tamagui] compound variant "${key}" carries a clause string and matched conditionally; dropping it. use the object form in the compound style`);
-					continue;
-				}
-				entries.push([key, { [chain]: value }]);
-			}
+		for (const key in processedProps) {
+			const compoundIndexes = preparedCompounds[key];
+			const value = processedProps[key];
+			beginCompoundEdges(compoundIndexes, compoundStates);
+			directState.flatPropSawCondition = false;
+			contributeProp(pass, key, value, compoundIndexes, compoundStates);
+			if (directState.flatPropSawCondition) injectDisplacedStyledDefault(pass, key, value);
+			finishCompoundEdges(pass, key, value, compoundIndexes, compoundStates);
 		}
-		compoundsByAnchor.set(anchor, entries);
-	}
-	for (let index = 0; index < orderedEntries.length; index++) contribute(orderedEntries[index][0], orderedEntries[index][1]);
-	const beforeProps = compoundsByAnchor.get(-1);
-	if (beforeProps) for (let index = 0; index < beforeProps.length; index++) contribute(beforeProps[index][0], beforeProps[index][1]);
-	for (let index = 0; index < propEntries.length; index++) {
-		contribute(propEntries[index][0], propEntries[index][1]);
-		const compounds = compoundsByAnchor.get(index);
-		if (compounds) for (let i = 0; i < compounds.length; i++) contribute(compounds[i][0], compounds[i][1]);
+	} finally {
+		releaseConditionPayloads(conditionWrapperBase);
 	}
 }
 function isValidStyleKey(key, validStyles, accept) {
-	return Boolean(key in validStyles || import_constants.isWeb && (key === "transitionProperty" || key === "transitionDuration" || key === "transitionTimingFunction" || key === "transitionDelay" || key === "transitionBehavior") || accept && key in accept);
+	return Boolean(key in validStyles || accept && key in accept);
 }
-const getSplitStyles = (props, staticConfig, theme, themeName, componentState, styleProps, parentSplitStyles, componentContext, groupContext, elementType, startedUnhydrated, debug, animationDriver) => {
-	const conf = (0, import_config.getConfig)();
-	if (staticConfig.styleFrontend?.normalizeStaticConfig) staticConfig = staticConfig.styleFrontend.normalizeStaticConfig(staticConfig, conf);
-	const driver = animationDriver || componentContext?.animationDriver || conf.animations;
-	const resolvedDriver = driver?.isStub ? null : driver;
-	if (props.passThrough) return null;
-	if (import_constants.isWeb && styleProps.isAnimated && driver?.isReactNative && !styleProps.noNormalize) styleProps.noNormalize = "values";
-	const { shorthands } = conf;
-	const { isHOC, isText, isInput, variants, isReactNative, inlineProps, parentStaticConfig, acceptsClassName } = staticConfig;
-	const viewProps = {};
-	const mediaState = styleProps.mediaState || import_mediaState.mediaState;
-	let shouldDoClasses = acceptsClassName && import_constants.isWeb && !styleProps.noClass;
-	const rulesToInsert = {};
-	const classNames = {};
-	props.space;
-	let hasMedia = false;
-	let pseudoGroups;
-	let mediaGroups;
-	let className = staticConfig.passthroughClassName || "";
-	if (className) shouldDoClasses = false;
-	const validStyles = staticConfig.validStyles || (staticConfig.isText || staticConfig.isInput ? import_helpers.stylePropsText : import_helpers.validStyles);
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-setup`;
-	const styleState = {
-		classNames,
-		conf,
-		props,
-		styleProps,
-		componentState,
-		staticConfig,
-		style: null,
-		theme,
-		viewProps,
-		context: componentContext,
-		debug,
-		flatRulesToInsert: rulesToInsert,
-		flatShouldDoClasses: shouldDoClasses,
-		flatThemeName: themeName,
-		flatMediaState: mediaState,
-		flatGroupContext: groupContext,
-		animationDriver: resolvedDriver
-	};
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`style-state`;
-	if (process.env.NODE_ENV === "development" && debug === "verbose" && import_constants.isClient) {
-		if (import_isDevTools.isDevTools) {
-			console.groupCollapsed("🔹 getSplitStyles 👇");
+function flushForwardStylesToClasses(pass) {
+	const styleState = pass[passStyleState];
+	if (!pass[passShouldDoClasses]) return;
+	(0, import_directStyleCSS.completeStreamingCSS)(styleState);
+	(0, import_directStyleCSS.flushDirectStyles)(styleState, true);
+}
+function effectiveLifecycleKeys(keys) {
+	if (!keys) return;
+	const out = /* @__PURE__ */ new Set();
+	for (const key of keys) out.add(key === "--t-x" || key === "--t-y" ? "translate" : key === "--t-scale-x" || key === "--t-scale-y" ? "scale" : key);
+	return out;
+}
+function mapContributedProp(styleState, key, val, originalVal, condition) {
+	const pass = styleState.flatPass;
+	const keyInit = pass[passMapSourceKey];
+	const disablePropMap = Boolean(pass[passMapFlags]);
+	const [, conf, props, viewProps, , validStyles, accept, , variants, inlineProps, parentVariants, , styledContext, styledContextKeys, flags, debug] = pass;
+	const isHOC = Boolean(flags & passHocFlag);
+	const hocParentVariants = isHOC ? parentVariants : void 0;
+	const canResolveContextPrograms = !isHOC;
+	const isStyledContextProp = styledContextKeys?.has(key) || styledContext && key in styledContext;
+	if (key === "className") {
+		if (typeof val === "string" && val) pass[passClassName] = `${pass[passClassName]} ${val}`.trim();
+		return;
+	}
+	if (canResolveContextPrograms && disablePropMap && !isStyledContextProp) {
+		if (key in import_helpers.stylePropsAll && !isValidStyleKey(key, validStyles, accept)) {
+			if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${key}" is a text style prop and this component is not text \u2014 it would render on neither platform. Use a Text-based component, or html.* for raw web elements.`);
+			return;
+		}
+		viewProps[key] = val;
+		return;
+	}
+	if (process.env.NODE_ENV === "development" && debug === "verbose") {
+		console.groupCollapsed("  💠 expanded", keyInit, "=>", key);
+		(0, import_log.log)(val);
+		console.groupEnd();
+	}
+	if (val == null) return;
+	if (accept && key in accept) {
+		viewProps[key] = val;
+		return;
+	}
+	const isHostStyleKey = isValidStyleKey(key, validStyles, accept) || false;
+	const isContextProgramKey = canResolveContextPrograms && Boolean(isStyledContextProp);
+	if (condition !== void 0) {
+		const conditionCursor = condition;
+		if (isHostStyleKey || isContextProgramKey) contributeValue(styleState, key, val, mergeStyle, originalVal, !isHostStyleKey, conditionCursor);
+		else if (isHOC) {
+			const structured = mergeConditionTransport(styleState, viewProps[key], conditionCursor, val);
+			if (key in viewProps) delete viewProps[key];
+			viewProps[key] = structured;
+		} else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${key}" is not a valid style on this component; the conditional variant value is dropped.`);
+		return;
+	}
+	if (isHostStyleKey || isContextProgramKey) {
+		contributeValue(styleState, key, val, mergeStyle, originalVal, !isHostStyleKey);
+		return;
+	}
+	const isVariant = Boolean(variants && key in variants);
+	if (inlineProps?.has(key)) viewProps[key] = props[key] ?? val;
+	if (Boolean(hocParentVariants && hocParentVariants[keyInit])) {
+		passDownProp(viewProps, key, val);
+		if (process.env.NODE_ENV === "development" && debug === "verbose") {
+			console.groupCollapsed(` - passing down prop ${key}`);
 			(0, import_log.log)({
-				props,
-				staticConfig,
-				shouldDoClasses,
-				styleProps,
-				rulesToInsert,
-				componentState,
-				styleState,
-				theme: { ...theme }
+				val,
+				after: { ...viewProps[key] }
 			});
+			console.groupEnd();
 		}
+		return;
 	}
-	const { asChild } = props;
-	const { accept, neverSkipProps } = staticConfig;
-	const { noSkip, disableExpandShorthands, noExpand, styledContext } = styleProps;
-	let processedProps;
-	const styleFrontend = staticConfig.styleFrontend;
-	if (styleFrontend && !props[import_styleFrontend.STYLE_FRONTEND_PREPROCESSED]) processedProps = styleFrontend.preprocessProps(props, conf);
-	else processedProps = props;
-	const { webContainerType } = conf.settings;
-	const parentVariants = parentStaticConfig?.variants;
-	const mergeStylePropAtCurrentPosition = (styleProp) => {
-		if (styleProps.noMergeStyle || !styleProp) return;
-		if (isHOC) {
-			viewProps.style = normalizeStyle(styleProp);
+	if (!isVariant) {
+		if (isStyledContextProp) return;
+		if (key in import_helpers.stylePropsAll && !isValidStyleKey(key, validStyles, accept)) {
+			if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${key}" is a text style prop and this component is not text \u2014 it would render on neither platform. Use a Text-based component, or html.* for raw web elements.`);
 			return;
 		}
-		const isArray = Array.isArray(styleProp);
-		const length = isArray ? styleProp.length : 1;
-		for (let index = 0; index < length; index++) {
-			const style = isArray ? styleProp[index] : styleProp;
-			if (!style) continue;
-			if (style["$$css"]) {
-				for (const key in style) (0, import_directStyle.clearDirectStyle)(styleState, key);
-				Object.assign(styleState.classNames, style);
-				continue;
-			}
-			const normalized = normalizeStyle(style);
-			const styleOriginals = shouldTrackStyleTokenProvenance ? import_styleOriginalValues.styleOriginalValues.get(style) : void 0;
-			for (const key in normalized) {
-				if (normalized[key] == null) continue;
-				(0, import_directStyle.contributeStyleValue)(styleState, key, normalized[key], mergeStyle, styleOriginals?.[key]);
-			}
-		}
-	};
-	const flushForwardStylesToClasses = () => {
-		if (!shouldDoClasses) return;
-		(0, import_directStyle.flushDirectStyles)(styleState, true);
-	};
-	const contributeProp = (keyOg, valOg) => {
+		viewProps[key] = val;
+	}
+}
+function contributeProp(pass, keyOg, valOg, compoundIndexes, compoundStates, parentConditionKey) {
+	const parentWatermark = conditionCursorTop;
+	if (compoundIndexes) {
+		pass[passCompoundIndexes] = compoundIndexes;
+		pass[passCompoundKey] = keyOg;
+		pass[passCompoundStates] = compoundStates;
+	} else if (pass[passCompoundIndexes]) pass[passCompoundIndexes] = void 0;
+	if (parentConditionKey) pass[passParentCursor] = acquireConditionKeyCursor(pass[passStyleState], parentConditionKey);
+	try {
+		const [styleState, conf, props, viewProps, staticConfig, validStyles, accept, neverSkipProps, variants, inlineProps, parentVariants, styleFrontend, styledContext, styledContextKeys, flags, debug, parentStaticConfig, defaultProps, driverAnimations, driverOutputStyle, elementType] = pass;
+		const noSkip = Boolean(flags & passNoSkipFlag);
+		const disableExpandShorthands = Boolean(flags & passDisableShorthandsFlag);
+		const noExpand = Boolean(flags & passNoExpandFlag);
+		const noMergeStyle = Boolean(flags & passNoMergeFlag);
+		const isHOC = Boolean(flags & passHocFlag);
+		const isText = Boolean(flags & passTextFlag);
+		const isInput = Boolean(flags & passInputFlag);
+		const shorthands = conf.shorthands;
+		const shouldSkipDirectProps = !noSkip && !isHOC;
+		const shouldCheckSkipProps = !noSkip;
+		const asChildExceptStyleLike = Boolean(flags & passAsChildStyleFlag);
+		const isTextOrInput = isText || isInput;
+		const hocParentVariants = isHOC ? parentVariants : void 0;
 		let keyInit = keyOg;
 		let valInit = valOg;
-		if (styleFrontend && keyInit.startsWith(import_styleFrontend.STYLE_FRONTEND_PASSTHROUGH_PREFIX)) keyInit = "className";
 		if (keyInit === "children") {
 			viewProps[keyInit] = valInit;
 			return;
@@ -338,7 +789,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 		if (accept) {
 			const accepted = accept[keyInit];
 			if ((accepted === "style" || accepted === "textStyle") && valInit && typeof valInit === "object") {
-				viewProps[keyInit] = getSubStyle(styleState, keyInit, valInit, styleProps.noClass);
+				viewProps[keyInit] = resolveAcceptedStyle(styleState, valInit);
 				return;
 			}
 		}
@@ -346,68 +797,126 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 			if (keyInit in shorthands) keyInit = shorthands[keyInit];
 		}
 		if (keyInit === "className") {
-			if (typeof valInit === "string" && valInit) {
-				className = `${className} ${valInit}`.trim();
-				if (styleFrontend) {
-					flushForwardStylesToClasses();
-					shouldDoClasses = false;
+			if (typeof valInit === "string" && valInit && true) {
+				if (noMergeStyle) {
+					viewProps.className = valInit;
+					return;
+				}
+				const hocClassNames = props[import_skipProps.HOC_CLASSNAME_MARKER];
+				if (hocClassNames && typeof hocClassNames === "object") {
+					flushForwardStylesToClasses(pass);
+					for (const property in hocClassNames) {
+						const generatedClass = hocClassNames[property];
+						if (typeof generatedClass !== "string") continue;
+						clearDirectStyle(styleState, property);
+						styleState.classNames[property] = generatedClass;
+						(pass[passHocMappedProperties] ||= /* @__PURE__ */ new Set()).add(property);
+						(pass[passHocMappedClasses] ||= /* @__PURE__ */ new Set()).add(generatedClass);
+					}
+				}
+				const getClassPlan = styleFrontend?.getClassPlan;
+				let start = 0;
+				for (let index = 0; index <= valInit.length; index++) {
+					if (index !== valInit.length && valInit.charCodeAt(index) > 32) continue;
+					if (index === start) {
+						start = index + 1;
+						continue;
+					}
+					const candidate = valInit.slice(start, index);
+					if (pass[passHocMappedClasses]?.has(candidate)) {
+						start = index + 1;
+						continue;
+					}
+					const plan = getClassPlan ? getClassPlan(candidate, conf) : "raw";
+					if (plan === null) {
+						if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`[tamagui] frontend candidate "${candidate}" is unavailable on this platform and was dropped.`);
+					} else if (plan === "raw") {
+						pass[passClassName] = pass[passClassName] ? `${pass[passClassName]} ${candidate}` : candidate;
+						if (getClassPlan) {
+							flushForwardStylesToClasses(pass);
+							pass[passShouldDoClasses] = false;
+							styleState.flatShouldDoClasses = false;
+						}
+					} else {
+						const parentPlan = plan;
+						if (!Array.isArray(plan) && parentPlan.preserveRawClass) {
+							pass[passClassName] = pass[passClassName] ? `${pass[passClassName]} ${candidate}` : candidate;
+							flushForwardStylesToClasses(pass);
+							pass[passShouldDoClasses] = false;
+							styleState.flatShouldDoClasses = false;
+						}
+						const entries = Array.isArray(plan) ? plan : parentPlan.entries;
+						for (let entryIndex = 0; entryIndex < entries.length; entryIndex++) {
+							const entry = entries[entryIndex];
+							if (entry[2] !== void 0) {
+								if (isValidStyleKey(entry[0], validStyles, accept)) contributeValue(styleState, entry[0], entry[1], mergeStyle, void 0, false, entry[2]);
+								else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${entry[0]}" is not a valid style on this component; the frontend value is dropped.`);
+							} else {
+								if (entry[0] === "group") pass[passFrontendGroup] = entry[1];
+								else if (entry[0] === "container") pass[passFrontendContainer] = entry[1];
+								else if (entry[0] === "containerType") pass[passFrontendContainerType] = entry[1];
+								contributeProp(pass, entry[0], entry[1]);
+							}
+						}
+					}
+					start = index + 1;
+				}
+				if (props[import_skipProps.HOC_CLASSNAME_MARKER] !== void 0) {
+					flushForwardStylesToClasses(pass);
+					pass[passShouldDoClasses] = false;
 					styleState.flatShouldDoClasses = false;
 				}
 			}
 			return;
 		}
 		if (keyInit === "style") {
-			mergeStylePropAtCurrentPosition(valInit);
+			if (!valInit) return;
+			if (noMergeStyle) {
+				viewProps.style = valInit;
+				return;
+			}
+			const isArray = Array.isArray(valInit);
+			const length = isArray ? valInit.length : 1;
+			for (let index = 0; index < length; index++) {
+				const style = isArray ? valInit[index] : valInit;
+				if (!style) continue;
+				const hocClassNames = style[TAMAGUI_CLASS_PROPS];
+				if (hocClassNames) {
+					for (const property in hocClassNames) {
+						clearDirectStyle(styleState, property);
+						styleState.classNames[property] = hocClassNames[property];
+						(pass[passHocMappedProperties] ||= /* @__PURE__ */ new Set()).add(property);
+					}
+					continue;
+				}
+				const normalized = (0, import_normalizeStyle.normalizeStyle)(style, false, true);
+				const styleOriginals = shouldTrackStyleTokenProvenance ? import_styleOriginalValues.styleOriginalValues.get(style) : void 0;
+				for (const key in normalized) {
+					if (normalized[key] == null) continue;
+					if (pass[passHocMappedProperties]?.delete(key)) clearDirectStyle(styleState, key);
+					if (key === "containerName" && typeof normalized[key] === "string" && normalized[key].indexOf(":") === -1) pass[passContainerName] = normalized[key];
+					if (key === "containerType" && typeof normalized[key] === "string" && normalized[key].indexOf(":") === -1) pass[passContainerType] = normalized[key];
+					contributeValue(styleState, key, normalized[key], mergeStyle, styleOriginals?.[key]);
+				}
+			}
 			return;
 		}
-		if (asChild) {
-			const defaults = (0, import_getDefaultProps.getDefaultProps)(staticConfig);
-			if (defaults) {
-				const defaultVal = defaults[keyOg] ?? defaults[keyInit];
-				if (defaultVal !== void 0 && valInit === defaultVal) return;
-			}
-		}
-		if (keyInit in import_skipProps.skipProps && !noSkip && !isHOC && !neverSkipProps?.[keyInit]) {
-			if (keyInit === "group") {
-				const identifier = `t_group_${valInit}`;
-				addStyleToInsertRules(rulesToInsert, [
-					"container",
-					void 0,
-					identifier,
-					void 0,
-					[`.${identifier} { container-name: ${valInit}; container-type: ${webContainerType || "inline-size"}; }`]
-				]);
-			}
-			if (keyInit === "container" && valInit) addStyleToInsertRules(rulesToInsert, [
-				"container",
-				void 0,
-				"t_container",
-				void 0,
-				[`.t_container { container-type: ${webContainerType || "inline-size"}; }`]
-			]);
+		if (defaultProps) {
+			const defaultVal = defaultProps[keyOg] ?? defaultProps[keyInit];
+			if (defaultVal !== void 0 && valInit === defaultVal) return;
+		}
+		if (keyInit in import_skipProps.skipProps && shouldSkipDirectProps && !neverSkipProps?.[keyInit]) {
+			if (keyInit === "container") pass[passContainerValue] = valInit;
 			if (keyInit === "transition" && typeof valInit === "string") {
-				const animationConfig = driver?.animations?.[valInit];
-				if (animationConfig && driver?.outputStyle === "css" && process.env.IS_STATIC === "is_static") valInit = `all ${animationConfig}`;
+				const animationConfig = driverAnimations?.[valInit];
+				if (animationConfig && driverOutputStyle === "css" && process.env.IS_STATIC === "is_static") valInit = `all ${animationConfig}`;
 				else if (animationConfig) return;
 			} else return;
 		}
-		if ((0, import_frontendProgram.isFrontendProgram)(valInit)) {
-			if (isValidStyleKey(valInit.property, validStyles, accept)) (0, import_frontendProgram.contributeFrontendProgram)(styleState, valInit, mergeStyle);
-			else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${valInit.property}" is not a valid style on this component; the frontend value is dropped.`);
-			return;
-		}
 		let isValidStyleKeyInit = isValidStyleKey(keyInit, validStyles, accept);
-		if (import_constants.isWeb) {
-			if ((staticConfig.isReactNative || styleProps.isAnimated && driver?.isReactNative && !driver.View?.acceptRenderProp) && keyInit.startsWith("data-")) {
-				keyInit = keyInit.replace("data-", "");
-				viewProps["dataSet"] ||= {};
-				viewProps["dataSet"][keyInit] = valInit;
-				return;
-			}
-			if (keyInit.startsWith("data-")) {
-				viewProps[keyInit] = valInit;
-				return;
-			}
+		if (keyInit.startsWith("data-")) {
+			viewProps[keyInit] = valInit;
+			return;
 		}
 		if (!noExpand) {
 			if (keyInit === "disabled" && valInit === true) {
@@ -416,11 +925,7 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 				if (!variants?.disabled) return;
 			}
 			if (keyInit === "testID") {
-				if (isReactNative) viewProps.testID = valInit;
-				else {
-					viewProps["data-testid"] = valInit;
-					if ((styleProps.isAnimated || staticConfig.isHOC) && driver?.isReactNative) viewProps.testID = valInit;
-				}
+				viewProps["data-testid"] = valInit;
 				return;
 			}
 			if (keyInit === "id") {
@@ -431,10 +936,10 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 		let isVariant = !isValidStyleKeyInit && variants && keyInit in variants;
 		const isStyleLikeKey = isValidStyleKeyInit || isVariant;
 		const isStyleProp = isValidStyleKeyInit || isVariant && !noExpand;
-		if (isStyleProp && (asChild === "except-style" || asChild === "except-style-web")) return;
-		const shouldPassProp = !isStyleProp && isHOC || isHOC && parentVariants && keyInit in parentVariants || inlineProps?.has(keyInit);
+		if (isStyleProp && asChildExceptStyleLike) return;
+		const shouldPassProp = !isStyleProp && isHOC || hocParentVariants && keyInit in hocParentVariants || inlineProps?.has(keyInit);
 		const parentVariant = parentVariants?.[keyInit];
-		const isHOCShouldPassThrough = Boolean(isHOC && (isValidStyleKeyInit || parentVariant || keyInit in import_skipProps.skipProps));
+		const isHOCShouldPassThrough = Boolean(isHOC && (parentVariant || keyInit in import_skipProps.skipProps));
 		const shouldPassThrough = shouldPassProp || isHOCShouldPassThrough;
 		if (process.env.NODE_ENV === "development" && debug === "verbose") {
 			console.groupCollapsed(`  \u{1F511} ${keyOg}${keyInit !== keyOg ? ` (shorthand for ${keyInit})` : ""} ${shouldPassThrough ? "(pass)" : ""}`);
@@ -456,121 +961,196 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 			if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
 			if (!isVariant) return;
 		}
-		if (!noSkip && !neverSkipProps?.[keyInit]) {
-			if (keyInit in import_skipProps.skipProps && !(keyInit === "transition" && typeof valInit === "string" && !driver?.animations?.[valInit])) {
+		if (shouldCheckSkipProps && !neverSkipProps?.[keyInit]) {
+			if (keyInit in import_skipProps.skipProps && !(keyInit === "transition" && typeof valInit === "string" && !driverAnimations?.[valInit])) {
 				if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
 				return;
 			}
 		}
-		if (isText || isInput) {
+		if (isTextOrInput) {
 			if (valInit && (keyInit === "fontFamily" || keyInit === shorthands["fontFamily"]) && valInit in conf.fontsParsed) styleState.fontFamily = valInit;
 		}
 		const disablePropMap = !isStyleLikeKey;
-		if (!isHOC && isValidStyleKeyInit && valInit != null && !(variants && keyInit in variants) && !(accept && keyInit in accept) && !(styledContext && keyInit in styledContext)) {
-			(0, import_directStyle.contributeStyleValue)(styleState, keyInit, valInit, mergeStyle);
+		if (isValidStyleKeyInit && valInit != null && !(variants && keyInit in variants) && !(accept && keyInit in accept) && !(styledContextKeys?.has(keyInit) || styledContext && keyInit in styledContext)) {
+			contributeValue(styleState, keyInit, valInit, mergeStyle);
 			return;
 		}
-		(0, import_propMapper.propMapper)(keyInit, valInit, styleState, disablePropMap, (key, val, originalVal, conditionSource) => {
-			const isStyledContextProp = styledContext && key in styledContext;
-			if (key === "className") {
-				if (typeof val === "string" && val) className = `${className} ${val}`.trim();
-				return;
-			}
-			if (!isHOC && disablePropMap && !isStyledContextProp) {
-				if (key in import_helpers.stylePropsAll && !isValidStyleKey(key, validStyles, accept)) {
-					if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${key}" is a text style prop and this component is not text \u2014 it would render on neither platform. Use a Text-based component, or html.* for raw web elements.`);
-					return;
-				}
-				viewProps[key] = val;
-				return;
-			}
-			if (process.env.NODE_ENV === "development" && debug === "verbose") {
-				console.groupCollapsed("  💠 expanded", keyInit, "=>", key);
-				(0, import_log.log)(val);
-				console.groupEnd();
-			}
-			if (val == null) return;
-			if (accept && key in accept) {
-				viewProps[key] = val;
-				return;
-			}
-			const isHostStyleKey = !isHOC && isValidStyleKey(key, validStyles, accept) || false;
-			const isContextProgramKey = !isHOC && Boolean(isStyledContextProp);
-			if (conditionSource !== void 0) {
-				if (isHostStyleKey || isContextProgramKey) (0, import_directStyle.contributeVariantClauseValue)(styleState, key, val, conditionSource, mergeStyle, originalVal, !isHostStyleKey);
-				else if (isHOC) {
-					const appended = (0, import_propMapper.appendFlatClause)(styleState, viewProps[key], conditionSource, val);
-					if (appended !== void 0) viewProps[key] = appended;
-					else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] conditional variant value for "${key}" cannot join the existing clause string; dropping the clause`);
-				} else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${key}" is not a valid style on this component; the conditional variant value is dropped.`);
-				return;
-			}
-			if (isHostStyleKey || isContextProgramKey) {
-				(0, import_directStyle.contributeStyleValue)(styleState, key, val, mergeStyle, originalVal, !isHostStyleKey);
-				return;
-			}
-			isVariant = variants && key in variants;
-			if (inlineProps?.has(key)) viewProps[key] = props[key] ?? val;
-			if (isHOC && Boolean(parentStaticConfig?.variants?.[keyInit])) {
-				passDownProp(viewProps, key, val);
-				if (process.env.NODE_ENV === "development" && debug === "verbose") {
-					console.groupCollapsed(` - passing down prop ${key}`);
-					(0, import_log.log)({
-						val,
-						after: { ...viewProps[key] }
-					});
-					console.groupEnd();
-				}
-				return;
-			}
-			if (!isVariant) {
-				if (isStyledContextProp) return;
-				if (key in import_helpers.stylePropsAll && !isValidStyleKey(key, validStyles, accept)) {
-					if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${key}" is a text style prop and this component is not text \u2014 it would render on neither platform. Use a Text-based component, or html.* for raw web elements.`);
-					return;
-				}
-				viewProps[key] = val;
-			}
-		});
+		pass[passMapSourceKey] = keyInit;
+		pass[passMapFlags] = disablePropMap ? 1 : 0;
+		contributeMappedValue(keyInit, valInit, styleState, disablePropMap);
 		if (process.env.NODE_ENV === "development" && debug === "verbose") {
 			try {
 				(0, import_log.log)(` \u2714\uFE0F expand complete`, keyInit);
 				(0, import_log.log)("style", { ...styleState.style });
 				(0, import_log.log)("viewProps", { ...viewProps });
-				(0, import_log.log)("transforms", { ...styleState.flatTransforms });
+				(0, import_log.log)("transforms", styleState.transformAccumulator);
 			} catch {}
 			console.groupEnd();
 		}
-	};
-	forEachPropInForwardOrder(processedProps, staticConfig, shorthands, contributeProp, (chain) => !!(0, import_directStyle.resolveClauseChain)(styleState, chain, 0, chain.length));
-	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-propsend`;
-	const conditionalStates = styleState.flatStateKeys || null;
-	const usesSafeArea = !!styleState.flatUsesSafeArea;
-	if (styleState.flatMediaKeys?.size) {
-		if (!hasMedia) hasMedia = /* @__PURE__ */ new Set();
-		if (typeof hasMedia !== "boolean") for (const key of styleState.flatMediaKeys) hasMedia.add(key);
-	}
-	if (styleState.flatGroupKeys?.size) {
-		pseudoGroups ||= /* @__PURE__ */ new Set();
-		for (const key of styleState.flatGroupKeys) pseudoGroups.add(key);
-	}
-	if (styleState.flatGroupMedia?.size) {
-		mediaGroups ||= /* @__PURE__ */ new Set();
-		for (const key of styleState.flatGroupMedia) mediaGroups.add(key);
+	} finally {
+		if (parentConditionKey) pass[passParentCursor] = null;
+		releaseConditionCursors(parentWatermark);
 	}
-	const effectiveTransition = styleState.style?.transition;
-	if (effectiveTransition != null && styleState.style && driver?.outputStyle !== "css") delete styleState.style.transition;
-	if ((styleState.style?.containerName != null || classNames.containerName) && !(styleState.style && "containerType" in styleState.style) && !classNames.containerType) (0, import_directStyle.contributeStyleValue)(styleState, "containerType", webContainerType || "inline-size", mergeStyle);
-	if (!(styleProps.noNormalize === false)) {
-		if (styleState.style) {
-			(0, import_expandStyles.fixStyles)(styleState.style);
-			if (!styleProps.noExpand && !styleProps.noMergeStyle) {
-				if (import_constants.isWeb && (isReactNative ? driver?.inputStyle !== "css" : true)) (0, import_getCSSStylesAtomic.styleToCSS)(styleState.style);
-			}
-		}
-		if (styleState.flatTransforms) {
+}
+const getSplitStyles = (props, staticConfig, theme, themeName, componentState, styleProps, parentSplitStyles, componentContext, groupContext, elementType, startedUnhydrated, debug, animationDriver) => {
+	const conf = (0, import_config.getConfig)();
+	if (staticConfig.styleFrontend?.normalizeStaticConfig) staticConfig = staticConfig.styleFrontend.normalizeStaticConfig(staticConfig, conf);
+	const driver = animationDriver || componentContext?.animationDriver || conf.animations;
+	const driverAnimations = driver?.animations;
+	const driverInputStyle = driver?.inputStyle;
+	const driverOutputStyle = driver?.outputStyle;
+	const resolvedDriver = driver?.isStub ? null : driver;
+	if (props.passThrough) return null;
+	const { shorthands } = conf;
+	const { isHOC, isText, isInput, variants, inlineProps, parentStaticConfig, acceptsClassName } = staticConfig;
+	const viewProps = {};
+	const mediaState = styleProps.mediaState || import_mediaState.mediaState;
+	let shouldDoClasses = !process.env.TAMAGUI_DID_OUTPUT_CSS && acceptsClassName && !styleProps.noClass;
+	const rulesToInsert = {};
+	const classNames = {};
+	let hasMedia = false;
+	let pseudoGroups;
+	let mediaGroups;
+	const staticPassthroughClassName = staticConfig.passthroughClassName || "";
+	let className = staticPassthroughClassName;
+	if (staticPassthroughClassName) shouldDoClasses = false;
+	const validStyles = staticConfig.validStyles || (staticConfig.isText || staticConfig.isInput ? import_helpers.stylePropsText : import_helpers.validStyles);
+	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-setup`;
+	const styleState = {
+		classNames,
+		conf,
+		props,
+		styleProps,
+		componentState,
+		staticConfig,
+		style: null,
+		theme,
+		viewProps,
+		context: componentContext,
+		debug,
+		flatRulesToInsert: rulesToInsert,
+		flatShouldDoClasses: shouldDoClasses,
+		flatThemeName: themeName,
+		flatMediaState: mediaState,
+		flatGroupContext: groupContext,
+		animationDriver: resolvedDriver
+	};
+	if (import_directStyleCSS.canGenerateCSS && shouldDoClasses && styleProps.canPlatformPseudo) styleState.flatDeferCSS = true;
+	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`style-state`;
+	if (process.env.NODE_ENV === "development" && debug === "verbose" && import_constants.isClient) {
+		if (import_isDevTools.isDevTools) {
+			console.groupCollapsed("🔹 getSplitStyles 👇");
+			(0, import_log.log)({
+				props,
+				staticConfig,
+				shouldDoClasses,
+				styleProps,
+				rulesToInsert,
+				componentState,
+				styleState,
+				theme: { ...theme }
+			});
+		}
+	}
+	const { asChild } = props;
+	const { accept, neverSkipProps } = staticConfig;
+	const { noSkip, disableExpandShorthands, noExpand, noClass, noMergeStyle, noNormalize, isAnimated, styledContext, styledContextKeys } = styleProps;
+	const styleFrontend = staticConfig.styleFrontend;
+	let frontendGroup;
+	let frontendContainer;
+	let frontendContainerType;
+	const processedProps = props;
+	const parentVariants = parentStaticConfig?.variants;
+	const defaultProps = asChild ? (0, import_getDefaultProps.getDefaultProps)(staticConfig) : void 0;
+	const asChildExceptStyleLike = asChild === "except-style" || asChild === "except-style-web";
+	let containerValue;
+	let containerName;
+	let containerType;
+	{
+		const authoredContainerName = processedProps.containerName;
+		const authoredContainerType = processedProps.containerType;
+		containerName = typeof authoredContainerName === "string" && authoredContainerName.indexOf(":") === -1 ? authoredContainerName : void 0;
+		containerType = typeof authoredContainerType === "string" && authoredContainerType.indexOf(":") === -1 ? authoredContainerType : void 0;
+	}
+	let hocMappedClassProperties;
+	let hocMappedClasses;
+	const stylePassFlags = (noSkip ? passNoSkipFlag : 0) | (disableExpandShorthands ? passDisableShorthandsFlag : 0) | (noExpand ? passNoExpandFlag : 0) | (noMergeStyle ? passNoMergeFlag : 0) | (isHOC ? passHocFlag : 0) | (isText ? passTextFlag : 0) | (isInput ? passInputFlag : 0) | (asChildExceptStyleLike ? passAsChildStyleFlag : 0);
+	const pass = [
+		styleState,
+		conf,
+		props,
+		viewProps,
+		staticConfig,
+		validStyles,
+		accept,
+		neverSkipProps,
+		variants,
+		inlineProps,
+		parentVariants,
+		styleFrontend,
+		styledContext,
+		styledContextKeys,
+		stylePassFlags,
+		debug,
+		parentStaticConfig,
+		defaultProps,
+		driverAnimations,
+		driverOutputStyle,
+		elementType,
+		className,
+		shouldDoClasses,
+		containerValue,
+		containerName,
+		containerType,
+		frontendGroup,
+		frontendContainer,
+		frontendContainerType,
+		hocMappedClassProperties,
+		hocMappedClasses
+	];
+	styleState.flatPass = pass;
+	forEachPropInForwardOrder(pass);
+	[, , , , , , , , , , , , , , , , , , , , , className, shouldDoClasses, containerValue, containerName, containerType, frontendGroup, frontendContainer, frontendContainerType, hocMappedClassProperties, hocMappedClasses] = pass;
+	if (containerValue) {
+		containerName ??= typeof containerValue === "string" ? containerValue : void 0;
+		containerType ??= "inline-size";
+		contributeValue(styleState, containerName ? "container" : "containerType", containerName ? `${containerName} / ${containerType}` : containerType, mergeStyle);
+	}
+	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-propsend`;
+	const conditionalStates = styleState.flatStateKeys || null;
+	const usesSafeArea = !!styleState.flatUsesSafeArea;
+	if (styleState.flatMediaKeys?.size) {
+		if (!hasMedia) hasMedia = /* @__PURE__ */ new Set();
+		if (typeof hasMedia !== "boolean") for (const key of styleState.flatMediaKeys) hasMedia.add(key);
+	}
+	if (styleState.flatGroupKeys?.size) {
+		pseudoGroups ||= /* @__PURE__ */ new Set();
+		for (const key of styleState.flatGroupKeys) pseudoGroups.add(key);
+	}
+	if (styleState.flatGroupMedia?.size) {
+		mediaGroups ||= /* @__PURE__ */ new Set();
+		for (const key of styleState.flatGroupMedia) mediaGroups.add(key);
+	}
+	if (styleProps.canPlatformPseudo && styleState.flatHasPlatformPseudo) {
+		shouldDoClasses = false;
+		styleState.flatShouldDoClasses = false;
+		if (styleState.transformAccumulator) {
+			mergeStyle(styleState, "transform", (0, import_runtime.finalizeTransformAccumulator)(styleState.transformAccumulator), 1, true);
+			styleState.transformAccumulator = void 0;
+		}
+		convertDeferredInline(styleState, mergeStyle);
+	}
+	completeStreaming(styleState, mergeStyle);
+	const effectiveTransition = styleState.style?.transition;
+	if (effectiveTransition != null && styleState.style && driverOutputStyle !== "css") delete styleState.style.transition;
+	if (!(noNormalize === false)) {
+		if (styleState.style) {
+			(0, import_expandStyles.fixStyles)(styleState.style);
+			if (!noExpand && !noMergeStyle) (0, import_styleToCSS.styleToCSS)(styleState.style);
+		}
+		if (styleState.transformAccumulator && !styleState.flatShouldDoClasses) {
 			styleState.style ||= {};
-			mergeFlatTransforms(styleState.style, styleState.flatTransforms);
+			styleState.style.transform = (0, import_runtime.finalizeTransformAccumulator)(styleState.transformAccumulator);
 		}
 		if (parentSplitStyles) {
 			if (shouldDoClasses) for (const key in parentSplitStyles.classNames) {
@@ -585,8 +1165,8 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 			}
 		}
 	}
-	if (!styleProps.noNormalize && !staticConfig.isReactNative && !staticConfig.isHOC && (!styleProps.isAnimated || driver?.inputStyle === "css") && Array.isArray(styleState.style?.transform)) styleState.style.transform = (0, import_transformsToString.transformsToString)(styleState.style.transform);
-	(0, import_directStyle.flushDirectStyles)(styleState);
+	if (!noNormalize && !isHOC && (!isAnimated || driverInputStyle === "css") && Array.isArray(styleState.style?.transform)) styleState.style.transform = (0, import_transformsToString.transformsToString)(styleState.style.transform);
+	(0, import_directStyleCSS.flushDirectStyles)(styleState);
 	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-pre-result`;
 	if (shouldTrackStyleTokenProvenance && styleState.style && styleState.tokenProvenance) {
 		const provenance = {};
@@ -614,53 +1194,49 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 	if (effectiveTransition != null) result.effectiveTransition = effectiveTransition;
 	if (conditionalStates) result.programStates = conditionalStates;
 	if (usesSafeArea) result.usesSafeArea = true;
-	if ((0, import_directStyle.getDirectDynamicThemeAccess)(styleState)) result.dynamicThemeAccess = true;
-	if (styleState.flatEnterKeys || styleState.flatExitKeys) {
-		const effectiveKeys = (keys) => {
-			if (!keys) return;
-			const out = /* @__PURE__ */ new Set();
-			for (const key of keys) out.add(key === "--t-x" || key === "--t-y" ? "translate" : key === "--t-scale-x" || key === "--t-scale-y" ? "scale" : key);
-			return out;
-		};
-		result.programLifecycleStyleKeys = {
-			enter: effectiveKeys(styleState.flatEnterKeys),
-			exit: effectiveKeys(styleState.flatExitKeys)
-		};
-	}
-	const asChildExceptStyleLike = asChild === "except-style" || asChild === "except-style-web";
-	if (!styleProps.noMergeStyle) {
+	if (getDirectDynamicThemeAccess(styleState)) result.dynamicThemeAccess = true;
+	if (styleState.flatEnterKeys || styleState.flatExitKeys) result.programLifecycleStyleKeys = {
+		enter: effectiveLifecycleKeys(styleState.flatEnterKeys),
+		exit: effectiveLifecycleKeys(styleState.flatExitKeys)
+	};
+	if (styleState.flatHasEnterStyle) result.hasEnterStyle = true;
+	if (styleState.flatHasPlatformPseudo) result.platformPseudo = true;
+	if (frontendGroup !== void 0) result.frontendGroup = frontendGroup;
+	if (frontendContainer !== void 0) result.frontendContainer = frontendContainer;
+	if (frontendContainerType !== void 0) result.frontendContainerType = frontendContainerType;
+	if (!noMergeStyle) {
 		if (!asChildExceptStyleLike) {
 			const style = styleState.style;
 			{
 				const fontFamily = isText || isInput ? styleState.fontFamily : null;
 				const fontFamilyClassName = fontFamily ? `font_${fontFamily}` : "";
-				const groupClassName = props.group ? `t_group_${props.group}` : "";
-				const containerClassName = props.container ? "t_container" : "";
-				const displayNameClassName = props.asChild || !styleProps.displayName || styleProps.displayName === "Text" || styleProps.displayName === "View" || !validComponentClassName.test(styleProps.displayName) ? "" : `is_${styleProps.displayName}`;
-				let classList = [];
-				if (displayNameClassName) classList.push(displayNameClassName);
-				if (!isText) classList.push("is_View");
-				else classList.push("is_Text");
-				if (fontFamilyClassName) classList.push(fontFamilyClassName);
-				if (classNames) for (const key in classNames) classList.push(classNames[key]);
-				if (groupClassName) classList.push(groupClassName);
-				if (containerClassName) classList.push(containerClassName);
-				if (className) classList.push(className);
-				const finalClassName = classList.join(" ");
-				const needsCssStyles = isReactNative || styleProps.isAnimated && driver?.isReactNative;
-				if (styleProps.isAnimated && driver?.inputStyle === "css") {
+				const group = props.group ?? frontendGroup;
+				const groupClassName = group ? `t_group_${group}` : "";
+				let finalClassName = isText ? "is_Text" : "is_View";
+				if (fontFamilyClassName) finalClassName += ` ${fontFamilyClassName}`;
+				let hasPropertyClassNames = false;
+				if (classNames) for (const key in classNames) {
+					hasPropertyClassNames = true;
+					finalClassName += ` ${classNames[key]}`;
+				}
+				if (groupClassName) finalClassName += ` ${groupClassName}`;
+				if (className) finalClassName += ` ${className}`;
+				if (isAnimated && driverInputStyle === "css") {
 					viewProps.className = finalClassName;
 					if (style) viewProps.style = style;
-				} else if (needsCssStyles) {
-					let cnStyles;
-					for (const name of finalClassName.split(" ")) {
-						cnStyles ||= { $$css: true };
-						cnStyles[name] = name;
-					}
-					viewProps.style = cnStyles ? [...Array.isArray(style) ? style : [style], cnStyles] : [style];
 				} else {
-					if (finalClassName) viewProps.className = finalClassName;
-					if (style) viewProps.style = style;
+					if (finalClassName) {
+						if (isHOC) viewProps[import_skipProps.HOC_CLASSNAME_MARKER] = classNames;
+						viewProps.className = finalClassName;
+					}
+					if (isHOC && hasPropertyClassNames) {
+						const classStyle = {};
+						Object.defineProperty(classStyle, TAMAGUI_CLASS_PROPS, {
+							value: classNames,
+							enumerable: false
+						});
+						viewProps.style = style ? [classStyle, style] : classStyle;
+					} else if (style) viewProps.style = style;
 				}
 			}
 		}
@@ -687,46 +1263,22 @@ const getSplitStyles = (props, staticConfig, theme, themeName, componentState, s
 	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-done`;
 	return result;
 };
-function mergeFlatTransforms(target, flatTransforms) {
-	const transform = [];
-	if ("x" in flatTransforms) transform.push({ translateX: flatTransforms.x });
-	if ("y" in flatTransforms) transform.push({ translateY: flatTransforms.y });
-	if ("rotate" in flatTransforms) transform.push({ rotate: flatTransforms.rotate });
-	const hasScaleX = "scaleX" in flatTransforms;
-	const hasScaleY = "scaleY" in flatTransforms;
-	if (hasScaleX && hasScaleY && Object.is(flatTransforms.scaleX, flatTransforms.scaleY)) transform.push({ scale: flatTransforms.scaleX });
-	else {
-		if (hasScaleX) transform.push({ scaleX: flatTransforms.scaleX });
-		if (hasScaleY) transform.push({ scaleY: flatTransforms.scaleY });
-		if (!hasScaleX && !hasScaleY && "scale" in flatTransforms) transform.push({ scale: flatTransforms.scale });
-	}
-	const keys = [];
-	for (const key in flatTransforms) if (key !== "x" && key !== "y" && key !== "rotate" && key !== "scale" && key !== "scaleX" && key !== "scaleY") keys.push(key);
-	keys.sort(import_sortString.sortString);
-	for (const key of keys) transform.push({ [mapTransformKeys[key] || key]: flatTransforms[key] });
-	if (Array.isArray(target.transform)) transform.push(...target.transform);
-	target.transform = transform;
-}
 function mergeStyle(styleState, key, val, _importance, disableNormalize = false, originalVal) {
 	const { viewProps, styleProps, staticConfig } = styleState;
-	const contextConfig = staticConfig.context || staticConfig.parentStaticConfig?.context;
-	const contextProps = contextConfig?.props;
-	const inheritedContextPropKeys = !staticConfig.context || staticConfig.context === staticConfig.parentStaticConfig?.context ? staticConfig.parentStaticConfig?.contextProps : void 0;
-	const contextPropKeys = staticConfig.contextProps || inheritedContextPropKeys;
-	if (contextProps && key in contextProps || contextPropKeys?.includes(key) || contextConfig?.propKeys?.includes(key)) {
+	if (getContextPropSet(staticConfig)?.has(key)) {
 		styleState.overriddenContextProps ||= {};
 		const originalFromState = styleState.originalContextPropValues?.[key];
 		styleState.overriddenContextProps[key] = originalVal ?? originalFromState ?? val;
 	}
-	if (key in import_helpers.stylePropsTransform) {
-		styleState.flatTransforms ||= {};
-		styleState.flatTransforms[key] = val;
+	if (key === "transform" || key in import_helpers.stylePropsTransform) {
+		styleState.transformAccumulator ||= (0, import_runtime.createTransformAccumulator)();
+		(0, import_runtime.addTransformValue)(styleState.transformAccumulator, key, val);
 	} else {
-		const out = import_constants.isWeb && !disableNormalize && !styleProps.noNormalize ? (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(val, key) : val;
+		const out = !disableNormalize && !styleProps.noNormalize ? (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(val, key) : val;
 		if (staticConfig.accept && key in staticConfig.accept) viewProps[key] = out;
 		else {
 			styleState.style ||= {};
-			styleState.style[key] = key === "transform" && Array.isArray(out) ? [...out] : out;
+			styleState.style[key] = out;
 			if (shouldTrackStyleTokenProvenance) recordStyleTokenProvenance(styleState, key, originalVal);
 		}
 	}
@@ -741,105 +1293,1422 @@ function recordStyleTokenProvenance(styleState, key, originalVal) {
 	if (tokenName !== "" && (Object.prototype.hasOwnProperty.call(styleState.theme, tokenName) || Object.prototype.hasOwnProperty.call(styleState.conf.themes?.[styleState.flatThemeName || ""] || {}, tokenName) || Object.values(styleState.conf.tokensParsed).some((category) => Object.prototype.hasOwnProperty.call(category, tokenName)))) (styleState.tokenProvenance ||= {})[key] = originalVal;
 	else if (styleState.tokenProvenance && key in styleState.tokenProvenance) delete styleState.tokenProvenance[key];
 }
-const getSubStyle = (styleState, _subKey, styleIn, avoidMergeTransform) => {
-	const { staticConfig, conf, styleProps } = styleState;
+const resolveAcceptedStyle = (styleState, styleIn) => {
+	const { conf, styleProps } = styleState;
 	const styleOut = {};
 	let originalValues;
 	const styleInOriginalValues = import_styleOriginalValues.styleOriginalValues.get(styleIn);
-	const parentProps = styleState.props;
-	styleState.props = Object.create(parentProps, Object.getOwnPropertyDescriptors(styleIn));
-	try {
-		for (let key in styleIn) {
-			const val = styleIn[key];
-			key = conf.shorthands[key] || key;
-			if (!staticConfig.isHOC && key in import_skipProps.skipProps && !styleProps.noSkip) continue;
-			(0, import_propMapper.propMapper)(key, val, styleState, false, (skey, sval, originalVal) => {
-				const trackedOriginalVal = styleInOriginalValues?.[skey] ?? originalVal;
-				if (trackedOriginalVal !== void 0) {
-					originalValues ||= {};
-					originalValues[skey] = trackedOriginalVal;
+	const childState = {
+		...styleState,
+		classNames: {},
+		flatShouldDoClasses: false,
+		props: styleIn,
+		style: styleOut,
+		transformAccumulator: void 0
+	};
+	childState.flatUsed = void 0;
+	childState.flatTransitions = void 0;
+	childState.flatAtomics = void 0;
+	childState.flatSingleEntries = void 0;
+	childState.flatSlots = void 0;
+	childState.flatBorderDefaultRequests = void 0;
+	const mergeAccepted = (_state, key, value, _importance, disableNormalize, originalValue) => {
+		styleOut[key] = disableNormalize || styleProps.noNormalize ? value : (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(value, key);
+		const trackedOriginal = styleInOriginalValues?.[key] ?? originalValue;
+		if (trackedOriginal !== void 0) (originalValues ||= {})[key] = trackedOriginal;
+	};
+	for (let key in styleIn) {
+		const value = styleIn[key];
+		key = conf.shorthands[key] || key;
+		if (key in import_skipProps.skipProps || value == null) continue;
+		contributeValue(childState, key, value, mergeAccepted);
+	}
+	completeStreaming(childState, mergeAccepted);
+	if (childState.transformAccumulator) styleOut.transform = (0, import_runtime.finalizeTransformAccumulator)(childState.transformAccumulator);
+	if (!styleProps.noNormalize) (0, import_expandStyles.fixStyles)(styleOut);
+	if (originalValues) import_styleOriginalValues.styleOriginalValues.set(styleOut, originalValues);
+	return styleOut;
+};
+function passDownProp(viewProps, key, val) {
+	if (key in viewProps) delete viewProps[key];
+	viewProps[key] = val;
+}
+let frameSequence = 0;
+function streamWriteCSS(state, property, value, cursor, original, conditionOverride = -1) {
+	const direct = state;
+	const condition = conditionOverride !== -1 ? conditionOverride : cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
+	const identity = cursor ? conditionTexts[cursor + conditionKeyOffset] || "" : "";
+	if (property.charCodeAt(0) === 116 && property.startsWith("transition")) {
+		const transitions = direct.flatTransitions ||= [];
+		for (let index = 0; index < transitions.length; index++) if (transitions[index].property === property && transitions[index].identity === identity) {
+			transitions[index].value = value;
+			transitions[index].condition = condition;
+			return;
+		}
+		transitions.push({
+			property,
+			value,
+			condition,
+			identity,
+			selector: cursor ? conditionTexts[cursor + conditionSelectorOffset] || "" : "",
+			wrappers: cursor ? conditionWrapperCopy(cursor) : void 0
+		});
+		return;
+	}
+	(0, import_directStyleCSS.streamAtomic)(state, property, value, condition, identity, cursor ? conditionTexts[cursor + conditionSelectorOffset] || "" : "", cursor ? conditionWrappers : void 0, cursor ? conditionNumbers[cursor + conditionWrapperOffset] >> 3 : 0, cursor ? conditionNumbers[cursor + conditionWrapperOffset] & 7 : 0, direct.flatWeakContribution === true, original);
+}
+function streamWriteInline(state, property, value, cursor, merge, original, normalize = false, conditionOverride = -1) {
+	const direct = state;
+	const condition = conditionOverride !== -1 ? conditionOverride : cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
+	const importance = condition ? Math.floor(condition / 256) + 1 : 0;
+	const used = direct.flatUsed ||= {};
+	const previous = used[property];
+	if (previous !== void 0) {
+		if (previous > importance) return;
+		if (direct.flatWeakContribution === true) return;
+	}
+	used[property] = importance;
+	merge(state, property, value, 1, !normalize, original);
+}
+function streamRetractInline(state, property, cursor) {
+	const direct = state;
+	const condition = cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
+	const importance = condition ? Math.floor(condition / 256) + 1 : 0;
+	const used = direct.flatUsed ||= {};
+	const previous = used[property];
+	if (previous !== void 0 && previous > importance) return;
+	used[property] = importance;
+	if (state.style) delete state.style[property];
+}
+function convertDeferredInline(state, merge) {
+	const direct = state;
+	const used = direct.flatUsed ||= {};
+	const consume = (entries) => {
+		for (let index = 0; index < entries.length; index++) {
+			const entry = entries[index];
+			const condition = entry.condition;
+			if (condition && !(condition & 1)) continue;
+			const importance = condition ? Math.floor(condition / 256) + 1 : 0;
+			const previous = used[entry.property];
+			if (previous !== void 0 && previous > importance) continue;
+			used[entry.property] = importance;
+			merge(state, entry.property, entry.value, 1, true, entry.original !== void 0 ? entry.original : entry.value);
+		}
+	};
+	const slots = direct.flatSlots;
+	if (slots) {
+		direct.flatSlots = void 0;
+		for (const property in slots) consume(slots[property]);
+	}
+	const transitions = direct.flatTransitions;
+	if (transitions) {
+		direct.flatTransitions = void 0;
+		consume(transitions);
+	}
+	direct.flatBorderDefaultRequests = void 0;
+}
+function completeStreaming(state, merge) {
+	const direct = state;
+	const shadow = direct.flatWebShadow;
+	if (shadow && (direct.flatBoxShadowSequence || 0) <= shadow[4]) {
+		const offset = shadow[1] || {
+			width: 0,
+			height: 0
+		};
+		const color = (0, import_normalizeColor.normalizeColor)(shadow[0], shadow[2] ?? 1);
+		if (color) {
+			const next = `${shadowUnit(offset.width)} ${shadowUnit(offset.height)} ${shadowUnit(shadow[3])} ${color}`;
+			emitProperty(state, "boxShadow", direct.flatBoxShadow ? `${direct.flatBoxShadow}, ${next}` : next, null, merge, shadow[5], shadow[6]);
+		}
+	}
+	(0, import_directStyleCSS.completeStreamingCSS)(state);
+}
+function emitAtParentCondition(state, property, value, merge, originalValue, contextOnly) {
+	emitValue(state, property, value, state.flatPass?.[passParentCursor] || null, merge, originalValue, contextOnly);
+}
+function emitUnderCondition(state, property, value, cursor, merge, originalValue, contextOnly, warnMode, warnSource) {
+	const condition = conditionNumbers[cursor + conditionValueOffset];
+	if (merge && property && condition) state.flatPropSawCondition = true;
+	if (!(conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag)) {
+		if (warnMode && process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, warnSource, `unknown modifier "${conditionTexts[cursor + conditionUnresolvedNameOffset] || ""}"`);
+		return 0;
+	}
+	const unsupportedState = conditionTexts[cursor + conditionUnsupportedStateOffset] || "";
+	if (warnMode && unsupportedState && process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`${property}: "${unsupportedState}:" has no native component-state source; dropping the clause`);
+	if (merge && property && condition & 2 && (condition & 1 || import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses || warnMode === 1 && false)) {
+		emitValue(state, property, value, cursor, merge, warnMode === 2 ? originalValue : originalValue ?? value, contextOnly);
+		const flags = conditionNumbers[cursor + conditionFlagsOffset];
+		if (flags & conditionEnterFlag) state.flatHasEnterStyle = true;
+		if (flags & conditionPlatformPseudoFlag) state.flatHasPlatformPseudo = true;
+	} else if (merge && property && condition & 2) {
+		const flags = conditionNumbers[cursor + conditionFlagsOffset];
+		if (flags & conditionEnterFlag) state.flatHasEnterStyle = true;
+		if (flags & conditionPlatformPseudoFlag) state.flatHasPlatformPseudo = true;
+	}
+	return condition;
+}
+const directStyleHandler = {
+	segment(state, start, end, isBase, valid, source, chainStart, chainEnd, chainValid, chainCount, _result, failure, failureIndex, property, merge, originalValue, contextOnly) {
+		if (isBase) {
+			if (start === end) return;
+			feedCompoundSegment(state, source, start, end, true, valid || failure === "invalid-character" || failure === "stray-comment-close", "");
+			if (!valid) {
+				if (failure === "invalid-character" || failure === "stray-comment-close") return 16;
+				if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, source, failure === "unterminated-string" ? "an unterminated string" : failure === "unterminated-comment" ? "an unterminated \"/*\" comment" : "an unterminated \"(\"");
+				return;
+			}
+			const value = source.slice(start, end);
+			emitAtParentCondition(state, property, value, merge, value, contextOnly);
+			return 5;
+		}
+		if (!chainValid) {
+			if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, source, failure === "invalid-character" ? `"${source[failureIndex]}" would end the declaration or rule` : failure === "unterminated-string" ? "an unterminated string" : failure === "unterminated-comment" ? "an unterminated \"/*\" comment" : failure === "stray-comment-close" ? "a stray \"*/\"" : "an unterminated \"(\"");
+			return;
+		}
+		if (start === end) {
+			if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, source, "a conditional clause has no value");
+			return;
+		}
+		if (property === "aspectRatio" && chainCount === 1) {
+			const left = Number(source.slice(chainStart, chainEnd));
+			const right = Number(source.slice(start, end));
+			if (chainStart < chainEnd && Number.isFinite(left) && left > 0 && Number.isFinite(right) && right > 0) return 12;
+		}
+		const directState = state;
+		const cursor = directState.flatScanCursor;
+		const condition = valid ? emitUnderCondition(state, property, source.slice(start, end), cursor, merge, void 0, contextOnly, 1, source) : conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag ? conditionNumbers[cursor + conditionValueOffset] : 0;
+		feedCompoundSegment(directState, source, start, end, false, valid && Boolean(condition), condition && directState.flatPass?.[passCompoundIndexes] ? conditionTexts[cursor + conditionKeyOffset] || "" : "");
+		if (!condition) return;
+		if (!valid) {
+			if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, source, failure === "invalid-character" ? `"${source[failureIndex]}" would end the declaration or rule` : failure === "unterminated-string" ? "an unterminated string" : failure === "unterminated-comment" ? "an unterminated \"/*\" comment" : failure === "stray-comment-close" ? "a stray \"*/\"" : "an unterminated \"(\"");
+			return;
+		}
+		return 4 | (condition & 12 ? 2 : 0);
+	},
+	modifier(state, start, end, valid, first, source) {
+		const directState = state;
+		let cursor = directState.flatScanCursor;
+		if (!cursor) cursor = directState.flatScanCursor = acquireConditionCursor(directState.flatPass?.[passParentCursor] || null);
+		else if (first) resetConditionCursor(cursor, directState.flatPass?.[passParentCursor] || null);
+		if (!valid) {
+			setConditionUnresolved(cursor);
+			return;
+		}
+		if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) resolveConditionModifier(state, cursor, source.slice(start, end));
+	},
+	chain(state, _start, _end, valid) {
+		const cursor = state.flatScanCursor;
+		if (cursor) {
+			if (!valid) setConditionUnresolved(cursor);
+			if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) commitConditionCursor(state, cursor);
+		}
+		return true;
+	},
+	end(state, source, result, lastPayloadStart, chainCount, property, merge, originalValue, contextOnly, failure, failureIndex) {
+		let hasBase = !!(result & 1);
+		if (result & 16) {
+			if (chainCount === 0) {
+				emitAtParentCondition(state, property, source, merge, originalValue ?? source, contextOnly);
+				hasBase = true;
+			} else if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, source, failure === "invalid-character" ? `"${source[failureIndex]}" would end the declaration or rule` : failure === "unterminated-string" ? "an unterminated string" : failure === "unterminated-comment" ? "an unterminated \"/*\" comment" : failure === "stray-comment-close" ? "a stray \"*/\"" : "an unterminated \"(\"");
+		}
+		if (result & 8 && chainCount === 1) {
+			emitAtParentCondition(state, property, source, merge, originalValue ?? source, contextOnly);
+			hasBase = true;
+		}
+		if (process.env.NODE_ENV === "development" && !hasBase && result & 4 && (property in import_helpers.tokenCategories.color || property in import_tokenCategories.tokenCategoryByProperty) && splitComponents(source.slice(lastPayloadStart)).length > 1) (0, import_warnOnce.warnOnce)(`${property}="${source}" has multiple values after its first conditional. Write the base value before the first conditional.`);
+		if ((!import_directStyleCSS.canGenerateCSS || !state.flatShouldDoClasses) && result & 2 && !hasBase) {
+			const value = implicitLifecycleBase(property);
+			if (value !== null) emitAtParentCondition(state, property, value, merge, value, contextOnly);
+		}
+	}
+};
+function implicitLifecycleBase(property) {
+	return property === "opacity" || property === "scale" || property === "scaleX" || property === "scaleY" ? 1 : property === "rotate" ? "0deg" : property === "x" || property === "y" ? 0 : null;
+}
+const legacyTransformParts = /* @__PURE__ */ new Set([
+	"matrix",
+	"perspective",
+	"rotateX",
+	"rotateY",
+	"rotateZ",
+	"scaleZ",
+	"skewX",
+	"skewY"
+]);
+const webShadowParts = {
+	shadowColor: 1,
+	shadowOffset: 2,
+	shadowOpacity: 3,
+	shadowRadius: 4
+};
+const webTextShadowParts = /* @__PURE__ */ new Set([
+	"textShadowColor",
+	"textShadowOffset",
+	"textShadowRadius"
+]);
+const lineStyles = /* @__PURE__ */ new Set([
+	"none",
+	"hidden",
+	"dotted",
+	"dashed",
+	"solid",
+	"double",
+	"groove",
+	"ridge",
+	"inset",
+	"outset"
+]);
+const borderTargets = {
+	border: {
+		width: [
+			"borderTopWidth",
+			"borderRightWidth",
+			"borderBottomWidth",
+			"borderLeftWidth"
+		],
+		style: [
+			"borderTopStyle",
+			"borderRightStyle",
+			"borderBottomStyle",
+			"borderLeftStyle"
+		],
+		color: [
+			"borderTopColor",
+			"borderRightColor",
+			"borderBottomColor",
+			"borderLeftColor"
+		]
+	},
+	borderTop: {
+		width: ["borderTopWidth"],
+		style: ["borderTopStyle"],
+		color: ["borderTopColor"]
+	},
+	borderRight: {
+		width: ["borderRightWidth"],
+		style: ["borderRightStyle"],
+		color: ["borderRightColor"]
+	},
+	borderBottom: {
+		width: ["borderBottomWidth"],
+		style: ["borderBottomStyle"],
+		color: ["borderBottomColor"]
+	},
+	borderLeft: {
+		width: ["borderLeftWidth"],
+		style: ["borderLeftStyle"],
+		color: ["borderLeftColor"]
+	},
+	outline: {
+		width: ["outlineWidth"],
+		style: ["outlineStyle"],
+		color: ["outlineColor"]
+	},
+	borderBlock: {
+		width: ["borderBlockStartWidth", "borderBlockEndWidth"],
+		style: ["borderBlockStartStyle", "borderBlockEndStyle"],
+		color: ["borderBlockStartColor", "borderBlockEndColor"]
+	},
+	borderInline: {
+		width: ["borderInlineStartWidth", "borderInlineEndWidth"],
+		style: ["borderInlineStartStyle", "borderInlineEndStyle"],
+		color: ["borderInlineStartColor", "borderInlineEndColor"]
+	}
+};
+const tokenLookup = {
+	value: void 0,
+	fromTheme: false,
+	themeKey: ""
+};
+function fillTokenLookup(value, fromTheme, themeKey) {
+	tokenLookup.value = value;
+	tokenLookup.fromTheme = fromTheme;
+	tokenLookup.themeKey = themeKey;
+	return tokenLookup;
+}
+function tokenVariable(state, property, name) {
+	let lookupName = name.charCodeAt(0) === 36 ? name.slice(1) : name;
+	if (property === "fontFamily") {
+		const family = state.conf.fontsParsed[lookupName]?.family;
+		return family ? fillTokenLookup(family, false, lookupName) : void 0;
+	}
+	const fontKey = property === "fontSize" ? "size" : property === "fontWeight" ? "weight" : property === "lineHeight" || property === "letterSpacing" ? property : void 0;
+	if (fontKey) {
+		const value = (state.conf.fontsParsed[state.fontFamily || state.conf.defaultFontToken] || state.conf.fontsParsed[state.conf.defaultFontToken])?.[fontKey]?.[lookupName];
+		return value ? fillTokenLookup(value, false, lookupName) : void 0;
+	}
+	const category = (0, import_tokenCategories.getTokenCategoryForProperty)(property);
+	const dot = lookupName.indexOf(".");
+	if (dot !== -1) {
+		const prefix = lookupName.slice(0, dot);
+		if (!category || prefix === category || prefix === "color") lookupName = lookupName.slice(dot + 1);
+	}
+	if (category) {
+		const own = state.conf.tokensParsed[category]?.[lookupName];
+		if (own) return fillTokenLookup(own, false, lookupName);
+		for (const sibling of [
+			"color",
+			"space",
+			"size",
+			"radius",
+			"zIndex"
+		]) if (sibling !== category && state.conf.tokensParsed[sibling]?.[lookupName]) return;
+	} else {
+		const first = lookupName.charCodeAt(0);
+		if (first >= 48 && first <= 57 || first === 43 || first === 45 || first === 46) return;
+	}
+	const theme = state.theme?.[lookupName] || state.conf.themes?.[state.flatThemeName || ""]?.[lookupName];
+	if (theme) return fillTokenLookup(theme, true, lookupName);
+	if (category) return;
+	const token = state.conf.tokensParsed.space?.[lookupName] || state.conf.tokensParsed.color?.[lookupName];
+	return token ? fillTokenLookup(token, false, lookupName) : void 0;
+}
+let literalMissConf = null;
+let literalMissRevision = -1;
+let literalMisses = /* @__PURE__ */ new WeakMap();
+const literalMissRootTheme = {};
+function isFontKeyedProperty(property) {
+	return property === "fontFamily" || property === "fontSize" || property === "fontWeight" || property === "lineHeight" || property === "letterSpacing";
+}
+function literalMissSet(state) {
+	const revision = (0, import_grammarConfig.getConfigRevisionState)(state.conf).revision;
+	if (state.conf !== literalMissConf || revision !== literalMissRevision) {
+		literalMissConf = state.conf;
+		literalMissRevision = revision;
+		literalMisses = /* @__PURE__ */ new WeakMap();
+	}
+	const themeKey = state.theme && typeof state.theme === "object" ? state.theme : literalMissRootTheme;
+	let set = literalMisses.get(themeKey);
+	if (!set) {
+		set = /* @__PURE__ */ new Set();
+		literalMisses.set(themeKey, set);
+	}
+	return set;
+}
+function configuredValue(state, property, raw) {
+	let name = raw;
+	let opacity;
+	const slash = raw.lastIndexOf("/");
+	if (slash > 0) {
+		const amount = Number(raw.slice(slash + 1));
+		if (Number.isInteger(amount) && amount >= 0 && amount <= 100) {
+			name = raw.slice(0, slash);
+			opacity = amount;
+		}
+	}
+	const safeArea = (0, import_resolveSafeAreaVariable.resolveSafeAreaVariable)(name);
+	if (safeArea !== void 0) {
+		state.flatUsesSafeArea = true;
+		return safeArea;
+	}
+	const cacheable = !isFontKeyedProperty(property);
+	let misses;
+	let missKey = "";
+	if (cacheable) {
+		misses = literalMissSet(state);
+		missKey = `${state.flatThemeName || ""}${property}${name}`;
+		if (misses.has(missKey)) return raw;
+	}
+	const lookup = tokenVariable(state, property, name);
+	if (!lookup || !(0, import_createVariable.isVariable)(lookup.value)) {
+		if (misses) misses.add(missKey);
+		if (process.env.NODE_ENV === "development" && import_tokenCategories.tokenCategoryByProperty[property] && state.conf.tokensParsed.color?.[name]) (0, import_warnOnce.warnOnce)(`"${name}" contributes to "color", not "${property}"; keeping it literal`);
+		return raw;
+	}
+	const resolveValues = !state.flatShouldDoClasses && state.styleProps.resolveValues === "auto" ? "value" : state.styleProps.resolveValues;
+	if (resolveValues === "except-theme" && lookup.fromTheme) return `${import_themeRef.THEME_REF_PREFIX}${lookup.themeKey}${opacity !== void 0 ? `/${opacity}` : ""}`;
+	let value = (0, import_resolveVariableValue.resolveVariableValue)(property, lookup.value, resolveValues);
+	if (opacity !== void 0) value = `color-mix(in srgb, ${value} ${opacity}%, transparent)`;
+	return value;
+}
+function resolveEmbeddedTokens(state, property, raw) {
+	let copyFrom = 0;
+	let out = "";
+	let quote = 0;
+	for (let index = 0; index < raw.length; index++) {
+		const code = raw.charCodeAt(index);
+		if (quote) {
+			if (code === 92) index++;
+			else if (code === quote) quote = 0;
+			continue;
+		}
+		if (code === 34 || code === 39) {
+			quote = code;
+			continue;
+		}
+		if (!(code === 36 || code === 95 || code >= 65 && code <= 90 || code >= 97 && code <= 122)) continue;
+		let end = index + 1;
+		while (end < raw.length) {
+			const next = raw.charCodeAt(end);
+			if (next === 36 || next === 45 || next === 46 || next === 95 || next >= 48 && next <= 57 || next >= 65 && next <= 90 || next >= 97 && next <= 122) end++;
+			else break;
+		}
+		if (raw.charCodeAt(end) === 47) {
+			let suffix = end + 1;
+			while (suffix < raw.length) {
+				const next = raw.charCodeAt(suffix);
+				if (next < 48 || next > 57) break;
+				suffix++;
+			}
+			if (suffix > end + 1) end = suffix;
+		}
+		const before = raw.charCodeAt(index - 1);
+		if (code !== 36 && (before >= 48 && before <= 57 || before === 35 || before === 45 && raw.charCodeAt(index - 2) === 45 || raw.charCodeAt(end) === 40)) {
+			index = end - 1;
+			continue;
+		}
+		const word = raw.slice(index, end);
+		const value = configuredValue(state, property, word);
+		if (value !== word) {
+			out += raw.slice(copyFrom, index);
+			out += String(value);
+			copyFrom = end;
+		}
+		index = end - 1;
+	}
+	return copyFrom ? out + raw.slice(copyFrom) : raw;
+}
+function normalizeTransitionNames(state, raw) {
+	let quote = 0;
+	let depth = 0;
+	let copyFrom = 0;
+	let out = "";
+	for (let index = 0; index < raw.length; index++) {
+		const code = raw.charCodeAt(index);
+		if (quote) {
+			if (code === 92) index++;
+			else if (code === quote) quote = 0;
+			continue;
+		}
+		if (code === 34 || code === 39) {
+			quote = code;
+			continue;
+		}
+		if (code === 40) {
+			depth++;
+			continue;
+		}
+		if (code === 41) {
+			depth--;
+			continue;
+		}
+		if (depth || !(code >= 65 && code <= 90 || code >= 97 && code <= 122 || code === 95) || index > 1 && raw.charCodeAt(index - 1) === 45 && raw.charCodeAt(index - 2) === 45) continue;
+		let end = index + 1;
+		while (end < raw.length) {
+			const next = raw.charCodeAt(end);
+			if (next >= 48 && next <= 57 || next >= 65 && next <= 90 || next >= 97 && next <= 122 || next === 45 || next === 95) end++;
+			else break;
+		}
+		if (raw.charCodeAt(end) !== 40) {
+			const authored = raw.slice(index, end);
+			let property = state.conf.shorthands[authored] || authored;
+			if (property === "x" || property === "y") property = "translate";
+			else if (property === "scaleX" || property === "scaleY") property = "scale";
+			else if (legacyTransformParts.has(property)) property = "transform";
+			let hasUpper = false;
+			for (let offset = 0; offset < property.length; offset++) {
+				const letter = property.charCodeAt(offset);
+				if (letter >= 65 && letter <= 90) {
+					hasUpper = true;
+					break;
 				}
-				if (!avoidMergeTransform && skey in import_helpers.stylePropsTransform) mergeTransform(styleOut, skey, sval);
-				else styleOut[skey] = styleProps.noNormalize ? sval : (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(sval, key);
-			});
+			}
+			if (property !== authored || hasUpper) {
+				out += raw.slice(copyFrom, index);
+				for (let offset = 0; offset < property.length; offset++) {
+					const letter = property.charCodeAt(offset);
+					out += letter >= 65 && letter <= 90 ? `-${String.fromCharCode(letter + 32)}` : property[offset];
+				}
+				copyFrom = end;
+			}
 		}
+		index = end - 1;
+	}
+	return copyFrom ? out + raw.slice(copyFrom) : raw;
+}
+function getDirectDynamicThemeAccess(state) {
+	return state.flatDynamicThemeAccess;
+}
+function emitProperty(state, property, value, cursor, merge, originalValue, contextOnly) {
+	const direct = state;
+	const condition = cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
+	if (condition & 4) (state.flatEnterKeys ||= /* @__PURE__ */ new Set()).add(property);
+	if (condition & 8) (state.flatExitKeys ||= /* @__PURE__ */ new Set()).add(property);
+	cursor && conditionTexts[cursor + conditionThemeOffset];
+	if (contextOnly) {
+		if (!condition || condition & 1) (state.overriddenContextProps ||= {})[property] = originalValue;
+		return;
+	}
+	if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && !condition && property === "transform") {
+		if (process.env.NODE_ENV === "development" && state.transformAccumulator) for (const part of (0, import_runtime.getTransformPartKeys)(state.transformAccumulator)) (0, import_warnOnce.warnOnce)(`legacy transform part "${part}" is dropped because "transform" owns the property`);
+		state.transformAccumulator ||= (0, import_runtime.createTransformAccumulator)();
+		(0, import_runtime.addTransformValue)(state.transformAccumulator, property, value);
+		return;
+	}
+	const shouldPromoteAnimatedStyle = import_directStyleCSS.canGenerateCSS && !condition && !state.flatShouldDoClasses && !state.styleProps.noMergeStyle && state.styleProps.isAnimated && state.animationDriver?.inputStyle === "css" && property in import_helpers.nonAnimatableStyleProps;
+	if (import_directStyleCSS.canGenerateCSS && (state.flatShouldDoClasses || shouldPromoteAnimatedStyle)) {
+		if (!condition && state.style && direct.flatWeakContribution !== true && !(direct.flatUsed && direct.flatUsed[property])) delete state.style[property];
+		streamWriteCSS(state, property, value, cursor, originalValue);
+		return;
+	}
+	if (condition && !(condition & 1)) return;
+	streamWriteInline(state, property, value, cursor, merge, originalValue);
+}
+function splitComponents(value) {
+	const parts = [];
+	let start = 0;
+	let quote = 0;
+	let depth = 0;
+	for (let index = 0; index <= value.length; index++) {
+		const code = index === value.length ? 32 : value.charCodeAt(index);
+		if (quote) {
+			if (code === 92) index++;
+			else if (code === quote) quote = 0;
+			continue;
+		}
+		if (code === 34 || code === 39) quote = code;
+		else if (code === 40) depth++;
+		else if (code === 41) depth--;
+		else if (!depth && code <= 32) {
+			if (index > start) parts.push(value.slice(start, index));
+			start = index + 1;
+		}
+	}
+	return parts;
+}
+function numericUnitValue(value, first, second) {
+	const unitLength = value.endsWith(first) || second !== void 0 && value.endsWith(second) ? first.length : 0;
+	if (!unitLength || value.length === unitLength) return NaN;
+	const numeric = Number(value.slice(0, value.length - unitLength));
+	return Number.isFinite(numeric) ? numeric : NaN;
+}
+function isNumericCSSComponent(value) {
+	let index = 0;
+	if (value.charCodeAt(index) === 43 || value.charCodeAt(index) === 45) index++;
+	let digits = 0;
+	let dot = false;
+	for (; index < value.length; index++) {
+		const code = value.charCodeAt(index);
+		if (code >= 48 && code <= 57) {
+			digits++;
+			continue;
+		}
+		if (code === 46 && !dot) {
+			dot = true;
+			continue;
+		}
+		break;
+	}
+	if (!digits) return false;
+	for (; index < value.length; index++) {
+		const code = value.charCodeAt(index);
+		if (code !== 37 && (code < 97 || code > 122)) return false;
+	}
+	return true;
+}
+function startsValueFunction(value) {
+	let index = 0;
+	while (index < value.length) {
+		const code = value.charCodeAt(index);
+		if (code === 45 || code >= 97 && code <= 122) {
+			index++;
+			continue;
+		}
+		break;
+	}
+	return index > 0 && value.charCodeAt(index) === 40;
+}
+function emitBorder(state, property, raw, cursor, merge, originalValue, contextOnly) {
+	let width;
+	let style;
+	let color;
+	for (const part of splitComponents(raw)) if (lineStyles.has(part) || property === "outline" && part === "auto") style = part;
+	else if (part === "thin" || part === "medium" || part === "thick" || isNumericCSSComponent(part) || startsValueFunction(part)) width = part;
+	else color = part;
+	if (style === "none" && width === void 0) width = "0";
+	const targets = borderTargets[property];
+	if (width !== void 0) for (const target of targets.width) emitResolved(state, target, width, cursor, merge, originalValue, contextOnly);
+	if (style !== void 0) {
+		const styleTargets = targets.style;
+		for (const target of styleTargets) emitProperty(state, target, style, cursor, merge, originalValue, contextOnly);
+	}
+	if (color !== void 0) for (const target of targets.color) emitResolved(state, target, color, cursor, merge, originalValue, contextOnly);
+}
+function emitTextDecoration(state, raw, cursor, merge, originalValue, contextOnly) {
+	for (const part of splitComponents(raw)) emitResolved(state, part === "solid" || part === "double" || part === "dotted" || part === "dashed" || part === "wavy" ? "textDecorationStyle" : part === "underline" || part === "overline" || part === "line-through" || part === "none" ? "textDecorationLine" : "textDecorationColor", part, cursor, merge, originalValue, contextOnly);
+}
+function emitTransform(state, property, value, cursor, merge, originalValue, contextOnly) {
+	if (!import_directStyleCSS.canGenerateCSS || !state.flatShouldDoClasses) {
+		emitProperty(state, property, value, cursor, merge, originalValue, contextOnly);
+		return;
+	}
+	const targets = property === "scale" ? ["--t-scale-x", "--t-scale-y"] : [property === "x" ? "--t-x" : property === "y" ? "--t-y" : property === "scaleX" ? "--t-scale-x" : property === "scaleY" ? "--t-scale-y" : "rotate"];
+	for (const target of targets) {
+		let targetValue = value;
+		if (typeof targetValue === "number") {
+			if (target === "--t-x" || target === "--t-y") targetValue = `${targetValue}px`;
+			else if (target === "rotate") targetValue = `${targetValue}deg`;
+		}
+		emitProperty(state, target, targetValue, cursor, merge, originalValue, contextOnly);
+		if (target === "--t-x" || target === "--t-y") (0, import_directStyleCSS.addComposition)(state, "translate");
+		else if (target.startsWith("--t-scale")) (0, import_directStyleCSS.addComposition)(state, "scale");
+	}
+}
+function emitResolved(state, property, raw, cursor, merge, originalValue, contextOnly) {
+	let value = configuredValue(state, property, raw);
+	if (value === raw) value = resolveEmbeddedTokens(state, property, raw);
+	if (!state.flatShouldDoClasses && typeof value === "string") {
+		const unitValue = numericUnitValue(value, "px", "dp");
+		if (Number.isFinite(unitValue)) value = unitValue;
+		else if (value !== "" && Number.isFinite(Number(value))) value = Number(value);
+	}
+	emitProperty(state, property, value, cursor, merge, originalValue, contextOnly);
+}
+const emitKindTransition = 1;
+const emitKindTransformPart = 2;
+const emitKindWebShadow = 3;
+const emitKindWebTextShadow = 4;
+const emitKindTransform = 5;
+const emitKindBorder = 6;
+const emitKindTextDecoration = 7;
+const emitKindBackground = 8;
+const emitKindAxis = 9;
+const emitKindBorderRadius = 10;
+const emitKindBorderWidth = 11;
+const emitValueKinds = {
+	transition: emitKindTransition,
+	transitionProperty: emitKindTransition,
+	transform: emitKindTransform,
+	textDecoration: emitKindTextDecoration,
+	background: emitKindBackground,
+	x: emitKindAxis,
+	y: emitKindAxis,
+	scale: emitKindAxis,
+	scaleX: emitKindAxis,
+	scaleY: emitKindAxis,
+	rotate: emitKindAxis,
+	borderRadius: emitKindBorderRadius,
+	borderWidth: emitKindBorderWidth,
+	borderTopWidth: emitKindBorderWidth,
+	borderRightWidth: emitKindBorderWidth,
+	borderBottomWidth: emitKindBorderWidth,
+	borderLeftWidth: emitKindBorderWidth
+};
+for (const part of legacyTransformParts) emitValueKinds[part] = emitKindTransformPart;
+for (const part in webShadowParts) emitValueKinds[part] = emitKindWebShadow;
+for (const part of webTextShadowParts) emitValueKinds[part] = emitKindWebTextShadow;
+for (const target in borderTargets) emitValueKinds[target] = emitKindBorder;
+function shadowUnit(part) {
+	return typeof part === "number" ? `${part}px` : part || "0px";
+}
+function emitWebTextShadow(state, property, value, merge, originalValue, contextOnly) {
+	const shadow = state.flatTextShadow ||= {};
+	shadow[property] = value;
+	const offset = shadow.textShadowOffset || {
+		width: 0,
+		height: 0
+	};
+	if (!shadow.textShadowColor) return;
+	emitProperty(state, "textShadow", `${shadowUnit(offset.width)} ${shadowUnit(offset.height)} ${shadowUnit(shadow.textShadowRadius)} ${shadow.textShadowColor}`, null, merge, originalValue, contextOnly);
+}
+function emitValue(state, property, raw, cursor, merge, originalValue, contextOnly) {
+	const condition = cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
+	if ((0, import_createVariable.isVariable)(raw)) raw = (0, import_resolveVariableValue.resolveVariableValue)(property, raw, !state.flatShouldDoClasses && state.styleProps.resolveValues === "auto" ? "value" : state.styleProps.resolveValues);
+	const emitKind = emitValueKinds[property];
+	if (emitKind !== void 0) switch (emitKind) {
+		case emitKindTransition:
+			if (typeof raw === "string") raw = normalizeTransitionNames(state, raw);
+			break;
+		case emitKindBorderWidth:
+			(0, import_directStyleCSS.requestBorderStyleDefault)(state, property, condition, cursor ? conditionTexts[cursor + conditionKeyOffset] || "" : "", cursor ? conditionTexts[cursor + conditionSelectorOffset] || "" : "", cursor ? conditionWrappers : void 0, cursor ? conditionNumbers[cursor + conditionWrapperOffset] >> 3 : 0, cursor ? conditionNumbers[cursor + conditionWrapperOffset] & 7 : 0);
+			break;
+		case emitKindTransformPart: {
+			const value2 = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
+			if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && !condition) {
+				state.transformAccumulator ||= (0, import_runtime.createTransformAccumulator)();
+				(0, import_runtime.addTransformValue)(state.transformAccumulator, property, value2);
+			} else if (condition && import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses) emitProperty(state, "transform", `${property}(${value2})`, cursor, merge, originalValue, contextOnly);
+			else streamWriteInline(state, property, value2, cursor, merge, originalValue, true);
+			return;
+		}
+		case emitKindWebShadow: {
+			const value2 = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
+			if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses) {
+				const shadow = state.flatWebShadow ||= [];
+				shadow[webShadowParts[property] - 1] = value2;
+				shadow[4] = ++frameSequence;
+				shadow[5] = originalValue;
+				shadow[6] = contextOnly;
+			} else streamWriteInline(state, property, value2, cursor, merge, originalValue, true);
+			return;
+		}
+		case emitKindWebTextShadow: {
+			const value2 = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
+			if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses) emitWebTextShadow(state, property, value2, merge, originalValue, contextOnly);
+			else streamWriteInline(state, property, value2, cursor, merge, originalValue, true);
+			return;
+		}
+		case emitKindTransform:
+			if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && Array.isArray(raw)) raw = (0, import_transformsToString.transformsToString)(raw);
+			break;
+		case emitKindBorder:
+			if (typeof raw === "string") {
+				emitBorder(state, property, raw, cursor, merge, originalValue, contextOnly);
+				return;
+			}
+			break;
+		case emitKindTextDecoration:
+			if (typeof raw === "string") {
+				emitTextDecoration(state, raw, cursor, merge, originalValue, contextOnly);
+				return;
+			}
+			break;
+		case emitKindBackground:
+			if (typeof raw === "string") {
+				const parts = splitComponents(raw);
+				if (parts.length === 1 && !startsValueFunction(parts[0])) {
+					emitResolved(state, "backgroundColor", parts[0], cursor, merge, originalValue, contextOnly);
+					return;
+				}
+			}
+			break;
+		case emitKindAxis: {
+			let value2 = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
+			if (!state.flatShouldDoClasses && typeof value2 === "string" && !value2.startsWith(import_themeRef.THEME_REF_PREFIX)) {
+				if (property === "rotate" && !Number.isFinite(numericUnitValue(value2, "deg", "rad"))) {
+					if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`native transform "${property}" cannot represent "${value2}"; dropping it`);
+					if (condition & 1) {
+						(0, import_runtime.removeTransformValue)(state.transformAccumulator, property);
+						streamRetractInline(state, property, cursor);
+					}
+					return;
+				}
+				const unitValue = numericUnitValue(value2, "px", "dp");
+				if (Number.isFinite(unitValue)) value2 = unitValue;
+				else if (Number.isFinite(Number(value2))) value2 = Number(value2);
+			}
+			emitTransform(state, property, value2, cursor, merge, originalValue, contextOnly);
+			return;
+		}
+		case emitKindBorderRadius:
+			if (!state.flatShouldDoClasses && !condition) {
+				if (typeof raw === "string") emitResolved(state, property, raw, cursor, merge, originalValue, contextOnly);
+				else emitProperty(state, property, raw, cursor, merge, originalValue, contextOnly);
+				return;
+			}
+			break;
+	}
+	let value = raw;
+	if (typeof raw === "string") {
+		value = configuredValue(state, property, raw);
+		if (value === raw) value = resolveEmbeddedTokens(state, property, raw);
+	}
+	if (!state.flatShouldDoClasses && typeof value === "string") {
+		const unitValue = numericUnitValue(value, "px", "dp");
+		if (Number.isFinite(unitValue)) value = unitValue;
+		else if (value !== "" && Number.isFinite(Number(value))) value = Number(value);
+	}
+	if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && property === "boxShadow" && !condition) {
+		state.flatBoxShadow = value;
+		state.flatBoxShadowSequence = frameSequence + 1;
+	}
+	const expanded = state.styleProps.noExpand ? null : (0, import_expandStyle.expandStyle)(property, value, state.conf.settings.styleCompat || "web");
+	if (!expanded) {
+		emitProperty(state, property, value, cursor, merge, originalValue, contextOnly);
+		return;
+	}
+	if (typeof raw === "string" && expanded.length > 1) {
+		const parts = splitComponents(raw);
+		if (parts.length > 0 && parts.length <= (expanded.length === 4 ? 4 : 2)) {
+			for (let index = 0; index < expanded.length; index++) {
+				const partIndex = index === 0 || parts.length === 1 ? 0 : index === 1 || index === 3 && parts.length < 4 ? 1 : index === 2 && parts.length < 3 ? 0 : index;
+				emitResolved(state, expanded[index][0], parts[partIndex], cursor, merge, originalValue, contextOnly);
+			}
+			return;
+		}
+	}
+	for (let index = 0; index < expanded.length; index++) emitProperty(state, expanded[index][0], expanded[index][1], cursor, merge, originalValue, contextOnly);
+}
+function contributeStyleString(state, property, source, merge, originalValue, contextOnly = false) {
+	const directState = state;
+	const watermark = conditionCursorTop;
+	const previousCursor = directState.flatScanCursor;
+	const previousExpectMulti = directState.flatExpectMulti;
+	directState.flatScanCursor = null;
+	directState.flatExpectMulti = source.indexOf(":") !== -1;
+	try {
+		(0, import_runtime.scanFlatValue)(source, directStyleHandler, state, property, merge, originalValue, contextOnly);
 	} finally {
-		styleState.props = parentProps;
-	}
-	if (!avoidMergeTransform) {
-		const parentTransform = styleState.style?.transform;
-		const flatTransforms = styleState.flatTransforms;
-		const styleOutTransform = styleOut.transform;
-		if (Array.isArray(styleOutTransform) && styleOutTransform.length) {
-			const len = styleOutTransform.length;
-			if (Array.isArray(parentTransform)) {
-				const merged = [];
-				outer: for (let i = 0; i < parentTransform.length; i++) {
-					const pt = parentTransform[i];
-					for (const pk in pt) {
-						for (let j = 0; j < len; j++) for (const sk in styleOutTransform[j]) {
-							if (pk === sk) continue outer;
-							break;
+		directState.flatScanCursor = previousCursor;
+		directState.flatExpectMulti = previousExpectMulti;
+		releaseConditionCursors(watermark);
+	}
+	return true;
+}
+function contributeStyleObject(state, property, value, merge, contextOnly) {
+	const outerState = state;
+	const previousExpectMulti = outerState.flatExpectMulti;
+	outerState.flatExpectMulti = true;
+	try {
+		return contributeStyleObjectInner(state, property, value, merge, contextOnly);
+	} finally {
+		outerState.flatExpectMulti = previousExpectMulti;
+	}
+}
+function contributeStyleObjectInner(state, property, value, merge, contextOnly) {
+	const directState = state;
+	const parent = directState.flatPass?.[passParentCursor] || null;
+	const hasDefault = Object.prototype.hasOwnProperty.call(value, "default");
+	let hasBase = false;
+	const base = hasDefault ? value.default : void 0;
+	if (base != null) {
+		const baseString = String(base);
+		feedCompoundSegment(directState, baseString, 0, baseString.length, true, true, "");
+		emitAtParentCondition(state, property, base, merge, base, contextOnly);
+		hasBase = true;
+	}
+	let conditions = 0;
+	let firstCondition = !hasDefault;
+	for (const key in value) {
+		if (key === "default") continue;
+		const payload = value[key];
+		const watermark = conditionCursorTop;
+		const cursor = acquireConditionCursor(parent);
+		resolveConditionText(state, cursor, key);
+		const condition = commitConditionCursor(state, cursor);
+		if (firstCondition) {
+			firstCondition = false;
+			if (!condition) {
+				releaseConditionCursors(watermark);
+				return false;
+			}
+		}
+		if (payload != null) {
+			conditions |= emitUnderCondition(state, property, payload, cursor, merge, payload, contextOnly, 1, payload);
+			const payloadString = String(payload);
+			feedCompoundSegment(directState, payloadString, 0, payloadString.length, false, Boolean(condition), condition && directState.flatPass?.[passCompoundIndexes] ? conditionTexts[cursor + conditionKeyOffset] || "" : "");
+		}
+		releaseConditionCursors(watermark);
+	}
+	if (!hasDefault && firstCondition) return false;
+	if ((!import_directStyleCSS.canGenerateCSS || !state.flatShouldDoClasses) && conditions & 12 && !hasBase) {
+		const resting = implicitLifecycleBase(property);
+		if (resting !== null) emitAtParentCondition(state, property, resting, merge, resting, contextOnly);
+	}
+	return true;
+}
+function contributeValue(state, property, value, merge, originalValue, contextOnly = false, condition) {
+	if (isConditionTransport(value)) {
+		if (value.hasBase) contributeValue(state, property, value.base, merge, value.base, contextOnly);
+		for (let offset = 0; offset < value.entries.length;) {
+			const entryValue = value.entries[offset];
+			const watermark = conditionCursorTop;
+			try {
+				emitUnderCondition(state, property, entryValue, acquireTransportCursor(state, value.entries, offset, state.flatPass?.[passParentCursor] || null), merge, entryValue, contextOnly, 2, entryValue);
+			} finally {
+				releaseConditionCursors(watermark);
+			}
+			offset += transportEntryWidth;
+		}
+		return true;
+	}
+	if (condition !== void 0) {
+		const parent = state.flatPass?.[passParentCursor] || null;
+		const watermark = conditionCursorTop;
+		try {
+			let effective;
+			if (typeof condition === "string") {
+				effective = acquireConditionCursor(parent);
+				resolveConditionText(state, effective, condition);
+				commitConditionCursor(state, effective);
+			} else if (parent) {
+				effective = acquireConditionCursor(parent);
+				const conditionKey = conditionTexts[condition + conditionKeyOffset] || "";
+				if (conditionKey) resolveConditionText(state, effective, conditionKey);
+				if (!(conditionNumbers[condition + conditionFlagsOffset] & conditionResolvedFlag)) setConditionUnresolved(effective);
+				commitConditionCursor(state, effective);
+			} else effective = condition;
+			const isObjectValue = value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value);
+			const objectHasDefault = isObjectValue && Object.prototype.hasOwnProperty.call(value, "default");
+			const firstChild = isObjectValue && !objectHasDefault ? acquireConditionCursor(effective) : null;
+			if (isObjectValue && classifyConditionalObject(value, state, void 0, firstChild || void 0)) {
+				let useFirstChild = firstChild !== null;
+				for (const key in value) {
+					const payload = value[key];
+					if (payload == null) continue;
+					if (key === "default") emitUnderCondition(state, property, payload, effective, merge, payload, contextOnly, 2, payload);
+					else {
+						const keyWatermark = conditionCursorTop;
+						const child = useFirstChild ? firstChild : acquireConditionCursor(effective);
+						if (useFirstChild) useFirstChild = false;
+						else {
+							resolveConditionText(state, child, key);
+							commitConditionCursor(state, child);
 						}
-						merged.push(pt);
-						break;
+						emitUnderCondition(state, property, payload, child, merge, payload, contextOnly, 2, payload);
+						if (child !== firstChild) releaseConditionCursors(keyWatermark);
 					}
 				}
-				for (let i = 0; i < len; i++) merged.push(styleOutTransform[i]);
-				styleOut.transform = merged;
+				return true;
 			}
-			if (flatTransforms) outer: for (const fk in flatTransforms) {
-				const ck = fk === "x" ? "translateX" : fk === "y" ? "translateY" : fk;
-				for (let j = 0; j < len; j++) for (const sk in styleOutTransform[j]) {
-					if (ck === sk) continue outer;
-					break;
+			emitUnderCondition(state, property, value, effective, merge, originalValue, contextOnly, 2, value);
+			return true;
+		} finally {
+			releaseConditionCursors(watermark);
+		}
+	}
+	if ((webShadowParts[property] || legacyTransformParts.has(property)) && (typeof value === "string" && value.indexOf(":") !== -1 || value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value) && classifyConditionalObject(value, state))) {
+		if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`conditional "${property}" needs its composite property; dropping it`);
+		return true;
+	}
+	if (value === "safe" && (0, import_resolveSafeArea.isSafeAreaKey)(property)) {
+		const expanded = (0, import_resolveSafeArea.expandSafeAreaValue)(property);
+		if (expanded) {
+			state.flatUsesSafeArea = true;
+			for (const [key, resolved] of expanded) emitAtParentCondition(state, key, resolved, merge, originalValue ?? value, contextOnly);
+			return true;
+		}
+	}
+	if (typeof value === "string") return contributeStyleString(state, property, value, merge, originalValue, contextOnly);
+	if (value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value) && contributeStyleObject(state, property, value, merge, contextOnly)) return true;
+	if (value != null) {
+		emitAtParentCondition(state, property, value, merge, originalValue ?? value, contextOnly);
+		return true;
+	}
+	return false;
+}
+function clearDirectStyle(state, property) {
+	const direct = state;
+	const atomicKey = property.startsWith("transition") ? "transition" : webShadowParts[property] ? "boxShadow" : webTextShadowParts.has(property) ? "textShadow" : legacyTransformParts.has(property) ? "transform" : property;
+	(0, import_directStyleCSS.clearFrameAtomic)(state, atomicKey);
+	const used = direct.flatUsed;
+	if (used) delete used[atomicKey];
+	if (atomicKey === "transform") state.transformAccumulator = void 0;
+	if (state.style) delete state.style[atomicKey];
+	delete state.classNames[atomicKey];
+}
+const conditionTransports = /* @__PURE__ */ new WeakSet();
+function isConditionTransport(value) {
+	return typeof value === "object" && value !== null && conditionTransports.has(value);
+}
+const transportEntryWidth = 2;
+function appendConditionEntry(entries, cursor, value) {
+	entries.push(value, conditionTexts[cursor + conditionKeyOffset] || "");
+}
+function acquireTransportCursor(state, entries, offset, parent) {
+	const cursor = acquireConditionCursor(parent);
+	const key = entries[offset + 1];
+	if (key) resolveConditionText(state, cursor, key);
+	commitConditionCursor(state, cursor);
+	return cursor;
+}
+function mergeConditionTransport(state, prev, cursor, value) {
+	let transport;
+	if (isConditionTransport(prev)) transport = prev;
+	else {
+		transport = {
+			hasBase: false,
+			base: void 0,
+			entries: []
+		};
+		conditionTransports.add(transport);
+		if (prev != null) {
+			const isObjectValue = typeof prev === "object" && !Array.isArray(prev) && !(0, import_createVariable.isVariable)(prev);
+			const objectHasDefault = isObjectValue && Object.prototype.hasOwnProperty.call(prev, "default");
+			const authoredWatermark = conditionCursorTop;
+			try {
+				const firstCursor = isObjectValue && !objectHasDefault ? acquireConditionCursor() : null;
+				if (isObjectValue && classifyConditionalObject(prev, state, void 0, firstCursor || void 0)) {
+					let useFirstCursor = firstCursor !== null;
+					for (const key in prev) {
+						const payload = prev[key];
+						if (payload == null) continue;
+						if (key === "default") {
+							transport.hasBase = true;
+							transport.base = payload;
+							continue;
+						}
+						const watermark = conditionCursorTop;
+						const keyCursor = useFirstCursor ? firstCursor : acquireConditionCursor();
+						if (useFirstCursor) useFirstCursor = false;
+						else {
+							resolveConditionText(state, keyCursor, key);
+							commitConditionCursor(state, keyCursor);
+						}
+						appendConditionEntry(transport.entries, keyCursor, payload);
+						if (keyCursor !== firstCursor) releaseConditionCursors(watermark);
+					}
+				} else {
+					transport.hasBase = true;
+					transport.base = prev;
 				}
-				mergeTransform(styleOut, fk, flatTransforms[fk]);
+			} finally {
+				releaseConditionCursors(authoredWatermark);
 			}
-		} else if (flatTransforms) mergeFlatTransforms(styleOut, flatTransforms);
+		}
+	}
+	const cursorKey = conditionTexts[cursor + conditionKeyOffset] || "";
+	for (let offset = 0; offset < transport.entries.length; offset += transportEntryWidth) if (transport.entries[offset + 1] === cursorKey) {
+		transport.entries.splice(offset, transportEntryWidth);
+		break;
+	}
+	appendConditionEntry(transport.entries, cursor, value);
+	return transport;
+}
+const variantValueHandler = {
+	segment(ctx, start, end, isBase, valid, source, chainStart, chainEnd, chainValid) {
+		const state = ctx[0];
+		const directState = state;
+		if (start === end) return;
+		if (isBase) {
+			feedCompoundSegment(directState, source, start, end, true, valid, "");
+			if (!valid) return;
+			emitResolvedVariant(ctx[1], source.slice(start, end), state, ctx[2], null);
+			return;
+		}
+		if (!valid || !chainValid) return;
+		const cursor = directState.flatScanCursor;
+		const condition = cursor && conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag ? conditionNumbers[cursor + conditionValueOffset] : 0;
+		feedCompoundSegment(directState, source, start, end, false, Boolean(condition), condition && directState.flatPass?.[passCompoundIndexes] ? conditionTexts[cursor + conditionKeyOffset] || "" : "");
+		if (!condition) return;
+		emitResolvedVariant(ctx[1], source.slice(start, end), state, ctx[2], cursor);
+	},
+	modifier(ctx, start, end, valid, first, source) {
+		const directState = ctx[0];
+		let cursor = directState.flatScanCursor;
+		if (!cursor) cursor = directState.flatScanCursor = acquireConditionCursor();
+		else if (first) resetConditionCursor(cursor, 0);
+		if (!valid) {
+			setConditionUnresolved(cursor);
+			return;
+		}
+		if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) resolveConditionModifier(ctx[0], cursor, source.slice(start, end));
+	},
+	chain(ctx, _start, _end, valid) {
+		const cursor = ctx[0].flatScanCursor;
+		if (cursor) {
+			if (!valid) setConditionUnresolved(cursor);
+			if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) commitConditionCursor(ctx[0], cursor);
+		}
+		return true;
 	}
-	if (!styleProps.noNormalize) (0, import_expandStyles.fixStyles)(styleOut);
-	if (originalValues) import_styleOriginalValues.styleOriginalValues.set(styleOut, originalValues);
-	return styleOut;
 };
-const useInsertEffectCompat = import_constants.isWeb ? import_react.default.useInsertionEffect || import_constants.useIsomorphicLayoutEffect : () => {};
-const useSplitStyles = (a, b, c, d, e, f, g, h, i, j, k, l, m) => {
-	"use no memo";
-	const res = getSplitStyles(a, b, c, d, e, f, g, h, i, j, k, l, m);
-	useInsertEffectCompat(() => {
-		if (res) (0, import_insertStyleRule.insertStyleRules)(res.rulesToInsert);
-	}, [res?.rulesToInsert]);
-	return res;
+const contextPropSets = /* @__PURE__ */ new WeakMap();
+function getContextPropSet(staticConfig) {
+	const cached = contextPropSets.get(staticConfig);
+	if (cached !== void 0) return cached;
+	const contextConfig = staticConfig.context || staticConfig.parentStaticConfig?.context;
+	const inheritedContextPropKeys = !staticConfig.context || staticConfig.context === staticConfig.parentStaticConfig?.context ? staticConfig.parentStaticConfig?.contextProps : void 0;
+	const contextPropKeys = staticConfig.contextProps || inheritedContextPropKeys;
+	let set = null;
+	if (contextConfig?.props) {
+		set ||= /* @__PURE__ */ new Set();
+		for (const key in contextConfig.props) set.add(key);
+	}
+	if (contextPropKeys) {
+		set ||= /* @__PURE__ */ new Set();
+		for (const key of contextPropKeys) set.add(key);
+	}
+	if (contextConfig?.propKeys) {
+		set ||= /* @__PURE__ */ new Set();
+		for (const key of contextConfig.propKeys) set.add(key);
+	}
+	const parentPropKeys = staticConfig.parentStaticConfig?.context?.propKeys;
+	if (parentPropKeys) {
+		set ||= /* @__PURE__ */ new Set();
+		for (const key of parentPropKeys) set.add(key);
+	}
+	contextPropSets.set(staticConfig, set);
+	return set;
+}
+function emitMappedValue(styleState, key, value, originalValue, nestedCondition, parentCondition, fallbackOriginal) {
+	const nested = nestedCondition;
+	const parent = parentCondition;
+	let resolvedCondition = nested ?? parent;
+	const watermark = conditionCursorTop;
+	if (nested && parent) {
+		const composed = acquireConditionCursor(parent);
+		const nestedKey = conditionTexts[nested + conditionKeyOffset] || "";
+		if (nestedKey) resolveConditionText(styleState, composed, nestedKey);
+		if (!(conditionNumbers[nested + conditionFlagsOffset] & conditionResolvedFlag)) setConditionUnresolved(composed);
+		commitConditionCursor(styleState, composed);
+		resolvedCondition = composed;
+	}
+	const conf = styleState.conf;
+	if (key === "fontFamily" || key === conf.inverseShorthands.fontFamily) styleState.fontFamily = getFontFamilyFromNameOrVariable(value, conf);
+	mapContributedProp(styleState, key, value, originalValue ?? fallbackOriginal, resolvedCondition);
+	releaseConditionCursors(watermark);
+}
+const contributeMappedValue = (key, value, styleState, disabled, parentCondition, fallbackOriginal) => {
+	if (disabled) return emitMappedValue(styleState, key, value, void 0, void 0, parentCondition, fallbackOriginal);
+	const { conf, styleProps, staticConfig } = styleState;
+	const { variants } = staticConfig;
+	const { disableExpandShorthands, noExpand, resolveValues } = styleProps;
+	const shorthands = conf.shorthands;
+	if (!noExpand) {
+		if (variants && key in variants) {
+			resolveVariants(key, value, styleProps, styleState, key);
+			return;
+		}
+	}
+	if (!disableExpandShorthands) {
+		if (key in shorthands) key = shorthands[key];
+	}
+	const originalValue = value;
+	if (value === "safe" && (0, import_resolveSafeArea.isSafeAreaKey)(key)) {
+		const expanded = (0, import_resolveSafeArea.expandSafeAreaValue)(key);
+		if (expanded) {
+			for (let i = 0; i < expanded.length; i++) {
+				const [nkey, nvalue] = expanded[i];
+				emitMappedValue(styleState, nkey, nvalue, originalValue, void 0, parentCondition, fallbackOriginal);
+			}
+			return;
+		}
+	}
+	if (value != null) {
+		if (typeof value === "string") value = (0, import_resolveRem.isRemValue)(value) ? (0, import_resolveRem.resolveRem)(value) : value;
+		else if ((0, import_createVariable.isVariable)(value)) value = (0, import_resolveVariableValue.resolveVariableValue)(key, value, resolveValues);
+		else if ((0, import_resolveRem.isRemValue)(value)) value = (0, import_resolveRem.resolveRem)(value);
+	}
+	if (value != null) {
+		if (key === "fontFamily" && typeof originalValue === "string") {
+			if (originalValue in conf.fontsParsed) styleState.fontFamily = originalValue;
+		}
+		const expanded = noExpand || typeof value === "string" ? null : (0, import_expandStyle.expandStyle)(key, value, conf.settings.styleCompat || "web");
+		if (expanded) {
+			const max = expanded.length;
+			for (let i = 0; i < max; i++) {
+				const [nkey, nvalue, noriginalValue] = expanded[i];
+				emitMappedValue(styleState, nkey, nvalue, noriginalValue ?? originalValue, void 0, parentCondition, fallbackOriginal);
+			}
+		} else emitMappedValue(styleState, key, value, originalValue, void 0, parentCondition, fallbackOriginal);
+	}
 };
-function addStyleToInsertRules(rulesToInsert, styleObject) {
-	{
-		const identifier = styleObject[import_helpers.StyleObjectIdentifier];
-		if ((0, import_insertStyleRule.shouldInsertStyleRules)(identifier)) {
-			(0, import_insertStyleRule.updateRules)(identifier, styleObject[import_helpers.StyleObjectRules]);
-			rulesToInsert[identifier] = styleObject;
+function resolveVariants(key, value, styleProps, styleState, parentVariantKey) {
+	const variantDefinition = styleState.staticConfig.variants?.[key];
+	if (isConditionTransport(value)) {
+		if (value.hasBase) emitResolvedVariant(key, value.base, styleState, parentVariantKey, null);
+		for (let offset = 0; offset < value.entries.length;) {
+			const entryValue = value.entries[offset];
+			const watermark = conditionCursorTop;
+			try {
+				emitResolvedVariant(key, entryValue, styleState, parentVariantKey, acquireTransportCursor(styleState, value.entries, offset, null));
+			} finally {
+				releaseConditionCursors(watermark);
+			}
+			offset += transportEntryWidth;
+		}
+		return;
+	}
+	if (typeof value === "string" && !(variantDefinition && typeof variantDefinition === "object" && value in variantDefinition)) {
+		const directState = styleState;
+		const watermark = conditionCursorTop;
+		const previousCursor = directState.flatScanCursor;
+		directState.flatScanCursor = null;
+		try {
+			(0, import_runtime.scanFlatValue)(value, variantValueHandler, [
+				styleState,
+				key,
+				parentVariantKey
+			]);
+		} finally {
+			directState.flatScanCursor = previousCursor;
+			releaseConditionCursors(watermark);
+		}
+		return;
+	}
+	const isObjectValue = value && typeof value === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value);
+	const objectHasDefault = isObjectValue && Object.prototype.hasOwnProperty.call(value, "default");
+	const objectWatermark = conditionCursorTop;
+	try {
+		const firstCursor = isObjectValue && !objectHasDefault ? acquireConditionCursor() : null;
+		if (isObjectValue && classifyConditionalObject(value, styleState, void 0, firstCursor || void 0)) {
+			let useFirstCursor = firstCursor !== null;
+			for (const objKey in value) {
+				const payload = value[objKey];
+				if (payload == null) continue;
+				const directState = styleState;
+				const payloadString = String(payload);
+				if (objKey === "default") {
+					feedCompoundSegment(directState, payloadString, 0, payloadString.length, true, true, "");
+					emitResolvedVariant(key, payload, styleState, parentVariantKey, null);
+					continue;
+				}
+				const watermark = conditionCursorTop;
+				const cursor = useFirstCursor ? firstCursor : acquireConditionCursor();
+				let condition = conditionNumbers[cursor + conditionValueOffset];
+				if (useFirstCursor) useFirstCursor = false;
+				else {
+					resolveConditionText(styleState, cursor, objKey);
+					condition = commitConditionCursor(styleState, cursor);
+				}
+				if (directState.flatPass?.[passCompoundIndexes]) feedCompoundSegment(directState, payloadString, 0, payloadString.length, false, Boolean(condition), condition ? conditionTexts[cursor + conditionKeyOffset] || "" : "");
+				emitResolvedVariant(key, payload, styleState, parentVariantKey, cursor);
+				if (cursor !== firstCursor) releaseConditionCursors(watermark);
+			}
+			return;
 		}
+	} finally {
+		releaseConditionCursors(objectWatermark);
 	}
+	emitResolvedVariant(key, value, styleState, parentVariantKey, null);
 }
-const mergeTransform = (obj, key, val, backwards = false) => {
-	if (typeof obj.transform === "string") return;
-	obj.transform ||= [];
-	obj.transform[backwards ? "unshift" : "push"]({ [mapTransformKeys[key] || key]: val });
-};
-const mapTransformKeys = {
-	x: "translateX",
-	y: "translateY"
-};
-function passDownProp(viewProps, key, val) {
-	viewProps[key] = val;
+function emitResolvedVariant(key, value, styleState, parentVariantKey, conditionCursor) {
+	const { staticConfig, conf, debug } = styleState;
+	const styleProps = styleState.styleProps;
+	const { variants } = staticConfig;
+	if (!variants) return;
+	const variant = variants[key];
+	let variantValue = getVariantDefinition(variant, value, conf, styleState);
+	if (process.env.NODE_ENV === "development" && debug === "verbose") {
+		console.groupCollapsed(`\u2666\uFE0F\u2666\uFE0F\u2666\uFE0F resolve variant ${key}`);
+		console.info({
+			key,
+			value,
+			variantValue,
+			variants
+		});
+		console.groupEnd();
+	}
+	if (!variantValue) {
+		if (process.env.TAMAGUI_WARN_ON_MISSING_VARIANT === "1") {
+			if (typeof value !== "boolean") {
+				const name = styleState.styleProps.displayName || "[UnnamedComponent]";
+				console.warn(`No variant found: ${name} has variant "${key}", but no matching value "${value}"`);
+			}
+		}
+		return;
+	}
+	if (typeof variantValue === "function") {
+		const fn = variantValue;
+		const extras = (0, import_getVariantExtras.getVariantExtras)(styleState);
+		variantValue = fn(value, extras);
+		if (process.env.NODE_ENV === "development" && debug === "verbose" && true) {
+			console.groupCollapsed("   expanded functional variant", key);
+			console.info({
+				fn,
+				variantValue,
+				extras
+			});
+			console.groupEnd();
+		}
+	}
+	if (!(0, import_isObj2.isObj)(variantValue)) return;
+	if (process.env.NODE_ENV === "development" && debug === "verbose") console.info(`   expanding styles from `, variantValue);
+	const { noSkip } = styleProps;
+	const originals = import_styleOriginalValues.styleOriginalValues.get(variantValue);
+	const directState = styleState;
+	directState.flatCompoundOutputDepth = (directState.flatCompoundOutputDepth || 0) + 1;
+	try {
+		for (const outputKey in variantValue) {
+			if (!noSkip && outputKey in import_skipProps.skipProps) continue;
+			const rawOutputValue = variantValue[outputKey];
+			const outputValue = styleProps.noNormalize ? rawOutputValue : (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(rawOutputValue, conf.shorthands[outputKey] || outputKey);
+			const originalValue = originals?.[outputKey] ?? rawOutputValue;
+			if (getContextPropSet(staticConfig)?.has(outputKey)) {
+				styleState.overriddenContextProps ||= {};
+				styleState.overriddenContextProps[outputKey] = originalValue;
+				styleState.originalContextPropValues ||= {};
+				styleState.originalContextPropValues[outputKey] = originalValue;
+			}
+			contributeMappedValue(outputKey, outputValue, styleState, parentVariantKey === key && outputKey === key, conditionCursor || void 0, originalValue);
+		}
+	} finally {
+		directState.flatCompoundOutputDepth--;
+	}
 }
-function normalizeStyle(style) {
-	const out = {};
-	for (const key in style) {
-		const val = style[key];
-		if (key in import_helpers.stylePropsTransform) mergeTransform(out, key, val);
-		else out[key] = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(val, key);
+function getFontFamilyFromNameOrVariable(input, conf) {
+	if ((0, import_createVariable.isVariable)(input)) {
+		const val = variableToFontNameCache.get(input);
+		if (val) return val;
+		for (const key in conf.fontsParsed) {
+			const familyVariable = conf.fontsParsed[key].family;
+			if ((0, import_createVariable.isVariable)(familyVariable)) {
+				variableToFontNameCache.set(familyVariable, key);
+				if (familyVariable === input) return key;
+			}
+		}
+	} else if (typeof input === "string" && input in conf.fontsParsed) return input;
+}
+const variableToFontNameCache = /* @__PURE__ */ new WeakMap();
+function getVariantDefinition(variant, value, conf, { theme }) {
+	if (!variant) return;
+	if (value === void 0) return;
+	if (typeof variant === "function") return variant;
+	if (Object.prototype.hasOwnProperty.call(variant, value)) return variant[value];
+	for (const { key, parts } of getCompiledVariantResolvers(variant)) for (const part of parts) if (matchesVariantResolver(part, value, conf, theme)) return variant[key];
+}
+const variantResolverNameSet = new Set(import_types.variantResolverNames);
+const variantResolverCache = /* @__PURE__ */ new WeakMap();
+const preparedStyleStaticConfigs = /* @__PURE__ */ new WeakSet();
+function prepareStyleStaticConfig(staticConfig) {
+	if (preparedStyleStaticConfigs.has(staticConfig)) return staticConfig;
+	preparedStyleStaticConfigs.add(staticConfig);
+	getContextPropSet(staticConfig);
+	prepareStaticConfigCompounds(staticConfig);
+	const variants = staticConfig.variants;
+	if (variants) for (const key in variants) {
+		const variant = variants[key];
+		if (variant && typeof variant === "object") getCompiledVariantResolvers(variant);
+	}
+	return staticConfig;
+}
+function getCompiledVariantResolvers(variant) {
+	let cached = variantResolverCache.get(variant);
+	if (cached) return cached;
+	const compiled = [];
+	for (const key in variant) {
+		const parts = parseVariantResolverKey(key);
+		if (parts) compiled.push({
+			key,
+			parts
+		});
+	}
+	variantResolverCache.set(variant, compiled);
+	return compiled;
+}
+function parseVariantResolverKey(key) {
+	if (!key) return null;
+	const parts = [];
+	let start = 0;
+	for (let index = 0; index <= key.length; index++) {
+		if (index !== key.length && key.charCodeAt(index) !== 124) continue;
+		let partStart = start;
+		let partEnd = index;
+		while (partStart < partEnd && key.charCodeAt(partStart) <= 32) partStart++;
+		while (partEnd > partStart && key.charCodeAt(partEnd - 1) <= 32) partEnd--;
+		if (partStart === partEnd) return null;
+		const part = key.slice(partStart, partEnd);
+		if (!variantResolverNameSet.has(part)) return null;
+		parts.push(part);
+		start = index + 1;
+	}
+	return parts;
+}
+function hasNumericPrefix(value, suffixLength) {
+	if (value.length <= suffixLength) return false;
+	return Number.isFinite(Number(value.slice(0, value.length - suffixLength)));
+}
+function matchesVariantResolver(resolverName, value, conf, theme) {
+	const string = typeof value === "string";
+	const number = typeof value === "number";
+	const rem = string && value.endsWith("rem") && hasNumericPrefix(value, 3);
+	switch (resolverName) {
+		case "Size":
+		case "Space":
+		case "Radius":
+		case "ZIndex": return value === true || number || string || resolverName !== "Size" && (0, import_createVariable.isVariable)(value);
+		case "Color": return value != null && value in conf.tokensParsed.color || string;
+		case "Theme": return string && !!theme && value in theme;
+		case "FontSize": return value === true || !!conf.fontsParsed.body?.size?.[value] || number || rem;
+		case "FontStyle": return !!conf.fontsParsed.body?.style?.[value] || value === "normal" || value === "italic";
+		case "FontTransform": return !!conf.fontsParsed.body?.transform?.[value] || value === "none" || value === "capitalize" || value === "uppercase" || value === "lowercase";
+		case "FontLineHeight": return !!conf.fontsParsed.body?.lineHeight?.[value] || number || rem;
+		case "FontLetterSpacing": return !!conf.fontsParsed.body?.letterSpacing?.[value] || number || rem;
+		case "number":
+		case "string":
+		case "boolean": return typeof value === resolverName;
+		case "any": return true;
 	}
-	if (import_constants.isWeb && Array.isArray(out.transform)) out.transform = (0, import_transformsToString.transformsToString)(out.transform);
-	(0, import_expandStyles.fixStyles)(out);
-	return out;
 }