@tamagui/web 3.0.0-beta.831.1 → 3.0.0-beta.889.1

package/dist/cjs/helpers/getSplitStyles.native.js

@@ -4,8 +4,8 @@ var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target2, all) => {
-	for (var name in all) __defProp(target2, name, {
+var __export = (target, all) => {
+	for (var name in all) __defProp(target, name, {
 		get: all[name],
 		enumerable: true
 	});
@@ -19,22 +19,19 @@ var __copyProps = (to, from, except, desc) => {
 	}
 	return to;
 };
-var __reExport = (target2, mod, secondTarget) => (__copyProps(target2, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+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,
-	getDirectDynamicThemeAccess: () => getDirectDynamicThemeAccess,
+	emitVariantStyle: () => emitVariantStyle,
 	getFontFamilyFromNameOrVariable: () => getFontFamilyFromNameOrVariable,
 	getSplitStyles: () => getSplitStyles,
 	getStyleStaticConfig: () => import_styleStaticConfig.getStyleStaticConfig,
 	getStyleTokenProvenance: () => import_styleProvenance2.getStyleTokenProvenance,
 	isValidStyleKey: () => isValidStyleKey,
-	styleOriginalValues: () => import_styleOriginalValues.styleOriginalValues
+	styleOriginalValues: () => import_styleOriginalValues.styleOriginalValues,
+	walkConditionalValue: () => walkConditionalValue
 });
 module.exports = __toCommonJS(getSplitStyles_exports);
 var import_constants = require("@tamagui/constants");
@@ -42,347 +39,246 @@ var import_helpers = require("@tamagui/helpers");
 var import_runtime = require("@tamagui/style-grammar/runtime");
 var import_config = require("../config.native.js");
 var import_isDevTools = require("../constants/isDevTools.native.js");
+var import_defaultComponentState = require("../defaultComponentState.native.js");
 var import_createVariable = require("../createVariable.native.js");
-var import_directStyleCSS = require("./directStyleCSS.native.js");
+var import_types = require("../types.native.js");
+var import_getCSSStylesAtomic = require("./getCSSStylesAtomic.native.js");
 var import_expandStyle = require("./expandStyle.native.js");
+var import_borderComponents = require("./borderComponents.native.js");
 var import_expandStyles = require("./expandStyles.native.js");
 var import_grammarConfig = require("./grammarConfig.native.js");
 var import_mediaState = require("./mediaState.native.js");
 var import_styleStaticConfig = require("./styleStaticConfig.native.js");
-require("./styleToCSS.native.js");
-var import_variantResolvers = require("./variantResolvers.native.js");
+var import_nativeStyleEngine = require("./nativeStyleEngine.native.js");
 var import_warnOnce = require("./warnOnce.native.js");
-var import_directStyleCSS2 = require("./directStyleCSS.native.js");
 var import_getDynamicVal = require("./getDynamicVal.native.js");
-var import_getVariantExtras = require("./getVariantExtras.native.js");
-require("./insertStyleRule.native.js");
-var import_isObj = require("./isObj.native.js");
+var import_styledDynamic = require("./styledDynamic.native.js");
+var import_insertStyleRule = require("./insertStyleRule.native.js");
 var import_log = require("./log.native.js");
 var import_normalizeColor = require("./normalizeColor.native.js");
-var import_normalizeStyle = require("./normalizeStyle.native.js");
 var import_normalizeValueWithProperty = require("./normalizeValueWithProperty.native.js");
 var import_parseNativeStyle = require("./parseNativeStyle.native.js");
 var import_parseNativeTransform = require("./parseNativeTransform.native.js");
-var import_resolveRem = require("./resolveRem.native.js");
-var import_resolveSafeArea = require("./resolveSafeArea.native.js");
-var import_resolveSafeAreaVariable = require("./resolveSafeAreaVariable.native.js");
 var import_resolveVariableValue = require("./resolveVariableValue.native.js");
 var import_skipProps = require("./skipProps.native.js");
 var import_styleOriginalValues = require("./styleOriginalValues.native.js");
 var import_styleProvenance = require("./styleProvenance.native.js");
 var import_themeRef = require("./themeRef.native.js");
-var import_tokenCategories = require("./tokenCategories.native.js");
 var import_transformsToString = require("./transformsToString.native.js");
+var import_style = require("../style.native.js");
 var import_styleProvenance2 = require("./styleProvenance.native.js");
 __reExport(getSplitStyles_exports, require("./tokenCategories.native.js"), module.exports);
 function _type_of(obj) {
 	"@swc/helpers - typeof";
 	return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
 }
-var TAMAGUI_CLASS_PROPS = "$$tamaguiClassProps";
 var shouldTrackStyleTokenProvenance = process.env.NODE_ENV === "development" && process.env.TAMAGUI_ENABLE_STYLE_TOKEN_PROVENANCE === "1";
-var conditionWidth = 4;
-var conditionValueOffset = 0;
-var conditionFlagsOffset = 1;
-var conditionPrecedenceOffset = 2;
-var conditionWrapperOffset = 3;
-var conditionActiveFlag = 1;
-var conditionEmitFlag = 2;
-var conditionResolvedFlag = 4;
-var conditionEnterFlag = 8;
-var conditionExitFlag = 16;
+var conditionValue = 0;
+var conditionPlatform = 1;
+var conditionKey = 2;
+var conditionSelector = 3;
+var conditionTheme = 4;
+var conditionWrappers = 5;
+var conditionAtoms = 6;
+var conditionRanks = 7;
+var conditionResolvedFlag = 16;
 var conditionPlatformPseudoFlag = 32;
-var conditionInitialFlags = conditionActiveFlag | conditionEmitFlag | conditionResolvedFlag;
-var conditionTextWidth = 5;
-var conditionKeyOffset = 0;
-var conditionSelectorOffset = 1;
-var conditionThemeOffset = 2;
-var conditionUnsupportedStateOffset = 3;
-var conditionUnresolvedNameOffset = 4;
-var conditionNumbers = new Float64Array(2048);
-var conditionTexts = [];
-var conditionWrappers = [];
-var conditionWrapperTop = 0;
-var conditionCursorTop = conditionWidth;
-function reserveConditionCursor(cursor) {
-	var required = cursor + conditionWidth;
-	if (required > conditionTexts.length) {
-		var previous = conditionTexts.length;
-		conditionTexts.length = required;
-		conditionTexts.fill("", previous);
-	}
-	if (required <= conditionNumbers.length) return;
-	var length = conditionNumbers.length * 2;
-	while (length < required) length *= 2;
-	var previous1 = conditionNumbers;
-	conditionNumbers = new Float64Array(length);
-	conditionNumbers.set(previous1);
+function createCondition(parent) {
+	return parent ? [
+		parent[conditionValue] & 63,
+		parent[conditionPlatform],
+		"",
+		parent[conditionSelector],
+		parent[conditionTheme],
+		parent[conditionWrappers].slice(),
+		parent[conditionAtoms].slice(),
+		parent[conditionRanks].slice()
+	] : [
+		19,
+		0,
+		"",
+		"",
+		"",
+		[],
+		[],
+		[]
+	];
 }
-function setConditionUnresolved(cursor) {
+function setConditionUnresolved(condition) {
 	var name = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "";
-	conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionResolvedFlag;
-	if (name) {
-		var _conditionTexts, _text;
-		var text = cursor + conditionUnresolvedNameOffset;
-		(_conditionTexts = conditionTexts)[_text = text] || (_conditionTexts[_text] = name);
-	}
-}
-function appendConditionWrapper(cursor, wrapper) {
-	conditionWrappers[conditionWrapperTop++] = wrapper;
-	conditionNumbers[cursor + conditionWrapperOffset]++;
-}
-function copyConditionCursor(target2, source) {
-	for (var offset = 0; offset <= conditionPrecedenceOffset; offset++) conditionNumbers[target2 + offset] = conditionNumbers[source + offset];
-	for (var offset1 = 0; offset1 < conditionTextWidth; offset1++) conditionTexts[target2 + offset1] = conditionTexts[source + offset1] || "";
-	var wrapper = conditionNumbers[source + conditionWrapperOffset];
-	var wrapperStart = wrapper >> 3;
-	var wrapperCount = wrapper & 7;
-	for (var index = 0; index < wrapperCount; index++) conditionWrappers[conditionWrapperTop++] = conditionWrappers[wrapperStart + index];
-	conditionNumbers[target2 + 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() {
-	var parent = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0;
-	var 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) {
-	var keySlot = cursor + conditionKeyOffset;
-	var key = conditionTexts[keySlot];
-	if (!key) conditionTexts[keySlot] = name;
-	else {
-		var slotStart = 0;
-		var inserted = false;
-		while (slotStart <= key.length) {
-			var slotEnd = key.indexOf(":", slotStart);
-			if (slotEnd === -1) slotEnd = key.length;
-			var order = 0;
-			var compareLength = Math.min(name.length, slotEnd - slotStart);
-			for (var offset = 0; offset < compareLength; offset++) {
-				order = name.charCodeAt(offset) - key.charCodeAt(slotStart + offset);
-				if (order) break;
-			}
-			order || (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}`;
+	var _condition;
+	condition[conditionValue] &= ~conditionResolvedFlag;
+	if (process.env.NODE_ENV !== "production") (_condition = condition).problem || (_condition.problem = name);
+}
+function appendConditionWrapper(condition, wrapper) {
+	var wrappers = condition[conditionWrappers];
+	if (!wrappers.includes(wrapper)) wrappers.push(wrapper);
+}
+function resolveConditionModifier(state, condition, authored) {
+	var modifier = (0, import_grammarConfig.getConfigRevisionState)(state.conf).resolveCondition(authored);
+	if (!modifier) {
+		setConditionUnresolved(condition, authored);
+		return;
 	}
-	if (kind === import_runtime.modifierKindPlatform) {
-		var precedence = conditionNumbers[cursor + conditionPrecedenceOffset];
-		if (rank > precedence >>> 26) conditionNumbers[cursor + conditionPrecedenceOffset] = precedence & 67108863 | rank << 26;
-		if (!(0, import_constants.platformMatches)(name)) conditionNumbers[cursor + conditionFlagsOffset] &= ~(conditionActiveFlag | conditionEmitFlag);
+	var [name, kind, rank] = modifier;
+	var atoms = condition[conditionAtoms];
+	var atomIndex = 0;
+	while (atomIndex < atoms.length && atoms[atomIndex] < name) atomIndex++;
+	if (atoms[atomIndex] === name) return;
+	for (var index = atoms.length; index > atomIndex; index--) atoms[index] = atoms[index - 1];
+	atoms[atomIndex] = name;
+	if (kind === 3) {
+		condition[conditionPlatform] = Math.max(condition[conditionPlatform], rank);
+		if (!modifier[6]) condition[conditionValue] &= -4;
 		return;
 	}
-	var precedence1 = conditionNumbers[cursor + conditionPrecedenceOffset];
-	var depth = Math.min((precedence1 >> 23 & 7) + 1, 7);
-	var nextCategory = kind === import_runtime.modifierKindMedia ? 0 : kind === 6 ? 1 : kind === import_runtime.modifierKindTheme ? 2 : kind === 5 ? 3 : 4;
-	var categoryRank = precedence1 >> 20 & 7;
-	var withinRank = precedence1 & 1048575;
-	if (nextCategory > categoryRank) {
-		categoryRank = nextCategory;
-		withinRank = rank;
-	} else if (nextCategory === categoryRank && rank > withinRank) withinRank = rank;
-	precedence1 = precedence1 & -67108864 | depth << 23 | categoryRank << 20 | withinRank;
-	conditionNumbers[cursor + conditionPrecedenceOffset] = precedence1;
-	var buildCSS = import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses;
-	if (kind === import_runtime.modifierKindMedia) {
+	var precedence = kind === 2 ? 1 + Math.min(rank, 63) : kind === 6 ? 65 + Math.min(rank, 63) : kind === 4 ? 129 : kind === 5 ? 161 + rank : 225 + rank;
+	var ranks = condition[conditionRanks];
+	var rankIndex = 0;
+	while (rankIndex < ranks.length && ranks[rankIndex] >= precedence) rankIndex++;
+	for (var index1 = ranks.length; index1 > rankIndex; index1--) ranks[index1] = ranks[index1 - 1];
+	ranks[rankIndex] = precedence;
+	var buildCSS = import_getCSSStylesAtomic.canGenerateCSS && state.flatShouldDoClasses;
+	if (kind === 2) {
 		var _state_flatMediaState;
 		var _state;
-		var query = (0, import_grammarConfig.getConfigRevisionState)(state.conf).mediaQueries[name];
-		if (!query) {
-			setConditionUnresolved(cursor, name);
-			return;
-		}
-		if (buildCSS) appendConditionWrapper(cursor, `@media ${query}`);
-		if (!((_state_flatMediaState = state.flatMediaState) === null || _state_flatMediaState === void 0 ? void 0 : _state_flatMediaState[name])) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
+		var query = modifier[3];
+		if (!query) return setConditionUnresolved(condition, name);
+		if (buildCSS) appendConditionWrapper(condition, `@media ${query}`);
+		if (!((_state_flatMediaState = state.flatMediaState) === null || _state_flatMediaState === void 0 ? void 0 : _state_flatMediaState[name])) condition[conditionValue] &= -2;
 		((_state = state).flatMediaKeys || (_state.flatMediaKeys = /* @__PURE__ */ new Set())).add(name);
-	} else if (kind === import_runtime.modifierKindTheme) {
+		return;
+	}
+	if (kind === 4) {
 		var _state_flatThemeName;
-		conditionTexts[cursor + conditionThemeOffset] = name;
-		if (buildCSS) {
-			var selector = cursor + conditionSelectorOffset;
-			conditionTexts[selector] += `:where(.t_${name}, .t_${name} *)`;
-		}
-		if (state.flatThemeName !== name && ((_state_flatThemeName = state.flatThemeName) === null || _state_flatThemeName === void 0 ? void 0 : _state_flatThemeName.startsWith(`${name}_`)) !== true) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
-	} else if (kind === 5) {
-		var _state_componentState_group, _state_flatGroupContext, _this;
-		var _state1;
-		var slash = name.indexOf("/");
-		var groupName = slash === -1 ? "true" : name.slice(slash + 1);
-		var stateSelector = import_runtime.stateModifierSelectors[rank];
-		var conditionStateName = import_runtime.canonicalStateModifierNames[rank];
+		condition[conditionTheme] = name;
+		if (buildCSS) condition[conditionSelector] += `:where(.t_${name}, .t_${name} *)`;
+		if (state.flatThemeName !== name && ((_state_flatThemeName = state.flatThemeName) === null || _state_flatThemeName === void 0 ? void 0 : _state_flatThemeName.startsWith(`${name}_`)) !== true) condition[conditionValue] &= -2;
+		return;
+	}
+	if (kind === 6) {
+		var _state_componentState_group, _state_flatGroupContext, _state_flatGroupContext1, _component_media;
+		var _state1, _state2;
+		var size = modifier[4];
+		var containerName = modifier[5];
+		var groupName = `@${containerName}`;
 		if (buildCSS) {
-			var selector1 = cursor + conditionSelectorOffset;
-			conditionTexts[selector1] += `:where(.t_group_${groupName}${stateSelector} *)`;
-			if (rank === 0) appendConditionWrapper(cursor, "@media (hover: hover)");
+			var query1 = modifier[3];
+			appendConditionWrapper(condition, containerName ? `@container ${containerName} ${query1}` : `@container ${query1}`);
 		}
 		var component = (_state_componentState_group = state.componentState.group) === null || _state_componentState_group === void 0 ? void 0 : _state_componentState_group[groupName];
 		var context = (_state_flatGroupContext = state.flatGroupContext) === null || _state_flatGroupContext === void 0 ? void 0 : _state_flatGroupContext[groupName];
-		var _component_pseudo;
-		if (!((_this = (_component_pseudo = component === null || component === void 0 ? void 0 : component.pseudo) !== null && _component_pseudo !== void 0 ? _component_pseudo : context === null || context === void 0 ? void 0 : context.state.pseudo) === null || _this === void 0 ? void 0 : _this[conditionStateName])) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
+		if (process.env.NODE_ENV === "development" && containerName && !component && !context && ((_state_flatGroupContext1 = state.flatGroupContext) === null || _state_flatGroupContext1 === void 0 ? void 0 : _state_flatGroupContext1[containerName])) (0, import_warnOnce.warnOnce)(`group-container:${containerName}`, `@${size}/${containerName}: targets group="${containerName}", but groups no longer establish query containers. Add container="${containerName}" to that group.`);
+		var match = component === null || component === void 0 ? void 0 : (_component_media = component.media) === null || _component_media === void 0 ? void 0 : _component_media[size];
+		if (!(match !== null && match !== void 0 ? match : (context === null || context === void 0 ? void 0 : context.state.layout) && (0, import_mediaState.mediaKeyMatch)(size, context.state.layout))) condition[conditionValue] &= -2;
 		((_state1 = state).flatGroupKeys || (_state1.flatGroupKeys = /* @__PURE__ */ new Set())).add(groupName);
-	} else if (kind === 6) {
-		var _state_componentState_group1, _state_flatGroupContext1, _state_flatGroupContext2, _component_media;
-		var _state2, _state3;
-		var slash1 = name.indexOf("/");
-		var containerSize = name.slice(1, slash1 === -1 ? name.length : slash1);
-		var containerName = slash1 === -1 ? "" : name.slice(slash1 + 1);
-		var containerQuery = (0, import_grammarConfig.getConfigRevisionState)(state.conf).mediaQueries[containerSize];
-		var groupKey = `@${containerName}`;
-		if (buildCSS) appendConditionWrapper(cursor, containerName ? `@container ${containerName} ${containerQuery}` : `@container ${containerQuery}`);
-		var component1 = (_state_componentState_group1 = state.componentState.group) === null || _state_componentState_group1 === void 0 ? void 0 : _state_componentState_group1[groupKey];
-		var context1 = (_state_flatGroupContext1 = state.flatGroupContext) === null || _state_flatGroupContext1 === void 0 ? void 0 : _state_flatGroupContext1[groupKey];
-		if (process.env.NODE_ENV === "development" && containerName && !component1 && !context1 && ((_state_flatGroupContext2 = state.flatGroupContext) === null || _state_flatGroupContext2 === void 0 ? void 0 : _state_flatGroupContext2[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.`);
-		var match = component1 === null || component1 === void 0 ? void 0 : (_component_media = component1.media) === null || _component_media === void 0 ? void 0 : _component_media[containerSize];
-		if (!(match === void 0 ? (context1 === null || context1 === void 0 ? void 0 : context1.state.layout) && (0, import_mediaState.mediaKeyMatch)(containerSize, context1.state.layout) : match)) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
-		((_state2 = state).flatGroupKeys || (_state2.flatGroupKeys = /* @__PURE__ */ new Set())).add(groupKey);
-		((_state3 = state).flatGroupMedia || (_state3.flatGroupMedia = /* @__PURE__ */ new Set())).add(containerSize);
-	} else {
-		var stateSelector1 = import_runtime.stateModifierSelectors[rank];
-		conditionNumbers[cursor + conditionFlagsOffset] += 64;
-		if (stateSelector1[0] === "[" && name !== "disabled") conditionTexts[cursor + conditionUnsupportedStateOffset] = name;
-		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) {
-			var selector2 = cursor + conditionSelectorOffset;
-			if (stateSelector1[0] === ".") conditionTexts[selector2] += `:is(${stateSelector1}, ${stateSelector1} *)`;
-			else conditionTexts[selector2] += stateSelector1;
-			if (rank === 0) appendConditionWrapper(cursor, "@media (hover: hover)");
-		}
-		var component2 = state.componentState;
-		if (!(rank === 0 ? !!component2.hover : rank === 4 ? !!(component2.press || component2.pressIn) : rank === 2 ? !!component2.focus : rank === 3 ? !!component2.focusVisible : rank === 1 ? !!component2.focusWithin : rank === 5 ? !!(component2.disabled || state.props.disabled) : rank === 6 ? !!component2.unmounted : rank === 7 ? !!state.styleProps.isExiting : false)) conditionNumbers[cursor + conditionFlagsOffset] &= ~conditionActiveFlag;
-		if (stateSelector1[0] === ":") {
-			var _state4;
-			((_state4 = state).flatStateKeys || (_state4.flatStateKeys = /* @__PURE__ */ new Set())).add(name);
-		}
-	}
-}
-function resolveConditionModifier(state, cursor, modifier) {
-	var compiled = (0, import_grammarConfig.getConfigRevisionState)(state.conf);
-	var code = compiled.modifiers[modifier];
-	var kind = code & 7;
-	var rank = code >> 3;
-	if (kind === import_runtime.modifierKindState) {
-		accumulateConditionAtom(state, cursor, kind, rank, import_runtime.canonicalStateModifierNames[rank]);
+		((_state2 = state).flatGroupMedia || (_state2.flatGroupMedia = /* @__PURE__ */ new Set())).add(size);
 		return;
 	}
-	if (!kind && modifier.startsWith("group-")) {
-		var slash = modifier.indexOf("/");
-		var authoredState = modifier.slice(6, slash === -1 ? void 0 : slash);
-		code = compiled.modifiers[authoredState];
-		if ((code & 7) === import_runtime.modifierKindState) {
-			rank = code >> 3;
-			var groupName = slash === -1 ? "true" : modifier.slice(slash + 1);
-			if (rank !== 6 && rank !== 7 && (slash === -1 || (0, import_runtime.isModifierName)(groupName, 0, groupName.length))) {
-				var 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) {
-		var slash1 = modifier.indexOf("/");
-		var containerSize = modifier.slice(1, slash1 === -1 ? void 0 : slash1);
-		var containerName = slash1 === -1 ? "" : modifier.slice(slash1 + 1);
-		var containerQuery = "";
-		if ((0, import_runtime.isModifierName)(containerSize, 0, containerSize.length) && (slash1 === -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;
+	var selector = modifier[3];
+	if (kind === 5) {
+		var _state_componentState_group1, _state_flatGroupContext2, _this;
+		var _state3;
+		var groupName1 = modifier[4];
+		if (buildCSS) condition[conditionSelector] += `:where(.t_group_${groupName1}${selector} *)`;
+		var component1 = (_state_componentState_group1 = state.componentState.group) === null || _state_componentState_group1 === void 0 ? void 0 : _state_componentState_group1[groupName1];
+		var context1 = (_state_flatGroupContext2 = state.flatGroupContext) === null || _state_flatGroupContext2 === void 0 ? void 0 : _state_flatGroupContext2[groupName1];
+		var _component_pseudo;
+		if (!((_this = (_component_pseudo = component1 === null || component1 === void 0 ? void 0 : component1.pseudo) !== null && _component_pseudo !== void 0 ? _component_pseudo : context1 === null || context1 === void 0 ? void 0 : context1.state.pseudo) === null || _this === void 0 ? void 0 : _this[modifier[5]])) condition[conditionValue] &= -2;
+		((_state3 = state).flatGroupKeys || (_state3.flatGroupKeys = /* @__PURE__ */ new Set())).add(groupName1);
+	} else {
+		var _state4;
+		if (rank === 0 || rank === 2 || rank === 4) condition[conditionValue] |= conditionPlatformPseudoFlag;
+		else if (rank === 6) condition[conditionValue] |= 4;
+		else if (rank === 7) condition[conditionValue] |= 8;
+		if (buildCSS) condition[conditionSelector] += `:where(${selector}${selector[0] === "." ? `, ${selector} *` : ""})`;
+		var component2 = state.componentState;
+		if (!(rank === 1 ? component2.focusWithin : rank === 3 ? component2.focusVisible : rank === 4 ? component2.press || component2.pressIn : rank === 5 ? component2.disabled || state.props.disabled : rank === 6 ? component2.unmounted : rank === 7 ? state.styleProps.isExiting : component2[name])) condition[conditionValue] &= -2;
+		if (selector[0] === ":") ((_state4 = state).flatStateKeys || (_state4.flatStateKeys = /* @__PURE__ */ new Set())).add(name);
 	}
-	setConditionUnresolved(cursor, modifier);
+	if (rank === 0 && buildCSS) appendConditionWrapper(condition, "@media (hover: hover)");
 }
-function resolveConditionText(state, cursor, text) {
+function resolveConditionText(state, condition, text) {
 	var start = 0;
 	for (var index = 0; index <= text.length; index++) {
 		if (index !== text.length && text.charCodeAt(index) !== 58) continue;
 		if (index === start) {
-			setConditionUnresolved(cursor);
+			setConditionUnresolved(condition);
 			return;
 		}
-		if (!(conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag)) return;
-		resolveConditionModifier(state, cursor, text.slice(start, index));
+		if (!(condition[conditionValue] & conditionResolvedFlag)) return;
+		resolveConditionModifier(state, condition, text.slice(start, index));
 		start = index + 1;
 	}
 }
-function commitConditionCursor(state, cursor) {
-	if (!(conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag)) {
-		conditionNumbers[cursor + conditionValueOffset] = 0;
+function commitCondition(condition) {
+	if (!(condition[conditionValue] & conditionResolvedFlag)) {
+		condition[conditionValue] = 0;
 		return 0;
 	}
-	var key = conditionTexts[cursor + conditionKeyOffset] || "";
-	var precedence = conditionNumbers[cursor + conditionPrecedenceOffset];
-	var 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}:"`);
-	var flags = conditionNumbers[cursor + conditionFlagsOffset];
-	var 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) {
-	var cursor = acquireConditionCursor();
-	if (key) {
-		resolveConditionText(state, cursor, key);
-		commitConditionCursor(state, cursor);
+	condition[conditionKey] = condition[conditionAtoms].join(":");
+	var ranks = condition[conditionRanks];
+	var depth = ranks.length;
+	if (depth > 5) {
+		if (process.env.NODE_ENV !== "production") throw new Error(`a flat value clause supports at most 5 non-platform conditions; received ${depth} in "${condition[conditionKey]}:"`);
+		return 0;
 	}
-	return cursor;
+	var precedence = condition[conditionPlatform] * 6 + depth;
+	for (var index = 0; index < 5; index++) precedence = precedence * 256 + (ranks[index] || 0);
+	var value = precedence * 256 + condition[conditionValue];
+	condition[conditionValue] = value;
+	return value;
+}
+function conditionFromKey(state, key, parent) {
+	if (!key) return createCondition(parent);
+	if (!parent) {
+		var direct = state;
+		var cache = direct.flatConditions;
+		if (cache === void 0 || direct.flatConditionsClassed !== state.flatShouldDoClasses) {
+			cache = direct.flatConditions = /* @__PURE__ */ new Map();
+			direct.flatConditionsClassed = state.flatShouldDoClasses;
+		}
+		var known = cache.get(key);
+		if (known !== void 0) return known;
+		var resolved = createCondition(null);
+		resolveConditionText(state, resolved, key);
+		commitCondition(resolved);
+		cache.set(key, resolved);
+		return resolved;
+	}
+	var condition = createCondition(parent);
+	resolveConditionText(state, condition, key);
+	commitCondition(condition);
+	return condition;
 }
-function classifyConditionalObject(value, state, isChain, firstCursor) {
+function classifyConditionalObject(value, state, isChain, firstCondition) {
 	if ("default" in value) return -1;
 	for (var key in value) {
 		if (!key.length) return 0;
 		if (!state) return (isChain === null || isChain === void 0 ? void 0 : isChain(key)) ? 1 : 0;
-		var watermark = conditionCursorTop;
-		var cursor = firstCursor || acquireConditionCursor();
-		try {
-			resolveConditionText(state, cursor, key);
-			return commitConditionCursor(state, cursor);
-		} finally {
-			if (!firstCursor) releaseConditionCursors(watermark);
-		}
+		var condition = firstCondition || createCondition();
+		resolveConditionText(state, condition, key);
+		return commitCondition(condition);
 	}
 	return 0;
 }
-var passStyleState = 0;
-var passClassName = 21;
-var passShouldDoClasses = 22;
-var passFrontendGroup = 26;
-var passFrontendContainer = 27;
-var passFrontendContainerType = 28;
-var passHocMappedProperties = 29;
-var passHocMappedClasses = 30;
-var passParentCursor = 35;
-var passMapSourceKey = 36;
-var passMapFlags = 37;
+var passClassName = 20;
+var passShouldDoClasses = 21;
+var passContainerValue = 22;
+var passContainerName = 23;
+var passContainerType = 24;
+var passFrontendGroup = 25;
+var passFrontendContainer = 26;
+var passFrontendContainerType = 27;
+var passSourceLayer = 28;
+var passParentCursor = 29;
+var passMapSourceKey = 30;
+var passFlags = 13;
+var sourceLayerBase = 0;
+var sourceLayerVariant = 1;
+var sourceLayerResolver = 2;
+var sourceLayerProps = 3;
+var sourceLayerStyle = 4;
 var passNoSkipFlag = 1;
 var passDisableShorthandsFlag = 2;
 var passNoExpandFlag = 4;
@@ -391,357 +287,269 @@ var passHocFlag = 16;
 var passTextFlag = 32;
 var passInputFlag = 64;
 var passAsChildStyleFlag = 128;
-function forEachPropInForwardOrder(pass) {
-	var styleState = pass[passStyleState];
-	var processedProps = styleState.props;
-	var styleStaticConfig = styleState.flatStyleStaticConfig;
-	var baseStyle = styleStaticConfig.baseStyle;
-	var baseVariantProps = styleStaticConfig.baseVariantProps;
-	var conditionWrapperBase = conditionWrapperTop;
-	try {
-		var appliesBaseStyle = baseStyle && !processedProps.asChild;
-		if (appliesBaseStyle) for (var key in baseStyle) contributeProp(pass, key, baseVariantProps && Object.hasOwn(baseVariantProps, key) && Object.hasOwn(processedProps, key) ? processedProps[key] : baseStyle[key]);
-		for (var key1 in processedProps) {
-			if (appliesBaseStyle && baseVariantProps && Object.hasOwn(baseVariantProps, key1)) continue;
-			contributeProp(pass, key1, processedProps[key1]);
-		}
-	} catch (error) {
-		releaseConditionPayloads(conditionWrapperBase);
-		throw error;
-	}
-}
-function isValidStyleKey(key, validStyles, accept) {
-	return Boolean(key in validStyles || accept && key in accept);
-}
-function flushForwardStylesToClasses(pass) {
-	var styleState = pass[passStyleState];
-	if (!pass[passShouldDoClasses]) return;
-	(0, import_directStyleCSS.completeStreamingCSS)(styleState);
-	(0, import_directStyleCSS.flushDirectStyles)(styleState, true);
+function isValidStyleKey(key, validStyles) {
+	return key in validStyles;
 }
 function effectiveLifecycleKeys(keys) {
 	if (!keys) return;
 	var out = /* @__PURE__ */ new Set();
-	var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
+	var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
 	try {
-		for (var _iterator2 = keys[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-			var key = _step2.value;
+		for (var _iterator = keys[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+			var key = _step.value;
 			out.add(key === "--t-x" || key === "--t-y" ? "translate" : key === "--t-scale-x" || key === "--t-scale-y" ? "scale" : key);
 		}
 	} catch (err) {
-		_didIteratorError2 = true;
-		_iteratorError2 = err;
+		_didIteratorError = true;
+		_iteratorError = err;
 	} finally {
 		try {
-			if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
+			if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
 		} finally {
-			if (_didIteratorError2) throw _iteratorError2;
+			if (_didIteratorError) throw _iteratorError;
 		}
 	}
 	return out;
 }
-function mapContributedProp(styleState, key, val, originalVal, condition) {
-	var pass = styleState.flatPass;
-	var keyInit = pass[passMapSourceKey];
-	var disablePropMap = Boolean(pass[passMapFlags]);
-	var [, conf, props, viewProps, , validStyles, accept, , variants, inlineProps, parentVariants, , styledContext, styledContextKeys, flags, debug] = pass;
+function contributeProp(pass, keyOg, valOg) {
+	var originalOg = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : valOg, disabled = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : false;
+	var [styleState, conf, props, viewProps, , validStyles, neverSkipProps, variants, inlineProps, parentVariants, styleFrontend, styledContext, styledContextKeys, flags, debug, , defaultProps, driverAnimations, driverOutputStyle, elementType] = pass;
+	var noSkip = Boolean(flags & passNoSkipFlag);
+	var disableExpandShorthands = Boolean(flags & passDisableShorthandsFlag);
+	var noExpand = Boolean(flags & passNoExpandFlag);
+	var noMergeStyle = Boolean(flags & passNoMergeFlag);
 	var isHOC = Boolean(flags & passHocFlag);
+	var isText = Boolean(flags & passTextFlag);
+	var isInput = Boolean(flags & passInputFlag);
+	var shorthands = conf.shorthands;
+	var shouldSkipDirectProps = !noSkip && !isHOC;
+	var shouldCheckSkipProps = !noSkip;
+	var asChildExceptStyleLike = Boolean(flags & passAsChildStyleFlag);
+	var isTextOrInput = isText || isInput;
 	var hocParentVariants = isHOC ? parentVariants : void 0;
-	var canResolveContextPrograms = !isHOC;
-	var isStyledContextProp = (styledContextKeys === null || styledContextKeys === void 0 ? void 0 : styledContextKeys.has(key)) || styledContext && key in styledContext;
-	if (key === "className") 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;
-	}
-	var isHostStyleKey = isValidStyleKey(key, validStyles, accept) || import_constants.isAndroid && key === "elevation";
-	var isContextProgramKey = canResolveContextPrograms && Boolean(isStyledContextProp);
-	if (condition !== void 0) {
-		var conditionCursor = condition;
-		if (isHostStyleKey || isContextProgramKey) contributeValue(styleState, key, val, mergeStyle, originalVal, !isHostStyleKey, conditionCursor);
-		else if (isHOC) {
-			var 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;
-	}
-	var isVariant = Boolean(variants && key in variants);
-	if (inlineProps === null || inlineProps === void 0 ? void 0 : inlineProps.has(key)) {
-		var _props_key;
-		viewProps[key] = (_props_key = props[key]) !== null && _props_key !== void 0 ? _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)({
-				val,
-				after: { ...viewProps[key] }
-			});
-			console.groupEnd();
-		}
+	var keyInit = keyOg;
+	var valInit = valOg;
+	if (keyInit === "children") {
+		viewProps[keyInit] = valInit;
 		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;
+	if (keyInit === "ref") return;
+	if (keyInit[0] === "d" && keyInit.startsWith("data-")) return;
+	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`before-prop-${keyInit}`;
+	if (process.env.NODE_ENV === "test" && keyInit === "jestAnimatedStyle") return;
+	if (!disableExpandShorthands) {
+		if (keyInit in shorthands) keyInit = shorthands[keyInit];
 	}
-}
-function contributeProp(pass, keyOg, valOg, parentConditionKey) {
-	var parentWatermark = conditionCursorTop;
-	if (parentConditionKey) pass[passParentCursor] = acquireConditionKeyCursor(pass[passStyleState], parentConditionKey);
-	try {
-		var [styleState, conf, props, viewProps, staticConfig, validStyles, accept, neverSkipProps, variants, inlineProps, parentVariants, styleFrontend, styledContext, styledContextKeys, flags, debug, parentStaticConfig, defaultProps, driverAnimations, driverOutputStyle, elementType] = pass;
-		var noSkip = Boolean(flags & passNoSkipFlag);
-		var disableExpandShorthands = Boolean(flags & passDisableShorthandsFlag);
-		var noExpand = Boolean(flags & passNoExpandFlag);
-		var noMergeStyle = Boolean(flags & passNoMergeFlag);
-		var isHOC = Boolean(flags & passHocFlag);
-		var isText = Boolean(flags & passTextFlag);
-		var isInput = Boolean(flags & passInputFlag);
-		var shorthands = conf.shorthands;
-		var shouldSkipDirectProps = !noSkip && !isHOC;
-		var shouldCheckSkipProps = !noSkip;
-		var asChildExceptStyleLike = Boolean(flags & passAsChildStyleFlag);
-		var isTextOrInput = isText || isInput;
-		var hocParentVariants = isHOC ? parentVariants : void 0;
-		var keyInit = keyOg;
-		var valInit = valOg;
-		if (keyInit === "children") {
-			viewProps[keyInit] = valInit;
-			return;
-		}
-		if (keyInit === "ref") return;
-		if (keyInit[0] === "d" && keyInit.startsWith("data-")) return;
-		if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`before-prop-${keyInit}`;
-		if (process.env.NODE_ENV === "test" && keyInit === "jestAnimatedStyle") return;
-		if (accept) {
-			var accepted = accept[keyInit];
-			if ((accepted === "style" || accepted === "textStyle") && valInit && (typeof valInit === "undefined" ? "undefined" : _type_of(valInit)) === "object") {
-				viewProps[keyInit] = resolveAcceptedStyle(styleState, valInit);
+	if (keyInit === "className") {
+		if (pass[passParentCursor]) return;
+		if (typeof valInit === "string" && valInit && (styleFrontend === null || styleFrontend === void 0 ? void 0 : styleFrontend.resolveClassName)) {
+			if (noMergeStyle) {
+				viewProps.className = valInit;
 				return;
 			}
-		}
-		if (!disableExpandShorthands) {
-			if (keyInit in shorthands) keyInit = shorthands[keyInit];
-		}
-		if (keyInit === "className") {
-			if (typeof valInit === "string" && valInit && (styleFrontend === null || styleFrontend === void 0 ? void 0 : styleFrontend.getClassPlan)) {
-				if (noMergeStyle) {
-					viewProps.className = valInit;
-					return;
+			var resolveClassName = styleFrontend === null || styleFrontend === void 0 ? void 0 : styleFrontend.resolveClassName;
+			var sink = function(entry) {
+				var property2 = entry[0];
+				if (entry[2] !== void 0) {
+					if (isValidStyleKey(property2, validStyles)) contributeValue(styleState, property2, entry[1], void 0, false, entry[2]);
+					else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${property2}" is not a valid style on this component; the frontend value is dropped.`);
+				} else {
+					if (property2 === "group") pass[passFrontendGroup] = entry[1];
+					else if (property2 === "container") pass[passFrontendContainer] = entry[1];
+					else if (property2 === "containerType") pass[passFrontendContainerType] = entry[1];
+					contributeProp(pass, property2, entry[1]);
 				}
-				var hocClassNames = props[import_skipProps.HOC_CLASSNAME_MARKER];
-				if (hocClassNames && (typeof hocClassNames === "undefined" ? "undefined" : _type_of(hocClassNames)) === "object") {
-					flushForwardStylesToClasses(pass);
-					for (var property in hocClassNames) {
-						var _pass, _passHocMappedProperties, _pass1, _passHocMappedClasses;
-						var generatedClass = hocClassNames[property];
-						if (typeof generatedClass !== "string") continue;
-						clearDirectStyle(styleState, property);
-						styleState.classNames[property] = generatedClass;
-						((_pass = pass)[_passHocMappedProperties = passHocMappedProperties] || (_pass[_passHocMappedProperties] = /* @__PURE__ */ new Set())).add(property);
-						((_pass1 = pass)[_passHocMappedClasses = passHocMappedClasses] || (_pass1[_passHocMappedClasses] = /* @__PURE__ */ new Set())).add(generatedClass);
-					}
+			};
+			var start = 0;
+			for (var index = 0; index <= valInit.length; index++) {
+				if (index !== valInit.length && valInit.charCodeAt(index) > 32) continue;
+				if (index === start) {
+					start = index + 1;
+					continue;
 				}
-				var getClassPlan = styleFrontend === null || styleFrontend === void 0 ? void 0 : styleFrontend.getClassPlan;
-				var start = 0;
-				for (var index = 0; index <= valInit.length; index++) {
-					var _pass_passHocMappedClasses;
-					if (index !== valInit.length && valInit.charCodeAt(index) > 32) continue;
-					if (index === start) {
-						start = index + 1;
-						continue;
-					}
-					var candidate = valInit.slice(start, index);
-					if ((_pass_passHocMappedClasses = pass[passHocMappedClasses]) === null || _pass_passHocMappedClasses === void 0 ? void 0 : _pass_passHocMappedClasses.has(candidate)) {
-						start = index + 1;
-						continue;
-					}
-					var 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 {
-						var parentPlan = plan;
-						if (!Array.isArray(plan) && parentPlan.preserveRawClass) {
-							pass[passClassName] = pass[passClassName] ? `${pass[passClassName]} ${candidate}` : candidate;
-							flushForwardStylesToClasses(pass);
-							pass[passShouldDoClasses] = false;
-							styleState.flatShouldDoClasses = false;
-						}
-						var entries = Array.isArray(plan) ? plan : parentPlan.entries;
-						for (var entryIndex = 0; entryIndex < entries.length; entryIndex++) {
-							var 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]);
-							}
+				var candidate = valInit.slice(start, index);
+				var preserveRaw = resolveClassName ? resolveClassName(candidate, conf, sink) : true;
+				if (preserveRaw === 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 (preserveRaw) {
+					pass[passClassName] = pass[passClassName] ? `${pass[passClassName]} ${candidate}` : candidate;
+					if (resolveClassName) {
+						if (pass[passShouldDoClasses]) {
+							completeResolvedStyles(styleState);
+							(0, import_getCSSStylesAtomic.flushDirectStyles)(styleState, true);
 						}
+						pass[passShouldDoClasses] = false;
+						styleState.flatShouldDoClasses = false;
 					}
-					start = index + 1;
-				}
-				if (props[import_skipProps.HOC_CLASSNAME_MARKER] !== void 0) {
-					flushForwardStylesToClasses(pass);
-					pass[passShouldDoClasses] = false;
-					styleState.flatShouldDoClasses = false;
 				}
+				start = index + 1;
 			}
-			return;
 		}
-		if (keyInit === "style") {
-			if (!valInit) return;
-			if (noMergeStyle) {
-				viewProps.style = valInit;
-				return;
-			}
-			var isArray = Array.isArray(valInit);
-			var length = isArray ? valInit.length : 1;
-			for (var index1 = 0; index1 < length; index1++) {
-				var style = isArray ? valInit[index1] : valInit;
-				if (!style) continue;
-				var hocClassNames1 = style[TAMAGUI_CLASS_PROPS];
-				if (hocClassNames1) {
-					for (var property1 in hocClassNames1) {
-						var _pass2, _passHocMappedProperties1;
-						clearDirectStyle(styleState, property1);
-						styleState.classNames[property1] = hocClassNames1[property1];
-						((_pass2 = pass)[_passHocMappedProperties1 = passHocMappedProperties] || (_pass2[_passHocMappedProperties1] = /* @__PURE__ */ new Set())).add(property1);
-					}
-					continue;
-				}
-				var normalized = (0, import_normalizeStyle.normalizeStyle)(style, false, true);
-				var styleOriginals = shouldTrackStyleTokenProvenance ? import_styleOriginalValues.styleOriginalValues.get(style) : void 0;
-				for (var key in normalized) {
-					var _pass_passHocMappedProperties;
-					if (normalized[key] == null) continue;
-					if ((_pass_passHocMappedProperties = pass[passHocMappedProperties]) === null || _pass_passHocMappedProperties === void 0 ? void 0 : _pass_passHocMappedProperties.delete(key)) clearDirectStyle(styleState, key);
-					contributeValue(styleState, key, normalized[key], mergeStyle, styleOriginals === null || styleOriginals === void 0 ? void 0 : styleOriginals[key]);
-				}
+		return;
+	}
+	if (keyInit === import_skipProps.HOC_CLASSNAME_MARKER) {
+		if (valInit && (typeof valInit === "undefined" ? "undefined" : _type_of(valInit)) === "object") {
+			var _direct;
+			var layers = (_direct = styleState).flatPropertyLayers || (_direct.flatPropertyLayers = /* @__PURE__ */ new Map());
+			for (var property in valInit) {
+				clearDirectStyle(styleState, property);
+				styleState.classNames[property] = valInit[property];
+				layers.set(property, pass[passSourceLayer]);
 			}
-			return;
 		}
-		if (defaultProps) {
-			var _defaultProps_keyOg;
-			var defaultVal = (_defaultProps_keyOg = defaultProps[keyOg]) !== null && _defaultProps_keyOg !== void 0 ? _defaultProps_keyOg : defaultProps[keyInit];
-			if (defaultVal !== void 0 && valInit === defaultVal) return;
+		return;
+	}
+	if (keyInit === "style") {
+		if (!valInit) return;
+		if (noMergeStyle) {
+			viewProps.style = valInit;
+			return;
 		}
-		if (keyInit in import_skipProps.skipProps && shouldSkipDirectProps && !(neverSkipProps === null || neverSkipProps === void 0 ? void 0 : neverSkipProps[keyInit])) if (keyInit === "transition" && typeof valInit === "string") return;
-		else return;
-		var isValidStyleKeyInit = isValidStyleKey(keyInit, validStyles, accept);
-		if (!isValidStyleKeyInit) {
-			if (!import_constants.isAndroid) {
-				if (keyInit === "elevationAndroid") return;
-			}
-			if (keyInit === "userSelect") {
-				keyInit = "selectable";
-				valInit = valInit !== "none";
-			} else if (keyInit === "textOverflow") {
-				if (isText && valInit === "ellipsis") {
-					var _viewProps, _viewProps1;
-					var _numberOfLines;
-					(_numberOfLines = (_viewProps = viewProps).numberOfLines) !== null && _numberOfLines !== void 0 || (_viewProps.numberOfLines = 1);
-					var _ellipsizeMode;
-					(_ellipsizeMode = (_viewProps1 = viewProps).ellipsizeMode) !== null && _ellipsizeMode !== void 0 || (_viewProps1.ellipsizeMode = "tail");
+		var layerBeforeStyle = pass[passSourceLayer];
+		pass[passSourceLayer] = sourceLayerStyle;
+		var isArray = Array.isArray(valInit);
+		var length = isArray ? valInit.length : 1;
+		for (var index1 = 0; index1 < length; index1++) {
+			var style = isArray ? valInit[index1] : valInit;
+			if (!style) continue;
+			if ((0, import_style.isStylePiece)(style)) {
+				var resolvedPiece = resolveStylePiece(styleState, style);
+				var pieceOriginals = shouldTrackStyleTokenProvenance ? import_styleOriginalValues.styleOriginalValues.get(style[import_types.stylePieceSymbol].styleObject) : void 0;
+				for (var key in resolvedPiece) {
+					if (resolvedPiece[key] == null) continue;
+					contributeValue(styleState, key, resolvedPiece[key], pieceOriginals === null || pieceOriginals === void 0 ? void 0 : pieceOriginals[key]);
 				}
-				return;
-			} else if (keyInit.startsWith("data-")) return;
-		}
-		var isVariant = !isValidStyleKeyInit && variants && keyInit in variants;
-		var isStyleLikeKey = isValidStyleKeyInit || isVariant;
-		var isStyleProp = isValidStyleKeyInit || isVariant && !noExpand;
-		if (isStyleProp && asChildExceptStyleLike) return;
-		var shouldPassProp = !isStyleProp && isHOC || hocParentVariants && keyInit in hocParentVariants || (inlineProps === null || inlineProps === void 0 ? void 0 : inlineProps.has(keyInit));
-		var parentVariant = parentVariants === null || parentVariants === void 0 ? void 0 : parentVariants[keyInit];
-		var isHOCShouldPassThrough = Boolean(isHOC && (parentVariant || keyInit in import_skipProps.skipProps));
-		var shouldPassThrough = shouldPassProp || isHOCShouldPassThrough;
-		if (process.env.NODE_ENV === "development" && debug === "verbose") {
-			console.groupCollapsed(`  \u{1F511} ${keyOg}${keyInit !== keyOg ? ` (shorthand for ${keyInit})` : ""} ${shouldPassThrough ? "(pass)" : ""}`);
-			(0, import_log.log)({
-				isVariant,
-				valInit,
-				shouldPassProp
-			});
-			if (import_constants.isClient) (0, import_log.log)({
-				variants,
-				variant: variants === null || variants === void 0 ? void 0 : variants[keyInit],
-				isVariant,
-				isHOCShouldPassThrough,
-				parentStaticConfig
-			});
-		}
-		if (shouldPassThrough) {
-			passDownProp(viewProps, keyInit, valInit);
-			if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
-			if (!isVariant) return;
-		}
-		if (shouldCheckSkipProps && !(neverSkipProps === null || neverSkipProps === void 0 ? void 0 : neverSkipProps[keyInit])) {
-			if (keyInit in import_skipProps.skipProps && !(keyInit === "transition" && typeof valInit === "string" && !(driverAnimations === null || driverAnimations === void 0 ? void 0 : driverAnimations[valInit]))) {
-				if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
-				return;
+				continue;
+			}
+			var styleOriginals = shouldTrackStyleTokenProvenance ? import_styleOriginalValues.styleOriginalValues.get(style) : void 0;
+			for (var key1 in style) {
+				if (style[key1] == null) continue;
+				contributeValue(styleState, key1, style[key1], styleOriginals === null || styleOriginals === void 0 ? void 0 : styleOriginals[key1]);
 			}
 		}
-		if (isTextOrInput) {
-			if (valInit && (keyInit === "fontFamily" || keyInit === shorthands["fontFamily"]) && valInit in conf.fontsParsed) styleState.fontFamily = valInit;
-		}
-		var disablePropMap = !isStyleLikeKey;
-		if (isValidStyleKeyInit && valInit != null && !(valInit === "unset") && !(variants && keyInit in variants) && !(accept && keyInit in accept) && !((styledContextKeys === null || styledContextKeys === void 0 ? void 0 : styledContextKeys.has(keyInit)) || styledContext && keyInit in styledContext)) {
-			contributeValue(styleState, keyInit, valInit, mergeStyle);
+		pass[passSourceLayer] = layerBeforeStyle;
+		return;
+	}
+	if (defaultProps) {
+		var _defaultProps_keyOg;
+		var defaultVal = (_defaultProps_keyOg = defaultProps[keyOg]) !== null && _defaultProps_keyOg !== void 0 ? _defaultProps_keyOg : defaultProps[keyInit];
+		if (defaultVal !== void 0 && valInit === defaultVal) return;
+	}
+	var isNativeInputColor = isInput && keyInit in import_nativeStyleEngine.nativeTextInputColorProps;
+	if (!isNativeInputColor && keyInit in import_skipProps.skipProps && shouldSkipDirectProps && !(neverSkipProps === null || neverSkipProps === void 0 ? void 0 : neverSkipProps[keyInit])) if (keyInit === "transition" && typeof valInit === "string") return;
+	else return;
+	var isValidStyleKeyInit = isValidStyleKey(keyInit, validStyles);
+	if (!isValidStyleKeyInit) {
+		if (!import_constants.isAndroid) {
+			if (keyInit === "elevationAndroid") return;
+		}
+		if (keyInit === "userSelect") {
+			keyInit = "selectable";
+			valInit = valInit !== "none";
+		} else if (keyInit === "textOverflow") {
+			if (isText && valInit === "ellipsis") {
+				var _viewProps, _viewProps1;
+				var _numberOfLines;
+				(_numberOfLines = (_viewProps = viewProps).numberOfLines) !== null && _numberOfLines !== void 0 || (_viewProps.numberOfLines = 1);
+				var _ellipsizeMode;
+				(_ellipsizeMode = (_viewProps1 = viewProps).ellipsizeMode) !== null && _ellipsizeMode !== void 0 || (_viewProps1.ellipsizeMode = "tail");
+			}
+			return;
+		} else if (keyInit.startsWith("data-")) return;
+	}
+	var isVariant = !isValidStyleKeyInit && variants && keyInit in variants;
+	var isStyleProp = isValidStyleKeyInit || isVariant && !noExpand;
+	if (isStyleProp && asChildExceptStyleLike) return;
+	var shouldPassProp = !isStyleProp && isHOC || hocParentVariants && keyInit in hocParentVariants || (inlineProps === null || inlineProps === void 0 ? void 0 : inlineProps.has(keyInit));
+	var parentVariant = parentVariants === null || parentVariants === void 0 ? void 0 : parentVariants[keyInit];
+	var isHOCShouldPassThrough = Boolean(isHOC && (parentVariant || keyInit in import_skipProps.skipProps));
+	var shouldPassThrough = shouldPassProp || isHOCShouldPassThrough;
+	if (process.env.NODE_ENV === "development" && debug === "verbose") {
+		console.groupCollapsed(`  \u{1F511} ${keyOg}${keyInit !== keyOg ? ` (shorthand for ${keyInit})` : ""} ${shouldPassThrough ? "(pass)" : ""}`);
+		(0, import_log.log)({
+			isVariant,
+			valInit,
+			shouldPassProp
+		});
+		if (import_constants.isClient) (0, import_log.log)({
+			variants,
+			variant: variants === null || variants === void 0 ? void 0 : variants[keyInit],
+			isVariant,
+			isHOCShouldPassThrough,
+			parentStaticConfig: pass[15]
+		});
+	}
+	if (shouldPassThrough) {
+		if (keyInit in viewProps) delete viewProps[keyInit];
+		viewProps[keyInit] = valInit;
+		if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
+		if (!isVariant) return;
+	}
+	if (!isNativeInputColor && shouldCheckSkipProps && !(neverSkipProps === null || neverSkipProps === void 0 ? void 0 : neverSkipProps[keyInit])) {
+		if (keyInit in import_skipProps.skipProps && !(keyInit === "transition" && typeof valInit === "string" && !(driverAnimations === null || driverAnimations === void 0 ? void 0 : driverAnimations[valInit]))) {
+			if (process.env.NODE_ENV === "development" && debug === "verbose") console.groupEnd();
 			return;
 		}
+	}
+	if (isTextOrInput) {
+		if (valInit && (keyInit === "fontFamily" || keyInit === shorthands["fontFamily"]) && valInit in conf.fontsParsed) styleState.fontFamily = valInit;
+	}
+	if (isValidStyleKeyInit && valInit != null && !(valInit === "unset") && !(variants && keyInit in variants) && !((styledContextKeys === null || styledContextKeys === void 0 ? void 0 : styledContextKeys.has(keyInit)) || styledContext && keyInit in styledContext)) {
+		contributeValue(styleState, keyInit, valInit, originalOg);
+		return;
+	}
+	if (variants && keyInit in variants && !noExpand && !disabled) {
+		var _variantConfig_variantStyleResolver;
+		var previousLayer = pass[passSourceLayer];
+		pass[passSourceLayer] = previousLayer ? sourceLayerVariant : sourceLayerBase;
 		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.transformAccumulator);
-			} catch (e) {}
-			console.groupEnd();
-		}
-	} finally {
-		if (parentConditionKey) pass[passParentCursor] = null;
-		releaseConditionCursors(parentWatermark);
+		var variantConfig = styleState.flatStyleStaticConfig;
+		(_variantConfig_variantStyleResolver = variantConfig.variantStyleResolver) === null || _variantConfig_variantStyleResolver === void 0 || _variantConfig_variantStyleResolver.call(variantConfig, styleState, variantConfig.variants, keyInit, valInit, keyInit, pass[passParentCursor]);
+		pass[passSourceLayer] = previousLayer;
+		return;
+	}
+	var isStyledContextProp = !isHOC && ((styledContextKeys === null || styledContextKeys === void 0 ? void 0 : styledContextKeys.has(keyInit)) || styledContext && keyInit in styledContext);
+	if (isStyledContextProp) {
+		var _styleState1, _styleState2;
+		((_styleState1 = styleState).overriddenContextProps || (_styleState1.overriddenContextProps = {}))[keyInit] = originalOg;
+		((_styleState2 = styleState).originalContextPropValues || (_styleState2.originalContextPropValues = {}))[keyInit] = originalOg;
+	}
+	var isHostStyleKey = isValidStyleKeyInit || import_constants.isAndroid && keyInit === "elevation";
+	if (isHostStyleKey || isStyledContextProp) {
+		if (valInit === "unset") {
+			var expanded = (0, import_expandStyle.expandStyle)(keyInit, valInit, conf.settings.styleCompat || "web");
+			clearDirectStyle(styleState, keyInit);
+			if (expanded) for (var index2 = 0; index2 < expanded.length; index2++) clearDirectStyle(styleState, expanded[index2][0]);
+		} else contributeValue(styleState, keyInit, valInit, originalOg, !isHostStyleKey);
+		return;
+	}
+	var condition = pass[passParentCursor];
+	if (condition) {
+		if (isHOC) {
+			var previous = viewProps[keyInit];
+			var transport = previous && (typeof previous === "undefined" ? "undefined" : _type_of(previous)) === "object" && !Array.isArray(previous) && "default" in previous ? previous : { default: previous };
+			transport[condition[conditionKey]] = valInit;
+			viewProps[keyInit] = transport;
+		} else if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${keyInit}" is not a valid style on this component; the conditional variant value is dropped.`);
+		return;
+	}
+	if (keyInit in import_helpers.stylePropsAll) {
+		if (process.env.NODE_ENV === "development") console.warn(`[tamagui] "${keyInit}" 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[keyInit] = valInit;
+	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.transformAccumulator);
+		} catch (e) {}
+		console.groupEnd();
 	}
 }
 var getSplitStyles = function(props, staticConfig, theme, themeName, componentState, styleProps, parentSplitStyles, componentContext, groupContext, elementType, startedUnhydrated, debug, animationDriver, styleStaticConfig) {
-	var _styleState_style;
+	var _styleState_flatMediaKeys, _styleState_flatGroupKeys, _styleState_flatGroupMedia, _styleState_style;
 	var conf = (0, import_config.getConfig)();
 	styleStaticConfig || (styleStaticConfig = (0, import_styleStaticConfig.getStyleStaticConfig)(staticConfig, conf));
 	var driver = animationDriver || (componentContext === null || componentContext === void 0 ? void 0 : componentContext.animationDriver) || conf.animations;
@@ -764,7 +572,7 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 	var staticPassthroughClassName = "";
 	var className = staticPassthroughClassName;
 	if (staticPassthroughClassName) shouldDoClasses = false;
-	var validStyles = staticConfig.validStyles || (staticConfig.isText || staticConfig.isInput ? import_helpers.stylePropsText : import_helpers.validStyles);
+	var validStyles = staticConfig.validStyles || (staticConfig.isInput ? import_helpers.stylePropsInput : staticConfig.isText ? import_helpers.stylePropsText : import_helpers.validStyles);
 	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-setup`;
 	var styleState = {
 		classNames,
@@ -786,7 +594,6 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 		animationDriver: resolvedDriver
 	};
 	styleState.flatStyleStaticConfig = styleStaticConfig;
-	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) {
@@ -804,21 +611,20 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 		}
 	}
 	var { asChild } = props;
-	var { accept, neverSkipProps } = staticConfig;
+	var { neverSkipProps } = staticConfig;
 	var { noSkip, disableExpandShorthands, noExpand, noClass, noMergeStyle, noNormalize, isAnimated, styledContext } = styleProps;
 	var styledContextKeys = styleStaticConfig.styledContextKeys;
 	var styleFrontend = staticConfig.styleFrontend;
 	var frontendGroup;
 	var frontendContainer;
 	var frontendContainerType;
+	var processedProps = props;
 	var parentVariants = parentStaticConfig ? (0, import_styleStaticConfig.getStyleStaticConfig)(parentStaticConfig, conf).variants : void 0;
 	var defaultProps = asChild ? styleStaticConfig.defaultProps : void 0;
 	var asChildExceptStyleLike = asChild === "except-style" || asChild === "except-style-web";
 	var containerValue;
 	var containerName;
 	var containerType;
-	var hocMappedClassProperties;
-	var hocMappedClasses;
 	var pass = [
 		styleState,
 		conf,
@@ -826,7 +632,6 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 		viewProps,
 		staticConfig,
 		validStyles,
-		accept,
 		neverSkipProps,
 		variants,
 		inlineProps,
@@ -848,36 +653,103 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 		containerType,
 		frontendGroup,
 		frontendContainer,
-		frontendContainerType,
-		hocMappedClassProperties,
-		hocMappedClasses
+		frontendContainerType
 	];
 	styleState.flatPass = pass;
 	var conditionalStates = null;
 	var usesSafeArea = false;
-	var conditionWrapperBase = conditionWrapperTop;
-	try {
-		var _styleState_flatMediaKeys, _styleState_flatGroupKeys, _styleState_flatGroupMedia;
-		forEachPropInForwardOrder(pass);
-		[, , , , , , , , , , , , , , , , , , , , , className, shouldDoClasses, containerValue, containerName, containerType, frontendGroup, frontendContainer, frontendContainerType, hocMappedClassProperties, hocMappedClasses] = pass;
-		if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-propsend`;
-		conditionalStates = styleState.flatStateKeys || null;
-		usesSafeArea = !!styleState.flatUsesSafeArea;
-		hasMedia = ((_styleState_flatMediaKeys = styleState.flatMediaKeys) === null || _styleState_flatMediaKeys === void 0 ? void 0 : _styleState_flatMediaKeys.size) ? styleState.flatMediaKeys : false;
-		pseudoGroups = ((_styleState_flatGroupKeys = styleState.flatGroupKeys) === null || _styleState_flatGroupKeys === void 0 ? void 0 : _styleState_flatGroupKeys.size) ? styleState.flatGroupKeys : void 0;
-		mediaGroups = ((_styleState_flatGroupMedia = styleState.flatGroupMedia) === null || _styleState_flatGroupMedia === void 0 ? void 0 : _styleState_flatGroupMedia.size) ? styleState.flatGroupMedia : void 0;
-		if (styleProps.canPlatformPseudo && styleState.flatHasPlatformPseudo) {
-			shouldDoClasses = false;
-			styleState.flatShouldDoClasses = false;
-			if (styleState.transformAccumulator) {
-				mergeStyle(styleState, "transform", (0, import_runtime.finalizeTransformAccumulator)(styleState.transformAccumulator), true);
-				styleState.transformAccumulator = void 0;
+	var baseStyle = styleStaticConfig.baseStyle;
+	var baseVariantProps = styleStaticConfig.baseVariantProps;
+	var appliesBaseStyle = baseStyle && !processedProps.asChild;
+	pass[passSourceLayer] = sourceLayerBase;
+	if (appliesBaseStyle && baseVariantProps) {
+		var callerKeys;
+		for (var key in baseVariantProps) if (Object.hasOwn(processedProps, key) && processedProps[key] !== baseVariantProps[key]) (callerKeys || (callerKeys = /* @__PURE__ */ new Set())).add(key);
+		styleState.flatCallerVariantKeys = callerKeys;
+	}
+	if (appliesBaseStyle) for (var key1 in baseStyle) {
+		var _styleStaticConfig_baseStylePieces;
+		var baseValue = baseVariantProps && Object.hasOwn(baseVariantProps, key1) && Object.hasOwn(processedProps, key1) ? processedProps[key1] : baseStyle[key1];
+		var expandedKey = shorthands[key1] || key1;
+		if ((isText || isInput) && baseValue && expandedKey === "fontFamily" && baseValue in conf.fontsParsed) styleState.fontFamily = baseValue;
+		(_styleStaticConfig_baseStylePieces = styleStaticConfig.baseStylePieces) === null || _styleStaticConfig_baseStylePieces === void 0 || _styleStaticConfig_baseStylePieces[key1];
+		contributeProp(pass, key1, baseValue);
+	}
+	pass[passSourceLayer] = sourceLayerProps;
+	for (var key2 in processedProps) {
+		if (appliesBaseStyle && baseVariantProps && Object.hasOwn(baseVariantProps, key2)) continue;
+		contributeProp(pass, key2, processedProps[key2]);
+	}
+	var resolvers = staticConfig.resolvers;
+	if (resolvers && !noExpand) {
+		pass[passSourceLayer] = sourceLayerResolver;
+		var flagsBefore = pass[passFlags];
+		pass[passFlags] = flagsBefore | passNoExpandFlag;
+		var env = (0, import_styledDynamic.getDynamicEnv)(styleState);
+		for (var index = 0; index < resolvers.length; index++) {
+			var resolved = resolvers[index](processedProps, env);
+			if (resolved) for (var key3 in resolved) {
+				if (resolved[key3] == null) continue;
+				contributeProp(pass, key3, resolved[key3]);
 			}
-			convertDeferredInline(styleState, mergeStyle);
 		}
-		completeStreaming(styleState, mergeStyle);
-	} finally {
-		releaseConditionPayloads(conditionWrapperBase);
+		pass[passFlags] = flagsBefore;
+	}
+	className = pass[passClassName];
+	shouldDoClasses = pass[passShouldDoClasses];
+	containerValue = pass[passContainerValue];
+	containerName = pass[passContainerName];
+	containerType = pass[passContainerType];
+	frontendGroup = pass[passFrontendGroup];
+	frontendContainer = pass[passFrontendContainer];
+	frontendContainerType = pass[passFrontendContainerType];
+	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-propsend`;
+	conditionalStates = styleState.flatStateKeys || null;
+	usesSafeArea = !!styleState.flatUsesSafeArea;
+	hasMedia = ((_styleState_flatMediaKeys = styleState.flatMediaKeys) === null || _styleState_flatMediaKeys === void 0 ? void 0 : _styleState_flatMediaKeys.size) ? styleState.flatMediaKeys : false;
+	pseudoGroups = ((_styleState_flatGroupKeys = styleState.flatGroupKeys) === null || _styleState_flatGroupKeys === void 0 ? void 0 : _styleState_flatGroupKeys.size) ? styleState.flatGroupKeys : void 0;
+	mediaGroups = ((_styleState_flatGroupMedia = styleState.flatGroupMedia) === null || _styleState_flatGroupMedia === void 0 ? void 0 : _styleState_flatGroupMedia.size) ? styleState.flatGroupMedia : void 0;
+	if (styleProps.canPlatformPseudo && styleState.flatHasPlatformPseudo) {
+		shouldDoClasses = false;
+		styleState.flatShouldDoClasses = false;
+		if (styleState.transformAccumulator) {
+			mergeStyle(styleState, "transform", (0, import_runtime.finalizeTransformAccumulator)(styleState.transformAccumulator), true);
+			styleState.transformAccumulator = void 0;
+		}
+	}
+	if (styleProps.stylePieceEntries) {
+		var slots = styleState.flatSlots;
+		if (slots) {
+			var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
+			try {
+				for (var _iterator = slots[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+					var [slot, entries] = _step.value;
+					styleProps.stylePieceEntries[slot] = entries;
+				}
+			} catch (err) {
+				_didIteratorError = true;
+				_iteratorError = err;
+			} finally {
+				try {
+					if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
+				} finally {
+					if (_didIteratorError) throw _iteratorError;
+				}
+			}
+		}
+	}
+	completeResolvedStyles(styleState);
+	if (styleProps.isStatic) for (var property in classNames) {
+		var identifier = classNames[property];
+		if (rulesToInsert[identifier]) continue;
+		var rules = (0, import_insertStyleRule.getRulesForIdentifier)(identifier);
+		if (rules) rulesToInsert[identifier] = [
+			property,
+			"",
+			identifier,
+			void 0,
+			rules
+		];
 	}
 	var effectiveTransition = (_styleState_style = styleState.style) === null || _styleState_style === void 0 ? void 0 : _styleState_style.transition;
 	if (effectiveTransition != null && styleState.style && true) delete styleState.style.transition;
@@ -886,21 +758,18 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 		if ("containerName" in styleState.style) delete styleState.style.containerName;
 	}
 	if (!(noNormalize === false)) {
-		if (styleState.style) {
-			(0, import_expandStyles.fixStyles)(styleState.style);
-			if (!noExpand && !noMergeStyle) {}
-		}
+		if (styleState.style) (0, import_expandStyles.fixStyles)(styleState.style);
 		if (styleState.transformAccumulator && !styleState.flatShouldDoClasses) {
 			var _styleState;
 			(_styleState = styleState).style || (_styleState.style = {});
 			styleState.style.transform = (0, import_runtime.finalizeTransformAccumulator)(styleState.transformAccumulator);
 		}
 		if (parentSplitStyles) {
-			if (!shouldDoClasses) for (var key1 in parentSplitStyles.style) {
+			if (!shouldDoClasses) for (var key5 in parentSplitStyles.style) {
 				var _styleState1;
-				if (key1 in classNames || styleState.style && key1 in styleState.style) continue;
+				if (key5 in classNames || styleState.style && key5 in styleState.style) continue;
 				(_styleState1 = styleState).style || (_styleState1.style = {});
-				styleState.style[key1] = parentSplitStyles.style[key1];
+				styleState.style[key5] = parentSplitStyles.style[key5];
 			}
 		}
 	}
@@ -929,9 +798,9 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 	if (shouldTrackStyleTokenProvenance && styleState.style && styleState.tokenProvenance) {
 		var provenance = {};
 		var hasProvenance = false;
-		for (var key2 in styleState.tokenProvenance) {
-			provenance[key2] = {
-				token: styleState.tokenProvenance[key2],
+		for (var key6 in styleState.tokenProvenance) {
+			provenance[key6] = {
+				token: styleState.tokenProvenance[key6],
 				theme: themeName
 			};
 			hasProvenance = true;
@@ -952,7 +821,7 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 	if (effectiveTransition != null) result.effectiveTransition = effectiveTransition;
 	if (conditionalStates) result.programStates = conditionalStates;
 	if (usesSafeArea) result.usesSafeArea = true;
-	if (getDirectDynamicThemeAccess(styleState)) result.dynamicThemeAccess = true;
+	if (styleState.flatDynamicThemeAccess) result.dynamicThemeAccess = true;
 	if (styleState.flatEnterKeys || styleState.flatExitKeys) result.programLifecycleStyleKeys = {
 		enter: effectiveLifecycleKeys(styleState.flatEnterKeys),
 		exit: effectiveLifecycleKeys(styleState.flatExitKeys)
@@ -982,7 +851,7 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 					rulesToInsert,
 					parentSplitStyles
 				};
-				for (var key4 in logs) (0, import_log.log)(key4, logs[key4]);
+				for (var key8 in logs) (0, import_log.log)(key8, logs[key8]);
 			} catch (e) {}
 			console.groupEnd();
 		}
@@ -990,6 +859,36 @@ var getSplitStyles = function(props, staticConfig, theme, themeName, componentSt
 	if (process.env.NODE_ENV === "development" && (debug === "profile" || globalThis.time)) time`split-styles-done`;
 	return result;
 };
+var stylePieceStaticConfig = {
+	acceptsClassName: true,
+	isText: true,
+	validStyles: import_helpers.stylePropsAll
+};
+var compileStylePieceRuntime = function(piece, layer) {};
+(0, import_style.setStylePieceCompiler)(compileStylePieceRuntime);
+(0, import_style.setStylePieceResolver)(function(piece, theme, themeName) {
+	var split = getSplitStyles({ style: piece }, stylePieceStaticConfig, theme, themeName, import_defaultComponentState.defaultComponentStateMounted, {
+		isAnimated: false,
+		resolveValues: "value"
+	});
+	return (split === null || split === void 0 ? void 0 : split.style) || {};
+});
+var resolvedStylePieceCache = /* @__PURE__ */ new WeakMap();
+function resolveStylePiece(styleState, piece) {
+	var definition = piece[import_types.stylePieceSymbol].styleObject;
+	if (!(0, import_style.isStylePieceCacheable)(piece)) return resolveStyleObject(styleState, definition);
+	var themeCache = resolvedStylePieceCache.get(piece);
+	if (!themeCache) {
+		themeCache = /* @__PURE__ */ new WeakMap();
+		resolvedStylePieceCache.set(piece, themeCache);
+	}
+	var theme = styleState.theme;
+	var cached = themeCache.get(theme);
+	if (cached) return cached;
+	var resolved = resolveStyleObject(styleState, definition);
+	themeCache.set(theme, resolved);
+	return resolved;
+}
 function mergeStyle(styleState, key, val) {
 	arguments.length > 3 && arguments[3] !== void 0 && arguments[3];
 	var originalVal = arguments.length > 4 ? arguments[4] : void 0;
@@ -1009,7 +908,7 @@ function mergeStyle(styleState, key, val) {
 		(0, import_runtime.addTransformValue)(styleState.transformAccumulator, key, val);
 	} else {
 		var out = val;
-		if (staticConfig.accept && key in staticConfig.accept) viewProps[key] = out;
+		if (staticConfig.isInput && key in import_nativeStyleEngine.nativeTextInputColorProps) viewProps[import_nativeStyleEngine.nativeTextInputColorProps[key]] = out;
 		else {
 			var _styleState2;
 			(_styleState2 = styleState).style || (_styleState2.style = {});
@@ -1033,7 +932,7 @@ function recordStyleTokenProvenance(styleState, key, originalVal) {
 		((_styleState = styleState).tokenProvenance || (_styleState.tokenProvenance = {}))[key] = originalVal;
 	} else if (styleState.tokenProvenance && key in styleState.tokenProvenance) delete styleState.tokenProvenance[key];
 }
-var resolveAcceptedStyle = function(styleState, styleIn) {
+var resolveStyleObject = function(styleState, styleIn) {
 	var { conf, styleProps } = styleState;
 	var styleOut = {};
 	var originalValues;
@@ -1046,12 +945,9 @@ var resolveAcceptedStyle = function(styleState, 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;
+	childState.flatPropertyLayers = void 0;
 	var mergeAccepted = function(_state, key2, value2, disableNormalize, originalValue) {
 		styleOut[key2] = disableNormalize || styleProps.noNormalize ? value2 : (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(value2, key2);
 		var _styleInOriginalValues_key;
@@ -1062,92 +958,63 @@ var resolveAcceptedStyle = function(styleState, styleIn) {
 		var value = styleIn[key];
 		key = conf.shorthands[key] || key;
 		if (key in import_skipProps.skipProps || value == null) continue;
-		contributeValue(childState, key, value, mergeAccepted);
+		contributeValue(childState, key, value);
 	}
-	completeStreaming(childState, mergeAccepted);
+	completeResolvedStyles(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;
-}
 var frameSequence = 0;
-function streamWriteCSS(state, property, value, cursor, original) {
-	var conditionOverride = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : -1;
-	var direct = state;
-	var condition = conditionOverride !== -1 ? conditionOverride : cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
-	var identity = cursor ? conditionTexts[cursor + conditionKeyOffset] || "" : "";
-	if (property.charCodeAt(0) === 116 && property.startsWith("transition")) {
-		var _direct;
-		var transitions = (_direct = direct).flatTransitions || (_direct.flatTransitions = []);
-		for (var index = 0; index < transitions.length; index++) if (transitions[index][0] === property && transitions[index][3] === identity) {
-			transitions[index][1] = value;
-			transitions[index][2] = condition;
-			return;
-		}
-		transitions.push([
-			property,
-			value,
-			condition,
-			identity,
-			cursor ? conditionTexts[cursor + conditionSelectorOffset] || "" : "",
-			cursor ? conditionWrappers : void 0,
-			cursor ? conditionNumbers[cursor + conditionWrapperOffset] >> 3 : 0,
-			cursor ? conditionNumbers[cursor + conditionWrapperOffset] & 7 : 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, false, original);
-}
-function streamWriteInline(state, property, value, cursor, merge, original) {
-	var normalize = arguments.length > 6 && arguments[6] !== void 0 ? arguments[6] : false, conditionOverride = arguments.length > 7 && arguments[7] !== void 0 ? arguments[7] : -1;
-	var _direct;
-	var direct = state;
-	var condition = conditionOverride !== -1 ? conditionOverride : cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
-	var importance = condition ? Math.floor(condition / 256) + 1 : 0;
-	var used = (_direct = direct).flatUsed || (_direct.flatUsed = {});
-	var previous = used[property];
-	if (previous !== void 0 && previous > importance) return;
-	used[property] = importance;
-	merge(state, property, value, !normalize, original);
-}
-function streamRetractInline(state, property, cursor) {
+var recordInline = 1;
+var recordNormalize = 2;
+var recordRetract = 4;
+var recordDefault = 8;
+var recordCSS = 16;
+function writeStyleRecord(state, property, value, cursor, original, flags) {
+	var conditionOverride = arguments.length > 6 && arguments[6] !== void 0 ? arguments[6] : -1;
+	var _state_flatPass;
 	var _direct;
-	var direct = state;
-	var condition = cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
-	var importance = condition ? Math.floor(condition / 256) + 1 : 0;
-	var used = (_direct = direct).flatUsed || (_direct.flatUsed = {});
-	var previous = used[property];
-	if (previous !== void 0 && previous > importance) return;
-	used[property] = importance;
-	if (state.style) delete state.style[property];
-}
-function convertDeferredInline(state, merge) {
-	var direct = state;
-	var consume = function(entries) {
-		for (var index = 0; index < entries.length; index++) {
-			var entry = entries[index];
-			var condition = entry[2];
-			if (condition && !(condition & 1)) continue;
-			streamWriteInline(state, entry[0], entry[1], null, merge, entry[8] !== void 0 ? entry[8] : entry[1], false, condition);
+	var condition = conditionOverride !== -1 ? conditionOverride : cursor ? cursor[conditionValue] : 0;
+	var identity = cursor ? cursor[conditionKey] : "";
+	var slots = (_direct = state).flatSlots || (_direct.flatSlots = /* @__PURE__ */ new Map());
+	var slot = property.startsWith("transition") ? "transition" : property;
+	var list = slots.get(slot);
+	if (!list) slots.set(slot, list = []);
+	for (var index = 0; index < list.length; index++) {
+		var entry = list[index];
+		var entryFlags = entry[7];
+		if ((entryFlags & (recordInline | recordCSS)) !== (flags & (recordInline | recordCSS))) continue;
+		if (entry[0] !== property) continue;
+		if (flags & recordDefault) {
+			if (!(entryFlags & recordDefault) && (!entry[2] || entry[3] === identity)) return;
+		} else if (entryFlags & recordDefault && (!condition || entry[3] === identity)) {
+			list.splice(index--, 1);
+			continue;
+		}
+		if (entry[3] === identity) {
+			list.splice(index, 1);
+			break;
 		}
-	};
-	var slots = direct.flatSlots;
-	if (slots) {
-		direct.flatSlots = void 0;
-		for (var property in slots) consume(slots[property]);
-	}
-	var transitions = direct.flatTransitions;
-	if (transitions) {
-		direct.flatTransitions = void 0;
-		consume(transitions);
 	}
-	direct.flatBorderDefaultRequests = void 0;
+	list.push([
+		property,
+		value,
+		condition,
+		identity,
+		cursor ? cursor[conditionSelector] : "",
+		cursor ? cursor[conditionWrappers] : void 0,
+		original,
+		flags | (((_state_flatPass = state.flatPass) === null || _state_flatPass === void 0 ? void 0 : _state_flatPass[passSourceLayer]) || 0) << 5
+	]);
 }
-function completeStreaming(state, merge) {
+function streamWriteInline(state, property, value, cursor, original) {
+	var normalize = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : property === "lineHeight", conditionOverride = arguments.length > 6 && arguments[6] !== void 0 ? arguments[6] : -1, force = arguments.length > 7 && arguments[7] !== void 0 ? arguments[7] : false;
+	writeStyleRecord(state, property, value, cursor, original, (normalize ? recordNormalize : 0) | (force ? recordInline : 0), conditionOverride);
+}
+function completeResolvedStyles(state) {
+	var merge = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : mergeStyle;
 	var direct = state;
 	var shadow = direct.flatWebShadow;
 	if (shadow && (direct.flatBoxShadowSequence || 0) <= shadow[4]) {
@@ -1159,275 +1026,116 @@ function completeStreaming(state, merge) {
 		var color = (0, import_normalizeColor.normalizeColor)(shadow[0], (_shadow_ = shadow[2]) !== null && _shadow_ !== void 0 ? _shadow_ : 1);
 		if (color) {
 			var 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]);
+			emitProperty(state, "boxShadow", direct.flatBoxShadow ? `${direct.flatBoxShadow}, ${next}` : next, null, shadow[5], shadow[6]);
+		}
+		direct.flatWebShadow = void 0;
+	}
+	if (state.flatShouldDoClasses && state.transformAccumulator) {
+		var transform = (0, import_runtime.finalizeTransformAccumulator)(state.transformAccumulator);
+		state.transformAccumulator = void 0;
+		writeStyleRecord(state, "transform", Array.isArray(transform) ? (0, import_transformsToString.transformsToString)(transform) : transform, null, transform, 0);
+	}
+	var slots = direct.flatSlots;
+	if (!slots) return;
+	var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
+	try {
+		for (var _iterator = slots[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+			var [property, entries] = _step.value;
+			var cssEntries = void 0;
+			var inlineWinner = void 0;
+			var importance = -1;
+			for (var index = 0; index < entries.length; index++) {
+				var entry = entries[index];
+				var flags = entry[7];
+				if (flags & recordCSS || state.flatShouldDoClasses && !(flags & recordInline)) {
+					cssEntries || (cssEntries = []);
+					var precedence = entry[2] ? Math.floor(entry[2] / 256) : -1;
+					var layer = flags >> 5;
+					var index1 = cssEntries.length;
+					while (index1 > 0) {
+						var before = cssEntries[index1 - 1];
+						var beforeLayer = before[7] >> 5;
+						if (beforeLayer < layer || beforeLayer === layer && (before[2] ? Math.floor(before[2] / 256) : -1) <= precedence) break;
+						index1--;
+					}
+					if (index1 === cssEntries.length) cssEntries.push(entry);
+					else cssEntries.splice(index1, 0, entry);
+				} else if (!entry[2] || entry[2] & 1) {
+					var next1 = entry[2] ? Math.floor(entry[2] / 256) : 0;
+					if (next1 >= importance) {
+						importance = next1;
+						inlineWinner = entry;
+					}
+				}
+			}
+			if (cssEntries) (0, import_getCSSStylesAtomic.registerAtomicSlot)(direct, property, cssEntries);
+			if (inlineWinner) if (inlineWinner[7] & recordRetract) {
+				if (state.style) delete state.style[inlineWinner[0]];
+			} else merge(state, inlineWinner[0], inlineWinner[1], !(inlineWinner[7] & recordNormalize), inlineWinner[6] !== void 0 ? inlineWinner[6] : inlineWinner[1]);
+		}
+	} catch (err) {
+		_didIteratorError = true;
+		_iteratorError = err;
+	} finally {
+		try {
+			if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
+		} finally {
+			if (_didIteratorError) throw _iteratorError;
 		}
 	}
-	(0, import_directStyleCSS.completeStreamingCSS)(state);
+	direct.flatSlots = void 0;
 }
-function emitAtParentCondition(state, property, value, merge, originalValue, contextOnly) {
+function emitAtParentCondition(state, property, value, originalValue, contextOnly) {
 	var _state_flatPass;
-	emitValue(state, property, value, ((_state_flatPass = state.flatPass) === null || _state_flatPass === void 0 ? void 0 : _state_flatPass[passParentCursor]) || null, merge, originalValue, contextOnly);
-}
-function emitUnderCondition(state, property, value, cursor, merge, originalValue, contextOnly, warnMode, warnSource) {
-	var condition = conditionNumbers[cursor + conditionValueOffset];
-	if (!(conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag)) {
-		if (warnMode && process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, warnSource, `unknown modifier "${conditionTexts[cursor + conditionUnresolvedNameOffset] || ""}"`);
+	var cursor = (_state_flatPass = state.flatPass) === null || _state_flatPass === void 0 ? void 0 : _state_flatPass[passParentCursor];
+	if (cursor) emitUnderCondition(state, property, value, cursor, originalValue, contextOnly, 0, value);
+	else emitValue(state, property, value, null, originalValue, contextOnly);
+}
+function emitUnderCondition(state, property, value, cursor, originalValue, contextOnly, warnMode, warnSource) {
+	var condition = cursor[conditionValue];
+	if (!(condition & conditionResolvedFlag)) {
+		if (warnMode && process.env.NODE_ENV !== "production") (0, import_warnOnce.warnRefusedValue)(property, warnSource, `unknown modifier "${cursor.problem}"`);
 		return 0;
 	}
-	var 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 && conditionTexts[cursor + conditionThemeOffset] && import_constants.supportsDynamicColorIOS && (0, import_getDynamicVal.isColorStyleKey)(property))) {
-		emitValue(state, property, value, cursor, merge, warnMode === 2 ? originalValue : originalValue !== null && originalValue !== void 0 ? originalValue : value, contextOnly);
-		var flags = conditionNumbers[cursor + conditionFlagsOffset];
-		if (flags & conditionEnterFlag) state.flatHasEnterStyle = true;
-		if (flags & conditionPlatformPseudoFlag) state.flatHasPlatformPseudo = true;
-	} else if (merge && property && condition & 2) {
-		var flags1 = conditionNumbers[cursor + conditionFlagsOffset];
-		if (flags1 & conditionEnterFlag) state.flatHasEnterStyle = true;
-		if (flags1 & conditionPlatformPseudoFlag) state.flatHasPlatformPseudo = true;
+	emitValue(state, property, value, cursor, warnMode === 2 ? originalValue : originalValue !== null && originalValue !== void 0 ? originalValue : value, contextOnly);
+	if (condition & 2) {
+		if (condition & 4) state.flatHasEnterStyle = true;
+		if (condition & conditionPlatformPseudoFlag) state.flatHasPlatformPseudo = true;
 	}
 	return condition;
 }
-var 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;
-			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;
-			}
-			var 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) {
-			var left = Number(source.slice(chainStart, chainEnd));
-			var right = Number(source.slice(start, end));
-			if (chainStart < chainEnd && Number.isFinite(left) && left > 0 && Number.isFinite(right) && right > 0) return 12;
-		}
-		var cursor = state.flatScanCursor;
-		var condition = valid ? emitUnderCondition(state, property, source.slice(start, end), cursor, merge, void 0, contextOnly, 1, source) : conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag ? conditionNumbers[cursor + conditionValueOffset] : 0;
-		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) {
-		var directState = state;
-		var cursor = directState.flatScanCursor;
-		if (!cursor) {
-			var _directState_flatPass;
-			cursor = directState.flatScanCursor = acquireConditionCursor(((_directState_flatPass = directState.flatPass) === null || _directState_flatPass === void 0 ? void 0 : _directState_flatPass[passParentCursor]) || null);
-		} else if (first) {
-			var _directState_flatPass1;
-			resetConditionCursor(cursor, ((_directState_flatPass1 = directState.flatPass) === null || _directState_flatPass1 === void 0 ? void 0 : _directState_flatPass1[passParentCursor]) || null);
-		}
-		if (!valid) {
-			setConditionUnresolved(cursor);
-			return;
-		}
-		if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) resolveConditionModifier(state, cursor, source.slice(start, end));
-	},
-	chain(state, _start, _end, valid) {
-		var 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) {
-		var hasBase = !!(result & 1);
-		if (result & 16) {
-			if (chainCount === 0) {
-				emitAtParentCondition(state, property, source, merge, originalValue !== null && originalValue !== void 0 ? 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 !== null && originalValue !== void 0 ? originalValue : source, contextOnly);
-			hasBase = true;
-		}
-		if (process.env.NODE_ENV === "development" && !hasBase && result & 4 && property in import_helpers.propToTokenCategoryCode && 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) {
-			var value = implicitLifecycleBase(property);
-			if (value !== null) emitAtParentCondition(state, property, value, merge, value, contextOnly);
-		}
-	}
+var formatScanFailure = function(failure, source, failureIndex) {
+	return 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 \"(\"";
 };
-function implicitLifecycleBase(property) {
-	return property === "opacity" || property === "scale" || property === "scaleX" || property === "scaleY" ? 1 : property === "rotate" ? "0deg" : property === "x" || property === "y" ? 0 : null;
-}
-var legacyTransformParts = /* @__PURE__ */ new Set([
-	"matrix",
-	"perspective",
-	"rotateX",
-	"rotateY",
-	"rotateZ",
-	"scaleZ",
-	"skewX",
-	"skewY"
-]);
-var webShadowParts = {
-	shadowColor: 1,
-	shadowOffset: 2,
-	shadowOpacity: 3,
-	shadowRadius: 4
+var warnScanFailure = function(property, source, failure, failureIndex) {
+	if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, source, formatScanFailure(failure, source, failureIndex));
 };
-var webTextShadowParts = /* @__PURE__ */ new Set([
-	"textShadowColor",
-	"textShadowOffset",
-	"textShadowRadius"
-]);
-var lineStyles = /* @__PURE__ */ new Set([
-	"none",
-	"hidden",
-	"dotted",
-	"dashed",
-	"solid",
-	"double",
-	"groove",
-	"ridge",
-	"inset",
-	"outset"
-]);
 var 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"]
-	}
+	border: [
+		"Top",
+		"Right",
+		"Bottom",
+		"Left"
+	],
+	borderTop: ["Top"],
+	borderRight: ["Right"],
+	borderBottom: ["Bottom"],
+	borderLeft: ["Left"],
+	outline: [""],
+	borderBlock: ["BlockStart", "BlockEnd"],
+	borderInline: ["InlineStart", "InlineEnd"]
 };
-var 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) {
-	var _state_theme, _state_conf_themes_, _state_conf_themes, _state_conf_tokensParsed_space, _state_conf_tokensParsed_color;
-	var lookupName = name.charCodeAt(0) === 36 ? name.slice(1) : name;
-	if (property === "fontFamily") {
-		var _state_conf_fontsParsed_lookupName;
-		var family = (_state_conf_fontsParsed_lookupName = state.conf.fontsParsed[lookupName]) === null || _state_conf_fontsParsed_lookupName === void 0 ? void 0 : _state_conf_fontsParsed_lookupName.family;
-		return family ? fillTokenLookup(family, false, lookupName) : void 0;
-	}
-	var fontKey = property === "fontSize" ? "size" : property === "fontWeight" ? "weight" : property === "lineHeight" || property === "letterSpacing" ? property : void 0;
-	if (fontKey) {
-		var _font_fontKey;
-		var font = state.conf.fontsParsed[state.fontFamily || state.conf.defaultFontToken] || state.conf.fontsParsed[state.conf.defaultFontToken];
-		var value = font === null || font === void 0 ? void 0 : (_font_fontKey = font[fontKey]) === null || _font_fontKey === void 0 ? void 0 : _font_fontKey[lookupName];
-		return value ? fillTokenLookup(value, false, lookupName) : void 0;
-	}
-	var category = (0, import_tokenCategories.getTokenCategoryForProperty)(property);
-	var dot = lookupName.indexOf(".");
-	if (dot !== -1) {
-		var prefix = lookupName.slice(0, dot);
-		if (!category || prefix === category || prefix === "color") lookupName = lookupName.slice(dot + 1);
-	}
-	if (category) {
-		var _state_conf_tokensParsed_category;
-		var own = (_state_conf_tokensParsed_category = state.conf.tokensParsed[category]) === null || _state_conf_tokensParsed_category === void 0 ? void 0 : _state_conf_tokensParsed_category[lookupName];
-		if (own) return fillTokenLookup(own, false, lookupName);
-	} else {
-		var first = lookupName.charCodeAt(0);
-		if (first >= 48 && first <= 57 || first === 43 || first === 45 || first === 46) return;
-	}
-	var theme = ((_state_theme = state.theme) === null || _state_theme === void 0 ? void 0 : _state_theme[lookupName]) || ((_state_conf_themes = state.conf.themes) === null || _state_conf_themes === void 0 ? void 0 : (_state_conf_themes_ = _state_conf_themes[state.flatThemeName || ""]) === null || _state_conf_themes_ === void 0 ? void 0 : _state_conf_themes_[lookupName]);
-	if (theme) return fillTokenLookup(theme, true, lookupName);
-	if (category) return;
-	var token = ((_state_conf_tokensParsed_space = state.conf.tokensParsed.space) === null || _state_conf_tokensParsed_space === void 0 ? void 0 : _state_conf_tokensParsed_space[lookupName]) || ((_state_conf_tokensParsed_color = state.conf.tokensParsed.color) === null || _state_conf_tokensParsed_color === void 0 ? void 0 : _state_conf_tokensParsed_color[lookupName]);
-	return token ? fillTokenLookup(token, false, lookupName) : void 0;
-}
-var literalMissConf = null;
-var literalMissRevision = -1;
-var literalMisses = /* @__PURE__ */ new WeakMap();
-var literalMissRootTheme = {};
-function isFontKeyedProperty(property) {
-	return property === "fontFamily" || property === "fontSize" || property === "fontWeight" || property === "lineHeight" || property === "letterSpacing";
-}
-function literalMissSet(state) {
-	var revision = (0, import_grammarConfig.getConfigRevisionState)(state.conf).revision;
-	if (state.conf !== literalMissConf || revision !== literalMissRevision) {
-		literalMissConf = state.conf;
-		literalMissRevision = revision;
-		literalMisses = /* @__PURE__ */ new WeakMap();
-	}
-	var themeKey = state.theme && _type_of(state.theme) === "object" ? state.theme : literalMissRootTheme;
-	var set = literalMisses.get(themeKey);
-	if (!set) {
-		set = /* @__PURE__ */ new Set();
-		literalMisses.set(themeKey, set);
-	}
-	return set;
-}
+var valueCacheConf;
+var valueCacheRevision = -1;
+var valueCaches = /* @__PURE__ */ new WeakMap();
+var valueCacheEntries = 0;
+var valueCacheRoot = {};
+var parsedSlices = /* @__PURE__ */ new WeakMap();
+var fontProperties = /* @__PURE__ */ new Map();
 function configuredValue(state, property, raw) {
+	var embedded = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : false;
+	var _maps;
+	var grammar = (0, import_grammarConfig.getConfigRevisionState)(state.conf);
 	var name = raw;
 	var opacity;
 	var slash = raw.lastIndexOf("/");
@@ -1438,157 +1146,142 @@ function configuredValue(state, property, raw) {
 			opacity = amount;
 		}
 	}
-	var safeArea = (0, import_resolveSafeAreaVariable.resolveSafeAreaVariable)(name);
+	var safeArea = grammar.safeAreaVariable(name);
 	if (safeArea !== void 0) {
 		state.flatUsesSafeArea = true;
 		return safeArea;
 	}
-	var cacheable = !isFontKeyedProperty(property);
-	var misses;
-	var missKey = "";
-	if (cacheable) {
-		misses = literalMissSet(state);
-		missKey = `${state.flatThemeName || ""}${property}${name}`;
-		if (misses.has(missKey)) return raw;
-	}
-	if (process.env.NODE_ENV === "development") {
-		var _state_conf_tokensParsed_color;
-		var category = (0, import_tokenCategories.getTokenCategoryForProperty)(property);
-		if (category && category !== "color" && ((_state_conf_tokensParsed_color = state.conf.tokensParsed.color) === null || _state_conf_tokensParsed_color === void 0 ? void 0 : _state_conf_tokensParsed_color[name])) (0, import_warnOnce.warnOnce)(`"${name}" contributes to "color", not "${property}"`);
+	var fontProperty = fontProperties.get(property);
+	if (fontProperty === void 0) {
+		fontProperty = property.startsWith("font") || property === "lineHeight" || property === "letterSpacing";
+		fontProperties.set(property, fontProperty);
 	}
-	var lookup = tokenVariable(state, property, name);
-	if (!lookup || !(0, import_createVariable.isVariable)(lookup.value)) {
-		if (misses) misses.add(missKey);
-		return raw;
+	var revision = grammar.revision;
+	if (state.conf !== valueCacheConf || revision !== valueCacheRevision) {
+		valueCacheConf = state.conf;
+		valueCacheRevision = revision;
+		valueCaches = /* @__PURE__ */ new WeakMap();
+		valueCacheEntries = 0;
+		state.flatValueScope = void 0;
 	}
 	var resolveValues = state.styleProps.resolveValues;
-	if (resolveValues === "except-theme" && lookup.fromTheme) return `${import_themeRef.THEME_REF_PREFIX}${lookup.themeKey}${opacity !== void 0 ? `/${opacity}` : ""}`;
-	var value = (0, import_resolveVariableValue.resolveVariableValue)(property, lookup.value, resolveValues);
-	if (opacity !== void 0) value = (0, import_normalizeColor.normalizeColor)(value, opacity / 100);
-	return value;
-}
-function resolveEmbeddedTokens(state, property, raw) {
-	var copyFrom = 0;
-	var out = "";
-	var quote = 0;
-	for (var index = 0; index < raw.length; index++) {
-		var 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;
-		var end = index + 1;
-		while (end < raw.length) {
-			var 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) {
-			var suffix = end + 1;
-			while (suffix < raw.length) {
-				var next1 = raw.charCodeAt(suffix);
-				if (next1 < 48 || next1 > 57) break;
-				suffix++;
-			}
-			if (suffix > end + 1) end = suffix;
-		}
-		var 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;
-		}
-		var word = raw.slice(index, end);
-		var value = configuredValue(state, property, word);
-		if (value !== word) {
-			out += raw.slice(copyFrom, index);
-			out += String(value);
-			copyFrom = end;
-		}
-		index = end - 1;
+	var direct = state;
+	var scope = direct.flatValueScope;
+	if (scope === void 0 || direct.flatValueScopeKind !== resolveValues) {
+		var themeObject = state.theme && _type_of(state.theme) === "object" ? state.theme : valueCacheRoot;
+		var byScope = valueCaches.get(themeObject);
+		if (!byScope) valueCaches.set(themeObject, byScope = /* @__PURE__ */ new Map());
+		var scopeKey = `${state.flatThemeName || ""}${resolveValues}`;
+		scope = byScope.get(scopeKey);
+		if (!scope) byScope.set(scopeKey, scope = /* @__PURE__ */ new Map());
+		direct.flatValueScope = scope;
+		direct.flatValueScopeKind = resolveValues;
+	}
+	var maps = scope.get(property);
+	if (maps === void 0) scope.set(property, maps = { direct: /* @__PURE__ */ new Map() });
+	var byRaw = embedded ? (_maps = maps).embedded || (_maps.embedded = /* @__PURE__ */ new Map()) : maps.direct;
+	if (!fontProperty) {
+		var known = byRaw.get(raw);
+		if (known !== void 0 || byRaw.has(raw)) return known;
 	}
-	return copyFrom ? out + raw.slice(copyFrom) : raw;
-}
-function normalizeTransitionNames(state, raw) {
-	var quote = 0;
-	var depth = 0;
-	var copyFrom = 0;
-	var out = "";
-	for (var index = 0; index < raw.length; index++) {
-		var 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;
-		var end = index + 1;
-		while (end < raw.length) {
-			var 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) {
-			var authored = raw.slice(index, end);
-			var 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";
-			var hasUpper = false;
-			for (var offset = 0; offset < property.length; offset++) {
-				var letter = property.charCodeAt(offset);
-				if (letter >= 65 && letter <= 90) {
-					hasUpper = true;
-					break;
-				}
+	var lookupName = name.charCodeAt(0) === 36 ? name.slice(1) : name;
+	var value;
+	var fromTheme = false;
+	if (property === "fontFamily") {
+		var _state_conf_fontsParsed_lookupName;
+		value = (_state_conf_fontsParsed_lookupName = state.conf.fontsParsed[lookupName]) === null || _state_conf_fontsParsed_lookupName === void 0 ? void 0 : _state_conf_fontsParsed_lookupName.family;
+	} else {
+		var fontKey = property === "fontSize" ? "size" : property === "fontWeight" ? "weight" : property === "lineHeight" || property === "letterSpacing" ? property : "";
+		if (fontKey) {
+			var _font_fontKey;
+			var font = state.conf.fontsParsed[state.fontFamily || state.conf.defaultFontToken] || state.conf.fontsParsed[state.conf.defaultFontToken];
+			value = font === null || font === void 0 ? void 0 : (_font_fontKey = font[fontKey]) === null || _font_fontKey === void 0 ? void 0 : _font_fontKey[lookupName];
+		} else {
+			var _state_conf_tokensParsed_category;
+			var category = grammar.tokenCategory(property);
+			var dot = lookupName.indexOf(".");
+			if (dot !== -1) {
+				var prefix = lookupName.slice(0, dot);
+				if (!category || prefix === category || prefix === "color") lookupName = lookupName.slice(dot + 1);
 			}
-			if (property !== authored || hasUpper) {
-				out += raw.slice(copyFrom, index);
-				for (var offset1 = 0; offset1 < property.length; offset1++) {
-					var letter1 = property.charCodeAt(offset1);
-					out += letter1 >= 65 && letter1 <= 90 ? `-${String.fromCharCode(letter1 + 32)}` : property[offset1];
+			value = category ? (_state_conf_tokensParsed_category = state.conf.tokensParsed[category]) === null || _state_conf_tokensParsed_category === void 0 ? void 0 : _state_conf_tokensParsed_category[lookupName] : void 0;
+			if (!value) {
+				var first = lookupName.charCodeAt(0);
+				if (category || !(first >= 48 && first <= 57 || first === 43 || first === 45 || first === 46)) {
+					var _state_theme, _state_conf_themes_, _state_conf_themes;
+					value = ((_state_theme = state.theme) === null || _state_theme === void 0 ? void 0 : _state_theme[lookupName]) || ((_state_conf_themes = state.conf.themes) === null || _state_conf_themes === void 0 ? void 0 : (_state_conf_themes_ = _state_conf_themes[state.flatThemeName || ""]) === null || _state_conf_themes_ === void 0 ? void 0 : _state_conf_themes_[lookupName]);
+					fromTheme = !!value;
+					if (!value && !category) {
+						var _state_conf_tokensParsed_space, _state_conf_tokensParsed_color;
+						value = ((_state_conf_tokensParsed_space = state.conf.tokensParsed.space) === null || _state_conf_tokensParsed_space === void 0 ? void 0 : _state_conf_tokensParsed_space[lookupName]) || ((_state_conf_tokensParsed_color = state.conf.tokensParsed.color) === null || _state_conf_tokensParsed_color === void 0 ? void 0 : _state_conf_tokensParsed_color[lookupName]);
+					}
 				}
-				copyFrom = end;
 			}
 		}
-		index = end - 1;
 	}
-	return copyFrom ? out + raw.slice(copyFrom) : raw;
+	if (process.env.NODE_ENV === "development") {
+		var _state_conf_tokensParsed_color1;
+		var category1 = grammar.tokenCategory(property);
+		if (category1 && category1 !== "color" && ((_state_conf_tokensParsed_color1 = state.conf.tokensParsed.color) === null || _state_conf_tokensParsed_color1 === void 0 ? void 0 : _state_conf_tokensParsed_color1[name])) (0, import_warnOnce.warnOnce)(`"${name}" contributes to "color", not "${property}"`);
+	}
+	var out = raw;
+	if ((0, import_createVariable.isVariable)(value)) {
+		out = resolveValues === "except-theme" && fromTheme ? `${import_themeRef.THEME_REF_PREFIX}${lookupName}${opacity !== void 0 ? `/${opacity}` : ""}` : (0, import_resolveVariableValue.resolveVariableValue)(property, value, resolveValues);
+		if (opacity !== void 0) {
+			var _normalizeColor;
+			out = (_normalizeColor = (0, import_normalizeColor.normalizeColor)(out, opacity / 100)) !== null && _normalizeColor !== void 0 ? _normalizeColor : out;
+		}
+	}
+	if (embedded && out === raw) {
+		var usedSafeArea = state.flatUsesSafeArea;
+		out = grammar.embeddedTokens(raw, function(word) {
+			return configuredValue(state, property, word);
+		});
+		if (!usedSafeArea && state.flatUsesSafeArea) return out;
+	}
+	if (!fontProperty && !fromTheme) if (valueCacheEntries > 8192) {
+		valueCaches = /* @__PURE__ */ new WeakMap();
+		valueCacheEntries = 0;
+	} else {
+		valueCacheEntries++;
+		byRaw.set(raw, out);
+	}
+	return out;
 }
-function getDirectDynamicThemeAccess(state) {
-	return state.flatDynamicThemeAccess;
+function ownsSourceLayer(state, property) {
+	var conditional = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false;
+	var _direct_flatPass;
+	var _direct;
+	var direct = state;
+	var layer = ((_direct_flatPass = direct.flatPass) === null || _direct_flatPass === void 0 ? void 0 : _direct_flatPass[passSourceLayer]) || 0;
+	var layers = (_direct = direct).flatPropertyLayers || (_direct.flatPropertyLayers = /* @__PURE__ */ new Map());
+	var previous = layers.get(property);
+	if (previous !== void 0) {
+		if (previous > layer) return false;
+		if (previous < layer) {
+			if (conditional) return true;
+			clearDirectStyle(state, property);
+		}
+	} else if (conditional) return true;
+	layers.set(property, layer);
+	return true;
 }
-function emitProperty(state, property, value, cursor, merge, originalValue, contextOnly) {
+function emitProperty(state, property, value, cursor, originalValue, contextOnly) {
 	var _state_animationDriver;
 	var _state, _state1;
+	if (!ownsSourceLayer(state, property, cursor !== null)) return;
 	var direct = state;
-	var condition = cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
+	var condition = cursor ? cursor[conditionValue] : 0;
+	if (condition && (!(condition & 2) || !(condition & 1) && !(import_getCSSStylesAtomic.canGenerateCSS && state.flatShouldDoClasses) && !(cursor[conditionTheme] && import_constants.supportsDynamicColorIOS && (0, import_getDynamicVal.isColorStyleKey)(property)))) return;
 	if (condition & 4) ((_state = state).flatEnterKeys || (_state.flatEnterKeys = /* @__PURE__ */ new Set())).add(property);
 	if (condition & 8) ((_state1 = state).flatExitKeys || (_state1.flatExitKeys = /* @__PURE__ */ new Set())).add(property);
-	var theme = cursor ? conditionTexts[cursor + conditionThemeOffset] || "" : "";
+	var theme = cursor ? cursor[conditionTheme] : "";
 	if (theme) {
 		if (import_constants.supportsDynamicColorIOS && (0, import_getDynamicVal.isColorStyleKey)(property)) {
 			var _direct, _ref, _property;
 			var schemes = (_ref = (_direct = direct).flatDynamicColors || (_direct.flatDynamicColors = {}))[_property = property] || (_ref[_property] = {});
-			schemes[theme] = typeof originalValue === "string" && isAsciiLetters(originalValue) ? originalValue : value;
-			streamWriteInline(state, property, { dynamic: { ...schemes } }, cursor, merge, originalValue, true, condition & 1 ? condition : condition + 1);
+			schemes[theme] = typeof originalValue === "string" && /^[a-z]+$/i.test(originalValue) ? originalValue : value;
+			streamWriteInline(state, property, { dynamic: { ...schemes } }, cursor, originalValue, true, condition & 1 ? condition : condition + 1);
 			return;
 		}
 		direct.flatDynamicThemeAccess = true;
@@ -1600,23 +1293,23 @@ function emitProperty(state, property, value, cursor, merge, originalValue, cont
 		}
 		return;
 	}
-	if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && !condition && property === "transform") {
+	if (import_getCSSStylesAtomic.canGenerateCSS && state.flatShouldDoClasses && !condition && property === "transform") {
 		var _state4;
 		if (process.env.NODE_ENV === "development" && state.transformAccumulator) {
-			var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
+			var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
 			try {
-				for (var _iterator2 = (0, import_runtime.getTransformPartKeys)(state.transformAccumulator)[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-					var part3 = _step2.value;
-					(0, import_warnOnce.warnOnce)(`legacy transform part "${part3}" is dropped because "transform" owns the property`);
+				for (var _iterator = (0, import_runtime.getTransformPartKeys)(state.transformAccumulator)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+					var part = _step.value;
+					(0, import_warnOnce.warnOnce)(`legacy transform part "${part}" is dropped because "transform" owns the property`);
 				}
 			} catch (err) {
-				_didIteratorError2 = true;
-				_iteratorError2 = err;
+				_didIteratorError = true;
+				_iteratorError = err;
 			} finally {
 				try {
-					if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
+					if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
 				} finally {
-					if (_didIteratorError2) throw _iteratorError2;
+					if (_didIteratorError) throw _iteratorError;
 				}
 			}
 		}
@@ -1624,44 +1317,12 @@ function emitProperty(state, property, value, cursor, merge, originalValue, cont
 		(0, import_runtime.addTransformValue)(state.transformAccumulator, property, value);
 		return;
 	}
-	var shouldPromoteAnimatedStyle = import_directStyleCSS.canGenerateCSS && !condition && !state.flatShouldDoClasses && !state.styleProps.noMergeStyle && state.styleProps.isAnimated && ((_state_animationDriver = state.animationDriver) === null || _state_animationDriver === void 0 ? void 0 : _state_animationDriver.inputStyle) === "css" && property in import_helpers.nonAnimatableStyleProps;
-	if (import_directStyleCSS.canGenerateCSS && (state.flatShouldDoClasses || shouldPromoteAnimatedStyle)) {
-		if (!condition && state.style && !(direct.flatUsed && direct.flatUsed[property])) delete state.style[property];
-		streamWriteCSS(state, property, value, cursor, originalValue);
+	var shouldPromoteAnimatedStyle = import_getCSSStylesAtomic.canGenerateCSS && !condition && !state.flatShouldDoClasses && !state.styleProps.noMergeStyle && state.styleProps.isAnimated && ((_state_animationDriver = state.animationDriver) === null || _state_animationDriver === void 0 ? void 0 : _state_animationDriver.inputStyle) === "css" && property in import_helpers.nonAnimatableStyleProps;
+	if (import_getCSSStylesAtomic.canGenerateCSS && (state.flatShouldDoClasses || shouldPromoteAnimatedStyle)) {
+		writeStyleRecord(state, property, value, cursor, originalValue, shouldPromoteAnimatedStyle ? recordCSS : 0);
 		return;
 	}
-	if (condition && !(condition & 1)) return;
-	streamWriteInline(state, property, value, cursor, merge, originalValue);
-}
-function splitComponents(value) {
-	var parts = [];
-	var start = 0;
-	var quote = 0;
-	var depth = 0;
-	for (var index = 0; index <= value.length; index++) {
-		var 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 isAsciiLetters(value) {
-	if (!value) return false;
-	for (var index = 0; index < value.length; index++) {
-		var code = value.charCodeAt(index) | 32;
-		if (code < 97 || code > 122) return false;
-	}
-	return true;
+	streamWriteInline(state, property, value, cursor, originalValue);
 }
 function numericUnitValue(value, first, second) {
 	var unitLength = value.endsWith(first) || second !== void 0 && value.endsWith(second) ? first.length : 0;
@@ -1669,858 +1330,391 @@ function numericUnitValue(value, first, second) {
 	var numeric = Number(value.slice(0, value.length - unitLength));
 	return Number.isFinite(numeric) ? numeric : NaN;
 }
-function isNumericCSSComponent(value) {
-	var index = 0;
-	if (value.charCodeAt(index) === 43 || value.charCodeAt(index) === 45) index++;
-	var digits = 0;
-	var dot = false;
-	for (; index < value.length; index++) {
-		var 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++) {
-		var code1 = value.charCodeAt(index);
-		if (code1 !== 37 && (code1 < 97 || code1 > 122)) return false;
-	}
-	return true;
-}
-function startsValueFunction(value) {
-	var index = 0;
-	while (index < value.length) {
-		var 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) {
+function emitBorder(state, property, raw, cursor, originalValue, contextOnly) {
 	if (property === "borderBlock" || property === "borderInline") {
 		if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`RN has no logical border shorthand "${property}"; dropping it`);
 		return;
 	}
-	var width;
-	var style;
-	var color;
-	var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
-	try {
-		for (var _iterator2 = splitComponents(raw)[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-			var part3 = _step2.value;
-			if (lineStyles.has(part3) || property === "outline" && part3 === "auto") style = part3;
-			else if (part3 === "thin" || part3 === "medium" || part3 === "thick" || isNumericCSSComponent(part3) || startsValueFunction(part3)) width = part3;
-			else color = part3;
-		}
-	} catch (err) {
-		_didIteratorError2 = true;
-		_iteratorError2 = err;
-	} finally {
-		try {
-			if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
-		} finally {
-			if (_didIteratorError2) throw _iteratorError2;
-		}
-	}
+	var { width, style, color } = (0, import_borderComponents.classifyBorderComponents)(raw, property === "outline");
 	if (style === "none" && width === void 0) width = "0";
-	var targets = borderTargets[property];
 	if (width !== void 0) {
-		var _iteratorNormalCompletion12 = true, _didIteratorError12 = false, _iteratorError12 = void 0;
-		try {
-			for (var _iterator12 = targets.width[Symbol.iterator](), _step12; !(_iteratorNormalCompletion12 = (_step12 = _iterator12.next()).done); _iteratorNormalCompletion12 = true) {
-				var target2 = _step12.value;
-				emitResolved(state, target2, width, cursor, merge, originalValue, contextOnly);
-			}
-		} catch (err) {
-			_didIteratorError12 = true;
-			_iteratorError12 = err;
-		} finally {
-			try {
-				if (!_iteratorNormalCompletion12 && _iterator12.return != null) _iterator12.return();
-			} finally {
-				if (_didIteratorError12) throw _iteratorError12;
-			}
-		}
+		if (width === "thin") width = "1px";
+		else if (width === "medium") width = "3px";
+		else if (width === "thick") width = "5px";
 	}
-	if (style !== void 0) {
-		var styleTargets = property === "border" ? ["borderStyle"] : targets.style;
-		var _iteratorNormalCompletion22 = true, _didIteratorError22 = false, _iteratorError22 = void 0;
-		try {
-			for (var _iterator22 = styleTargets[Symbol.iterator](), _step22; !(_iteratorNormalCompletion22 = (_step22 = _iterator22.next()).done); _iteratorNormalCompletion22 = true) {
-				var target1 = _step22.value;
-				emitProperty(state, target1, style, cursor, merge, originalValue, contextOnly);
-			}
-		} catch (err) {
-			_didIteratorError22 = true;
-			_iteratorError22 = err;
-		} finally {
-			try {
-				if (!_iteratorNormalCompletion22 && _iterator22.return != null) _iterator22.return();
-			} finally {
-				if (_didIteratorError22) throw _iteratorError22;
-			}
-		}
-	}
-	if (color !== void 0) {
-		var _iteratorNormalCompletion3 = true, _didIteratorError3 = false, _iteratorError3 = void 0;
-		try {
-			for (var _iterator3 = targets.color[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {
-				var target22 = _step3.value;
-				emitResolved(state, target22, color, cursor, merge, originalValue, contextOnly);
-			}
-		} catch (err) {
-			_didIteratorError3 = true;
-			_iteratorError3 = err;
-		} finally {
-			try {
-				if (!_iteratorNormalCompletion3 && _iterator3.return != null) _iterator3.return();
-			} finally {
-				if (_didIteratorError3) throw _iteratorError3;
-			}
-		}
-	}
-}
-function emitTextDecoration(state, raw, cursor, merge, originalValue, contextOnly) {
-	var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
+	var targets = borderTargets[property];
+	var prefix = property === "outline" ? "outline" : "border";
+	if (style !== void 0 && property === "border") emitProperty(state, "borderStyle", style, cursor, originalValue, contextOnly);
+	var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
 	try {
-		for (var _iterator2 = splitComponents(raw)[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-			var part3 = _step2.value;
-			emitResolved(state, part3 === "solid" || part3 === "double" || part3 === "dotted" || part3 === "dashed" || part3 === "wavy" ? "textDecorationStyle" : part3 === "underline" || part3 === "overline" || part3 === "line-through" || part3 === "none" ? "textDecorationLine" : "textDecorationColor", part3, cursor, merge, originalValue, contextOnly);
+		for (var _iterator = targets[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+			var propBase = `${prefix}${_step.value}`;
+			if (width !== void 0) emitResolved(state, `${propBase}Width`, width, cursor, originalValue, contextOnly);
+			if (style !== void 0 && !(property === "border")) emitProperty(state, `${propBase}Style`, style, cursor, originalValue, contextOnly);
+			if (color !== void 0) emitResolved(state, `${propBase}Color`, color, cursor, originalValue, contextOnly);
 		}
 	} catch (err) {
-		_didIteratorError2 = true;
-		_iteratorError2 = err;
+		_didIteratorError = true;
+		_iteratorError = err;
 	} finally {
 		try {
-			if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
+			if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
 		} finally {
-			if (_didIteratorError2) throw _iteratorError2;
+			if (_didIteratorError) throw _iteratorError;
 		}
 	}
 }
-function emitTransform(state, property, value, cursor, merge, originalValue, contextOnly) {
-	if (!import_directStyleCSS.canGenerateCSS || !state.flatShouldDoClasses) {
-		emitProperty(state, property, value, cursor, merge, originalValue, contextOnly);
-		return;
-	}
-	var 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"];
-	var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
+function emitTextDecoration(state, raw, cursor, originalValue, contextOnly) {
+	var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
 	try {
-		for (var _iterator2 = targets[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-			var target2 = _step2.value;
-			var targetValue = value;
-			if (typeof targetValue === "number") {
-				if (target2 === "--t-x" || target2 === "--t-y") targetValue = `${targetValue}px`;
-				else if (target2 === "rotate") targetValue = `${targetValue}deg`;
-			}
-			emitProperty(state, target2, targetValue, cursor, merge, originalValue, contextOnly);
-			if (target2 === "--t-x" || target2 === "--t-y") (0, import_directStyleCSS.addComposition)(state, "translate");
-			else if (target2.startsWith("--t-scale")) (0, import_directStyleCSS.addComposition)(state, "scale");
+		for (var _iterator = (0, import_borderComponents.splitComponents)(raw)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+			var part = _step.value;
+			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, originalValue, contextOnly);
 		}
 	} catch (err) {
-		_didIteratorError2 = true;
-		_iteratorError2 = err;
+		_didIteratorError = true;
+		_iteratorError = err;
 	} finally {
 		try {
-			if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
+			if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
 		} finally {
-			if (_didIteratorError2) throw _iteratorError2;
+			if (_didIteratorError) throw _iteratorError;
 		}
 	}
 }
-function emitResolved(state, property, raw, cursor, merge, originalValue, contextOnly) {
-	var value = configuredValue(state, property, raw);
-	if (value === raw) value = resolveEmbeddedTokens(state, property, raw);
+function emitResolved(state, property, raw, cursor, originalValue, contextOnly) {
+	var value = configuredValue(state, property, raw, true);
 	if (typeof value === "string") {
 		var 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);
+	emitProperty(state, property, value, cursor, originalValue, contextOnly);
 }
-var emitKindTransition = 1;
-var emitKindTransformPart = 2;
-var emitKindWebShadow = 3;
-var emitKindWebTextShadow = 4;
-var emitKindTransform = 5;
-var emitKindBorder = 6;
-var emitKindTextDecoration = 7;
-var emitKindBackground = 8;
-var emitKindAxis = 9;
-var emitKindBorderRadius = 10;
-var emitKindBorderWidth = 11;
-var 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
-};
-var _iteratorNormalCompletion = true;
-var _didIteratorError = false;
-var _iteratorError = void 0;
-try {
-	for (var _iterator = legacyTransformParts[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
-		var part = _step.value;
-		emitValueKinds[part] = emitKindTransformPart;
-	}
-} catch (err) {
-	_didIteratorError = true;
-	_iteratorError = err;
-} finally {
-	try {
-		if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
-	} finally {
-		if (_didIteratorError) throw _iteratorError;
-	}
-}
-for (var part1 in webShadowParts) emitValueKinds[part1] = emitKindWebShadow;
-var _iteratorNormalCompletion1 = true;
-var _didIteratorError1 = false;
-var _iteratorError1 = void 0;
-try {
-	for (var _iterator1 = webTextShadowParts[Symbol.iterator](), _step1; !(_iteratorNormalCompletion1 = (_step1 = _iterator1.next()).done); _iteratorNormalCompletion1 = true) {
-		var part2 = _step1.value;
-		emitValueKinds[part2] = emitKindWebTextShadow;
-	}
-} catch (err) {
-	_didIteratorError1 = true;
-	_iteratorError1 = err;
-} finally {
-	try {
-		if (!_iteratorNormalCompletion1 && _iterator1.return != null) _iterator1.return();
-	} finally {
-		if (_didIteratorError1) throw _iteratorError1;
-	}
+function shadowUnit(part) {
+	return typeof part === "number" ? `${part}px` : part || "0px";
 }
-for (var target in borderTargets) emitValueKinds[target] = emitKindBorder;
-function shadowUnit(part3) {
-	return typeof part3 === "number" ? `${part3}px` : part3 || "0px";
-}
-function emitValue(state, property, raw, cursor, merge, originalValue, contextOnly) {
-	var condition = cursor ? conditionNumbers[cursor + conditionValueOffset] : 0;
+function emitValue(state, property, raw, cursor, originalValue, contextOnly) {
+	var condition = cursor ? cursor[conditionValue] : 0;
+	var grammar = (0, import_grammarConfig.getConfigRevisionState)(state.conf);
 	if ((0, import_createVariable.isVariable)(raw)) raw = (0, import_resolveVariableValue.resolveVariableValue)(property, raw, state.styleProps.resolveValues);
-	var 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:
-			var value = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
-			if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && !condition) {
-				var _state;
-				(_state = state).transformAccumulator || (_state.transformAccumulator = (0, import_runtime.createTransformAccumulator)());
-				(0, import_runtime.addTransformValue)(state.transformAccumulator, property, value);
-			} else if (condition && import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses) emitProperty(state, "transform", `${property}(${value})`, cursor, merge, originalValue, contextOnly);
-			else streamWriteInline(state, property, value, cursor, merge, originalValue, true);
-			return;
-		case emitKindWebShadow: break;
-		case emitKindWebTextShadow: break;
-		case emitKindTransform:
-			if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && Array.isArray(raw)) raw = (0, import_transformsToString.transformsToString)(raw);
-			if (typeof raw === "string") {
-				var transform = (0, import_parseNativeTransform.parseNativeTransform)(raw);
-				if (transform) {
-					emitProperty(state, property, transform, cursor, merge, originalValue, contextOnly);
-					return;
-				}
-			}
-			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);
+	if (typeof raw === "string" && (property === "transition" || property === "transitionProperty")) raw = grammar.normalizeTransition(raw);
+	if ((property === "borderWidth" || property === "borderTopWidth" || property === "borderRightWidth" || property === "borderBottomWidth" || property === "borderLeftWidth") && state.styleProps.noNormalize !== false) writeStyleRecord(state, "borderStyle", "solid", cursor, originalValue, recordDefault);
+	if (grammar.propertyKind(property) === 5) {
+		var value = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
+		if (import_getCSSStylesAtomic.canGenerateCSS && state.flatShouldDoClasses && !condition) {
+			var _state;
+			(_state = state).transformAccumulator || (_state.transformAccumulator = (0, import_runtime.createTransformAccumulator)());
+			(0, import_runtime.addTransformValue)(state.transformAccumulator, property, value);
+		} else if (condition && import_getCSSStylesAtomic.canGenerateCSS && state.flatShouldDoClasses) emitProperty(state, "transform", `${property}(${value})`, cursor, originalValue, contextOnly);
+		else streamWriteInline(state, property, value, cursor, originalValue, true);
+		return;
+	}
+	if (property === "transform") {
+		if (import_getCSSStylesAtomic.canGenerateCSS && state.flatShouldDoClasses && Array.isArray(raw)) raw = (0, import_transformsToString.transformsToString)(raw);
+		if (typeof raw === "string") {
+			var transform = (0, import_parseNativeTransform.parseNativeTransform)(raw);
+			if (transform) {
+				emitProperty(state, property, transform, cursor, originalValue, contextOnly);
 				return;
 			}
-			break;
-		case emitKindBackground:
-			if (typeof raw === "string") {
-				var parts = splitComponents(raw);
-				if (parts.length === 1 && !startsValueFunction(parts[0])) {
-					emitResolved(state, "backgroundColor", parts[0], cursor, merge, originalValue, contextOnly);
-					return;
+		}
+	}
+	if (typeof raw === "string" && borderTargets[property]) {
+		emitBorder(state, property, raw, cursor, originalValue, contextOnly);
+		return;
+	}
+	if (typeof raw === "string" && property === "textDecoration") {
+		emitTextDecoration(state, raw, cursor, originalValue, contextOnly);
+		return;
+	}
+	if (typeof raw === "string" && property === "background") {
+		var parts = (0, import_borderComponents.splitComponents)(raw);
+		if (parts.length === 1 && !(0, import_borderComponents.startsValueFunction)(parts[0])) {
+			emitResolved(state, "backgroundColor", parts[0], cursor, originalValue, contextOnly);
+			return;
+		}
+		if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`native background cannot represent "${raw}"; dropping it`);
+		return;
+	}
+	if (property === "x" || property === "y" || property === "scale" || property === "scaleX" || property === "scaleY" || property === "rotate") {
+		var value2 = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
+		if (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);
+					writeStyleRecord(state, property, void 0, cursor, void 0, recordRetract);
 				}
-				if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`native background cannot represent "${raw}"; dropping it`);
 				return;
 			}
-			break;
-		case emitKindAxis:
-			var value3 = typeof raw === "string" ? configuredValue(state, property, raw) : raw;
-			if (typeof value3 === "string" && !value3.startsWith(import_themeRef.THEME_REF_PREFIX)) {
-				if (property === "rotate" && !Number.isFinite(numericUnitValue(value3, "deg", "rad"))) {
-					if (process.env.NODE_ENV === "development") (0, import_warnOnce.warnOnce)(`native transform "${property}" cannot represent "${value3}"; dropping it`);
-					if (condition & 1) {
-						(0, import_runtime.removeTransformValue)(state.transformAccumulator, property);
-						streamRetractInline(state, property, cursor);
-					}
-					return;
+			var unitValue = numericUnitValue(value2, "px", "dp");
+			if (Number.isFinite(unitValue)) value2 = unitValue;
+			else if (Number.isFinite(Number(value2))) value2 = Number(value2);
+		}
+		if (!import_getCSSStylesAtomic.canGenerateCSS || !state.flatShouldDoClasses) {
+			emitProperty(state, property, value2, cursor, originalValue, contextOnly);
+			return;
+		}
+		var 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"];
+		var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
+		try {
+			for (var _iterator = targets[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+				var target1 = _step.value;
+				var targetValue = value2;
+				if (typeof targetValue === "number") {
+					if (target1 === "--t-x" || target1 === "--t-y") targetValue = `${targetValue}px`;
+					else if (target1 === "rotate") targetValue = `${targetValue}deg`;
 				}
-				var unitValue = numericUnitValue(value3, "px", "dp");
-				if (Number.isFinite(unitValue)) value3 = unitValue;
-				else if (Number.isFinite(Number(value3))) value3 = Number(value3);
+				emitProperty(state, target1, targetValue, cursor, originalValue, contextOnly);
+				if (target1 === "--t-x" || target1 === "--t-y") (0, import_getCSSStylesAtomic.addComposition)(state, "translate");
+				else if (target1.startsWith("--t-scale")) (0, import_getCSSStylesAtomic.addComposition)(state, "scale");
 			}
-			emitTransform(state, property, value3, cursor, merge, originalValue, contextOnly);
-			return;
-		case emitKindBorderRadius: break;
-	}
-	var value4 = raw;
-	if (typeof raw === "string") {
-		value4 = configuredValue(state, property, raw);
-		if (value4 === raw) value4 = resolveEmbeddedTokens(state, property, raw);
+		} catch (err) {
+			_didIteratorError = true;
+			_iteratorError = err;
+		} finally {
+			try {
+				if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
+			} finally {
+				if (_didIteratorError) throw _iteratorError;
+			}
+		}
+		return;
 	}
-	if (typeof value4 === "string") {
-		var unitValue1 = numericUnitValue(value4, "px", "dp");
-		if (Number.isFinite(unitValue1)) value4 = unitValue1;
-		else if (value4 !== "" && Number.isFinite(Number(value4))) value4 = Number(value4);
+	var value3 = raw;
+	if (typeof raw === "string") value3 = configuredValue(state, property, raw, true);
+	if (typeof value3 === "string") {
+		var unitValue1 = numericUnitValue(value3, "px", "dp");
+		if (Number.isFinite(unitValue1)) value3 = unitValue1;
+		else if (value3 !== "" && Number.isFinite(Number(value3))) value3 = Number(value3);
 	}
-	if (import_directStyleCSS.canGenerateCSS && state.flatShouldDoClasses && property === "boxShadow" && !condition) {
-		state.flatBoxShadow = value4;
+	if (import_getCSSStylesAtomic.canGenerateCSS && state.flatShouldDoClasses && property === "boxShadow" && !condition) {
+		state.flatBoxShadow = value3;
 		state.flatBoxShadowSequence = frameSequence + 1;
 	}
-	if (typeof value4 === "string" && (property === "backgroundImage" || property === "boxShadow" || property === "textShadow")) {
-		var parsed = (0, import_parseNativeStyle.parseNativeStyle)(property, value4);
+	if (typeof value3 === "string" && (property === "backgroundImage" || property === "boxShadow" || property === "textShadow")) {
+		var parsed = (0, import_parseNativeStyle.parseNativeStyle)(property, value3);
 		if (parsed) {
 			if (property === "textShadow") {
-				var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
+				var _iteratorNormalCompletion1 = true, _didIteratorError1 = false, _iteratorError1 = void 0;
 				try {
-					for (var _iterator2 = parsed[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-						var [key, parsedValue] = _step2.value;
-						emitProperty(state, key, parsedValue, cursor, merge, originalValue, contextOnly);
+					for (var _iterator1 = parsed[Symbol.iterator](), _step1; !(_iteratorNormalCompletion1 = (_step1 = _iterator1.next()).done); _iteratorNormalCompletion1 = true) {
+						var [key, parsedValue] = _step1.value;
+						emitProperty(state, key, parsedValue, cursor, originalValue, contextOnly);
 					}
 				} catch (err) {
-					_didIteratorError2 = true;
-					_iteratorError2 = err;
+					_didIteratorError1 = true;
+					_iteratorError1 = err;
 				} finally {
 					try {
-						if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
+						if (!_iteratorNormalCompletion1 && _iterator1.return != null) _iterator1.return();
 					} finally {
-						if (_didIteratorError2) throw _iteratorError2;
+						if (_didIteratorError1) throw _iteratorError1;
 					}
 				}
-			} else emitProperty(state, property === "backgroundImage" ? "experimental_backgroundImage" : property, parsed, cursor, merge, originalValue, contextOnly);
+			} else emitProperty(state, property === "backgroundImage" ? "experimental_backgroundImage" : property, parsed, cursor, originalValue, contextOnly);
 			return;
 		}
 	}
-	if (property === "fontVariant" && typeof value4 === "string") {
+	if (property === "fontVariant" && typeof value3 === "string") {
 		var variants = [];
 		var start = 0;
-		for (var index = 0; index <= value4.length; index++) {
-			var code = index === value4.length ? 32 : value4.charCodeAt(index);
+		for (var index = 0; index <= value3.length; index++) {
+			var code = index === value3.length ? 32 : value3.charCodeAt(index);
 			if (code !== 44 && code > 32) continue;
-			if (start < index) variants.push(value4.slice(start, index));
+			if (start < index) variants.push(value3.slice(start, index));
 			start = index + 1;
 		}
-		value4 = variants;
+		value3 = variants;
 	}
-	var expanded = state.styleProps.noExpand ? null : (0, import_expandStyle.expandStyle)(property, value4, state.conf.settings.styleCompat || "web");
+	var expanded = !state.styleProps.noExpand ? (0, import_expandStyle.expandStyle)(property, value3, state.conf.settings.styleCompat || "web") : null;
 	if (!expanded) {
-		emitProperty(state, property, value4, cursor, merge, originalValue, contextOnly);
+		emitProperty(state, property, value3, cursor, originalValue, contextOnly);
 		return;
 	}
 	if (typeof raw === "string" && expanded.length > 1) {
-		var parts1 = splitComponents(raw);
+		var parts1 = (0, import_borderComponents.splitComponents)(raw);
 		if (parts1.length > 0 && parts1.length <= (expanded.length === 4 ? 4 : 2)) {
 			for (var index1 = 0; index1 < expanded.length; index1++) {
 				var partIndex = index1 === 0 || parts1.length === 1 ? 0 : index1 === 1 || index1 === 3 && parts1.length < 4 ? 1 : index1 === 2 && parts1.length < 3 ? 0 : index1;
-				emitResolved(state, expanded[index1][0], parts1[partIndex], cursor, merge, originalValue, contextOnly);
+				emitResolved(state, expanded[index1][0], parts1[partIndex], cursor, originalValue, contextOnly);
 			}
 			return;
 		}
 	}
-	for (var index2 = 0; index2 < expanded.length; index2++) emitProperty(state, expanded[index2][0], expanded[index2][1], cursor, merge, originalValue, contextOnly);
+	for (var index2 = 0; index2 < expanded.length; index2++) emitProperty(state, expanded[index2][0], expanded[index2][1], cursor, originalValue, contextOnly);
 }
-function contributeStyleString(state, property, source, merge, originalValue) {
-	var contextOnly = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : false;
-	var directState = state;
-	var watermark = conditionCursorTop;
-	var previousCursor = directState.flatScanCursor;
-	var previousExpectMulti = directState.flatExpectMulti;
-	directState.flatScanCursor = null;
-	directState.flatExpectMulti = source.indexOf(":") !== -1;
-	try {
-		(0, import_runtime.scanFlatValue)(source, directStyleHandler, state, property, merge, originalValue, contextOnly);
-	} finally {
-		directState.flatScanCursor = previousCursor;
-		directState.flatExpectMulti = previousExpectMulti;
-		releaseConditionCursors(watermark);
-	}
-	return true;
-}
-function contributeStyleObject(state, property, value, merge, contextOnly) {
-	var outerState = state;
-	var 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) {
-	var _directState_flatPass;
-	var parent = ((_directState_flatPass = state.flatPass) === null || _directState_flatPass === void 0 ? void 0 : _directState_flatPass[passParentCursor]) || null;
-	var hasDefault = "default" in value;
+function walkConditionalValue(state, property, value, parent, sink) {
+	var warnMode = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : 0;
+	var parentCondition = parent || null;
 	var hasBase = false;
-	var base = hasDefault ? value.default : void 0;
-	if (base != null) {
-		emitAtParentCondition(state, property, base, merge, base, contextOnly);
-		hasBase = true;
-	}
 	var conditions = 0;
-	var firstCondition = !hasDefault;
-	for (var key in value) {
-		if (key === "default") continue;
-		var payload = value[key];
-		var watermark = conditionCursorTop;
-		var cursor = acquireConditionCursor(parent);
-		resolveConditionText(state, cursor, key);
-		var condition = commitConditionCursor(state, cursor);
-		if (firstCondition) {
-			firstCondition = false;
-			if (!condition) {
-				releaseConditionCursors(watermark);
-				return false;
+	var lastPayload = "";
+	if (typeof value === "string") {
+		var parsed = (0, import_grammarConfig.getConfigRevisionState)(state.conf).parseFlatValue(value);
+		var [segments, failure, failureIndex] = parsed;
+		var slices = parsedSlices.get(parsed);
+		if (slices === void 0) parsedSlices.set(parsed, slices = []);
+		var chainCount = segments.length / 5 - 1;
+		if (property === "aspectRatio" && chainCount === 1) {
+			var left = Number(value.slice(segments[7], segments[8]));
+			var right = Number(value.slice(segments[5], segments[6]));
+			if (left > 0 && right > 0 && Number.isFinite(left) && Number.isFinite(right)) return false;
+		}
+		for (var index = 0; index < segments.length; index += 5) {
+			var start = segments[index];
+			var end = segments[index + 1];
+			var flags = segments[index + 4];
+			if (!(flags & 1)) continue;
+			if (start === end) continue;
+			if (flags & 2) {
+				var _slices, _index;
+				var _;
+				var payload = (_ = (_slices = slices)[_index = index]) !== null && _ !== void 0 ? _ : _slices[_index] = value.slice(start, end);
+				sink(payload, parentCondition, payload);
+				hasBase = true;
+			} else if (process.env.NODE_ENV !== "production" && warnMode && !chainCount && (failure === "invalid-character" || failure === "stray-comment-close")) {
+				sink(value, parentCondition, value);
+				hasBase = true;
+			} else if (warnMode) warnScanFailure(property, value, failure, failureIndex);
+		}
+		var lastPayloadStart = 0;
+		for (var index1 = 0; index1 < segments.length; index1 += 5) {
+			var _slices1, _ref;
+			var start1 = segments[index1];
+			var end1 = segments[index1 + 1];
+			var flags1 = segments[index1 + 4];
+			if (flags1 & 1) continue;
+			if (!(flags1 & 4) || !(flags1 & 2)) {
+				if (warnMode) warnScanFailure(property, value, failure, failureIndex);
+				continue;
 			}
+			lastPayloadStart = start1;
+			if (start1 === end1) {
+				if (warnMode && process.env.NODE_ENV === "development") (0, import_warnOnce.warnRefusedValue)(property, value, "a conditional clause has no value");
+				continue;
+			}
+			var _1;
+			var cursor = conditionFromKey(state, (_1 = (_slices1 = slices)[_ref = index1 + 2]) !== null && _1 !== void 0 ? _1 : _slices1[_ref] = value.slice(segments[index1 + 2], segments[index1 + 3]), parentCondition);
+			conditions |= cursor[conditionValue];
+			if (cursor[conditionValue] & conditionResolvedFlag || warnMode) {
+				var _slices2, _index1;
+				var _2;
+				sink((_2 = (_slices2 = slices)[_index1 = index1]) !== null && _2 !== void 0 ? _2 : _slices2[_index1] = value.slice(start1, end1), cursor, value);
+			}
+		}
+		if (process.env.NODE_ENV !== "production") lastPayload = value.slice(lastPayloadStart);
+	} else {
+		if (!value || (typeof value === "undefined" ? "undefined" : _type_of(value)) !== "object" || Array.isArray(value) || (0, import_createVariable.isVariable)(value) || !classifyConditionalObject(value, state)) return false;
+		if (value.default != null) {
+			sink(value.default, parentCondition, value.default);
+			hasBase = true;
+		}
+		for (var key in value) {
+			if (key === "default" || value[key] == null) continue;
+			var cursor1 = conditionFromKey(state, key, parentCondition);
+			conditions |= cursor1[conditionValue];
+			if (cursor1[conditionValue] & conditionResolvedFlag || warnMode) sink(value[key], cursor1, value[key]);
 		}
-		if (payload != null) conditions |= emitUnderCondition(state, property, payload, cursor, merge, payload, contextOnly, 1, payload);
-		releaseConditionCursors(watermark);
 	}
-	if (!hasDefault && firstCondition) return false;
-	if ((!import_directStyleCSS.canGenerateCSS || !state.flatShouldDoClasses) && conditions & 12 && !hasBase) {
-		var resting = implicitLifecycleBase(property);
-		if (resting !== null) emitAtParentCondition(state, property, resting, merge, resting, contextOnly);
+	if (warnMode && process.env.NODE_ENV === "development" && typeof value === "string" && !hasBase && conditions && (0, import_grammarConfig.getConfigRevisionState)(state.conf).tokenCategory(property) && (0, import_borderComponents.splitComponents)(lastPayload).length > 1) (0, import_warnOnce.warnOnce)(`${property}="${value}" has multiple values after its first conditional. Write the base value before the first conditional.`);
+	if (warnMode === 1 && (!import_getCSSStylesAtomic.canGenerateCSS || !state.flatShouldDoClasses) && conditions & 12 && !hasBase) {
+		var _state_flatPropertyLayers;
+		var resting = property === "opacity" || property.startsWith("scale") ? 1 : property === "rotate" ? "0deg" : property === "x" || property === "y" ? 0 : null;
+		if (resting !== null && !((_state_flatPropertyLayers = state.flatPropertyLayers) === null || _state_flatPropertyLayers === void 0 ? void 0 : _state_flatPropertyLayers.has(property))) sink(resting, parentCondition, resting);
 	}
 	return true;
 }
-function contributeValue(state, property, value, merge, originalValue) {
-	var contextOnly = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : false, condition = arguments.length > 6 ? arguments[6] : void 0;
-	if (isConditionTransport(value)) {
-		if (value[transportHasBase]) {
-			var base = value[transportBase];
-			contributeValue(state, property, base, merge, base, contextOnly);
-		}
-		for (var offset = transportEntries; offset < value.length;) {
-			var entryValue = value[offset];
-			var watermark = conditionCursorTop;
-			try {
-				var _state_flatPass;
-				emitUnderCondition(state, property, entryValue, acquireTransportCursor(state, value, offset, ((_state_flatPass = state.flatPass) === null || _state_flatPass === void 0 ? void 0 : _state_flatPass[passParentCursor]) || null), merge, entryValue, contextOnly, 2, entryValue);
-			} finally {
-				releaseConditionCursors(watermark);
-			}
-			offset += transportEntryWidth;
-		}
-		return true;
-	}
+function contributeValue(state, property, value, originalValue) {
+	var contextOnly = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : false, condition = arguments.length > 5 ? arguments[5] : void 0;
+	var _state_flatPass;
 	if (condition !== void 0) {
 		var _directState_flatPass;
 		var parent = ((_directState_flatPass = state.flatPass) === null || _directState_flatPass === void 0 ? void 0 : _directState_flatPass[passParentCursor]) || null;
-		var watermark1 = conditionCursorTop;
-		try {
-			var effective;
-			if (typeof condition === "string") {
-				effective = acquireConditionCursor(parent);
-				resolveConditionText(state, effective, condition);
-				commitConditionCursor(state, effective);
-			} else if (parent) {
-				effective = acquireConditionCursor(parent);
-				var conditionKey = conditionTexts[condition + conditionKeyOffset] || "";
-				if (conditionKey) resolveConditionText(state, effective, conditionKey);
-				if (!(conditionNumbers[condition + conditionFlagsOffset] & conditionResolvedFlag)) setConditionUnresolved(effective);
-				commitConditionCursor(state, effective);
-			} else effective = condition;
-			var isObjectValue = value && (typeof value === "undefined" ? "undefined" : _type_of(value)) === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value);
-			var objectHasDefault = isObjectValue && "default" in value;
-			var firstChild = isObjectValue && !objectHasDefault ? acquireConditionCursor(effective) : null;
-			if (isObjectValue && classifyConditionalObject(value, state, void 0, firstChild || void 0)) {
-				var useFirstChild = firstChild !== null;
-				for (var key in value) {
-					var payload = value[key];
-					if (payload == null) continue;
-					if (key === "default") emitUnderCondition(state, property, payload, effective, merge, payload, contextOnly, 2, payload);
-					else {
-						var keyWatermark = conditionCursorTop;
-						var child = useFirstChild ? firstChild : acquireConditionCursor(effective);
-						if (useFirstChild) useFirstChild = false;
-						else {
-							resolveConditionText(state, child, key);
-							commitConditionCursor(state, child);
-						}
-						emitUnderCondition(state, property, payload, child, merge, payload, contextOnly, 2, payload);
-						if (child !== firstChild) releaseConditionCursors(keyWatermark);
-					}
-				}
-				return true;
-			}
-			emitUnderCondition(state, property, value, effective, merge, originalValue, contextOnly, 2, value);
-			return true;
-		} finally {
-			releaseConditionCursors(watermark1);
-		}
+		var effective;
+		if (typeof condition === "string") effective = conditionFromKey(state, condition, parent);
+		else if (parent) {
+			effective = conditionFromKey(state, condition[conditionKey], parent);
+			if (!(condition[conditionValue] & conditionResolvedFlag)) setConditionUnresolved(effective);
+			commitCondition(effective);
+		} else effective = condition;
+		if (typeof value !== "string" && walkConditionalValue(state, property, value, effective, function(payload, cursor, source) {
+			return emitUnderCondition(state, property, payload, cursor, payload, contextOnly, 2, source);
+		}, 2)) return true;
+		emitUnderCondition(state, property, value, effective, originalValue, contextOnly, 2, value);
+		return true;
+	}
+	var compositeKind = 0;
+	if (compositeKind > 0 && compositeKind < 6 && (typeof value === "string" && value.indexOf(":") !== -1 || value && (typeof value === "undefined" ? "undefined" : _type_of(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)) {
-		var expanded = (0, import_resolveSafeArea.expandSafeAreaValue)(property);
+	if (value === "safe") {
+		var expanded = (0, import_grammarConfig.getConfigRevisionState)(state.conf).expandSafeArea(property);
 		if (expanded) {
 			state.flatUsesSafeArea = true;
-			var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
+			var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
 			try {
-				for (var _iterator2 = expanded[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-					var [key1, resolved] = _step2.value;
-					emitAtParentCondition(state, key1, resolved, merge, originalValue !== null && originalValue !== void 0 ? originalValue : value, contextOnly);
+				for (var _iterator = expanded[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+					var [key, resolved] = _step.value;
+					emitAtParentCondition(state, key, resolved, originalValue !== null && originalValue !== void 0 ? originalValue : value, contextOnly);
 				}
 			} catch (err) {
-				_didIteratorError2 = true;
-				_iteratorError2 = err;
+				_didIteratorError = true;
+				_iteratorError = err;
 			} finally {
 				try {
-					if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
+					if (!_iteratorNormalCompletion && _iterator.return != null) _iterator.return();
 				} finally {
-					if (_didIteratorError2) throw _iteratorError2;
+					if (_didIteratorError) throw _iteratorError;
 				}
 			}
 			return true;
 		}
 	}
-	if (typeof value === "string") return contributeStyleString(state, property, value, merge, originalValue, contextOnly);
-	if (value && (typeof value === "undefined" ? "undefined" : _type_of(value)) === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value) && contributeStyleObject(state, property, value, merge, contextOnly)) return true;
+	if (walkConditionalValue(state, property, value, ((_state_flatPass = state.flatPass) === null || _state_flatPass === void 0 ? void 0 : _state_flatPass[passParentCursor]) || null, function(payload, cursor, source) {
+		return cursor ? emitUnderCondition(state, property, payload, cursor, void 0, contextOnly, 1, source) : emitValue(state, property, payload, null, payload, contextOnly);
+	}, 1)) return true;
 	if (value != null) {
-		emitAtParentCondition(state, property, value, merge, originalValue !== null && originalValue !== void 0 ? originalValue : value, contextOnly);
+		emitAtParentCondition(state, property, value, originalValue !== null && originalValue !== void 0 ? originalValue : value, contextOnly);
 		return true;
 	}
 	return false;
 }
 function clearDirectStyle(state, property) {
+	var _direct_flatAtomics;
 	var direct = state;
-	var atomicKey = property.startsWith("transition") ? "transition" : webShadowParts[property] ? "boxShadow" : webTextShadowParts.has(property) ? "textShadow" : legacyTransformParts.has(property) ? "transform" : property;
-	(0, import_directStyleCSS.clearFrameAtomic)(state, atomicKey);
-	var 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];
-}
-var conditionTransportTag = /* @__PURE__ */ Symbol();
-var transportHasBase = 1;
-var transportBase = 2;
-var transportEntries = 3;
-var transportEntryWidth = 2;
-function isConditionTransport(value) {
-	return Array.isArray(value) && value[0] === conditionTransportTag;
-}
-function appendConditionEntry(transport, cursor, value) {
-	transport.push(value, conditionTexts[cursor + conditionKeyOffset] || "");
-}
-function acquireTransportCursor(state, transport, offset, parent) {
-	var cursor = acquireConditionCursor(parent);
-	var key = transport[offset + 1];
-	if (key) resolveConditionText(state, cursor, key);
-	commitConditionCursor(state, cursor);
-	return cursor;
-}
-function mergeConditionTransport(state, prev, cursor, value) {
-	var transport;
-	if (isConditionTransport(prev)) transport = prev;
-	else {
-		transport = [
-			conditionTransportTag,
-			false,
-			void 0
-		];
-		if (prev != null) {
-			var isObjectValue = (typeof prev === "undefined" ? "undefined" : _type_of(prev)) === "object" && !Array.isArray(prev) && !(0, import_createVariable.isVariable)(prev);
-			var objectHasDefault = isObjectValue && "default" in prev;
-			var authoredWatermark = conditionCursorTop;
-			try {
-				var firstCursor = isObjectValue && !objectHasDefault ? acquireConditionCursor() : null;
-				if (isObjectValue && classifyConditionalObject(prev, state, void 0, firstCursor || void 0)) {
-					var useFirstCursor = firstCursor !== null;
-					for (var key in prev) {
-						var payload = prev[key];
-						if (payload == null) continue;
-						if (key === "default") {
-							transport[transportHasBase] = true;
-							transport[transportBase] = payload;
-							continue;
-						}
-						var watermark = conditionCursorTop;
-						var keyCursor = useFirstCursor ? firstCursor : acquireConditionCursor();
-						if (useFirstCursor) useFirstCursor = false;
-						else {
-							resolveConditionText(state, keyCursor, key);
-							commitConditionCursor(state, keyCursor);
-						}
-						appendConditionEntry(transport, keyCursor, payload);
-						if (keyCursor !== firstCursor) releaseConditionCursors(watermark);
-					}
-				} else {
-					transport[transportHasBase] = true;
-					transport[transportBase] = prev;
-				}
-			} finally {
-				releaseConditionCursors(authoredWatermark);
+	var propertyKind = (0, import_grammarConfig.getConfigRevisionState)(state.conf).propertyKind(property);
+	var atomicKey = property.startsWith("transition") ? "transition" : propertyKind > 0 && propertyKind < 5 ? "boxShadow" : propertyKind === 6 ? "textShadow" : propertyKind === 5 ? "transform" : property;
+	var slot = atomicKey;
+	(_direct_flatAtomics = direct.flatAtomics) === null || _direct_flatAtomics === void 0 || _direct_flatAtomics.delete(slot);
+	if (direct.flatSlots) {
+		if (slot !== atomicKey) {
+			var entries = direct.flatSlots.get(slot);
+			if (entries) {
+				for (var index = entries.length; index--;) if (entries[index][0] === atomicKey) entries.splice(index, 1);
 			}
 		}
+		direct.flatSlots.delete(atomicKey);
 	}
-	var cursorKey = conditionTexts[cursor + conditionKeyOffset] || "";
-	for (var offset = transportEntries; offset < transport.length; offset += transportEntryWidth) if (transport[offset + 1] === cursorKey) {
-		transport.splice(offset, transportEntryWidth);
-		break;
-	}
-	appendConditionEntry(transport, cursor, value);
-	return transport;
-}
-var variantValueHandler = {
-	segment(ctx, start, end, isBase, valid, source, chainStart, chainEnd, chainValid) {
-		var state = ctx[0];
-		if (start === end) return;
-		if (isBase) {
-			if (!valid) return;
-			emitResolvedVariant(ctx[1], source.slice(start, end), state, ctx[2], null);
-			return;
-		}
-		if (!valid || !chainValid) return;
-		var cursor = state.flatScanCursor;
-		if (!(cursor && conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag ? conditionNumbers[cursor + conditionValueOffset] : 0)) return;
-		emitResolvedVariant(ctx[1], source.slice(start, end), state, ctx[2], cursor);
-	},
-	modifier(ctx, start, end, valid, first, source) {
-		var directState = ctx[0];
-		var 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) {
-		var cursor = ctx[0].flatScanCursor;
-		if (cursor) {
-			if (!valid) setConditionUnresolved(cursor);
-			if (conditionNumbers[cursor + conditionFlagsOffset] & conditionResolvedFlag) commitConditionCursor(ctx[0], cursor);
-		}
-		return true;
-	}
-};
-function emitMappedValue(styleState, key, value, originalValue, nestedCondition, parentCondition, fallbackOriginal) {
-	var nested = nestedCondition;
-	var parent = parentCondition;
-	var resolvedCondition = nested !== null && nested !== void 0 ? nested : parent;
-	var watermark = conditionCursorTop;
-	if (nested && parent) {
-		var composed = acquireConditionCursor(parent);
-		var nestedKey = conditionTexts[nested + conditionKeyOffset] || "";
-		if (nestedKey) resolveConditionText(styleState, composed, nestedKey);
-		if (!(conditionNumbers[nested + conditionFlagsOffset] & conditionResolvedFlag)) setConditionUnresolved(composed);
-		commitConditionCursor(styleState, composed);
-		resolvedCondition = composed;
-	}
-	var conf = styleState.conf;
-	if (key === "fontFamily" || key === conf.inverseShorthands.fontFamily) styleState.fontFamily = getFontFamilyFromNameOrVariable(value, conf);
-	mapContributedProp(styleState, key, value, originalValue !== null && originalValue !== void 0 ? originalValue : fallbackOriginal, resolvedCondition);
-	releaseConditionCursors(watermark);
-}
-var contributeMappedValue = function(key, value, styleState, disabled, parentCondition, fallbackOriginal) {
-	if (disabled) return emitMappedValue(styleState, key, value, void 0, void 0, parentCondition, fallbackOriginal);
-	var { conf, styleProps } = styleState;
-	var variants = styleState.flatStyleStaticConfig.variants;
-	var { disableExpandShorthands, noExpand, resolveValues } = styleProps;
-	var shorthands = conf.shorthands;
-	if (value === "unset") {
-		var expandedKey = !disableExpandShorthands && shorthands[key] || key;
-		var expanded = noExpand ? null : (0, import_expandStyle.expandStyle)(expandedKey, value, conf.settings.styleCompat || "web");
-		var used = styleState.flatUsed;
-		if (expanded) {
-			var _iteratorNormalCompletion2 = true, _didIteratorError2 = false, _iteratorError2 = void 0;
-			try {
-				for (var _iterator2 = expanded[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
-					var [nkey] = _step2.value;
-					if (used) delete used[nkey];
-					if (styleState.style) delete styleState.style[nkey];
-				}
-			} catch (err) {
-				_didIteratorError2 = true;
-				_iteratorError2 = err;
-			} finally {
-				try {
-					if (!_iteratorNormalCompletion2 && _iterator2.return != null) _iterator2.return();
-				} finally {
-					if (_didIteratorError2) throw _iteratorError2;
-				}
-			}
-		} else {
-			if (used) delete used[expandedKey];
-			if (styleState.style) delete styleState.style[expandedKey];
-		}
-		return;
-	}
-	if (!noExpand) {
-		if (variants && key in variants) {
-			resolveVariants(key, value, styleProps, styleState, key);
-			return;
-		}
-	}
-	if (!disableExpandShorthands) {
-		if (key in shorthands) key = shorthands[key];
-	}
-	var originalValue = value;
-	if (value === "safe" && (0, import_resolveSafeArea.isSafeAreaKey)(key)) {
-		var expanded1 = (0, import_resolveSafeArea.expandSafeAreaValue)(key);
-		if (expanded1) {
-			for (var i = 0; i < expanded1.length; i++) {
-				var [nkey1, nvalue] = expanded1[i];
-				emitMappedValue(styleState, nkey1, 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;
-		}
-		var expanded2 = noExpand || typeof value === "string" ? null : (0, import_expandStyle.expandStyle)(key, value, conf.settings.styleCompat || "web");
-		if (expanded2) {
-			var max = expanded2.length;
-			for (var i1 = 0; i1 < max; i1++) {
-				var [nkey2, nvalue1, noriginalValue] = expanded2[i1];
-				emitMappedValue(styleState, nkey2, nvalue1, noriginalValue !== null && noriginalValue !== void 0 ? noriginalValue : originalValue, void 0, parentCondition, fallbackOriginal);
-			}
-		} else emitMappedValue(styleState, key, value, originalValue, void 0, parentCondition, fallbackOriginal);
-	}
-};
-function resolveVariants(key, value, styleProps, styleState, parentVariantKey) {
-	var _styleState_flatStyleStaticConfig_variants;
-	var variantDefinition = (_styleState_flatStyleStaticConfig_variants = styleState.flatStyleStaticConfig.variants) === null || _styleState_flatStyleStaticConfig_variants === void 0 ? void 0 : _styleState_flatStyleStaticConfig_variants[key];
-	if (isConditionTransport(value)) {
-		if (value[transportHasBase]) emitResolvedVariant(key, value[transportBase], styleState, parentVariantKey, null);
-		for (var offset = transportEntries; offset < value.length;) {
-			var entryValue = value[offset];
-			var watermark = conditionCursorTop;
-			try {
-				emitResolvedVariant(key, entryValue, styleState, parentVariantKey, acquireTransportCursor(styleState, value, offset, null));
-			} finally {
-				releaseConditionCursors(watermark);
-			}
-			offset += transportEntryWidth;
-		}
-		return;
-	}
-	if (typeof value === "string" && !(variantDefinition && (typeof variantDefinition === "undefined" ? "undefined" : _type_of(variantDefinition)) === "object" && value in variantDefinition)) {
-		var directState = styleState;
-		var watermark1 = conditionCursorTop;
-		var previousCursor = directState.flatScanCursor;
-		directState.flatScanCursor = null;
-		try {
-			(0, import_runtime.scanFlatValue)(value, variantValueHandler, [
-				styleState,
-				key,
-				parentVariantKey
-			]);
-		} finally {
-			directState.flatScanCursor = previousCursor;
-			releaseConditionCursors(watermark1);
-		}
-		return;
-	}
-	var isObjectValue = value && (typeof value === "undefined" ? "undefined" : _type_of(value)) === "object" && !Array.isArray(value) && !(0, import_createVariable.isVariable)(value);
-	var objectHasDefault = isObjectValue && "default" in value;
-	var objectWatermark = conditionCursorTop;
-	try {
-		var firstCursor = isObjectValue && !objectHasDefault ? acquireConditionCursor() : null;
-		if (isObjectValue && classifyConditionalObject(value, styleState, void 0, firstCursor || void 0)) {
-			var useFirstCursor = firstCursor !== null;
-			for (var objKey in value) {
-				var payload = value[objKey];
-				if (payload == null) continue;
-				if (objKey === "default") {
-					emitResolvedVariant(key, payload, styleState, parentVariantKey, null);
-					continue;
-				}
-				var watermark2 = conditionCursorTop;
-				var cursor1 = useFirstCursor ? firstCursor : acquireConditionCursor();
-				conditionNumbers[cursor1 + conditionValueOffset];
-				if (useFirstCursor) useFirstCursor = false;
-				else {
-					resolveConditionText(styleState, cursor1, objKey);
-					commitConditionCursor(styleState, cursor1);
-				}
-				emitResolvedVariant(key, payload, styleState, parentVariantKey, cursor1);
-				if (cursor1 !== firstCursor) releaseConditionCursors(watermark2);
-			}
-			return;
-		}
-	} finally {
-		releaseConditionCursors(objectWatermark);
-	}
-	emitResolvedVariant(key, value, styleState, parentVariantKey, null);
-}
-function emitResolvedVariant(key, value, styleState, parentVariantKey, conditionCursor) {
-	var { conf, debug } = styleState;
-	var styleProps = styleState.styleProps;
-	var variants = styleState.flatStyleStaticConfig.variants;
-	if (!variants) return;
-	var variant = variants[key];
-	var variantValue = (0, import_variantResolvers.getVariantDefinition)(variant, value, conf, styleState);
-	if (!variantValue) return;
-	if (typeof variantValue === "function") {
-		variantValue = variantValue(value, (0, import_getVariantExtras.getVariantExtras)(styleState));
-		if (process.env.NODE_ENV === "development" && debug === "verbose" && false);
-	}
-	if (!(0, import_isObj.isObj)(variantValue)) return;
-	if (process.env.NODE_ENV === "development" && debug === "verbose") console.info(`   expanding styles from `, variantValue);
-	var { noSkip } = styleProps;
-	var originals = import_styleOriginalValues.styleOriginalValues.get(variantValue);
-	for (var outputKey in variantValue) {
-		if (!noSkip && outputKey in import_skipProps.skipProps) continue;
-		var rawOutputValue = variantValue[outputKey];
-		var outputValue = styleProps.noNormalize ? rawOutputValue : (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(rawOutputValue, conf.shorthands[outputKey] || outputKey);
-		var _originals_outputKey;
-		var originalValue = (_originals_outputKey = originals === null || originals === void 0 ? void 0 : originals[outputKey]) !== null && _originals_outputKey !== void 0 ? _originals_outputKey : rawOutputValue;
-		var contextPropSet = styleState.flatStyleStaticConfig.styledContextKeys;
-		if (contextPropSet === null || contextPropSet === void 0 ? void 0 : contextPropSet.has(outputKey)) {
-			var _styleState, _styleState1;
-			(_styleState = styleState).overriddenContextProps || (_styleState.overriddenContextProps = {});
-			styleState.overriddenContextProps[outputKey] = originalValue;
-			(_styleState1 = styleState).originalContextPropValues || (_styleState1.originalContextPropValues = {});
-			styleState.originalContextPropValues[outputKey] = originalValue;
-		}
-		contributeMappedValue(outputKey, outputValue, styleState, parentVariantKey === key && outputKey === key, conditionCursor || void 0, originalValue);
-	}
+	if (atomicKey === "transform") state.transformAccumulator = void 0;
+	if (state.style) delete state.style[atomicKey];
+	delete state.classNames[atomicKey];
+	delete state.classNames[slot];
+}
+function emitVariantStyle(state, key, value, original, condition, disabled) {
+	var _state_flatCallerVariantKeys, _state_flatStyleStaticConfig_styledContextKeys;
+	var pass = state.flatPass;
+	if (key !== pass[passMapSourceKey] && ((_state_flatCallerVariantKeys = state.flatCallerVariantKeys) === null || _state_flatCallerVariantKeys === void 0 ? void 0 : _state_flatCallerVariantKeys.has(key))) return;
+	if ((_state_flatStyleStaticConfig_styledContextKeys = state.flatStyleStaticConfig.styledContextKeys) === null || _state_flatStyleStaticConfig_styledContextKeys === void 0 ? void 0 : _state_flatStyleStaticConfig_styledContextKeys.has(key)) {
+		var _state, _state1;
+		((_state = state).overriddenContextProps || (_state.overriddenContextProps = {}))[key] = ((_state1 = state).originalContextPropValues || (_state1.originalContextPropValues = {}))[key] = original;
+	}
+	var parent = pass[passParentCursor];
+	pass[passParentCursor] = condition;
+	contributeProp(pass, key, value, original, disabled);
+	pass[passParentCursor] = parent;
 }
 function getFontFamilyFromNameOrVariable(input, conf) {
 	if ((0, import_createVariable.isVariable)(input)) {