@tenphi/tasty 0.0.0-snapshot.27b6708 → 0.0.0-snapshot.28b6339

package/dist/chunks/runtime-engine-D2WOLvd6.js

@@ -0,0 +1,3439 @@
+import { f as parseStyle, j as normalizeDslName, m as resetGlobalPredefinedTokens, p as resetGlobalParseFunctions, u as normalizeColorTokenValue, w as Lru } from "./dsl-D7kBow--.js";
+import { i as warn, n as isSelector, o as isDevEnv, r as resetStyleWarnings } from "./shared-utils-Bgl8FNGJ.js";
+import { A as validateNamePrefix, B as formatFunctionPrelude, D as makeKeyframeName, F as normalizePropertyDefinition, G as registerLocalFunctionPolyfills, I as parsePropertyToken, K as resetFunctionPolyfills, M as extractLocalProperties, N as getEffectiveDefinition, O as rscClassRegexGlobal, R as extractLocalFunctions, S as PropertyTypeResolver, T as makeClassName, U as parseFunctionName, V as formatFunctionRule, _ as extractLocalFontFace, a as formatPropertyCSS, b as formatFontFaceRule, c as filterUsedKeyframes, d as replaceAnimationNames, f as resolveKeyframesNames, h as formatCounterStyleRule, i as formatKeyframesCSS, j as hashString, k as tastyClassRegex, l as hasLocalKeyframes, m as formatCounterStyleDeclarations, o as extractAnimationNamesFromStyles, p as extractLocalCounterStyle, r as formatRules, s as extractLocalKeyframes, u as mergeKeyframes, v as fontFaceContentHash, y as formatFontFaceDeclarations, z as formatFunctionDeclarations } from "./css-definitions-Crstltrf.js";
+import { C as STYLE_HANDLER_MAP, D as resetHandlers, G as resetGlobalPolyfillsState, H as hasStylesGenerated, K as resetStylesGeneratedState, R as resetStyleChunks, S as camelToKebab, U as isFunctionsPolyfillEnabled, W as markStylesGeneratedState, a as registerBaseStyleProps, b as renderStyles, k as createStyle, n as generateChunkCacheKey, o as resetBaseStyleProps, r as categorizeStyleKeys, t as renderStylesForChunk, y as clearPipelineCache } from "./style-engine-C4ZcOAPb.js";
+import { n as applyStyleConfig, r as normalizeConfig, t as resolveRecipesWith } from "./config-engine-tKK7WxJO.js";
+import { _ as resetConfigResources, a as getGlobalConfigTokens, c as getGlobalFunctions, d as mergeGlobalConfigTokens, f as mergeGlobalCounterStyles, g as mergeGlobalStyles, h as mergeGlobalProperties, i as getEffectiveProperties, l as getGlobalStyles, m as mergeGlobalFunctions, o as getGlobalCounterStyles, p as mergeGlobalFontFaces, s as getGlobalFontFaces, t as getRegisteredSSRCollector, v as setRuntimeConfigState } from "./runtime-state-DOeH6rsG.js";
+import { cache } from "react";
+//#region src/prop-handlers.ts
+/**
+* Props middleware for tasty components.
+*
+* A prop handler receives a component's props and returns them, changed or not.
+* That makes it the extension point for props that are *not* style properties:
+* it can read a custom prop, strip it so it never reaches the DOM, and fold its
+* meaning into `styles`, `mods`, `tokens`, `variant`, or `as`.
+*
+* ```ts
+* configure({
+*   propHandlers: {
+*     glaze: (props) => {
+*       const { glaze, ...rest } = props;
+*       if (!glaze) return rest;
+*       return { ...rest, styles: mergeStyles(glazeStyles(glaze), rest.styles) };
+*     },
+*   },
+* });
+* ```
+*
+* Handlers run on every render of every tasty component, so the registry is a
+* pre-composed chain that is `null` while nothing is registered — the cost when
+* unused is one property load and one branch.
+*/
+const GTKEY = "__tasty_prop_handlers__";
+const globalStore = globalThis;
+const propHandlerRegistry = globalStore[GTKEY] ?? (globalStore[GTKEY] = {
+	apply: null,
+	list: []
+});
+function normalize(key, definition, options) {
+	const source = options?.source ?? "configure()";
+	if (typeof definition === "function") return {
+		key,
+		triggers: [key],
+		fn: definition,
+		source
+	};
+	if (Array.isArray(definition)) {
+		const [first, fn] = definition;
+		if (typeof fn !== "function") throw new Error(`[Tasty] Invalid prop handler definition for "${key}". Tuple must have a function as the second element: [string, function] or [string[], function].`);
+		if (first === "*") return {
+			key,
+			triggers: null,
+			fn,
+			source
+		};
+		if (typeof first === "string") return {
+			key,
+			triggers: [first],
+			fn,
+			source
+		};
+		if (Array.isArray(first)) return {
+			key,
+			triggers: first.includes("*") ? null : first,
+			fn,
+			source
+		};
+		throw new Error(`[Tasty] Invalid prop handler definition for "${key}". First element must be a string or string array.`);
+	}
+	throw new Error(`[Tasty] Invalid prop handler definition for "${key}". Expected function, [string, function], or [string[], function].`);
+}
+/**
+* Run one handler, treating a nothing/non-object return as "unchanged".
+*
+* `isDevEnv()` is called lazily rather than captured at module load so the
+* warnings are assertable in tests; it is only reached on the misuse path.
+*/
+function runOne(handler, props) {
+	const next = handler.fn(props);
+	if (next != null && typeof next === "object" && !Array.isArray(next)) return next;
+	if (isDevEnv()) console.warn(next == null ? `[Tasty] propHandlers["${handler.key}"] (from ${handler.source}) returned ${String(next)}. Props are treated as unchanged — did you forget to \`return props\`?` : `[Tasty] propHandlers["${handler.key}"] (from ${handler.source}) returned ${Array.isArray(next) ? "an array" : typeof next}. A prop handler must return a props object. The result was ignored.`);
+	return props;
+}
+function compose(list) {
+	if (list.length === 0) return null;
+	if (list.length === 1) {
+		const only = list[0];
+		if (only.triggers === null) return (props) => runOne(only, props);
+		if (only.triggers.length === 1) {
+			const trigger = only.triggers[0];
+			return (props) => trigger in props ? runOne(only, props) : props;
+		}
+	}
+	return (props) => {
+		for (const handler of list) {
+			const triggers = handler.triggers;
+			if (triggers !== null) {
+				let triggered = false;
+				for (const trigger of triggers) if (trigger in props) {
+					triggered = true;
+					break;
+				}
+				if (!triggered) continue;
+			}
+			props = runOne(handler, props);
+		}
+		return props;
+	};
+}
+/**
+* Register a props middleware under `key`, replacing any handler already
+* registered under the same key while keeping its position in the chain.
+*/
+function registerPropHandler(key, definition, options) {
+	const normalized = normalize(key, definition, options);
+	const { list } = propHandlerRegistry;
+	const existing = list.findIndex((handler) => handler.key === key);
+	if (existing === -1) list.push(normalized);
+	else list[existing] = normalized;
+	propHandlerRegistry.apply = compose(list);
+}
+/** Drop every registered props middleware. Called by `resetConfig()`. */
+function resetPropHandlers() {
+	if (propHandlerRegistry.list.length === 0) return;
+	propHandlerRegistry.list.length = 0;
+	propHandlerRegistry.apply = null;
+}
+//#endregion
+//#region src/injector/batch.ts
+/**
+* Deferred CSSOM writes ("batched injection").
+*
+* Every `insertRule()` on a live stylesheet invalidates style for the sheet's
+* scope, so Blink recalculates style the next time anything reads layout or
+* computed style. When components inject during React's render phase and other
+* components read layout in the same pass, the two interleave:
+*
+*   inject -> read (forced recalc) -> inject -> read (forced recalc) -> ...
+*
+* Batching moves every sheet write out from between those reads. Writes are
+* queued in FIFO order and drained in one go, so the tree is invalidated once
+* per flush instead of once per component.
+*
+* ## Ordering
+*
+* A single queue holds *all* writes — component rules, global rules, keyframes,
+* `@property`, `@font-face`, `@counter-style`, `@function` and raw CSS. Draining
+* it in insertion order keeps the sheet byte-identical to unbatched output,
+* which matters because equal-specificity rules resolve by document order.
+*
+* ## Batch windows — why queuing is safe
+*
+* Deferring a write past React's layout phase would let a `useLayoutEffect`
+* measure an element whose rules are not in the sheet yet, reading the unstyled
+* box. `<TastyBatchProvider>` closes that hole by opening a *window* during its
+* render and closing it — flushing — in its `useInsertionEffect`, which React
+* runs in the mutation phase, before any layout effect:
+*
+*   provider renders          -> window OPEN
+*     children render         -> injections queued
+*   provider insertionEffect  -> FLUSH, window CLOSED
+*   layout effects run        -> rules are in the sheet
+*
+* So in the default (`batchInjection: true`) mode a write is only ever queued
+* inside a commit whose flush is already guaranteed by that same commit. Every
+* injection outside a window — a deep update the provider did not re-render
+* for, a `useLayoutEffect` that injects, an event handler, an async callback —
+* is written straight through, exactly as with batching off.
+*
+* `batchInjection: 'always'` opts out of the gate and queues unconditionally.
+* That wins on more commits, at the cost of the measurement hazard above.
+*
+* ## Flush points (earliest wins)
+*
+* 1. `<TastyBatchProvider>`'s `useInsertionEffect` — closes the window.
+* 2. A microtask — a backstop for a render that was aborted or suspended and
+*    therefore never reached its insertion effect. An aborted render mounts
+*    nothing, so nothing can measure what it queued. Microtasks also always
+*    drain before paint, so styles are never visually missing.
+* 3. `flushStyles()` — explicit, and called internally by every injector read
+*    API (`getCSSText`, `cleanup`, `gc`, `destroy`, ...).
+*/
+/**
+* FIFO of pending writes. Drained with a moving `head` index rather than
+* `shift()` so a large batch stays O(n) instead of O(n²).
+*/
+let queue = [];
+let head = 0;
+let microtaskScheduled = false;
+let flushing = false;
+/**
+* Whether a `<TastyBatchProvider>` has rendered in the current commit and will
+* therefore flush in its insertion effect, making it safe to queue a write.
+*
+* A flag rather than a depth count, because renders and insertion effects do
+* not pair up one-to-one. StrictMode double-invokes render but runs the
+* insertion effect once, so a counter ends the commit stuck above zero — and a
+* window that stays open past its commit turns the next provider-less commit
+* into `'always'` mode behind the user's back, which is exactly the measurement
+* hazard `true` exists to avoid.
+*
+* Clearing on the first close is safe with nested or sibling providers: React
+* finishes every render in a commit before running any insertion effect, so once
+* one closes, no further render-phase injection can arrive in that commit.
+*/
+let windowOpen = false;
+/** Whether any window has ever been opened, i.e. a provider is in the tree. */
+let everOpened = false;
+/** Dev-only: warn at most once that batching is on with no provider mounted. */
+let warnedNoProvider = false;
+/**
+* Queue a sheet write.
+*
+* Returns a handle whose `cancel()` drops the write if the caller disposes
+* before the flush. The handle is intentionally tiny — one is allocated per
+* injected class, on the cache-miss path only.
+*/
+function enqueueStyleWrite(run) {
+	if (flushing) {
+		run();
+		return {
+			run,
+			cancelled: false,
+			done: true
+		};
+	}
+	const entry = {
+		run,
+		cancelled: false,
+		done: false
+	};
+	queue.push(entry);
+	scheduleMicrotaskFlush();
+	return entry;
+}
+/** Whether any write is still waiting to hit a stylesheet. */
+function hasPendingStyleWrites() {
+	return head < queue.length;
+}
+/**
+* Open a batch window. Called from `<TastyBatchProvider>`'s render, so every
+* descendant injection in this commit is covered by the provider's insertion
+* effect.
+*
+* Called during render on purpose: the window must be open before children
+* render. It is idempotent — so StrictMode's double render costs nothing — and
+* carries no other side effect. A render that is thrown away is recovered by the
+* microtask backstop.
+*
+* A no-op without a `document`. On the server there is no sheet to batch
+* against, and `useInsertionEffect` never runs, so nothing would ever close a
+* window this opened. Skipping it keeps the provider inert during SSR and RSC
+* instead of merely harmless.
+*/
+function openBatchWindow() {
+	if (typeof document === "undefined") return;
+	windowOpen = true;
+	everOpened = true;
+}
+/**
+* Close a batch window and flush. Called from the provider's
+* `useInsertionEffect`, i.e. after every render in the commit and before any
+* layout effect.
+*/
+function closeBatchWindow() {
+	windowOpen = false;
+	flushStyles();
+}
+/** Whether a batch window is currently open. */
+function isBatchWindowOpen() {
+	return windowOpen;
+}
+function scheduleMicrotaskFlush() {
+	if (microtaskScheduled || flushing) return;
+	microtaskScheduled = true;
+	queueMicrotask(() => {
+		microtaskScheduled = false;
+		windowOpen = false;
+		flushStyles();
+	});
+}
+/**
+* Drain every pending sheet write, in insertion order.
+*
+* Safe to call when the queue is empty (the common case, so the guard comes
+* first) and safe to call re-entrantly: a nested `flushStyles()` is a no-op,
+* and work a draining write triggers is written in place by
+* `enqueueStyleWrite` rather than queued behind the rest of the batch.
+*/
+function flushStyles() {
+	if (head >= queue.length) return;
+	if (flushing) return;
+	flushing = true;
+	try {
+		while (head < queue.length) {
+			const entry = queue[head++];
+			if (entry.cancelled) {
+				entry.done = true;
+				continue;
+			}
+			entry.run();
+			entry.done = true;
+		}
+	} finally {
+		queue = [];
+		head = 0;
+		flushing = false;
+	}
+}
+/**
+* Dev-only: `batchInjection: true` batches nothing unless a window opens, and no
+* window has ever opened, so no provider is in the tree. Called by the injector
+* the first time it declines to batch.
+*/
+function warnBatchProviderMissing() {
+	if (everOpened || warnedNoProvider || !isDevEnv()) return;
+	warnedNoProvider = true;
+	warn("[Tasty] batchInjection needs <TastyBatchProvider> mounted to batch.");
+}
+/**
+* Drop every pending write without applying it. Test helper — production code
+* should call `flushStyles()` instead.
+*/
+function resetStyleBatch() {
+	queue = [];
+	head = 0;
+	microtaskScheduled = false;
+	flushing = false;
+	windowOpen = false;
+	everOpened = false;
+	warnedNoProvider = false;
+}
+//#endregion
+//#region src/injector/sheet-manager.ts
+const supportsConstructableSheets = typeof CSSStyleSheet !== "undefined" && (() => {
+	try {
+		new CSSStyleSheet();
+		return true;
+	} catch {
+		return false;
+	}
+})();
+function wrapAtRules(css, atRules) {
+	return atRules?.reduce((wrapped, atRule) => `${atRule} { ${wrapped} }`, css) ?? css;
+}
+/** Split a selector list without treating commas inside [] / () / strings as separators. */
+function splitSelectorsSafely(selectorList) {
+	const parts = [];
+	let buffer = "";
+	let squareDepth = 0;
+	let parenDepth = 0;
+	let quote = "";
+	for (let i = 0; i < selectorList.length; i++) {
+		const char = selectorList[i];
+		if (quote) {
+			if (char === quote && selectorList[i - 1] !== "\\") quote = "";
+			buffer += char;
+			continue;
+		}
+		if (char === "\"" || char === "'") {
+			quote = char;
+			buffer += char;
+			continue;
+		}
+		if (char === "[") squareDepth++;
+		else if (char === "]") squareDepth = Math.max(0, squareDepth - 1);
+		else if (char === "(") parenDepth++;
+		else if (char === ")") parenDepth = Math.max(0, parenDepth - 1);
+		if (char === "," && squareDepth === 0 && parenDepth === 0) {
+			const part = buffer.trim();
+			if (part) parts.push(part);
+			buffer = "";
+		} else buffer += char;
+	}
+	const tail = buffer.trim();
+	if (tail) parts.push(tail);
+	return parts;
+}
+function rulesToCSS(sheet) {
+	return Array.from(sheet.cssRules, (rule) => rule.cssText).join("\n");
+}
+function rawBlocksToCSS(blocks) {
+	return [...blocks.values()].sort((a, b) => a.startOffset - b.startOffset).map((block) => block.css).join("\n");
+}
+var SheetManager = class {
+	rootRegistries = /* @__PURE__ */ new WeakMap();
+	/** Strong set of active roots so background GC can iterate them all */
+	activeRoots = /* @__PURE__ */ new Set();
+	config;
+	/** Dedicated style elements for raw CSS per root */
+	rawStyleElements = /* @__PURE__ */ new WeakMap();
+	/** Constructable sheets for raw CSS in adopted mode */
+	rawConstructableSheets = /* @__PURE__ */ new WeakMap();
+	/** Tracking for raw CSS blocks per root */
+	rawCSSBlocks = /* @__PURE__ */ new WeakMap();
+	/** Counter for generating unique raw CSS IDs */
+	rawCSSCounter = 0;
+	constructor(config) {
+		this.config = config;
+	}
+	/**
+	* Resolve the underlying CSSStyleSheet from a SheetInfo,
+	* abstracting away adopted vs style-element modes.
+	*/
+	getCSSSheet(sheetInfo) {
+		if (sheetInfo.constructableSheet) return sheetInfo.constructableSheet;
+		return sheetInfo.sheet?.sheet ?? null;
+	}
+	/**
+	* Record an inserted rule text at its rule index (text mode only).
+	*
+	* `textRules` mirrors the sheet's rule order. `textContent` cannot be edited
+	* rule-by-rule the way CSSOM can, so keeping the texts is what makes
+	* deletion possible at all in this mode.
+	*/
+	trackTextRule(sheet, ruleIndex, ruleText) {
+		if (!sheet.textMode) return;
+		const rules = sheet.textRules ??= [];
+		while (rules.length < ruleIndex) rules.push("");
+		rules[ruleIndex] = ruleText;
+	}
+	/**
+	* Remove rule indices from a text-mode sheet and rewrite the element's text.
+	* Returns the indices that were actually removed.
+	*/
+	deleteTextRules(sheet, indices) {
+		const rules = sheet.textRules;
+		if (!rules) return [];
+		const removed = [...new Set(indices)].filter((idx) => idx >= 0 && idx < rules.length).sort((a, b) => b - a);
+		for (const idx of removed) rules.splice(idx, 1);
+		if (removed.length > 0 && sheet.sheet) sheet.sheet.textContent = rules.length ? "\n" + rules.join("\n") : "";
+		return removed;
+	}
+	/**
+	* Determine the injection mode for a root.
+	* ShadowRoot uses adopted stylesheets when supported; Document uses <style> elements.
+	*/
+	detectInjectionMode(root) {
+		if (root instanceof ShadowRoot && supportsConstructableSheets && !this.config.forceTextInjection) return "adopted";
+		return "style-element";
+	}
+	/**
+	* Get or create registry for a root (Document or ShadowRoot)
+	*/
+	getRegistry(root) {
+		let registry = this.rootRegistries.get(root);
+		if (!registry) {
+			const metrics = this.config.devMode ? {
+				hits: 0,
+				misses: 0,
+				bulkCleanups: 0,
+				totalInsertions: 0,
+				totalUnused: 0,
+				stylesCleanedUp: 0,
+				cleanupHistory: [],
+				startTime: Date.now()
+			} : void 0;
+			registry = {
+				sheets: [],
+				pinCounts: /* @__PURE__ */ new Map(),
+				rules: /* @__PURE__ */ new Map(),
+				cacheKeyToClassName: /* @__PURE__ */ new Map(),
+				ruleTextSet: /* @__PURE__ */ new Set(),
+				metrics,
+				keyframesCache: /* @__PURE__ */ new Map(),
+				keyframesNameToContent: /* @__PURE__ */ new Map(),
+				keyframesCounter: 0,
+				injectedProperties: /* @__PURE__ */ new Map(),
+				injectedFontFaces: /* @__PURE__ */ new Set(),
+				injectedCounterStyles: /* @__PURE__ */ new Map(),
+				injectedFunctions: /* @__PURE__ */ new Map(),
+				globalRules: /* @__PURE__ */ new Map(),
+				propertyTypeResolver: new PropertyTypeResolver(),
+				unusedSince: /* @__PURE__ */ new Map(),
+				localKeyframes: /* @__PURE__ */ new Map(),
+				touchCount: 0,
+				serverClassSyncIndex: 0,
+				rscStylesScanned: false,
+				injectionMode: this.detectInjectionMode(root)
+			};
+			this.rootRegistries.set(root, registry);
+			this.activeRoots.add(root);
+		}
+		return registry;
+	}
+	/** Return all roots with active registries (for background GC sweep). */
+	getActiveRoots() {
+		return this.activeRoots;
+	}
+	/** Check whether any roots have active registries. */
+	hasActiveRoots() {
+		return this.activeRoots.size > 0;
+	}
+	/** Remove registries for ShadowRoots whose host has been detached from the DOM. */
+	pruneDisconnectedRoots() {
+		for (const root of this.activeRoots) if (root !== document && !root.host?.isConnected) this.cleanup(root);
+	}
+	/**
+	* Create a new stylesheet for the registry.
+	* In adopted mode (ShadowRoot), creates a constructable CSSStyleSheet and
+	* pushes it to adoptedStyleSheets. Otherwise creates a <style> element.
+	*/
+	createSheet(registry, root) {
+		if (registry.injectionMode === "adopted") {
+			const constructableSheet = new CSSStyleSheet();
+			root.adoptedStyleSheets = [...root.adoptedStyleSheets, constructableSheet];
+			const sheetInfo = {
+				sheet: null,
+				constructableSheet,
+				ruleCount: 0,
+				holes: []
+			};
+			registry.sheets.push(sheetInfo);
+			return sheetInfo;
+		}
+		const sheet = this.createStyleElement(root);
+		const textMode = this.config.forceTextInjection === true || sheet.sheet == null;
+		const sheetInfo = {
+			sheet,
+			ruleCount: 0,
+			holes: [],
+			textMode,
+			...textMode ? { textRules: [] } : {}
+		};
+		registry.sheets.push(sheetInfo);
+		return sheetInfo;
+	}
+	/**
+	* Create a style element and append to document
+	*/
+	createStyleElement(root, attribute = "data-tasty") {
+		const style = root.createElement?.("style") || document.createElement("style");
+		if (this.config.nonce) style.nonce = this.config.nonce;
+		style.setAttribute(attribute, "");
+		("head" in root && root.head ? root.head : root).appendChild(style);
+		if (attribute === "data-tasty" && !style.isConnected && !this.config.forceTextInjection) console.error("[Tasty] SheetManager: style element failed to connect to the DOM.", {
+			parentNode: style.parentNode?.nodeName,
+			isConnected: style.isConnected
+		});
+		return style;
+	}
+	/** Append a rule to a text-mode sheet while preserving its index mirror. */
+	appendTextRule(sheet, ruleIndex, ruleText) {
+		this.trackTextRule(sheet, ruleIndex, ruleText);
+		const style = sheet.sheet;
+		style.textContent = (style.textContent || "") + "\n" + ruleText;
+	}
+	/**
+	* Insert CSS rules as a single block
+	*/
+	insertRule(registry, flattenedRules, className, root) {
+		let targetSheet = this.findAvailableSheet(registry);
+		if (!targetSheet) targetSheet = this.createSheet(registry, root);
+		const sheetIndex = registry.sheets.indexOf(targetSheet);
+		try {
+			const groupedRules = /* @__PURE__ */ new Map();
+			for (const rule of flattenedRules) {
+				const key = `${rule.atRules?.join("|") ?? ""}||${rule.selector}||${rule.startingStyle ? "1" : "0"}`;
+				const existing = groupedRules.get(key);
+				if (existing) existing.declarations = existing.declarations ? `${existing.declarations} ${rule.declarations}` : rule.declarations;
+				else groupedRules.set(key, {
+					selector: rule.selector,
+					atRules: rule.atRules,
+					startingStyle: rule.startingStyle,
+					declarations: rule.declarations
+				});
+			}
+			const insertedRuleTexts = [];
+			const insertedIndices = [];
+			let currentRuleIndex = this.findAvailableRuleIndex(targetSheet);
+			let firstInsertedIndex = null;
+			let lastInsertedIndex = null;
+			const recordInsertion = (index) => {
+				targetSheet.ruleCount++;
+				insertedIndices.push(index);
+				if (firstInsertedIndex == null) firstInsertedIndex = index;
+				lastInsertedIndex = index;
+				currentRuleIndex = index + 1;
+			};
+			for (const rule of groupedRules.values()) {
+				const declarations = rule.declarations;
+				const innerContent = rule.startingStyle ? `@starting-style { ${declarations} }` : declarations;
+				const fullRule = wrapAtRules(`${rule.selector} { ${innerContent} }`, rule.atRules);
+				const styleElement = targetSheet.sheet;
+				const styleSheet = this.getCSSSheet(targetSheet);
+				if (!targetSheet.textMode && styleSheet) {
+					const maxIndex = styleSheet.cssRules.length;
+					const atomicRuleIndex = this.findAvailableRuleIndex(targetSheet);
+					const safeIndex = Math.min(Math.max(0, atomicRuleIndex), maxIndex);
+					try {
+						styleSheet.insertRule(fullRule, safeIndex);
+						recordInsertion(safeIndex);
+					} catch (e) {
+						const selectors = splitSelectorsSafely(rule.selector);
+						if (selectors.length > 1) for (const sel of selectors) {
+							const singleRule = wrapAtRules(`${sel} { ${declarations} }`, rule.atRules);
+							try {
+								const maxIdx = styleSheet.cssRules.length;
+								const atomicIdx = this.findAvailableRuleIndex(targetSheet);
+								const idx = Math.min(Math.max(0, atomicIdx), maxIdx);
+								styleSheet.insertRule(singleRule, idx);
+								recordInsertion(idx);
+							} catch (singleErr) {
+								console.warn("[Tasty] Browser rejected CSS rule:", singleRule, singleErr);
+							}
+						}
+						else if (!(fullRule.startsWith("@property ") && !this.engineSupportsAtProperty(registry, styleSheet))) console.warn("[Tasty] Browser rejected CSS rule:", fullRule, e);
+					}
+				} else if (styleElement) {
+					const atomicRuleIndex = this.findAvailableRuleIndex(targetSheet);
+					this.appendTextRule(targetSheet, atomicRuleIndex, fullRule);
+					recordInsertion(atomicRuleIndex);
+				}
+				if (styleElement && !styleElement.parentNode && !this.config.forceTextInjection) console.error("[Tasty] SheetManager: style element is not attached to the DOM; rules will not apply.", {
+					className,
+					ruleIndex: currentRuleIndex
+				});
+				if (this.config.devMode) {
+					insertedRuleTexts.push(fullRule);
+					try {
+						registry.ruleTextSet.add(fullRule);
+					} catch {}
+				}
+			}
+			if (insertedIndices.length === 0) return null;
+			return {
+				className,
+				ruleIndex: firstInsertedIndex ?? 0,
+				sheetIndex,
+				cssText: this.config.devMode ? insertedRuleTexts : void 0,
+				endRuleIndex: lastInsertedIndex ?? firstInsertedIndex ?? 0,
+				indices: insertedIndices
+			};
+		} catch (error) {
+			console.warn("[Tasty] Failed to insert CSS rules:", error, {
+				flattenedRules,
+				className
+			});
+			return null;
+		}
+	}
+	/**
+	* Insert global CSS rules
+	*/
+	insertGlobalRule(registry, flattenedRules, globalKey, root) {
+		const ruleInfo = this.insertRule(registry, flattenedRules, globalKey, root);
+		if (ruleInfo) registry.globalRules.set(globalKey, ruleInfo);
+		return ruleInfo;
+	}
+	/**
+	* Delete a global CSS rule by key
+	*/
+	deleteGlobalRule(registry, globalKey) {
+		const ruleInfo = registry.globalRules.get(globalKey);
+		if (!ruleInfo) return;
+		this.deleteRule(registry, ruleInfo);
+		registry.globalRules.delete(globalKey);
+	}
+	/**
+	* Adjust rule indices after deletion to account for shifting
+	*/
+	adjustIndicesAfterDeletion(registry, sheetIndex, startIdx, endIdx, deleteCount, deletedRuleInfo, deletedIndices) {
+		try {
+			const sortedDeleted = deletedIndices && deletedIndices.length > 0 ? [...deletedIndices].sort((a, b) => a - b) : null;
+			const countDeletedBefore = (sorted, idx) => {
+				let shift = 0;
+				for (const delIdx of sorted) if (delIdx < idx) shift++;
+				else break;
+				return shift;
+			};
+			const adjustRuleInfo = (info) => {
+				if (info === deletedRuleInfo) return;
+				if (info.sheetIndex !== sheetIndex) return;
+				if (!info.indices || info.indices.length === 0) return;
+				if (sortedDeleted) info.indices = info.indices.map((idx) => {
+					return idx - countDeletedBefore(sortedDeleted, idx);
+				});
+				else info.indices = info.indices.map((idx) => idx > endIdx ? Math.max(0, idx - deleteCount) : idx);
+				if (info.indices.length > 0) {
+					info.ruleIndex = Math.min(...info.indices);
+					info.endRuleIndex = Math.max(...info.indices);
+				}
+			};
+			for (const info of registry.rules.values()) adjustRuleInfo(info);
+			for (const info of registry.globalRules.values()) adjustRuleInfo(info);
+			for (const entry of registry.keyframesCache.values()) {
+				const ki = entry.info;
+				if (ki.sheetIndex !== sheetIndex) continue;
+				if (sortedDeleted) {
+					const shift = countDeletedBefore(sortedDeleted, ki.ruleIndex);
+					if (shift > 0) ki.ruleIndex = Math.max(0, ki.ruleIndex - shift);
+				} else if (ki.ruleIndex > endIdx) ki.ruleIndex = Math.max(0, ki.ruleIndex - deleteCount);
+			}
+		} catch {}
+	}
+	/**
+	* Delete a CSS rule from the sheet
+	*/
+	deleteRule(registry, ruleInfo) {
+		const sheet = registry.sheets[ruleInfo.sheetIndex];
+		if (!sheet) return;
+		try {
+			const texts = this.config.devMode && Array.isArray(ruleInfo.cssText) ? ruleInfo.cssText.slice() : [];
+			const styleSheet = this.getCSSSheet(sheet);
+			const indices = ruleInfo.indices;
+			if (sheet.textMode) {
+				let targetIndices;
+				if (indices?.length) targetIndices = indices;
+				else {
+					const startIdx = Math.max(0, ruleInfo.ruleIndex);
+					const endIdx = Math.min((sheet.textRules?.length ?? 0) - 1, Number.isFinite(ruleInfo.endRuleIndex) ? ruleInfo.endRuleIndex : startIdx);
+					targetIndices = [];
+					for (let idx = startIdx; idx <= endIdx; idx++) targetIndices.push(idx);
+				}
+				const deletedIndices = this.deleteTextRules(sheet, targetIndices);
+				if (deletedIndices.length > 0) {
+					sheet.ruleCount = Math.max(0, sheet.ruleCount - deletedIndices.length);
+					this.adjustIndicesAfterDeletion(registry, ruleInfo.sheetIndex, Math.min(...deletedIndices), Math.max(...deletedIndices), deletedIndices.length, ruleInfo, deletedIndices);
+				}
+			} else if (styleSheet) {
+				const rules = styleSheet.cssRules;
+				if (indices?.length) {
+					const sortedIndices = [...indices].sort((a, b) => b - a);
+					const deletedIndices = [];
+					for (const idx of sortedIndices) if (idx >= 0 && idx < styleSheet.cssRules.length) try {
+						styleSheet.deleteRule(idx);
+						deletedIndices.push(idx);
+					} catch (e) {
+						console.warn(`[Tasty] Failed to delete rule at index ${idx}:`, e);
+					}
+					sheet.ruleCount = Math.max(0, sheet.ruleCount - deletedIndices.length);
+					if (deletedIndices.length > 0) this.adjustIndicesAfterDeletion(registry, ruleInfo.sheetIndex, Math.min(...deletedIndices), Math.max(...deletedIndices), deletedIndices.length, ruleInfo, deletedIndices);
+				} else {
+					const startIdx = Math.max(0, ruleInfo.ruleIndex);
+					const endIdx = Math.min(rules.length - 1, Number.isFinite(ruleInfo.endRuleIndex) ? ruleInfo.endRuleIndex : startIdx);
+					if (Number.isFinite(startIdx) && endIdx >= startIdx) {
+						const deleteCount = endIdx - startIdx + 1;
+						for (let idx = endIdx; idx >= startIdx; idx--) {
+							if (idx < 0 || idx >= styleSheet.cssRules.length) continue;
+							styleSheet.deleteRule(idx);
+						}
+						sheet.ruleCount = Math.max(0, sheet.ruleCount - deleteCount);
+						this.adjustIndicesAfterDeletion(registry, ruleInfo.sheetIndex, startIdx, endIdx, deleteCount, ruleInfo);
+					}
+				}
+			}
+			if (this.config.devMode && texts.length) try {
+				for (const text of texts) registry.ruleTextSet.delete(text);
+			} catch {}
+		} catch (error) {
+			console.warn("[Tasty] Failed to delete CSS rule:", error);
+		}
+	}
+	/**
+	* Find a sheet with available space or return null
+	*/
+	findAvailableSheet(registry) {
+		const maxRules = this.config.maxRulesPerSheet;
+		if (!maxRules) return registry.sheets[registry.sheets.length - 1] || null;
+		for (const sheet of registry.sheets) if (sheet.ruleCount < maxRules) return sheet;
+		return null;
+	}
+	/**
+	* Find an available rule index in the sheet
+	*/
+	findAvailableRuleIndex(sheet) {
+		return sheet.ruleCount;
+	}
+	/**
+	* Probe whether the underlying CSS engine supports `@property` at-rules.
+	* Result is cached per registry on `registry.atPropertySupported`.
+	*
+	* The probe inserts and immediately deletes a minimal known-valid rule
+	* (`@property --__tasty_probe__ { syntax: "*"; inherits: true; }`).
+	* Engines that lack `@property` support (jsdom, happy-dom) reject any
+	* `@property` rule including this one, so a probe failure is a reliable
+	* signal that further `@property` rejections are environmental noise and
+	* not user-authored bugs.
+	*
+	* The probe is intentionally a separate operation from the user's failing
+	* insertion: we don't want to leak `--__tasty_probe__` into the sheet, so
+	* on success we delete the probe rule immediately, leaving `ruleCount`
+	* and `cssRules.length` unchanged.
+	*/
+	engineSupportsAtProperty(registry, styleSheet) {
+		if (registry.atPropertySupported !== void 0) return registry.atPropertySupported;
+		const probeRule = "@property --__tasty_probe__ { syntax: \"*\"; inherits: true; }";
+		try {
+			const probeIdx = styleSheet.cssRules.length;
+			styleSheet.insertRule(probeRule, probeIdx);
+			try {
+				styleSheet.deleteRule(probeIdx);
+			} catch {}
+			registry.atPropertySupported = true;
+		} catch {
+			registry.atPropertySupported = false;
+		}
+		return registry.atPropertySupported;
+	}
+	/**
+	* Delete the given classes: their rules leave the sheets and every registry
+	* entry pointing at them is dropped.
+	*
+	* Deciding *what* is unused belongs to `StyleInjector.gc()`, which owns the
+	* DOM scan and the capacity policy. This only re-checks that each class is
+	* still safe to delete, and reports how many were.
+	*
+	* @returns Number of classes actually deleted.
+	*/
+	deleteClasses(registry, classNames) {
+		const cleanupStartTime = Date.now();
+		const selected = Array.from(classNames).map((className) => {
+			const ruleInfo = registry.rules.get(className);
+			return ruleInfo ? {
+				className,
+				ruleInfo
+			} : null;
+		}).filter((entry) => entry != null);
+		if (selected.length === 0) return 0;
+		const deleted = /* @__PURE__ */ new Set();
+		let totalCssSize = 0;
+		let totalRulesDeleted = 0;
+		const rulesBySheet = /* @__PURE__ */ new Map();
+		for (const { className, ruleInfo } of selected) {
+			const sheetIndex = ruleInfo.sheetIndex;
+			if (this.config.devMode && Array.isArray(ruleInfo.cssText)) {
+				const cssSize = ruleInfo.cssText.reduce((total, css) => total + css.length, 0);
+				totalCssSize += cssSize;
+				totalRulesDeleted += ruleInfo.cssText.length;
+			}
+			const rules = rulesBySheet.get(sheetIndex);
+			if (rules) rules.push({
+				className,
+				ruleInfo
+			});
+			else rulesBySheet.set(sheetIndex, [{
+				className,
+				ruleInfo
+			}]);
+		}
+		for (const rulesInSheet of rulesBySheet.values()) {
+			rulesInSheet.sort((a, b) => b.ruleInfo.ruleIndex - a.ruleInfo.ruleIndex);
+			for (const { className, ruleInfo } of rulesInSheet) {
+				if ((registry.pinCounts.get(className) ?? 0) > 0) continue;
+				if (registry.rules.get(className) !== ruleInfo) continue;
+				const sheetInfo = registry.sheets[ruleInfo.sheetIndex];
+				if (!sheetInfo || !sheetInfo.sheet && !sheetInfo.constructableSheet) continue;
+				const styleSheet = this.getCSSSheet(sheetInfo);
+				if (!sheetInfo.textMode && !styleSheet) continue;
+				const maxRuleIndex = (sheetInfo.textMode ? sheetInfo.textRules?.length ?? 0 : styleSheet?.cssRules.length ?? 0) - 1;
+				const startIdx = ruleInfo.ruleIndex;
+				const endIdx = ruleInfo.endRuleIndex ?? ruleInfo.ruleIndex;
+				if (startIdx < 0 || endIdx > maxRuleIndex || startIdx > endIdx) continue;
+				this.deleteRule(registry, ruleInfo);
+				registry.rules.delete(className);
+				registry.pinCounts.delete(className);
+				registry.unusedSince.delete(className);
+				for (const [key, entry] of registry.localKeyframes) {
+					if (!entry.owners.delete(className)) continue;
+					if (entry.owners.size === 0) {
+						entry.dispose();
+						registry.localKeyframes.delete(key);
+					}
+				}
+				deleted.add(className);
+			}
+		}
+		if (deleted.size > 0) {
+			for (const [key, mappedClassName] of registry.cacheKeyToClassName) if (deleted.has(mappedClassName)) registry.cacheKeyToClassName.delete(key);
+		}
+		if (registry.metrics) {
+			registry.metrics.bulkCleanups++;
+			registry.metrics.stylesCleanedUp += deleted.size;
+			registry.metrics.cleanupHistory.push({
+				timestamp: cleanupStartTime,
+				classesDeleted: deleted.size,
+				cssSize: totalCssSize,
+				rulesDeleted: totalRulesDeleted
+			});
+		}
+		return deleted.size;
+	}
+	/**
+	* Get total number of rules across all sheets
+	*/
+	getTotalRuleCount(registry) {
+		return registry.sheets.reduce((total, sheet) => total + sheet.ruleCount - sheet.holes.length, 0);
+	}
+	/**
+	* The CSS of one managed sheet, or `null` when it holds none this can read —
+	* an empty style element, or a sheet the engine refuses to hand over.
+	*/
+	readSheetCSS(sheetInfo) {
+		try {
+			if (sheetInfo.sheet?.textContent) return sheetInfo.sheet.textContent;
+			const sheet = this.getCSSSheet(sheetInfo);
+			if (sheet) return rulesToCSS(sheet);
+		} catch (error) {
+			console.warn("[Tasty] Failed to read CSS from sheet:", error);
+		}
+		return null;
+	}
+	/**
+	* Get CSS text from all sheets (for SSR)
+	*/
+	getCSSText(registry) {
+		const cssChunks = [];
+		for (const sheetInfo of registry.sheets) {
+			const css = this.readSheetCSS(sheetInfo);
+			if (css !== null) cssChunks.push(css);
+		}
+		return cssChunks.join("\n");
+	}
+	/**
+	* Get cache performance metrics
+	*/
+	getMetrics(registry) {
+		if (!registry.metrics) return null;
+		return {
+			...registry.metrics,
+			unusedHits: 0
+		};
+	}
+	/**
+	* Reset cache performance metrics
+	*/
+	resetMetrics(registry) {
+		if (registry.metrics) registry.metrics = {
+			hits: 0,
+			misses: 0,
+			bulkCleanups: 0,
+			totalInsertions: 0,
+			totalUnused: 0,
+			stylesCleanedUp: 0,
+			cleanupHistory: [],
+			startTime: Date.now()
+		};
+	}
+	/**
+	* Convert keyframes steps to CSS string.
+	* Public so the SSR collector can format keyframes without DOM access.
+	* Returns both the CSS text and a combined declarations string for property type scanning.
+	*/
+	stepsToCSS(steps) {
+		const rules = [];
+		const allDeclarations = [];
+		for (const [key, value] of Object.entries(steps)) {
+			if (typeof value === "string") {
+				rules.push(`${key} { ${value.trim()} }`);
+				allDeclarations.push(value.trim());
+				continue;
+			}
+			const styleMap = value || {};
+			const styleNames = Object.keys(styleMap).sort();
+			const handlerQueue = [];
+			const seenHandlers = /* @__PURE__ */ new Set();
+			styleNames.forEach((styleName) => {
+				let handlers = STYLE_HANDLER_MAP[styleName];
+				if (!handlers) handlers = STYLE_HANDLER_MAP[styleName] = [createStyle(styleName)];
+				handlers.forEach((handler) => {
+					if (!seenHandlers.has(handler)) {
+						seenHandlers.add(handler);
+						handlerQueue.push(handler);
+					}
+				});
+			});
+			const declarationPairs = [];
+			handlerQueue.forEach((handler) => {
+				const result = handler(handler.__lookupStyles.reduce((acc, name) => {
+					const v = styleMap[name];
+					if (v !== void 0) acc[name] = v;
+					return acc;
+				}, {}));
+				if (!result) return;
+				(Array.isArray(result) ? result : [result]).forEach((cssMap) => {
+					if (!cssMap || typeof cssMap !== "object") return;
+					const { $: _$, ...props } = cssMap;
+					Object.entries(props).forEach(([prop, val]) => {
+						if (val == null || val === "") return;
+						if (Array.isArray(val)) val.forEach((v) => {
+							if (v != null && v !== "") declarationPairs.push({
+								prop,
+								value: String(v)
+							});
+						});
+						else declarationPairs.push({
+							prop,
+							value: String(val)
+						});
+					});
+				});
+			});
+			const declarations = declarationPairs.map((d) => `${d.prop}: ${d.value}`).join("; ");
+			rules.push(`${key} { ${declarations.trim()} }`);
+			allDeclarations.push(declarations);
+		}
+		return {
+			css: rules.join(" "),
+			declarations: allDeclarations.join("; ")
+		};
+	}
+	/**
+	* Insert keyframes rule.
+	* Returns the KeyframesInfo and the raw declarations string for property type scanning.
+	*/
+	insertKeyframes(registry, steps, name, root) {
+		let targetSheet = this.findAvailableSheet(registry);
+		if (!targetSheet) targetSheet = this.createSheet(registry, root);
+		const ruleIndex = this.findAvailableRuleIndex(targetSheet);
+		const sheetIndex = registry.sheets.indexOf(targetSheet);
+		try {
+			const { css: cssSteps, declarations } = this.stepsToCSS(steps);
+			const fullRule = `@keyframes ${name} { ${cssSteps} }`;
+			const styleSheet = this.getCSSSheet(targetSheet);
+			if (!targetSheet.textMode && styleSheet) {
+				const safeIndex = Math.min(Math.max(0, ruleIndex), styleSheet.cssRules.length);
+				styleSheet.insertRule(fullRule, safeIndex);
+			} else if (targetSheet.sheet) this.appendTextRule(targetSheet, ruleIndex, fullRule);
+			targetSheet.ruleCount++;
+			return {
+				info: {
+					name,
+					ruleIndex,
+					sheetIndex,
+					cssText: this.config.devMode ? fullRule : void 0
+				},
+				declarations
+			};
+		} catch (error) {
+			console.warn("[Tasty] Failed to insert keyframes:", error);
+			return null;
+		}
+	}
+	/**
+	* Delete keyframes rule
+	*/
+	deleteKeyframes(registry, info) {
+		const sheet = registry.sheets[info.sheetIndex];
+		if (!sheet) return;
+		try {
+			const styleSheet = this.getCSSSheet(sheet);
+			if (sheet.textMode) {
+				if (!this.deleteTextRules(sheet, [info.ruleIndex]).length) return;
+			} else {
+				if (!styleSheet || info.ruleIndex < 0 || info.ruleIndex >= styleSheet.cssRules.length) return;
+				styleSheet.deleteRule(info.ruleIndex);
+			}
+			sheet.ruleCount = Math.max(0, sheet.ruleCount - 1);
+			this.adjustIndicesAfterDeletion(registry, info.sheetIndex, info.ruleIndex, info.ruleIndex, 1, null, [info.ruleIndex]);
+		} catch (error) {
+			console.warn("[Tasty] Failed to delete keyframes:", error);
+		}
+	}
+	/**
+	* Clean up resources for a root
+	*/
+	cleanup(root) {
+		const registry = this.rootRegistries.get(root);
+		if (!registry) return;
+		if (registry.injectionMode === "adopted") {
+			const shadowRoot = root;
+			const ownedSheets = /* @__PURE__ */ new Set();
+			for (const sheetInfo of registry.sheets) if (sheetInfo.constructableSheet) ownedSheets.add(sheetInfo.constructableSheet);
+			const rawSheet = this.rawConstructableSheets.get(shadowRoot);
+			if (rawSheet) {
+				ownedSheets.add(rawSheet);
+				this.rawConstructableSheets.delete(shadowRoot);
+			}
+			if (ownedSheets.size > 0) shadowRoot.adoptedStyleSheets = shadowRoot.adoptedStyleSheets.filter((s) => !ownedSheets.has(s));
+		} else {
+			for (const sheet of registry.sheets) try {
+				const styleElement = sheet.sheet;
+				if (styleElement?.parentNode) styleElement.parentNode.removeChild(styleElement);
+			} catch (error) {
+				console.warn("[Tasty] Failed to cleanup sheet:", error);
+			}
+			const rawStyleElement = this.rawStyleElements.get(root);
+			if (rawStyleElement?.parentNode) rawStyleElement.parentNode.removeChild(rawStyleElement);
+			this.rawStyleElements.delete(root);
+		}
+		this.rootRegistries.delete(root);
+		this.activeRoots.delete(root);
+		this.rawCSSBlocks.delete(root);
+	}
+	/**
+	* Check if a root uses adopted injection mode.
+	*/
+	isAdoptedMode(root) {
+		const registry = this.rootRegistries.get(root);
+		if (registry) return registry.injectionMode === "adopted";
+		return this.detectInjectionMode(root) === "adopted";
+	}
+	/**
+	* Get or create a constructable CSSStyleSheet for raw CSS in adopted mode.
+	* The raw sheet is prepended to adoptedStyleSheets so it precedes tasty rules.
+	*/
+	getOrCreateRawAdoptedSheet(root) {
+		let sheet = this.rawConstructableSheets.get(root);
+		if (!sheet) {
+			sheet = new CSSStyleSheet();
+			root.adoptedStyleSheets = [sheet, ...root.adoptedStyleSheets];
+			this.rawConstructableSheets.set(root, sheet);
+			if (!this.rawCSSBlocks.has(root)) this.rawCSSBlocks.set(root, /* @__PURE__ */ new Map());
+		}
+		return sheet;
+	}
+	/**
+	* Get or create a dedicated style element for raw CSS
+	* Raw CSS is kept separate from tasty-managed sheets to avoid index conflicts
+	*/
+	getOrCreateRawStyleElement(root) {
+		let styleElement = this.rawStyleElements.get(root);
+		if (!styleElement) {
+			styleElement = this.createStyleElement(root, "data-tasty-raw");
+			this.rawStyleElements.set(root, styleElement);
+			this.rawCSSBlocks.set(root, /* @__PURE__ */ new Map());
+		}
+		return styleElement;
+	}
+	/**
+	* Inject raw CSS text directly without parsing
+	* Returns a dispose function to remove the injected CSS
+	*/
+	injectRawCSS(css, root) {
+		if (!css.trim()) return { dispose: () => {} };
+		const id = `raw_${this.rawCSSCounter++}`;
+		if (this.isAdoptedMode(root)) {
+			this.getOrCreateRawAdoptedSheet(root);
+			const blocksMap = this.rawCSSBlocks.get(root);
+			const info = {
+				id,
+				css,
+				startOffset: 0,
+				endOffset: css.length
+			};
+			blocksMap.set(id, info);
+			this.rebuildRawAdoptedSheet(root);
+		} else {
+			const styleElement = this.getOrCreateRawStyleElement(root);
+			const blocksMap = this.rawCSSBlocks.get(root);
+			const currentContent = styleElement.textContent || "";
+			const cssWithNewline = (currentContent ? "\n" : "") + css;
+			styleElement.textContent = currentContent + cssWithNewline;
+			blocksMap.set(id, {
+				id,
+				css,
+				startOffset: currentContent.length,
+				endOffset: currentContent.length + cssWithNewline.length
+			});
+		}
+		return { dispose: () => {
+			this.disposeRawCSS(id, root);
+		} };
+	}
+	/**
+	* Rebuild the raw CSS constructable sheet from all tracked blocks.
+	*/
+	rebuildRawAdoptedSheet(root) {
+		const sheet = this.rawConstructableSheets.get(root);
+		const blocksMap = this.rawCSSBlocks.get(root);
+		if (!sheet || !blocksMap) return;
+		sheet.replaceSync(rawBlocksToCSS(blocksMap));
+	}
+	/**
+	* Remove a raw CSS block by ID
+	*/
+	disposeRawCSS(id, root) {
+		const blocksMap = this.rawCSSBlocks.get(root);
+		if (!blocksMap?.delete(id)) return;
+		if (this.isAdoptedMode(root)) {
+			this.rebuildRawAdoptedSheet(root);
+			return;
+		}
+		const styleElement = this.rawStyleElements.get(root);
+		if (!styleElement) return;
+		const remainingBlocks = Array.from(blocksMap.values());
+		if (remainingBlocks.length === 0) styleElement.textContent = "";
+		else {
+			remainingBlocks.sort((a, b) => a.startOffset - b.startOffset);
+			styleElement.textContent = remainingBlocks.map((block) => block.css).join("\n");
+			let offset = 0;
+			for (const block of remainingBlocks) {
+				block.startOffset = offset;
+				block.endOffset = offset + block.css.length;
+				offset = block.endOffset + 1;
+			}
+		}
+	}
+	/**
+	* Get the raw CSS content
+	*/
+	/**
+	* The CSS this injector owns in `root`, one entry per sheet, in the order the
+	* engine applies them.
+	*
+	* `getCSSText()` walks the managed sheets only, and raw CSS has its own —
+	* which sits before, after, or *between* them depending on how it got there:
+	* prepended to `adoptedStyleSheets`, or wherever in `<head>` the first raw
+	* injection happened to land, with every managed sheet opened afterwards
+	* following it. Reporting a fixed order would describe the opposite winner
+	* from the live page whenever two rules of equal specificity meet, so the raw
+	* sheet is spliced in at the position the DOM actually gives it.
+	*/
+	getOwnedCSSInOrder(registry, root) {
+		const raw = this.getRawCSSText(root);
+		const rawElement = this.isAdoptedMode(root) ? null : this.rawStyleElements.get(root);
+		let rawIndex = raw && !rawElement ? 0 : -1;
+		const chunks = [];
+		for (const sheetInfo of registry.sheets) {
+			const css = this.readSheetCSS(sheetInfo);
+			if (css === null) continue;
+			if (rawIndex < 0 && rawElement && sheetInfo.sheet && rawElement.compareDocumentPosition(sheetInfo.sheet) & Node.DOCUMENT_POSITION_FOLLOWING) rawIndex = chunks.length;
+			chunks.push(css);
+		}
+		if (!raw) return chunks;
+		chunks.splice(rawIndex < 0 ? chunks.length : rawIndex, 0, raw);
+		return chunks;
+	}
+	/**
+	* Top-level rules in the raw sheet.
+	*
+	* Read from the sheet the engine parsed, not from the text: a raw block is
+	* one string but any number of rules, and one rule — `@keyframes`, `@media` —
+	* can contain any number of blocks, so counting braces answers neither
+	* question.
+	*/
+	getRawRuleCount(root) {
+		const sheet = this.isAdoptedMode(root) ? this.rawConstructableSheets.get(root) : this.rawStyleElements.get(root)?.sheet;
+		try {
+			return sheet?.cssRules.length ?? 0;
+		} catch {
+			return 0;
+		}
+	}
+	getRawCSSText(root) {
+		if (this.isAdoptedMode(root)) {
+			const blocksMap = this.rawCSSBlocks.get(root);
+			if (!blocksMap || blocksMap.size === 0) return "";
+			return rawBlocksToCSS(blocksMap);
+		}
+		return this.rawStyleElements.get(root)?.textContent || "";
+	}
+};
+//#endregion
+//#region src/injector/injector.ts
+/**
+* How long a class is left alone after it was last known to be wanted.
+* Long enough that a render cannot plausibly still be waiting to commit one.
+*/
+const DEFAULT_GC_GRACE = 1e4;
+/** Dispose handle handed back for injections that took no pin. */
+const noop = () => {};
+/**
+* Placeholder `KeyframesInfo` for a cache entry reserved by a batched write and
+* not yet backed by a real rule. Only ever read through `entry.pending`, which
+* is checked before the info is used.
+*/
+const EMPTY_KEYFRAMES_INFO = {
+	name: "",
+	ruleIndex: -3,
+	sheetIndex: -3
+};
+/**
+* Extract class names from `<style data-tasty-rsc>` tags.
+* The doubled-specificity pattern `.tXXX.tXXX` makes extraction reliable.
+*/
+function extractRSCClassNames(rscClassRegex) {
+	if (typeof document === "undefined") return [];
+	const styles = document.querySelectorAll("style[data-tasty-rsc]");
+	if (styles.length === 0) return [];
+	const classSet = /* @__PURE__ */ new Set();
+	for (const style of styles) {
+		const text = style.textContent;
+		if (!text) continue;
+		let match;
+		rscClassRegex.lastIndex = 0;
+		while ((match = rscClassRegex.exec(text)) !== null) classSet.add(match[1]);
+	}
+	return Array.from(classSet);
+}
+/**
+* Lazily sync server-rendered class names into the client registry.
+*
+* Sources:
+* 1. `window.__TASTY__` — pushed by SSR/RSC streaming scripts
+* 2. `<style data-tasty-rsc>` tags — inline CSS emitted by RSC components
+*
+* Called inside `inject()` / `allocateClassName()` to pick up
+* class names rendered on the server (including during SPA navigation).
+*/
+function syncServerClasses(registry, rscClassRegex) {
+	if (typeof window === "undefined") return;
+	const classes = window.__TASTY__;
+	if (classes && classes.length > registry.serverClassSyncIndex) {
+		for (let i = registry.serverClassSyncIndex; i < classes.length; i++) registerHydratedClass(registry, classes[i]);
+		registry.serverClassSyncIndex = classes.length;
+	}
+	if (!registry.rscStylesScanned) {
+		registry.rscStylesScanned = true;
+		for (const cls of extractRSCClassNames(rscClassRegex)) registerHydratedClass(registry, cls);
+	}
+}
+function registerHydratedClass(registry, className) {
+	if (registry.rules.has(className)) return;
+	registry.rules.set(className, {
+		className,
+		ruleIndex: -2,
+		sheetIndex: -2
+	});
+	registry.pinCounts.set(className, 0);
+}
+var StyleInjector = class {
+	sheetManager;
+	config;
+	globalRuleCounter = 0;
+	/** Cancels the scheduled sweep, whichever timer scheduled it. */
+	cancelPendingGC = null;
+	namePrefix;
+	classRegex;
+	rscClassRegex;
+	/** @internal — exposed for debug utilities only */
+	get _sheetManager() {
+		return this.sheetManager;
+	}
+	/** Register inferable custom properties used by a set of declarations. */
+	inferProperties(registry, rules, root) {
+		if (this.config.autoPropertyTypes === false) return;
+		const resolver = registry.propertyTypeResolver;
+		const defined = registry.injectedProperties;
+		for (const rule of rules) {
+			if (!rule.declarations) continue;
+			resolver.scanDeclarations(rule.declarations, (name) => defined.has(name), (name, syntax, initialValue) => {
+				this.property(name, {
+					syntax,
+					inherits: true,
+					initialValue,
+					root
+				});
+			});
+		}
+	}
+	/**
+	* Whether sheet writes should be queued instead of applied immediately.
+	*
+	* Only ever true on the client: SSR collects CSS as text and the RSC path
+	* returns it as strings, so neither has a live sheet to batch writes against.
+	*
+	* In the default `true` mode a write is only queued inside an open batch
+	* window — a commit in which `<TastyBatchProvider>` rendered and will
+	* therefore flush in its insertion effect, before any layout effect can
+	* measure. Everything else falls through to a synchronous write, so enabling
+	* the flag cannot make a `useLayoutEffect` read an unstyled element.
+	* `'always'` drops the gate and accepts that trade for wider coverage.
+	*/
+	get batching() {
+		const mode = this.config.batchInjection;
+		if (!mode || typeof document === "undefined") return false;
+		if (mode === "always") return true;
+		if (isBatchWindowOpen()) return true;
+		warnBatchProviderMissing();
+		return false;
+	}
+	/**
+	* Apply a sheet write now, or queue it when batching is on.
+	* Returns the queue handle when deferred, so the caller can cancel it if it
+	* disposes before the flush.
+	*/
+	writeSheet(task) {
+		if (this.batching) return enqueueStyleWrite(task);
+		task();
+		return null;
+	}
+	/**
+	* Insert a global (non-class) rule, honouring batching.
+	*
+	* `onApplied` records the caller's dedupe bookkeeping. When the write is
+	* queued it runs eagerly, so a repeat call before the flush bails out instead
+	* of queueing the same rule twice — the same reasoning as
+	* `insertPropertyRule`'s eager marking. When written synchronously it runs
+	* only on success, preserving the existing retry-on-failure behaviour.
+	*/
+	writeGlobalRule(registry, rules, key, root, onApplied) {
+		if (this.batching) {
+			onApplied?.();
+			enqueueStyleWrite(() => {
+				this.sheetManager.insertGlobalRule(registry, rules, key, root);
+			});
+			return;
+		}
+		if (this.sheetManager.insertGlobalRule(registry, rules, key, root)) onApplied?.();
+	}
+	constructor(config = {}) {
+		if (config.namePrefix !== void 0) validateNamePrefix(config.namePrefix);
+		this.config = config;
+		this.sheetManager = new SheetManager(config);
+		this.namePrefix = config.namePrefix ?? "t";
+		this.classRegex = tastyClassRegex(this.namePrefix);
+		this.rscClassRegex = rscClassRegexGlobal(this.namePrefix);
+	}
+	/**
+	* Generate a deterministic class name from a cache key using content hash.
+	* The same cache key always produces the same class name across environments
+	* with the same `namePrefix`.
+	*/
+	generateClassName(cacheKey) {
+		return makeClassName(this.namePrefix, hashString(cacheKey));
+	}
+	/**
+	* Check if `className` was hydrated from server-rendered styles and,
+	* if so, wire the cacheKey mapping. Returns true on hit.
+	*/
+	tryHydratedHit(registry, cacheKey, className) {
+		syncServerClasses(registry, this.rscClassRegex);
+		const rule = registry.rules.get(className);
+		if (rule && rule.ruleIndex === -2 && rule.sheetIndex === -2) {
+			registry.cacheKeyToClassName.set(cacheKey, className);
+			return true;
+		}
+		return false;
+	}
+	/**
+	* Allocate a className for a cacheKey without injecting styles yet.
+	* This allows separating className allocation (render phase) from style injection (insertion phase).
+	*/
+	allocateClassName(cacheKey, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		if (registry.cacheKeyToClassName.has(cacheKey)) return {
+			className: registry.cacheKeyToClassName.get(cacheKey),
+			isNewAllocation: false
+		};
+		const className = this.generateClassName(cacheKey);
+		if (this.tryHydratedHit(registry, cacheKey, className)) return {
+			className,
+			isNewAllocation: false
+		};
+		if (registry.rules.get(className)) {
+			if (isDevEnv()) console.warn(`[Tasty] Hash collision: cache keys produce the same class "${className}". Styles may be incorrect.`);
+			registry.cacheKeyToClassName.set(cacheKey, className);
+			return {
+				className,
+				isNewAllocation: false
+			};
+		}
+		const placeholderRuleInfo = {
+			className,
+			ruleIndex: -1,
+			sheetIndex: -1
+		};
+		registry.rules.set(className, placeholderRuleInfo);
+		registry.cacheKeyToClassName.set(cacheKey, className);
+		return {
+			className,
+			isNewAllocation: true
+		};
+	}
+	/**
+	* Inject styles from StyleResult objects
+	*/
+	inject(rules, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const pin = options?.pin ?? true;
+		if (rules.length === 0) return {
+			className: "",
+			dispose: () => {}
+		};
+		const cacheKey = options?.cacheKey;
+		let className;
+		if (cacheKey && registry.cacheKeyToClassName.has(cacheKey)) {
+			className = registry.cacheKeyToClassName.get(cacheKey);
+			const existingRuleInfo = registry.rules.get(className);
+			if (existingRuleInfo.ruleIndex === -3) {
+				registry.unusedSince.delete(className);
+				if (pin) registry.pinCounts.set(className, (registry.pinCounts.get(className) || 0) + 1);
+				if (registry.metrics) registry.metrics.hits++;
+				return {
+					className,
+					dispose: pin ? () => this.unpin(className, registry) : noop
+				};
+			}
+			if (!(existingRuleInfo.ruleIndex === -1 && existingRuleInfo.sheetIndex === -1)) {
+				registry.unusedSince.delete(className);
+				if (pin) {
+					const pins = registry.pinCounts.get(className) || 0;
+					registry.pinCounts.set(className, pins + 1);
+				}
+				if (registry.metrics) registry.metrics.hits++;
+				return {
+					className,
+					dispose: pin ? () => this.unpin(className, registry) : noop
+				};
+			}
+		} else if (cacheKey) {
+			className = this.generateClassName(cacheKey);
+			if (this.tryHydratedHit(registry, cacheKey, className)) {
+				if (pin) registry.pinCounts.set(className, (registry.pinCounts.get(className) || 0) + 1);
+				if (registry.metrics) registry.metrics.hits++;
+				return {
+					className,
+					dispose: pin ? () => this.unpin(className, registry) : noop
+				};
+			}
+		} else {
+			const parts = rules.map((r) => `${r.selector}\0${r.declarations}`);
+			className = makeClassName(this.namePrefix, hashString(parts.join("\n")));
+		}
+		const rulesToInsert = rules.map((rule) => {
+			let newSelector = rule.selector;
+			if (rule.needsClassName) {
+				const selectorParts = newSelector ? newSelector.split("|||") : [""];
+				const classPrefix = `.${className}.${className}`;
+				newSelector = selectorParts.map((part) => {
+					const classSelector = part ? `${classPrefix}${part}` : classPrefix;
+					if (rule.rootPrefix) return `${rule.rootPrefix} ${classSelector}`;
+					return classSelector;
+				}).join(", ");
+			}
+			return {
+				...rule,
+				selector: newSelector,
+				needsClassName: void 0,
+				rootPrefix: void 0
+			};
+		});
+		const applySheetWrite = () => {
+			this.inferProperties(registry, rulesToInsert, root);
+			const ruleInfo = this.sheetManager.insertRule(registry, rulesToInsert, className, root);
+			if (!ruleInfo) {
+				if (registry.metrics) registry.metrics.misses++;
+				return null;
+			}
+			registry.rules.set(className, ruleInfo);
+			if (cacheKey) registry.cacheKeyToClassName.set(cacheKey, className);
+			if (registry.metrics) {
+				registry.metrics.totalInsertions++;
+				registry.metrics.misses++;
+			}
+			return ruleInfo;
+		};
+		if (this.batching) {
+			registry.rules.set(className, {
+				className,
+				ruleIndex: -3,
+				sheetIndex: -3
+			});
+			if (cacheKey) registry.cacheKeyToClassName.set(cacheKey, className);
+			if (pin) registry.pinCounts.set(className, 1);
+			registry.unusedSince.set(className, Date.now());
+			const queued = enqueueStyleWrite(() => {
+				if (applySheetWrite()) return;
+				registry.rules.set(className, {
+					className,
+					ruleIndex: -1,
+					sheetIndex: -1
+				});
+			});
+			return {
+				className,
+				dispose: pin ? () => {
+					if (!queued.done && registry.pinCounts.get(className) === 1 && registry.rules.get(className)?.ruleIndex === -3) {
+						queued.cancelled = true;
+						registry.rules.delete(className);
+						if (cacheKey) registry.cacheKeyToClassName.delete(cacheKey);
+						registry.pinCounts.set(className, 0);
+						return;
+					}
+					this.unpin(className, registry);
+				} : noop
+			};
+		}
+		if (!applySheetWrite()) return {
+			className,
+			dispose: () => {}
+		};
+		if (pin) registry.pinCounts.set(className, 1);
+		registry.unusedSince.set(className, Date.now());
+		return {
+			className,
+			dispose: pin ? () => this.unpin(className, registry) : noop
+		};
+	}
+	/**
+	* Inject global styles (rules without a generated tasty class selector)
+	* This ensures we don't reserve a tasty class name (t{number}) for global rules,
+	* which could otherwise collide with element-level styles and break lookups.
+	*/
+	injectGlobal(rules, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		if (!rules || rules.length === 0) return { dispose: () => {} };
+		const key = `global:${this.globalRuleCounter++}`;
+		const applyWrite = () => {
+			this.inferProperties(registry, rules, root);
+			const inserted = this.sheetManager.insertGlobalRule(registry, rules, key, root);
+			if (registry.metrics) registry.metrics.totalInsertions++;
+			return inserted;
+		};
+		if (this.batching) {
+			let info = null;
+			const queued = enqueueStyleWrite(() => {
+				info = applyWrite();
+			});
+			return { dispose: () => {
+				if (!queued.done) {
+					queued.cancelled = true;
+					return;
+				}
+				if (info) this.sheetManager.deleteGlobalRule(registry, key);
+			} };
+		}
+		const info = applyWrite();
+		return { dispose: () => {
+			if (info) this.sheetManager.deleteGlobalRule(registry, key);
+		} };
+	}
+	/**
+	* Inject raw CSS text directly without parsing
+	* This is a low-overhead alternative to createGlobalStyle for raw CSS
+	* The CSS is inserted into a separate style element to avoid conflicts with tasty's chunking
+	*/
+	injectRawCSS(css, options) {
+		const root = options?.root || document;
+		if (!this.batching) return this.sheetManager.injectRawCSS(css, root);
+		let result = null;
+		const queued = enqueueStyleWrite(() => {
+			result = this.sheetManager.injectRawCSS(css, root);
+		});
+		return { dispose: () => {
+			if (!queued.done) {
+				queued.cancelled = true;
+				return;
+			}
+			result?.dispose();
+		} };
+	}
+	/**
+	* Get raw CSS text for SSR
+	*/
+	getRawCSSText(options) {
+		flushStyles();
+		const root = options?.root || document;
+		return this.sheetManager.getRawCSSText(root);
+	}
+	/**
+	* Take a reference on local `@keyframes`, under the deterministic names the
+	* caller resolved.
+	*
+	* One reference per distinct set of steps, shared by every class that ends up
+	* animating it, so a repeat render takes nothing further. Ownership is
+	* assigned by `ownKeyframes()` once the rules exist to be inspected.
+	*/
+	holdKeyframes(steps, names, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const keys = /* @__PURE__ */ new Map();
+		for (const [authored, definition] of Object.entries(steps)) {
+			const resolved = names.get(authored) ?? authored;
+			let entry = registry.localKeyframes.get(resolved);
+			if (!entry) {
+				const injected = this.keyframes(definition, {
+					name: resolved,
+					root,
+					distinctByName: true
+				});
+				entry = {
+					name: injected.toString(),
+					dispose: injected.dispose,
+					owners: /* @__PURE__ */ new Set()
+				};
+				registry.localKeyframes.set(resolved, entry);
+			}
+			keys.set(authored, resolved);
+		}
+		return keys;
+	}
+	/**
+	* Record that `className` animates these keyframes, so the reference is
+	* released when the last such class is collected.
+	*
+	* Only classes whose rules actually reference the animation should be here:
+	* a class that merely rendered alongside one would otherwise keep the
+	* keyframes alive for as long as it lives.
+	*/
+	ownKeyframes(key, className, options) {
+		this.sheetManager.getRegistry(options?.root || document).localKeyframes.get(key)?.owners.add(className);
+	}
+	/**
+	* Pin an already-injected cacheKey and return the handle that releases it.
+	* For callers that skipped the pipeline on a cache hit but still need the
+	* class held. Returns null if the cacheKey is not found.
+	*/
+	trackRef(cacheKey, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		if (!registry.cacheKeyToClassName.has(cacheKey)) return null;
+		const className = registry.cacheKeyToClassName.get(cacheKey);
+		const pins = registry.pinCounts.get(className) || 0;
+		registry.pinCounts.set(className, pins + 1);
+		if (registry.metrics) registry.metrics.hits++;
+		return {
+			className,
+			dispose: () => this.unpin(className, registry)
+		};
+	}
+	/**
+	* Release one pin on a className. At zero pins the class is not deleted — it
+	* stays cached and collectible, and `gc()` decides when it actually goes.
+	*/
+	unpin(className, registry) {
+		const pins = registry.pinCounts.get(className);
+		if (pins == null || pins <= 0) return;
+		const remaining = pins - 1;
+		registry.pinCounts.set(className, remaining);
+		if (remaining === 0 && registry.metrics) registry.metrics.totalUnused++;
+	}
+	/**
+	* Remove every style that is neither in the DOM nor referenced by an
+	* outstanding `inject()` handle, ignoring the GC capacity threshold.
+	*/
+	cleanup(root) {
+		this.gc({
+			root,
+			force: true
+		});
+	}
+	/**
+	* Get CSS text from all sheets (for SSR)
+	*/
+	getCSSText(options) {
+		flushStyles();
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		return this.sheetManager.getCSSText(registry);
+	}
+	/**
+	* Get CSS only for the provided tasty classNames (e.g., ["t0","t3"])
+	*/
+	getCSSTextForClasses(classNames, options) {
+		flushStyles();
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const cssChunks = [];
+		for (const cls of classNames) {
+			const info = registry.rules.get(cls);
+			if (info) {
+				const sheet = registry.sheets[info.sheetIndex];
+				const styleSheet = sheet ? this.sheetManager.getCSSSheet(sheet) : null;
+				if (styleSheet) {
+					const start = Math.max(0, info.ruleIndex);
+					const end = Math.min(styleSheet.cssRules.length - 1, info.endRuleIndex ?? info.ruleIndex);
+					if (start >= 0 && end >= start && start < styleSheet.cssRules.length) for (let i = start; i <= end; i++) {
+						const rule = styleSheet.cssRules[i];
+						if (rule) cssChunks.push(rule.cssText);
+					}
+				} else if (info.cssText && info.cssText.length) cssChunks.push(...info.cssText);
+			}
+		}
+		return cssChunks.join("\n");
+	}
+	/**
+	* Get cache performance metrics
+	*/
+	getMetrics(options) {
+		flushStyles();
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const metrics = this.sheetManager.getMetrics(registry);
+		if (metrics && typeof document !== "undefined") metrics.unusedHits = this.collectUnused(registry, root).length;
+		return metrics;
+	}
+	/**
+	* Reset cache performance metrics
+	*/
+	resetMetrics(options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		this.sheetManager.resetMetrics(registry);
+	}
+	/**
+	* Define a CSS @property custom property.
+	*
+	* Accepts tasty token syntax for the property name:
+	* - `$name` → defines `--name`
+	* - `#name` → defines `--name-color` (auto-sets syntax: '<color>', defaults initialValue: 'transparent')
+	* - `--name` → defines `--name` (legacy format)
+	*
+	* Example:
+	* @property --rotation { syntax: "<angle>"; inherits: false; initial-value: 45deg; }
+	*
+	* Note: No caching or dispose — this defines a global property.
+	*
+	* If the same property is registered with different options, a warning is emitted
+	* but the original definition is preserved (CSS @property cannot be redefined).
+	*/
+	property(name, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const effectiveResult = getEffectiveDefinition(name, {
+			syntax: options?.syntax,
+			inherits: options?.inherits,
+			initialValue: options?.initialValue
+		});
+		if (!effectiveResult.isValid) {
+			if (isDevEnv()) console.warn(`[Tasty] property(): ${effectiveResult.error}. Got: "${name}"`);
+			return;
+		}
+		const cssName = effectiveResult.cssName;
+		const definition = effectiveResult.definition;
+		this.insertPropertyRule(registry, root, cssName, definition, name);
+	}
+	/**
+	* Build and insert a single `@property` rule into the given registry.
+	* No-op if the property was already injected.
+	*/
+	insertPropertyRule(registry, root, cssName, definition, cacheKey) {
+		if (registry.injectedProperties.has(cssName)) return;
+		const parts = [];
+		if (definition.syntax != null) {
+			let syntax = String(definition.syntax).trim();
+			if (!/^['"]/u.test(syntax)) syntax = `"${syntax}"`;
+			parts.push(`syntax: ${syntax};`);
+		}
+		const inherits = definition.inherits ?? true;
+		parts.push(`inherits: ${inherits ? "true" : "false"};`);
+		if (definition.initialValue != null) {
+			let initialValueStr;
+			if (typeof definition.initialValue === "number") initialValueStr = String(definition.initialValue);
+			else initialValueStr = parseStyle(definition.initialValue).output;
+			parts.push(`initial-value: ${initialValueStr};`);
+		}
+		const declarations = parts.join(" ").trim();
+		const rule = {
+			selector: `@property ${cssName}`,
+			declarations
+		};
+		registry.injectedProperties.set(cssName, normalizePropertyDefinition(definition));
+		this.writeGlobalRule(registry, [rule], `property:${cacheKey}`, root);
+	}
+	/**
+	* Check whether a given @property name was already injected by this injector.
+	*
+	* Accepts tasty token syntax:
+	* - `$name` → checks `--name`
+	* - `#name` → checks `--name-color`
+	* - `--name` → checks `--name` (legacy format)
+	*/
+	isPropertyDefined(name, options) {
+		flushStyles();
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const effectiveResult = getEffectiveDefinition(name, {});
+		if (!effectiveResult.isValid) return false;
+		return registry.injectedProperties.has(effectiveResult.cssName);
+	}
+	/**
+	* Inject a CSS @font-face rule.
+	*
+	* Permanent and global — no dispose or ref-counting.
+	* Deduplicates by content hash (family + descriptors).
+	*/
+	fontFace(family, descriptors, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const hash = fontFaceContentHash(family, descriptors);
+		if (registry.injectedFontFaces.has(hash)) return;
+		const rule = {
+			selector: "@font-face",
+			declarations: formatFontFaceDeclarations(family, descriptors)
+		};
+		this.writeGlobalRule(registry, [rule], `fontface:${hash}`, root, () => {
+			registry.injectedFontFaces.add(hash);
+		});
+	}
+	/**
+	* Inject a CSS @counter-style rule.
+	*
+	* Permanent and global — no dispose or ref-counting. Deduplicates by name.
+	* By default a definition overrides a previously injected one of the same
+	* name. Pass `weak: true` for global `configure()` definitions, which must
+	* never clobber an existing rule (so component-local definitions win
+	* regardless of injection order).
+	*/
+	counterStyle(name, descriptors, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const isWeak = options?.weak === true;
+		const existingIsStrong = registry.injectedCounterStyles.get(name);
+		if (existingIsStrong !== void 0) {
+			if (isWeak || existingIsStrong === true) return;
+			this.writeSheet(() => {
+				this.sheetManager.deleteGlobalRule(registry, `counterstyle:${name}`);
+			});
+		}
+		const rule = {
+			selector: `@counter-style ${name}`,
+			declarations: formatCounterStyleDeclarations(descriptors)
+		};
+		this.writeGlobalRule(registry, [rule], `counterstyle:${name}`, root, () => {
+			registry.injectedCounterStyles.set(name, !isWeak);
+		});
+	}
+	/**
+	* Inject a CSS @function rule (custom function).
+	*
+	* Permanent and global — no dispose or ref-counting. Deduplicates by function
+	* name. By default a definition overrides a previously injected one of the
+	* same name. Pass `weak: true` for global `configure()` definitions, which
+	* must never clobber an existing rule (so component-local definitions win
+	* regardless of injection order).
+	*/
+	func(name, definition, options) {
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		const isWeak = options?.weak === true;
+		const cssName = parseFunctionName(name);
+		const existingIsStrong = registry.injectedFunctions.get(cssName);
+		if (existingIsStrong !== void 0) {
+			if (isWeak || existingIsStrong === true) return;
+			this.writeSheet(() => {
+				this.sheetManager.deleteGlobalRule(registry, `function:${cssName}`);
+			});
+		}
+		const rule = {
+			selector: formatFunctionPrelude(name, definition.args, definition.returns),
+			declarations: formatFunctionDeclarations(definition)
+		};
+		this.writeGlobalRule(registry, [rule], `function:${cssName}`, root, () => {
+			registry.injectedFunctions.set(cssName, !isWeak);
+		});
+	}
+	/**
+	* Inject keyframes and return object with toString() and dispose()
+	*
+	* Keyframes are cached by content (steps). If the same content is injected
+	* multiple times with different provided names, the first injected name is reused.
+	*
+	* If the same name is provided with different content (collision), a unique
+	* name is generated to avoid overwriting the existing keyframes.
+	*/
+	keyframes(steps, nameOrOptions) {
+		const isStringName = typeof nameOrOptions === "string";
+		const providedName = isStringName ? nameOrOptions : nameOrOptions?.name;
+		const distinctByName = isStringName ? false : nameOrOptions?.distinctByName ?? false;
+		const root = isStringName ? document : nameOrOptions?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		if (Object.keys(steps).length === 0) return {
+			toString: () => "",
+			dispose: () => {}
+		};
+		const contentHash = distinctByName && providedName ? `${providedName}\u0000${JSON.stringify(steps)}` : JSON.stringify(steps);
+		const existing = registry.keyframesCache.get(contentHash);
+		if (existing) {
+			existing.refCount++;
+			return {
+				toString: () => existing.name,
+				dispose: () => this.disposeKeyframes(contentHash, registry)
+			};
+		}
+		let actualName;
+		if (providedName) {
+			const existingContentForName = registry.keyframesNameToContent.get(providedName);
+			if (existingContentForName && existingContentForName !== contentHash) actualName = `${providedName}-${makeKeyframeName(this.namePrefix, String(registry.keyframesCounter++))}`;
+			else {
+				actualName = providedName;
+				registry.keyframesNameToContent.set(providedName, contentHash);
+			}
+		} else actualName = makeKeyframeName(this.namePrefix, String(registry.keyframesCounter++));
+		const applyWrite = () => {
+			const result = this.sheetManager.insertKeyframes(registry, steps, actualName, root);
+			if (!result) return false;
+			const { info, declarations } = result;
+			if (this.config.autoPropertyTypes !== false && declarations) registry.propertyTypeResolver.scanDeclarations(declarations, (name) => registry.injectedProperties.has(name), (name, syntax, initialValue) => {
+				this.property(name, {
+					syntax,
+					inherits: true,
+					initialValue,
+					root
+				});
+			});
+			const entry = registry.keyframesCache.get(contentHash);
+			if (entry) {
+				entry.info = info;
+				entry.pending = void 0;
+			} else registry.keyframesCache.set(contentHash, {
+				name: actualName,
+				refCount: 1,
+				info
+			});
+			if (registry.metrics) {
+				registry.metrics.totalInsertions++;
+				registry.metrics.misses++;
+			}
+			return true;
+		};
+		if (this.batching) {
+			const entry = {
+				name: actualName,
+				refCount: 1,
+				info: EMPTY_KEYFRAMES_INFO
+			};
+			registry.keyframesCache.set(contentHash, entry);
+			entry.pending = enqueueStyleWrite(() => {
+				if (applyWrite()) return;
+				if (registry.keyframesCache.get(contentHash) === entry) registry.keyframesCache.delete(contentHash);
+			});
+			return {
+				toString: () => actualName,
+				dispose: () => this.disposeKeyframes(contentHash, registry)
+			};
+		}
+		if (!applyWrite()) return {
+			toString: () => "",
+			dispose: () => {}
+		};
+		return {
+			toString: () => actualName,
+			dispose: () => this.disposeKeyframes(contentHash, registry)
+		};
+	}
+	/**
+	* Dispose keyframes
+	*/
+	disposeKeyframes(contentHash, registry) {
+		const entry = registry.keyframesCache.get(contentHash);
+		if (!entry) return;
+		entry.refCount--;
+		if (entry.refCount <= 0) {
+			if (entry.pending && !entry.pending.done) entry.pending.cancelled = true;
+			else this.sheetManager.deleteKeyframes(registry, entry.info);
+			registry.keyframesCache.delete(contentHash);
+			for (const [name, hash] of registry.keyframesNameToContent.entries()) if (hash === contentHash) {
+				registry.keyframesNameToContent.delete(name);
+				break;
+			}
+			if (registry.metrics) {
+				registry.metrics.totalUnused++;
+				registry.metrics.stylesCleanedUp++;
+			}
+		}
+	}
+	/**
+	* Count a render, and schedule a collection pass every `touchInterval` of
+	* them. Nothing else: what a class is worth keeping is decided by the sweep's
+	* own DOM scan, so rendering does not track usage at all.
+	*
+	* @deprecated The class name is ignored — pass anything, or stop calling it.
+	* Collection no longer records per-class usage, and scheduling does not need
+	* to know which class was rendered. A class handed back by `inject()` is
+	* marked wanted there, which is what reuse actually goes through.
+	*/
+	touch(_className, options) {
+		if (typeof document === "undefined") return;
+		if (!this.config.gc) return;
+		const registry = this.sheetManager.getRegistry(options?.root || document);
+		if (++registry.touchCount >= (this.config.gc.touchInterval ?? 1e3)) {
+			registry.touchCount = 0;
+			this.scheduleGC();
+		}
+	}
+	/**
+	* Schedule a GC in idle time. Runs GC on all active roots, and avoids
+	* double-scheduling.
+	*
+	* Idle only. Without `requestIdleCallback` nothing is collected
+	* automatically: running the sweep inline here would put it inside the render
+	* that touched the class, and collection is never urgent enough for that.
+	*/
+	scheduleGC() {
+		if (this.cancelPendingGC) return;
+		const runGC = () => {
+			this.cancelPendingGC = null;
+			this.sheetManager.pruneDisconnectedRoots();
+			for (const root of this.sheetManager.getActiveRoots()) this.gc({ root });
+		};
+		if (typeof requestIdleCallback !== "undefined") {
+			const handle = requestIdleCallback(() => runGC());
+			this.cancelPendingGC = () => cancelIdleCallback(handle);
+		}
+	}
+	/**
+	* The one definition of "unused": this injector owns the class's rules, no
+	* element in `root` carries it, and nobody pinned it.
+	*
+	* `gc()` evicts from this set, `getMetrics()` counts it, and `tastyDebug`
+	* reports it — all through here, so the three can never disagree about what
+	* "unused" means. Entries carry their last `touch()` so callers can drop the
+	* oldest first; a class that was never touched sorts as oldest.
+	*/
+	/**
+	* Everything the injector holds falls into one of five bands, and only the
+	* last of them is ever deleted:
+	*
+	* 1. rendered — some element carries the class right now
+	* 2. not ours — queued for a batched write, pre-allocated, or server-rendered
+	* 3. hot — nothing carries it, but that was noticed less than `grace` ago
+	* 4. cached — cold, but within `capacity` when ordered by when it went cold
+	* 5. the rest
+	*
+	* This returns bands 4 and 5 together, most recently cold first; `gc()` draws
+	* the capacity line through them. Band 3 is what makes collection safe
+	* without a commit signal: a render can resolve a class and commit it a
+	* little later, and during that gap nothing on the page carries it.
+	*/
+	collectUnused(registry, root) {
+		const now = Date.now();
+		const grace = this.config.gc?.grace ?? DEFAULT_GC_GRACE;
+		const liveClasses = /* @__PURE__ */ new Set();
+		for (const el of root.querySelectorAll("[class]")) for (const token of el.classList) if (this.classRegex.test(token)) liveClasses.add(token);
+		const unused = [];
+		for (const [className, ruleInfo] of registry.rules) {
+			if (ruleInfo.sheetIndex < 0) continue;
+			if (liveClasses.has(className)) {
+				registry.unusedSince.delete(className);
+				continue;
+			}
+			if ((registry.pinCounts.get(className) ?? 0) > 0) continue;
+			let since = registry.unusedSince.get(className);
+			if (since === void 0) {
+				since = now;
+				registry.unusedSince.set(className, now);
+			}
+			if (now - since < grace) continue;
+			unused.push(className);
+		}
+		unused.sort((a, b) => (registry.unusedSince.get(b) ?? 0) - (registry.unusedSince.get(a) ?? 0));
+		return unused;
+	}
+	/**
+	* Class names this injector holds CSS for that nothing renders and nobody
+	* pinned — exactly what `gc({ force: true })` would delete. Unordered.
+	*/
+	getUnusedClasses(options) {
+		flushStyles();
+		if (typeof document === "undefined") return [];
+		const root = options?.root || document;
+		const registry = this.sheetManager.getRegistry(root);
+		return this.collectUnused(registry, root);
+	}
+	/**
+	* Synchronous garbage collection.
+	*
+	* 1. Quick upper-bound check: skip if the registry is smaller than capacity.
+	* 2. Scans the DOM for live tasty classNames — the DOM, not a ref count, is
+	*    what says a class rendered by a component is still in use.
+	* 3. With `force: true`: deletes every unused class.
+	*    Without `force`: keeps the `capacity` most recently touched and deletes
+	*    the rest, oldest first.
+	*
+	* @returns Number of styles evicted.
+	*/
+	gc(options) {
+		flushStyles();
+		if (typeof document === "undefined") return 0;
+		this.cancelPendingGC?.();
+		this.cancelPendingGC = null;
+		const root = options?.root || document;
+		const force = options?.force;
+		const registry = this.sheetManager.getRegistry(root);
+		const capacity = this.config.gc?.capacity ?? 1e3;
+		if (!force && registry.rules.size <= capacity) return 0;
+		const unused = this.collectUnused(registry, root);
+		let doomed;
+		if (force) doomed = unused;
+		else if (unused.length > capacity) doomed = unused.slice(capacity);
+		else return 0;
+		if (doomed.length === 0) return 0;
+		return this.sheetManager.deleteClasses(registry, doomed);
+	}
+	/**
+	* Destroy all resources for a root
+	*/
+	destroy(root) {
+		flushStyles();
+		const targetRoot = root || document;
+		this.sheetManager.cleanup(targetRoot);
+		if (this.cancelPendingGC && !this.sheetManager.hasActiveRoots()) {
+			this.cancelPendingGC();
+			this.cancelPendingGC = null;
+		}
+	}
+};
+//#endregion
+//#region src/config.ts
+/**
+* Tasty Configuration Module
+*
+* Centralizes all tasty configuration, including:
+* - Style injector settings (nonce, cleanup thresholds, etc.)
+* - Global predefined states for advanced state mapping
+* - stylesGenerated flag that locks configuration after first style generation
+*
+* Configuration must be done BEFORE any styles are generated.
+* After the first `inject()` call, configuration is locked and attempts to
+* reconfigure will emit a warning and be ignored.
+*/
+const emittedWarnings = /* @__PURE__ */ new Set();
+const devMode = isDevEnv();
+/**
+* Emit a warning only once
+*/
+function warnOnce(key, message) {
+	if (devMode && !emittedWarnings.has(key)) {
+		emittedWarnings.add(key);
+		console.warn(message);
+	}
+}
+let currentConfig = null;
+let globalKeyframes = null;
+let globalRecipes = null;
+const GLOBAL_INJECTOR_KEY = "__TASTY_GLOBAL_INJECTOR__";
+/**
+* Detect if we're running in a test environment
+*/
+function isTestEnvironment() {
+	if (typeof global !== "undefined") {
+		const g = global;
+		if (g.vi || g.jest || g.expect || g.describe || g.it) return true;
+	}
+	if (typeof window !== "undefined") {
+		const ua = window.navigator?.userAgent;
+		if (ua?.includes("jsdom") || ua?.includes("HappyDOM")) return true;
+	}
+	if (typeof globalThis !== "undefined") {
+		const gt = globalThis;
+		if (gt.vitest || gt.mocha) return true;
+	}
+	return false;
+}
+/**
+* Create default configuration with optional test environment detection
+*/
+function createDefaultConfig(isTest) {
+	return {
+		maxRulesPerSheet: 8192,
+		forceTextInjection: isTest ?? false,
+		devMode: isDevEnv(),
+		namePrefix: "t"
+	};
+}
+/**
+* Mark that styles have been generated (called by injector on first inject)
+* This locks the configuration - no further changes allowed.
+* Also injects internal and global properties.
+*/
+function markStylesGenerated() {
+	if (!markStylesGeneratedState()) return;
+	if (typeof document !== "undefined" && document.querySelector("[data-tasty-ssr]")) {
+		warnOnce("ssr-globals-skip", "[Tasty] SSR styles detected — skipping client-side global CSS injection to avoid duplicates.");
+		return;
+	}
+	const injector = getGlobalInjector();
+	const globalFontFaces = getGlobalFontFaces();
+	const globalCounterStyles = getGlobalCounterStyles();
+	const globalFunctions = getGlobalFunctions();
+	const globalTokens = getGlobalConfigTokens();
+	const configuredGlobalStyles = getGlobalStyles();
+	for (const [token, definition] of Object.entries(getEffectiveProperties())) injector.property(token, definition);
+	if (globalFontFaces && Object.keys(globalFontFaces).length > 0) for (const [family, input] of Object.entries(globalFontFaces)) {
+		const descriptors = Array.isArray(input) ? input : [input];
+		for (const desc of descriptors) injector.fontFace(family, desc);
+	}
+	if (globalCounterStyles && Object.keys(globalCounterStyles).length > 0) for (const [name, descriptors] of Object.entries(globalCounterStyles)) injector.counterStyle(name, descriptors, { weak: true });
+	if (globalFunctions && Object.keys(globalFunctions).length > 0) for (const [name, definition] of Object.entries(globalFunctions)) injector.func(name, definition, { weak: true });
+	if (globalTokens && Object.keys(globalTokens).length > 0) {
+		const tokenRules = renderStyles(globalTokens, ":root");
+		if (tokenRules.length > 0) injector.injectGlobal(tokenRules);
+	}
+	if (configuredGlobalStyles) {
+		for (const [selector, styles] of Object.entries(configuredGlobalStyles)) if (Object.keys(styles).length > 0) {
+			const rules = renderStyles(styles, selector);
+			if (rules.length > 0) injector.injectGlobal(rules);
+		}
+	}
+}
+let _hasGlobalKeyframes = false;
+/**
+* Check if any global keyframes are configured.
+* Uses a pre-computed flag to avoid Object.keys() allocation on every call.
+*/
+function hasGlobalKeyframes() {
+	return _hasGlobalKeyframes;
+}
+/**
+* Get global keyframes configuration.
+* Returns null if no keyframes configured (fast path for zero-overhead).
+*/
+function getGlobalKeyframes() {
+	return globalKeyframes;
+}
+/**
+* Set global keyframes (called from configure).
+* Internal use only.
+*/
+function setGlobalKeyframes(keyframes) {
+	if (hasStylesGenerated()) {
+		warnOnce("keyframes-after-styles", "[Tasty] Cannot update keyframes after styles have been generated.\nThe new keyframes will be ignored.");
+		return;
+	}
+	globalKeyframes = {
+		...globalKeyframes ?? {},
+		...keyframes
+	};
+	_hasGlobalKeyframes = Object.keys(globalKeyframes).length > 0;
+}
+/**
+* Set global properties (called from configure).
+* Internal use only.
+*/
+function setGlobalProperties(properties) {
+	if (hasStylesGenerated()) {
+		warnOnce("properties-after-styles", "[Tasty] Cannot update properties after styles have been generated.\nThe new properties will be ignored.");
+		return;
+	}
+	mergeGlobalProperties(properties);
+}
+/**
+* Set global font faces (called from configure).
+* Internal use only.
+*/
+function setGlobalFontFace(fontFace) {
+	if (hasStylesGenerated()) {
+		warnOnce("fontface-after-styles", "[Tasty] Cannot update fontFaces after styles have been generated.\nThe new font faces will be ignored.");
+		return;
+	}
+	mergeGlobalFontFaces(fontFace);
+}
+/**
+* Set global counter styles (called from configure).
+* Internal use only.
+*/
+function setGlobalCounterStyle(counterStyle) {
+	if (hasStylesGenerated()) {
+		warnOnce("counterstyle-after-styles", "[Tasty] Cannot update counterStyles after styles have been generated.\nThe new counter styles will be ignored.");
+		return;
+	}
+	mergeGlobalCounterStyles(counterStyle);
+}
+/**
+* Set global functions (called from configure).
+* Internal use only.
+*/
+function setGlobalFunction(functions) {
+	if (hasStylesGenerated()) {
+		warnOnce("function-after-styles", "[Tasty] Cannot update functions after styles have been generated.\nThe new functions will be ignored.");
+		return;
+	}
+	mergeGlobalFunctions(functions);
+}
+/**
+* Check if any global recipes are configured.
+* Fast path: returns false if no recipes were ever set.
+*/
+function hasGlobalRecipes() {
+	return globalRecipes !== null && Object.keys(globalRecipes).length > 0;
+}
+/**
+* Get global recipes configuration.
+* Returns null if no recipes configured (fast path for zero-overhead).
+*/
+function getGlobalRecipes() {
+	return globalRecipes;
+}
+/**
+* Set global recipes (called from configure).
+* Internal use only.
+*/
+function setGlobalRecipes(recipes) {
+	if (hasStylesGenerated()) {
+		warnOnce("recipes-after-styles", "[Tasty] Cannot update recipes after styles have been generated.\nThe new recipes will be ignored.");
+		return;
+	}
+	if (devMode) for (const [name, recipeStyles] of Object.entries(recipes)) {
+		if (name === "none") warnOnce("recipe-reserved-none", "[Tasty] Recipe name \"none\" is reserved. It is used as a keyword meaning \"no base recipes\" (e.g. recipe: 'none / post-recipe'). Choose a different name for your recipe.");
+		for (const key of Object.keys(recipeStyles)) {
+			if (isSelector(key)) warnOnce(`recipe-selector-${name}-${key}`, `[Tasty] Recipe "${name}" contains sub-element key "${key}". Recipes must be flat styles without sub-element keys. Remove the sub-element key from the recipe definition.`);
+			if (key === "recipe") warnOnce(`recipe-recursive-${name}`, `[Tasty] Recipe "${name}" contains a "recipe" key. Recipes cannot reference other recipes. Use space-separated names for composition: recipe: 'base elevated'.`);
+		}
+	}
+	globalRecipes = {
+		...globalRecipes ?? {},
+		...recipes
+	};
+}
+/**
+* Set global token styles (called from configure).
+* Internal use only.
+*/
+function setGlobalConfigTokens(styles) {
+	if (hasStylesGenerated()) {
+		warnOnce("tokens-after-styles", "[Tasty] Cannot update tokens after styles have been generated.\nThe new tokens will be ignored.");
+		return;
+	}
+	mergeGlobalConfigTokens(styles);
+}
+/**
+* Set configured global styles (called from configure).
+* Internal use only.
+*/
+function setGlobalStyles(styles) {
+	if (hasStylesGenerated()) {
+		warnOnce("globalStyles-after-styles", "[Tasty] Cannot update globalStyles after styles have been generated.\nThe new global styles will be ignored.");
+		return;
+	}
+	mergeGlobalStyles(styles);
+}
+/**
+* Check if configuration is locked (styles have been generated)
+*/
+function isConfigLocked() {
+	return hasStylesGenerated();
+}
+/**
+* Configure the Tasty style system.
+*
+* Must be called BEFORE any styles are generated (before first render that uses tasty).
+* After styles are generated, configuration is locked and calls to configure() will
+* emit a warning and be ignored.
+*
+* @example
+* ```ts
+* import { configure } from '@tenphi/tasty';
+*
+* // Configure before app renders
+* configure({
+*   nonce: 'abc123',
+*   states: {
+*     '@mobile': '@media(w < 768px)',
+*     '@dark': '@root(theme=dark)',
+*   },
+* });
+* ```
+*/
+function configure(config = {}) {
+	if (hasStylesGenerated()) {
+		warnOnce("configure-after-styles", "[Tasty] Cannot call configure() after styles have been generated.\nConfiguration must be done before the first render. The configuration will be ignored.");
+		return;
+	}
+	if (config.namePrefix !== void 0) validateNamePrefix(config.namePrefix);
+	const normalized = normalizeConfig(config);
+	const { propHandlers: mergedPropHandlers, propHandlerSources, baseStyleProps: mergedBaseStyleProps, properties: mergedProperties, keyframes: mergedKeyframes, fontFaces: mergedFontFaces, counterStyles: mergedCounterStyles, tokens: mergedConfigTokens, recipes: mergedRecipes, globalStyles: mergedGlobalStyles } = normalized;
+	const functionDefs = applyStyleConfig(config, normalized, warnOnce);
+	if (!isFunctionsPolyfillEnabled() && Object.keys(functionDefs).length > 0) setGlobalFunction(functionDefs);
+	if (Object.keys(mergedKeyframes).length > 0) setGlobalKeyframes(mergedKeyframes);
+	if (Object.keys(mergedProperties).length > 0) setGlobalProperties(mergedProperties);
+	if (Object.keys(mergedFontFaces).length > 0) setGlobalFontFace(mergedFontFaces);
+	if (Object.keys(mergedCounterStyles).length > 0) setGlobalCounterStyle(mergedCounterStyles);
+	if (Object.keys(mergedPropHandlers).length > 0) for (const [name, definition] of Object.entries(mergedPropHandlers)) registerPropHandler(name, definition, { source: propHandlerSources.get(name) });
+	if (mergedBaseStyleProps.length > 0) registerBaseStyleProps(mergedBaseStyleProps);
+	if (Object.keys(mergedConfigTokens).length > 0) setGlobalConfigTokens(mergedConfigTokens);
+	if (Object.keys(mergedRecipes).length > 0) setGlobalRecipes(mergedRecipes);
+	if (Object.keys(mergedGlobalStyles).length > 0) setGlobalStyles(mergedGlobalStyles);
+	const { states: _states, parserCacheSize: _parserCacheSize, units: _units, functions: _functions, polyfills: _polyfills, plugins: _plugins, keyframes: _keyframes, properties: _properties, fontFaces: _fontFaces, counterStyles: _counterStyles, handlers: _handlers, propHandlers: _propHandlers, baseStyleProps: _baseStyleProps, tokens: _tokens, replaceTokens: _replaceTokens, recipes: _recipes, colorSpace: _colorSpace, presets: _presets, globalStyles: _globalStyles, ...injectorConfig } = config;
+	const fullConfig = {
+		...createDefaultConfig(),
+		...currentConfig,
+		...injectorConfig
+	};
+	currentConfig = fullConfig;
+	setRuntimeConfigState(fullConfig);
+	const storage = typeof window !== "undefined" ? window : globalThis;
+	storage[GLOBAL_INJECTOR_KEY] = new StyleInjector(fullConfig);
+}
+/**
+* Get the current configuration.
+* If not configured, returns default configuration.
+*/
+function getConfig() {
+	if (currentConfig) return currentConfig;
+	const defaultConfig = createDefaultConfig(isTestEnvironment());
+	currentConfig = defaultConfig;
+	setRuntimeConfigState(defaultConfig);
+	return defaultConfig;
+}
+/**
+* Get the configured prefix used for every generated identifier
+* (class names, keyframe names, counter-style names).
+*
+* Falls back to the default prefix (`'t'`) when `configure()` has not
+* been called yet — this matches the auto-configuration behavior used
+* by the rest of the system.
+*/
+function getNamePrefix() {
+	return currentConfig?.namePrefix ?? "t";
+}
+/**
+* Get the global injector instance.
+* Auto-configures with defaults if not already configured.
+*/
+function getGlobalInjector() {
+	const storage = typeof window !== "undefined" ? window : globalThis;
+	if (!storage[GLOBAL_INJECTOR_KEY]) configure();
+	return storage[GLOBAL_INJECTOR_KEY];
+}
+/**
+* Reset configuration (for testing only).
+* Clears the global injector and allows reconfiguration.
+*/
+function resetConfig() {
+	resetStylesGeneratedState();
+	currentConfig = null;
+	globalKeyframes = null;
+	_hasGlobalKeyframes = false;
+	resetGlobalPolyfillsState();
+	globalRecipes = null;
+	resetConfigResources();
+	resetGlobalPredefinedTokens();
+	resetGlobalParseFunctions();
+	resetFunctionPolyfills();
+	resetHandlers();
+	resetStyleChunks();
+	resetPropHandlers();
+	resetBaseStyleProps();
+	clearPipelineCache();
+	emittedWarnings.clear();
+	resetStyleWarnings();
+	const storage = typeof window !== "undefined" ? window : globalThis;
+	delete storage[GLOBAL_INJECTOR_KEY];
+}
+//#endregion
+//#region src/injector/chunk-sheet-registry.ts
+/**
+* Global registry mapping CSS content hashes to shared constructable
+* CSSStyleSheet objects with reference counting.
+*
+* Multiple shadow roots adopting the same chunk share a single underlying
+* stylesheet object — parse once, adopt everywhere.
+*/
+var ChunkSheetRegistry = class {
+	sheets = /* @__PURE__ */ new Map();
+	sheetToHash = /* @__PURE__ */ new WeakMap();
+	/**
+	* Get or create a CSSStyleSheet for the given CSS text.
+	* Increments refCount. Uses content hash as the dedup key.
+	*/
+	acquire(cssText) {
+		const hash = hashString(cssText);
+		const existing = this.sheets.get(hash);
+		if (existing) {
+			existing.refCount++;
+			return existing.sheet;
+		}
+		const sheet = new CSSStyleSheet();
+		sheet.replaceSync(cssText);
+		const entry = {
+			sheet,
+			cssText,
+			refCount: 1
+		};
+		this.sheets.set(hash, entry);
+		this.sheetToHash.set(sheet, hash);
+		return sheet;
+	}
+	/**
+	* Decrement refCount for a sheet. When refCount reaches 0,
+	* the sheet is removed from the registry.
+	*/
+	release(sheet) {
+		const hash = this.sheetToHash.get(sheet);
+		if (!hash) return;
+		const entry = this.sheets.get(hash);
+		if (!entry) return;
+		entry.refCount--;
+		if (entry.refCount <= 0) {
+			this.sheets.delete(hash);
+			this.sheetToHash.delete(sheet);
+		}
+	}
+	/**
+	* Bulk acquire — returns an array of CSSStyleSheet in the same order.
+	*/
+	acquireAll(cssTexts) {
+		return cssTexts.map((text) => this.acquire(text));
+	}
+	/**
+	* Bulk release — decrements refCount for each sheet.
+	*/
+	releaseAll(sheets) {
+		for (const sheet of sheets) this.release(sheet);
+	}
+	/** Number of unique sheets currently held. */
+	get size() {
+		return this.sheets.size;
+	}
+};
+/** Module-level singleton shared across the entire application. */
+const chunkSheetRegistry = new ChunkSheetRegistry();
+//#endregion
+//#region src/injector/index.ts
+/**
+* Inject styles and return className with dispose function
+*/
+function inject(rules, options) {
+	const injector = getGlobalInjector();
+	markStylesGenerated();
+	return injector.inject(rules, options);
+}
+/**
+* Inject global rules that should not reserve tasty class names
+*/
+function injectGlobal(rules, options) {
+	return getGlobalInjector().injectGlobal(rules, options);
+}
+/**
+* Inject raw CSS text directly without parsing
+* This is a low-overhead method for injecting raw CSS that doesn't need tasty processing.
+* The CSS is inserted into a separate style element to avoid conflicts with tasty's chunking.
+*
+* @example
+* ```tsx
+* // Inject raw CSS
+* const { dispose } = injectRawCSS(`
+*   body { margin: 0; padding: 0; }
+*   .my-class { color: red; }
+* `);
+*
+* // Later, remove the injected CSS
+* dispose();
+* ```
+*/
+function injectRawCSS(css, options) {
+	return getGlobalInjector().injectRawCSS(css, options);
+}
+/**
+* Get raw CSS text for SSR
+*/
+function getRawCSSText(options) {
+	return getGlobalInjector().getRawCSSText(options);
+}
+/**
+* Inject keyframes and return object with toString() and dispose()
+*/
+function keyframes(steps, nameOrOptions) {
+	return getGlobalInjector().keyframes(steps, nameOrOptions);
+}
+/**
+* Define a CSS @property custom property.
+* This enables advanced features like animating custom properties.
+*
+* Note: @property rules are global and persistent once defined.
+* Re-registering the same property name is a no-op.
+*
+* @param name - The custom property name (must start with --)
+* @param options - Property configuration
+*
+* @example
+* ```ts
+* // Define a color property that can be animated
+* property('--my-color', {
+*   syntax: '<color>',
+*   initialValue: 'red',
+* });
+*
+* // Define an angle property
+* property('--rotation', {
+*   syntax: '<angle>',
+*   inherits: false,
+*   initialValue: '0deg',
+* });
+* ```
+*/
+function property(name, options) {
+	return getGlobalInjector().property(name, options);
+}
+/**
+* Check if a CSS @property has already been defined
+*
+* @param name - The custom property name to check
+* @param options - Options including root
+*/
+function isPropertyDefined(name, options) {
+	return getGlobalInjector().isPropertyDefined(name, options);
+}
+/**
+* Inject a CSS @font-face rule.
+*
+* Permanent and global — no dispose or ref-counting.
+* Deduplicates by content hash (family + descriptors).
+*/
+function fontFace(family, descriptors, options) {
+	return getGlobalInjector().fontFace(family, descriptors, options);
+}
+/**
+* Inject a CSS @counter-style rule.
+*
+* Permanent and global — no dispose or ref-counting. Deduplicates by name and
+* overrides an existing rule by default. Pass `weak: true` for global
+* `configure()` definitions, which never clobber an existing rule.
+*/
+function counterStyle(name, descriptors, options) {
+	return getGlobalInjector().counterStyle(name, descriptors, options);
+}
+/**
+* Inject a CSS @function rule (custom function).
+*
+* Permanent and global — no dispose or ref-counting. Deduplicates by function
+* name and overrides an existing rule by default. Pass `weak: true` for global
+* `configure()` definitions, which never clobber an existing rule.
+*
+* @param name - The function name (`$$name`, `$name`, or `--name`)
+* @param definition - Function definition (args, returns, result, local vars)
+*
+* @example
+* ```ts
+* func('$$negative', { args: ['$value'], result: '(-1 * $value)' });
+* ```
+*/
+function func(name, definition, options) {
+	return getGlobalInjector().func(name, definition, options);
+}
+/**
+* Get CSS text from all sheets (for SSR)
+*/
+function getCSSText(options) {
+	return getGlobalInjector().getCSSText(options);
+}
+/**
+* Collect only CSS used by a rendered subtree (like jest-styled-components).
+* Pass the container returned by render(...).
+*/
+function getCSSTextForNode(node, options) {
+	const classRegex = tastyClassRegex(getNamePrefix());
+	const classSet = /* @__PURE__ */ new Set();
+	const readClasses = (el) => {
+		const cls = el.getAttribute("class");
+		if (!cls) return;
+		for (const token of cls.split(/\s+/)) if (classRegex.test(token)) classSet.add(token);
+	};
+	if (node.getAttribute) readClasses(node);
+	const elements = node.querySelectorAll ? node.querySelectorAll("[class]") : [];
+	if (elements) elements.forEach(readClasses);
+	return getGlobalInjector().getCSSTextForClasses(classSet, options);
+}
+/**
+* Take a reference on local `@keyframes` under the deterministic names the
+* caller resolved, and report which entry holds each. Pair with
+* `ownKeyframes()` once the rules exist to inspect.
+*/
+function holdKeyframes(steps, names, options) {
+	return getGlobalInjector().holdKeyframes(steps, names, options);
+}
+/**
+* Record that a class animates these keyframes, so the reference is released
+* when the last such class is collected.
+*/
+function ownKeyframes(key, className, options) {
+	getGlobalInjector().ownKeyframes(key, className, options);
+}
+/**
+* Remove every injected rule that is neither in the DOM nor held by an
+* outstanding `inject()` handle. Equivalent to `gc({ force: true })`.
+*/
+function cleanup(root) {
+	return getGlobalInjector().cleanup(root);
+}
+/**
+* Count a render, so that a collection pass is scheduled every
+* `gc.touchInterval` of them. Used internally by computeStyles and tasty().
+*
+* @deprecated The class name is ignored — collection asks the DOM what is
+* rendered rather than recording usage per class. The argument is kept so
+* existing calls still compile.
+*/
+function touch(className, options) {
+	if (!getConfig().gc) return;
+	getGlobalInjector().touch(className, options);
+}
+/**
+* Synchronous garbage collection of unused styles — those no element carries
+* and no `inject()` handle references. Evicts the oldest ones once they exceed
+* capacity. With `{ force: true }`, removes all of them regardless of capacity.
+*
+* @returns Number of styles evicted.
+*/
+function gc(options) {
+	return getGlobalInjector().gc(options);
+}
+/**
+* Get the global injector instance for debugging
+*/
+const injector = { get instance() {
+	return getGlobalInjector();
+} };
+/**
+* Destroy all resources and clean up
+*/
+function destroy(root) {
+	return getGlobalInjector().destroy(root);
+}
+/**
+* Create a new isolated injector instance
+*/
+function createInjector(config = {}) {
+	return new StyleInjector({
+		...getConfig(),
+		forceTextInjection: config.forceTextInjection ?? isTestEnvironment(),
+		...config
+	});
+}
+//#endregion
+//#region src/rsc-cache.ts
+/**
+* Shared RSC (React Server Components) inline style cache.
+*
+* Uses React.cache for per-request memoization in Server Components.
+* Both computeStyles() and standalone style functions (useGlobalStyles,
+* useRawCSS, useKeyframes, useProperty, useFontFace, useCounterStyle)
+* share this cache so that CSS accumulated by standalone functions is
+* flushed into inline <style> tags by the next tasty() component.
+*/
+/**
+* Per-request RSC style cache using React.cache.
+* React.cache provides per-request memoization in Server Components,
+* so each request gets its own isolated cache.
+*/
+const getRSCCache = cache(() => ({
+	cacheKeyToClassName: /* @__PURE__ */ new Map(),
+	emittedKeys: /* @__PURE__ */ new Set(),
+	internalsEmitted: false,
+	pendingCSS: [],
+	keyToIndex: /* @__PURE__ */ new Map(),
+	generatedNames: /* @__PURE__ */ new Map()
+}));
+function rscAllocateClassName(rscCache, cacheKey) {
+	const existing = rscCache.cacheKeyToClassName.get(cacheKey);
+	if (existing) return {
+		className: existing,
+		isNew: false
+	};
+	const className = makeClassName(getNamePrefix(), hashString(cacheKey));
+	rscCache.cacheKeyToClassName.set(cacheKey, className);
+	return {
+		className,
+		isNew: true
+	};
+}
+/**
+* Flush any pending CSS accumulated by standalone functions.
+* Returns the CSS string and clears the buffer.
+*/
+function flushPendingCSS(rscCache) {
+	if (rscCache.pendingCSS.length === 0) return "";
+	const css = rscCache.pendingCSS.join("\n");
+	rscCache.pendingCSS.length = 0;
+	rscCache.keyToIndex.clear();
+	return css;
+}
+/**
+* Push CSS into the RSC pending buffer with dedup via emittedKeys.
+* Returns true if the CSS was added, false if it was already emitted.
+*
+* Pass `replace` for slot-keyed entries (an explicit `id`), where the last write
+* must win to match the client's update-tracking behavior. If the slot has
+* already been flushed into a `<style>` tag the new CSS is appended instead,
+* which still wins by cascade order.
+*/
+function pushRSCCSS(rscCache, key, css, replace) {
+	if (replace) {
+		const pendingIndex = rscCache.keyToIndex.get(key);
+		if (pendingIndex !== void 0) {
+			rscCache.pendingCSS[pendingIndex] = css;
+			return true;
+		}
+	} else if (rscCache.emittedKeys.has(key)) return false;
+	rscCache.emittedKeys.add(key);
+	rscCache.keyToIndex.set(key, rscCache.pendingCSS.length);
+	rscCache.pendingCSS.push(css);
+	return true;
+}
+/**
+* Determine the current style injection target.
+* Centralizes the three-way detection (SSR collector / RSC cache / client DOM)
+* used by all style functions.
+*/
+function getStyleTarget() {
+	const collector = getRegisteredSSRCollector();
+	if (collector) return {
+		mode: "ssr",
+		collector
+	};
+	if (typeof document === "undefined") return {
+		mode: "rsc",
+		cache: getRSCCache()
+	};
+	return { mode: "client" };
+}
+//#endregion
+//#region src/ssr/collect-auto-properties.ts
+/**
+* Scan rendered rules for auto-inferable custom properties and emit
+* @property CSS via the provided callback.
+*/
+function scanAndEmitAutoProperties(rules, styles, emit) {
+	const registered = /* @__PURE__ */ new Set();
+	if (styles) {
+		const localProps = styles["@property"];
+		if (localProps && typeof localProps === "object") for (const token of Object.keys(localProps)) {
+			const parsed = parsePropertyToken(token);
+			if (parsed.isValid) registered.add(parsed.cssName);
+		}
+	}
+	const resolver = new PropertyTypeResolver();
+	for (const rule of rules) {
+		if (!rule.declarations) continue;
+		resolver.scanDeclarations(rule.declarations, (name) => registered.has(name), (name, syntax, initialValue) => {
+			registered.add(name);
+			const css = formatPropertyCSS(name, {
+				syntax,
+				inherits: true,
+				initialValue
+			});
+			if (css) emit(name, css);
+		});
+	}
+}
+/**
+* Scan rendered rules for custom property declarations and collect
+* auto-inferred @property rules via the SSR collector.
+*
+* @param rules - Rendered style rules containing CSS declarations
+* @param collector - SSR collector to emit @property CSS into
+* @param styles - Original styles object (used to skip explicit @property)
+*/
+function collectAutoInferredProperties(rules, collector, styles) {
+	scanAndEmitAutoProperties(rules, styles, (name, css) => {
+		collector.collectProperty(`__auto:${name}`, css);
+	});
+}
+/**
+* RSC variant: scan rendered rules and push auto-inferred @property CSS
+* into the RSC pending buffer.
+*/
+function collectAutoInferredPropertiesRSC(rules, rscCache, styles) {
+	scanAndEmitAutoProperties(rules, styles, (name, css) => {
+		pushRSCCSS(rscCache, `__auto:${name}`, css);
+	});
+}
+//#endregion
+//#region src/utils/has-keys.ts
+/**
+* Check if an object has any own enumerable keys.
+* Avoids the array allocation of Object.keys(obj).length > 0.
+*/
+function hasKeys(obj) {
+	for (const _ in obj) return true;
+	return false;
+}
+//#endregion
+//#region src/utils/resolve-recipes.ts
+/** Resolve recipe references against the globally configured recipe map. */
+function resolveRecipes(styles) {
+	return resolveRecipesWith(styles, getGlobalRecipes());
+}
+//#endregion
+//#region src/compute-styles.ts
+/**
+* Hook-free, synchronous style computation.
+*
+* Extracts the core logic from useStyles() into a plain function that can
+* be called during React render without any hooks. Three code paths:
+*
+* 1. SSR collector — styles collected via ServerStyleCollector
+* 2. Client inject — styles injected synchronously into the DOM
+* 3. RSC inline — styles returned as CSS strings for inline <style> emission
+*
+* This enables tasty() components to work as React Server Components.
+*/
+const EMPTY_RESULT = { className: "" };
+/**
+* Collect per-component ancillary CSS (keyframes, @property, font-face,
+* counter-style) for RSC mode.
+*/
+function collectAncillaryRSC(rscCache, styles, usedKf, keyframeNames) {
+	const parts = [];
+	if (usedKf && keyframeNames) for (const [authored, steps] of Object.entries(usedKf)) {
+		const name = keyframeNames.get(authored);
+		const key = `__kf:${name}`;
+		if (!rscCache.emittedKeys.has(key)) {
+			rscCache.emittedKeys.add(key);
+			parts.push(formatKeyframesCSS(name, steps));
+		}
+	}
+	const localProperties = extractLocalProperties(styles);
+	if (localProperties) for (const [token, definition] of Object.entries(localProperties)) {
+		const key = `__prop:${token}`;
+		if (!rscCache.emittedKeys.has(key)) {
+			rscCache.emittedKeys.add(key);
+			const css = formatPropertyCSS(token, definition);
+			if (css) parts.push(css);
+		}
+	}
+	const localFontFace = extractLocalFontFace(styles);
+	if (localFontFace) for (const [family, input] of Object.entries(localFontFace)) {
+		const descriptors = Array.isArray(input) ? input : [input];
+		for (const desc of descriptors) {
+			const key = `__ff:${fontFaceContentHash(family, desc)}`;
+			if (!rscCache.emittedKeys.has(key)) {
+				rscCache.emittedKeys.add(key);
+				parts.push(formatFontFaceRule(family, desc));
+			}
+		}
+	}
+	const localCounterStyle = extractLocalCounterStyle(styles);
+	if (localCounterStyle) for (const [name, descriptors] of Object.entries(localCounterStyle)) {
+		const key = `__cs:${name}:${JSON.stringify(descriptors)}`;
+		if (!rscCache.emittedKeys.has(key)) {
+			rscCache.emittedKeys.add(key);
+			parts.push(formatCounterStyleRule(name, descriptors));
+		}
+	}
+	if (!isFunctionsPolyfillEnabled()) {
+		const localFunctions = extractLocalFunctions(styles);
+		if (localFunctions) for (const [name, definition] of Object.entries(localFunctions)) {
+			const key = `__func:${parseFunctionName(name)}`;
+			if (!rscCache.emittedKeys.has(key)) {
+				rscCache.emittedKeys.add(key);
+				parts.push(formatFunctionRule(name, definition));
+			}
+		}
+	}
+	return parts.join("\n");
+}
+/**
+* Process all chunks in RSC mode: render CSS to strings, allocate classNames,
+* and return combined { className, css }.
+*/
+function computeStylesRSC(styles, chunkMap, stableStyles) {
+	const rscCache = getRSCCache();
+	const cssParts = [];
+	const classNames = [];
+	const rscUsedKf = getUsedKeyframes(styles);
+	const rscKeyframeNames = rscUsedKf ? resolveKeyframesNames(rscUsedKf) : null;
+	const pendingCSS = flushPendingCSS(rscCache);
+	if (pendingCSS) cssParts.push(pendingCSS);
+	rscCache.internalsEmitted = true;
+	for (const [chunkName, chunkStyleKeys] of chunkMap) {
+		if (chunkStyleKeys.length === 0) continue;
+		const baseKey = generateChunkCacheKey(styles, chunkName, chunkStyleKeys, stableStyles);
+		const renderResult = renderStylesForChunk(styles, chunkName, chunkStyleKeys);
+		if (renderResult.rules.length === 0) continue;
+		const { rules, cacheKey } = applyKeyframeNames(renderResult.rules, baseKey, rscKeyframeNames);
+		const { className, isNew } = rscAllocateClassName(rscCache, cacheKey);
+		classNames.push(className);
+		if (isNew) {
+			const css = formatRules(rules, className);
+			if (css) cssParts.push(css);
+		}
+	}
+	const ancillaryCSS = collectAncillaryRSC(rscCache, styles, rscUsedKf, rscKeyframeNames);
+	if (ancillaryCSS) cssParts.push(ancillaryCSS);
+	if (classNames.length === 0) return EMPTY_RESULT;
+	const css = cssParts.join("\n");
+	return {
+		className: classNames.join(" "),
+		css: css || void 0
+	};
+}
+/**
+* Get keyframes that are actually used in styles.
+* Returns null if no keyframes are used (fast path for zero overhead).
+*/
+function getUsedKeyframes(styles) {
+	const hasLocal = hasLocalKeyframes(styles);
+	const hasGlobal = hasGlobalKeyframes();
+	if (!hasLocal && !hasGlobal) return null;
+	const usedNames = extractAnimationNamesFromStyles(styles);
+	if (usedNames.size === 0) return null;
+	return filterUsedKeyframes(mergeKeyframes(hasLocal ? extractLocalKeyframes(styles) : null, hasGlobal ? getGlobalKeyframes() : null), usedNames);
+}
+/**
+* Process a chunk on the SSR path: allocate via collector, render, collect CSS.
+*/
+function processChunkSSR(collector, styles, chunkName, styleKeys, stableStyles, keyframeNames) {
+	if (styleKeys.length === 0) return null;
+	const baseKey = generateChunkCacheKey(styles, chunkName, styleKeys, stableStyles);
+	const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);
+	if (renderResult.rules.length === 0) return null;
+	const { rules, cacheKey } = applyKeyframeNames(renderResult.rules, baseKey, keyframeNames);
+	const { className, isNewAllocation } = collector.allocateClassName(cacheKey);
+	if (isNewAllocation) {
+		collector.collectChunk(cacheKey, className, rules);
+		return {
+			className,
+			rules
+		};
+	}
+	return {
+		className,
+		rules: []
+	};
+}
+/**
+* Point a chunk's rules at the resolved keyframe names, and fold those names
+* into its cache key.
+*
+* Both halves matter, and both have to happen before the rules are written
+* anywhere: the declarations have to name the animation that will exist, and
+* the key has to distinguish two components that authored the same shorthand
+* over different definitions. Shared by the client and the server so they
+* cannot disagree about either.
+*/
+function applyKeyframeNames(ruleset, baseKey, keyframeNames) {
+	if (!keyframeNames || keyframeNames.size === 0) return {
+		animations: [],
+		rules: ruleset,
+		cacheKey: baseKey
+	};
+	const usedNames = /* @__PURE__ */ new Set();
+	let rules;
+	for (let i = 0; i < ruleset.length; i++) {
+		const rule = ruleset[i];
+		const declarations = replaceAnimationNames(rule.declarations, keyframeNames, usedNames);
+		if (declarations !== rule.declarations) {
+			rules ??= ruleset.slice();
+			rules[i] = {
+				...rule,
+				declarations
+			};
+		}
+	}
+	const animations = [...keyframeNames.keys()].filter((authored) => usedNames.has(authored));
+	if (animations.length === 0) return {
+		animations,
+		rules: ruleset,
+		cacheKey: baseKey
+	};
+	const cacheKey = `${baseKey}\u0000kf:${animations.map((authored) => `${authored}=${keyframeNames.get(authored)}`).sort().join(",")}`;
+	return {
+		animations,
+		rules: rules ?? ruleset,
+		cacheKey
+	};
+}
+/**
+* Process a chunk on the client: render, allocate className, and inject
+* CSS synchronously. The injector's cache makes this idempotent.
+*/
+function processChunkSync(styles, chunkName, styleKeys, stableStyles, root, keyframeNames) {
+	if (styleKeys.length === 0) return null;
+	const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys, stableStyles);
+	const renderResult = renderStylesForChunk(styles, chunkName, styleKeys, cacheKey);
+	if (renderResult.rules.length === 0) return null;
+	const { animations, rules, cacheKey: injectKey } = applyKeyframeNames(renderResult.rules, cacheKey, keyframeNames);
+	const { className } = inject(rules, {
+		cacheKey: injectKey,
+		root,
+		pin: false
+	});
+	return {
+		className,
+		animations
+	};
+}
+/**
+* Inject all ancillary rules (properties, font-faces, counter-styles) synchronously.
+*/
+function injectAncillarySync(styles, root) {
+	const localProperties = extractLocalProperties(styles);
+	if (localProperties) for (const [token, definition] of Object.entries(localProperties)) property(token, {
+		...definition,
+		root
+	});
+	const localFontFace = extractLocalFontFace(styles);
+	if (localFontFace) for (const [family, input] of Object.entries(localFontFace)) {
+		const descriptors = Array.isArray(input) ? input : [input];
+		for (const desc of descriptors) fontFace(family, desc, { root });
+	}
+	const localCounterStyle = extractLocalCounterStyle(styles);
+	if (localCounterStyle) for (const [name, descriptors] of Object.entries(localCounterStyle)) counterStyle(name, descriptors, { root });
+	if (!isFunctionsPolyfillEnabled()) {
+		const localFunctions = extractLocalFunctions(styles);
+		if (localFunctions) for (const [name, definition] of Object.entries(localFunctions)) func(name, definition, { root });
+	}
+}
+/**
+* Collect all ancillary rules into the SSR collector.
+*/
+function collectAncillarySSR(collector, styles, chunks, usedKf, keyframeNames) {
+	if (usedKf && keyframeNames) for (const [authored, steps] of Object.entries(usedKf)) {
+		const name = keyframeNames.get(authored);
+		collector.collectKeyframes(name, formatKeyframesCSS(name, steps));
+	}
+	const localProperties = extractLocalProperties(styles);
+	if (localProperties) for (const [token, definition] of Object.entries(localProperties)) {
+		const css = formatPropertyCSS(token, definition);
+		if (css) collector.collectProperty(token, css);
+	}
+	const localFontFace = extractLocalFontFace(styles);
+	if (localFontFace) for (const [family, input] of Object.entries(localFontFace)) {
+		const descriptors = Array.isArray(input) ? input : [input];
+		for (const desc of descriptors) {
+			const hash = fontFaceContentHash(family, desc);
+			const css = formatFontFaceRule(family, desc);
+			collector.collectFontFace(hash, css);
+		}
+	}
+	const localCounterStyle = extractLocalCounterStyle(styles);
+	if (localCounterStyle) for (const [name, descriptors] of Object.entries(localCounterStyle)) {
+		const css = formatCounterStyleRule(name, descriptors);
+		collector.collectCounterStyle(name, css);
+	}
+	if (!isFunctionsPolyfillEnabled()) {
+		const localFunctions = extractLocalFunctions(styles);
+		if (localFunctions) for (const [name, definition] of Object.entries(localFunctions)) {
+			const css = formatFunctionRule(name, definition);
+			collector.collectFunction(parseFunctionName(name), css);
+		}
+	}
+	if (getConfig().autoPropertyTypes !== false) {
+		const allRules = chunks.flatMap((chunk) => chunk.rules ?? []);
+		if (allRules.length > 0) collectAutoInferredProperties(allRules, collector, styles);
+	}
+}
+/**
+* Synchronous, hook-free style computation.
+*
+* Resolves recipes, categorizes style keys into chunks, renders CSS rules,
+* allocates class names, and injects / collects / returns the CSS.
+*
+* Three code paths:
+* 1. SSR collector — discovered via ALS or passed explicitly; CSS collected
+* 2. RSC inline — no collector and no `document`; CSS returned as `result.css`
+*    for the caller to emit as an inline `<style>` tag
+* 3. Client inject — CSS injected synchronously into the DOM (idempotent)
+*
+* @param styles - Tasty styles object (or undefined for no styles)
+* @param options - Optional SSR collector override
+*/
+function computeStyles(styles, options) {
+	if (!styles || !hasKeys(styles)) return EMPTY_RESULT;
+	const resolved = resolveRecipes(styles);
+	const stableStyles = options?.stableStyles === true && resolved === styles;
+	if (isFunctionsPolyfillEnabled()) registerLocalFunctionPolyfills(resolved);
+	const chunkMap = categorizeStyleKeys(resolved);
+	const collector = options?.ssrCollector !== void 0 ? options.ssrCollector : getRegisteredSSRCollector();
+	const chunks = [];
+	if (collector) {
+		collector.collectInternals();
+		const ssrKf = getUsedKeyframes(resolved);
+		const ssrKeyframeNames = ssrKf ? resolveKeyframesNames(ssrKf) : null;
+		for (const [chunkName, chunkStyleKeys] of chunkMap) {
+			const chunk = processChunkSSR(collector, resolved, chunkName, chunkStyleKeys, stableStyles, ssrKeyframeNames);
+			if (chunk) chunks.push(chunk);
+		}
+		collectAncillarySSR(collector, resolved, chunks, ssrKf, ssrKeyframeNames);
+	} else if (typeof document === "undefined") return computeStylesRSC(resolved, chunkMap, stableStyles);
+	else {
+		const root = options?.root;
+		injectAncillarySync(resolved, root);
+		const usedKf = getUsedKeyframes(resolved);
+		const keyframeNames = usedKf ? resolveKeyframesNames(usedKf) : null;
+		const keyframeKeys = usedKf && keyframeNames ? holdKeyframes(usedKf, keyframeNames, { root }) : null;
+		for (const [chunkName, chunkStyleKeys] of chunkMap) {
+			const chunk = processChunkSync(resolved, chunkName, chunkStyleKeys, stableStyles, root, keyframeNames);
+			if (chunk) chunks.push(chunk);
+		}
+		if (keyframeKeys) for (const chunk of chunks) for (const authored of chunk.animations ?? []) {
+			const key = keyframeKeys.get(authored);
+			if (key) ownKeyframes(key, chunk.className, { root });
+		}
+		for (const chunk of chunks) touch(chunk.className, { root });
+	}
+	if (chunks.length === 0) return EMPTY_RESULT;
+	if (chunks.length === 1) return { className: chunks[0].className };
+	return { className: chunks.map((c) => c.className).join(" ") };
+}
+//#endregion
+//#region src/utils/filter-base-props.ts
+const BasePropNames = new Set([
+	"role",
+	"as",
+	"element",
+	"css",
+	"qa",
+	"mods",
+	"qaVal",
+	"hidden",
+	"isHidden",
+	"disabled",
+	"isDisabled",
+	"children",
+	"style",
+	"className",
+	"href",
+	"target",
+	"tabIndex"
+]);
+const eventRe = /^on[A-Z].+$/;
+const ignoredEventProps = new Set([
+	"onPress",
+	"onHoverStart",
+	"onHoverEnd",
+	"onPressStart",
+	"onPressEnd"
+]);
+/**
+* Filters out all props that aren't valid DOM props or defined via override prop obj.
+* @param props - The component props to be filtered.
+* @param opts - Props to override.
+*/
+function filterBaseProps(props, opts = {}) {
+	const { propNames, eventProps } = opts;
+	const filteredProps = {};
+	for (const prop of Object.keys(props)) if (prop === "id" || BasePropNames.has(prop) || prop.startsWith("aria-") || eventProps && eventRe.test(prop) && !ignoredEventProps.has(prop) || propNames?.has(prop) || prop.startsWith("data-")) filteredProps[prop] = props[prop];
+	return filteredProps;
+}
+//#endregion
+//#region src/utils/mod-attrs.ts
+const cache$1 = new Lru();
+function modAttrs(map) {
+	if (!map) return null;
+	const cacheKey = JSON.stringify(map);
+	const cached = cache$1.get(cacheKey);
+	if (cached) return cached;
+	const attrs = {};
+	for (const key of Object.keys(map)) {
+		const value = map[key];
+		if (value == null || value === false) continue;
+		const attrName = `data-${camelToKebab(key)}`;
+		if (value === true) attrs[attrName] = "";
+		else if (typeof value === "string") attrs[attrName] = value;
+		else if (typeof value === "number") attrs[attrName] = String(value);
+		else console.warn(`[Tasty] Invalid mod value for "${key}". Expected boolean, string, or number, got ${typeof value}`);
+	}
+	cache$1.set(cacheKey, attrs);
+	return attrs;
+}
+//#endregion
+//#region src/utils/process-tokens.ts
+/**
+* Check if a value is a valid token value (string, number, or boolean - not object).
+* Returns false for `false` values (they mean "skip this token").
+*/
+function isValidTokenValue(value) {
+	if (value === void 0 || value === null || value === false) return false;
+	if (typeof value === "object") {
+		console.warn("[Tasty] Object values are not allowed in tokens prop. Tokens do not support state-based styling. Use a primitive value instead.");
+		return false;
+	}
+	return typeof value === "string" || typeof value === "number" || typeof value === "boolean";
+}
+/**
+* Process a single token value through the tasty parser.
+* Numbers are converted to strings; 0 stays as "0".
+*/
+function processTokenValue(value) {
+	if (typeof value === "number") {
+		if (value === 0) return "0";
+		return parseStyle(String(value)).output;
+	}
+	return parseStyle(value).output;
+}
+/**
+* Resolve one `$name` / `#name` entry to the custom property it declares and
+* the value to declare, or `null` when the entry declares nothing.
+*
+* The two sigils differ only in the property name they build and in how `true`
+* is read: for a custom property it is the empty value, for a color it is
+* `transparent`.
+*/
+function resolveTokenEntry(key, value) {
+	const name = `--${normalizeDslName(key.slice(1))}`;
+	if (key[0] === "$") return [name, processTokenValue(value === true ? "" : value)];
+	const colorValue = normalizeColorTokenValue(value);
+	if (colorValue === null) return null;
+	return [`${name}-color`, processTokenValue(colorValue)];
+}
+/**
+* Process tokens object into inline style properties.
+* - `$name` -> `--name` with the parsed value
+* - `#name` -> `--name-color` with the parsed value
+*
+* @param tokens - The tokens object to process
+* @returns CSSProperties object or undefined if no tokens to process
+*/
+function processTokens(tokens) {
+	if (!tokens) return;
+	const keys = Object.keys(tokens);
+	if (keys.length === 0) return;
+	let result;
+	for (const key of keys) {
+		const value = tokens[key];
+		if (!isValidTokenValue(value)) continue;
+		if (key[0] !== "$" && key[0] !== "#") continue;
+		const entry = resolveTokenEntry(key, value);
+		if (!entry) continue;
+		if (!result) result = {};
+		result[entry[0]] = entry[1];
+	}
+	return result;
+}
+//#endregion
+//#region src/utils/client-state.ts
+/**
+* Build a per-(injector, root) client state cache for the standalone style
+* functions (`useGlobalStyles`, `useRawCSS`, `useKeyframes`, `useCounterStyle`).
+*
+* Two levels, both weak:
+*
+* - **injector** — `configure()` replaces the global injector, and every dispose
+*   handle and generated name we cache belongs to the one that produced it.
+*   Keying by injector makes stale state fall away with it, instead of letting
+*   change-detection keys suppress re-injection into the new sheets.
+* - **root** — the same selector or slot name can be used in several shadow
+*   roots, and each holds its own injection.
+*/
+function createClientState(create) {
+	const byInjector = /* @__PURE__ */ new WeakMap();
+	return (root) => {
+		const injector = getGlobalInjector();
+		let byRoot = byInjector.get(injector);
+		if (!byRoot) {
+			byRoot = /* @__PURE__ */ new WeakMap();
+			byInjector.set(injector, byRoot);
+		}
+		let state = byRoot.get(root);
+		if (!state) {
+			state = create();
+			byRoot.set(root, state);
+		}
+		return state;
+	};
+}
+//#endregion
+//#region src/utils/deps-equal.ts
+/**
+* Shallow comparison of two dependency arrays using Object.is semantics.
+* Returns true when both arrays have the same length and every element
+* at the same index is identical.
+*/
+function depsEqual(a, b) {
+	if (a.length !== b.length) return false;
+	for (let i = 0; i < a.length; i++) if (!Object.is(a[i], b[i])) return false;
+	return true;
+}
+//#endregion
+export { propHandlerRegistry as $, ownKeyframes as A, getNamePrefix as B, holdKeyframes as C, injector as D, injectRawCSS as E, configure as F, resetConfig as G, hasGlobalRecipes as H, getConfig as I, closeBatchWindow as J, StyleInjector as K, getGlobalInjector as L, touch as M, ChunkSheetRegistry as N, isPropertyDefined as O, chunkSheetRegistry as P, resetStyleBatch as Q, getGlobalKeyframes as R, getRawCSSText as S, injectGlobal as T, isConfigLocked as U, hasGlobalKeyframes as V, isTestEnvironment as W, hasPendingStyleWrites as X, flushStyles as Y, openBatchWindow as Z, fontFace as _, filterBaseProps as a, getCSSText as b, hasKeys as c, getStyleTarget as d, pushRSCCSS as f, destroy as g, createInjector as h, modAttrs as i, property as j, keyframes as k, collectAutoInferredProperties as l, counterStyle as m, createClientState as n, computeStyles as o, cleanup as p, SheetManager as q, processTokens as r, resolveRecipes as s, depsEqual as t, collectAutoInferredPropertiesRSC as u, func as v, inject as w, getCSSTextForNode as x, gc as y, getGlobalRecipes as z };
+
+//# sourceMappingURL=runtime-engine-D2WOLvd6.js.map