@tenphi/tasty 3.3.1 → 3.5.0

package/dist/{core-wxP3GHQu.js → core-Bq7w2kti.js}

@@ -1,7 +1,7 @@
-import { Bt as getGlobalParseFunctions, G as StyleInjector, Gt as parseStyle, It as registerLocalFunctionPolyfills, J as hasLocalCounterStyle, K as extractLocalCounterStyle, Mt as formatFunctionRule, Nt as hasLocalFunctions, Pt as parseFunctionName, Q as hasLocalFontFace, Qt as isDevEnv, Ut as normalizeColorTokenValue, Vt as getGlobalParser, X as fontFaceContentHash, Y as extractLocalFontFace, Z as formatFontFaceRule, _ as isFunctionsPolyfillEnabled, _t as hashString, bt as hasLocalProperties, c as getGlobalInjector, en as Lru, et as STYLE_HANDLER_MAP, f as getNamePrefix, ft as makeClassName, ht as tastyClassRegex, it as PropertyTypeResolver, jt as extractLocalFunctions, l as getGlobalKeyframes, n as getConfig, p as hasGlobalKeyframes, q as formatCounterStyleRule, rt as createStyle, sn as normalizeDslName, tn as overrideColorAlpha, v as isTestEnvironment, vt as extractLocalProperties, wt as CHUNK_NAMES, xt as parsePropertyToken, y as markStylesGenerated, z as camelToKebab } from "./config-BCdCTIED.js";
-import { a as mergeKeyframes, c as generateChunkCacheKey, i as hasLocalKeyframes, l as categorizeStyleKeys, n as extractLocalKeyframes, o as replaceAnimationNames, r as filterUsedKeyframes, s as renderStylesForChunk, t as extractAnimationNamesFromStyles } from "./keyframes-D737PShJ.js";
-import { n as formatPropertyCSS, r as getRegisteredSSRCollector, t as formatRules } from "./format-rules-Bo_e2u7r.js";
-import { t as resolveRecipes } from "./resolve-recipes-Df1Ta-Q0.js";
+import { Bt as getGlobalParseFunctions, G as StyleInjector, Gt as parseStyle, It as registerLocalFunctionPolyfills, J as hasLocalCounterStyle, K as extractLocalCounterStyle, Mt as formatFunctionRule, Nt as hasLocalFunctions, Pt as parseFunctionName, Q as hasLocalFontFace, Qt as isDevEnv, Ut as normalizeColorTokenValue, Vt as getGlobalParser, X as fontFaceContentHash, Y as extractLocalFontFace, Z as formatFontFaceRule, _ as isFunctionsPolyfillEnabled, _t as hashString, bt as hasLocalProperties, c as getGlobalInjector, en as Lru, et as STYLE_HANDLER_MAP, f as getNamePrefix, ft as makeClassName, ht as tastyClassRegex, it as PropertyTypeResolver, jt as extractLocalFunctions, l as getGlobalKeyframes, n as getConfig, ot as flushStyles, p as hasGlobalKeyframes, q as formatCounterStyleRule, rt as createStyle, sn as normalizeDslName, tn as overrideColorAlpha, v as isTestEnvironment, vt as extractLocalProperties, wt as CHUNK_NAMES, xt as parsePropertyToken, y as markStylesGenerated, z as camelToKebab } from "./config-B3gPdCqd.js";
+import { a as mergeKeyframes, c as resolveKeyframesNames, d as categorizeStyleKeys, i as hasLocalKeyframes, l as renderStylesForChunk, n as extractLocalKeyframes, o as referencesAnimation, r as filterUsedKeyframes, s as replaceAnimationNames, t as extractAnimationNamesFromStyles, u as generateChunkCacheKey } from "./keyframes-DE-OE76F.js";
+import { n as formatPropertyCSS, r as getRegisteredSSRCollector, t as formatRules } from "./format-rules-rCZ37rqY.js";
+import { t as resolveRecipes } from "./resolve-recipes-H9NqOQuP.js";
 import { cache } from "react";
 //#region src/utils/function-color.ts
 const RE_FUNC_NAME = /^([a-z][a-z0-9-]*)\s*\(/i;
@@ -245,24 +245,43 @@ function getCSSTextForNode(node, options) {
 	return getGlobalInjector().getCSSTextForClasses(classSet, options);
 }
 /**
-* Force cleanup of unused rules
+* 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);
 }
 /**
-* Record a render-time usage hit for one or more classNames.
-* Used internally by computeStyles and tasty() to track usage for GC.
-* When the global touch counter reaches `touchInterval`, schedules GC.
+* 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.
-* Evicts the oldest unused styles when usageMap exceeds capacity.
-* With `{ force: true }`, removes ALL unused styles regardless of capacity.
+* 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.
 */
@@ -543,8 +562,10 @@ function collectInternalsRSC(rscCache) {
 function collectAncillaryRSC(rscCache, styles) {
 	const parts = [];
 	const usedKf = getUsedKeyframes(styles);
-	if (usedKf) for (const [name, steps] of Object.entries(usedKf)) {
-		const key = `__kf:${name}:${JSON.stringify(steps)}`;
+	const rscKeyframeNames = usedKf ? resolveKeyframesNames(usedKf) : null;
+	if (usedKf && rscKeyframeNames) for (const [authored, steps] of Object.entries(usedKf)) {
+		const name = rscKeyframeNames.get(authored);
+		const key = `__kf:${name}`;
 		if (!rscCache.emittedKeys.has(key)) {
 			rscCache.emittedKeys.add(key);
 			parts.push(formatKeyframesCSS(name, steps));
@@ -600,24 +621,27 @@ function collectAncillaryRSC(rscCache, styles) {
 * Process all chunks in RSC mode: render CSS to strings, allocate classNames,
 * and return combined { className, css }.
 */
-function computeStylesRSC(styles, chunkMap) {
+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);
 	const internalsCSS = collectInternalsRSC(rscCache);
 	if (internalsCSS) cssParts.push(internalsCSS);
 	for (const [chunkName, chunkStyleKeys] of chunkMap) {
 		if (chunkStyleKeys.length === 0) continue;
-		const { className, isNew } = rscAllocateClassName(rscCache, generateChunkCacheKey(styles, chunkName, chunkStyleKeys));
+		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 renderResult = renderStylesForChunk(styles, chunkName, chunkStyleKeys);
-			if (renderResult.rules.length > 0) {
-				const css = formatRules(renderResult.rules, className);
-				if (css) cssParts.push(css);
-			}
+			const css = formatRules(rules, className);
+			if (css) cssParts.push(css);
 		}
 	}
 	const ancillaryCSS = collectAncillaryRSC(rscCache, styles);
@@ -644,23 +668,26 @@ function getUsedKeyframes(styles) {
 /**
 * Process a chunk on the SSR path: allocate via collector, render, collect CSS.
 */
-function processChunkSSR(collector, styles, chunkName, styleKeys) {
+function processChunkSSR(collector, styles, chunkName, styleKeys, stableStyles, keyframeNames) {
 	if (styleKeys.length === 0) return null;
-	const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);
+	const baseKey = generateChunkCacheKey(styles, chunkName, styleKeys, stableStyles);
+	const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);
+	if (renderResult.rules.length === 0) return null;
+	const { animations, rules, cacheKey } = applyKeyframeNames(renderResult.rules, baseKey, keyframeNames);
 	const { className, isNewAllocation } = collector.allocateClassName(cacheKey);
 	if (isNewAllocation) {
-		const renderResult = renderStylesForChunk(styles, chunkName, styleKeys);
-		if (renderResult.rules.length > 0) {
-			collector.collectChunk(cacheKey, className, renderResult.rules);
-			return {
-				name: chunkName,
-				styleKeys,
-				cacheKey,
-				renderResult,
-				className
-			};
-		}
-		return null;
+		collector.collectChunk(cacheKey, className, rules);
+		return {
+			name: chunkName,
+			styleKeys,
+			cacheKey,
+			renderResult: {
+				...renderResult,
+				rules
+			},
+			className,
+			animations
+		};
 	}
 	return {
 		name: chunkName,
@@ -671,57 +698,64 @@ function processChunkSSR(collector, styles, chunkName, styleKeys) {
 	};
 }
 /**
+* 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 animations = [...keyframeNames.keys()].filter((authored) => ruleset.some((rule) => referencesAnimation(rule.declarations, authored)));
+	if (animations.length === 0) return {
+		animations,
+		rules: ruleset,
+		cacheKey: baseKey
+	};
+	return {
+		animations,
+		rules: ruleset.map((rule) => ({
+			...rule,
+			declarations: replaceAnimationNames(rule.declarations, keyframeNames)
+		})),
+		cacheKey: `${baseKey}\u0000kf:${animations.map((authored) => `${authored}=${keyframeNames.get(authored)}`).sort().join(",")}`
+	};
+}
+/**
 * 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, root) {
+function processChunkSync(styles, chunkName, styleKeys, stableStyles, root, keyframeNames) {
 	if (styleKeys.length === 0) return null;
-	const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys);
+	const cacheKey = generateChunkCacheKey(styles, chunkName, styleKeys, stableStyles);
 	const renderResult = renderStylesForChunk(styles, chunkName, styleKeys, cacheKey);
 	if (renderResult.rules.length === 0) return null;
-	const { className } = inject(renderResult.rules, {
-		cacheKey,
-		root
+	const { animations, rules, cacheKey: injectKey } = applyKeyframeNames(renderResult.rules, cacheKey, keyframeNames);
+	const { className } = inject(rules, {
+		cacheKey: injectKey,
+		root,
+		pin: false
 	});
 	return {
 		name: chunkName,
 		styleKeys,
-		cacheKey,
-		renderResult,
-		className
+		cacheKey: injectKey,
+		renderResult: {
+			...renderResult,
+			rules
+		},
+		className,
+		animations
 	};
 }
 /**
-* Inject keyframes synchronously and return a name replacement map.
-* On the client, keyframes are injected into the DOM.
-*/
-function injectKeyframesSync(usedKeyframes, root) {
-	let nameMap = null;
-	for (const [name, steps] of Object.entries(usedKeyframes)) {
-		const injectedName = keyframes(steps, {
-			name,
-			root
-		}).toString();
-		if (injectedName !== name) {
-			if (!nameMap) nameMap = /* @__PURE__ */ new Map();
-			nameMap.set(name, injectedName);
-		}
-	}
-	return nameMap;
-}
-/**
-* Inject chunk rules synchronously, replacing animation names if needed.
-*/
-function injectChunkRulesSync(chunks, nameMap, root) {
-	for (const chunk of chunks) if (chunk.renderResult.rules.length > 0) inject(nameMap ? chunk.renderResult.rules.map((rule) => ({
-		...rule,
-		declarations: replaceAnimationNames(rule.declarations, nameMap)
-	})) : chunk.renderResult.rules, {
-		cacheKey: chunk.cacheKey,
-		root
-	});
-}
-/**
 * Inject all ancillary rules (properties, font-faces, counter-styles) synchronously.
 */
 function injectAncillarySync(styles, root) {
@@ -753,9 +787,12 @@ function injectAncillarySync(styles, root) {
 */
 function collectAncillarySSR(collector, styles, chunks) {
 	const usedKf = getUsedKeyframes(styles);
-	if (usedKf) for (const [name, steps] of Object.entries(usedKf)) {
-		const css = formatKeyframesCSS(name, steps);
-		collector.collectKeyframes(name, css);
+	if (usedKf) {
+		const names = resolveKeyframesNames(usedKf);
+		for (const [authored, steps] of Object.entries(usedKf)) {
+			const name = names.get(authored);
+			collector.collectKeyframes(name, formatKeyframesCSS(name, steps));
+		}
 	}
 	if (hasLocalProperties(styles)) {
 		const localProperties = extractLocalProperties(styles);
@@ -812,28 +849,35 @@ function collectAncillarySSR(collector, styles, chunks) {
 function computeStyles(styles, options) {
 	if (!styles || !hasKeys(styles)) return EMPTY_RESULT;
 	const resolved = resolveRecipes(styles);
+	const stableStyles = options?.stableStyles === true && resolved === styles;
 	if (isFunctionsPolyfillEnabled() && hasLocalFunctions(resolved)) 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);
+			const chunk = processChunkSSR(collector, resolved, chunkName, chunkStyleKeys, stableStyles, ssrKeyframeNames);
 			if (chunk) chunks.push(chunk);
 		}
 		collectAncillarySSR(collector, resolved, chunks);
-	} else if (typeof document === "undefined") return computeStylesRSC(resolved, chunkMap);
+	} else if (typeof document === "undefined") return computeStylesRSC(resolved, chunkMap, stableStyles);
 	else {
 		const root = options?.root;
 		injectAncillarySync(resolved, root);
 		const usedKf = getUsedKeyframes(resolved);
-		const nameMap = usedKf ? injectKeyframesSync(usedKf, root) : null;
+		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, root);
+			const chunk = processChunkSync(resolved, chunkName, chunkStyleKeys, stableStyles, root, keyframeNames);
 			if (chunk) chunks.push(chunk);
 		}
-		if (nameMap) injectChunkRulesSync(chunks, nameMap, root);
+		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;
@@ -1114,16 +1158,19 @@ function countRules(css) {
 function sortTastyClasses(classes) {
 	return Array.from(classes).sort((a, b) => a.localeCompare(b));
 }
+/**
+* The registry for `root`, with every queued write landed first.
+*
+* Every injector read API is a flush point, and the reads below reach past
+* those APIs straight into the registry and the sheet manager. Without this
+* they would report a batch window's contents as absent — a rule that is
+* enqueued but not yet in a sheet is missing from `globalRules`, from the
+* sheets, and from anything counting either.
+*/
 function getRegistry(root = document) {
+	flushStyles();
 	return injector.instance._sheetManager?.getRegistry(root);
 }
-function getUnusedClasses(root = document) {
-	const registry = getRegistry(root);
-	if (!registry) return [];
-	const result = [];
-	for (const [cls, rc] of registry.refCounts) if (rc === 0) result.push(cls);
-	return sortTastyClasses(result);
-}
 function findDomTastyClasses(root = document) {
 	const classes = /* @__PURE__ */ new Set();
 	const elements = root.querySelectorAll?.("[class]") || [];
@@ -1136,6 +1183,36 @@ function findDomTastyClasses(root = document) {
 	});
 	return sortTastyClasses(classes);
 }
+/**
+* Everything this injector holds in `root`, in the order the engine applies it,
+* with the sources kept byte-for-byte — trimming would report a total smaller
+* than one of its own parts whenever raw CSS has edge whitespace.
+*/
+function getAllCSS(root = document) {
+	const registry = getRegistry(root);
+	const sheetManager = injector.instance._sheetManager;
+	if (!registry || !sheetManager) return "";
+	return sheetManager.getOwnedCSSInOrder(registry, root).join("\n");
+}
+/**
+* Injected classes that no element carries and nobody pinned — the exact set
+* `gc({ force: true })` would delete.
+*
+* Deliberately borrowed from the injector rather than recomputed here: the two
+* drifted apart once before, when this file still read "unused" off the pin
+* counts the render path had stopped maintaining.
+*/
+function getUnusedClasses(root = document) {
+	return sortTastyClasses(injector.instance.getUnusedClasses({ root }));
+}
+/** Every class this injector holds CSS for in `root`. */
+function getOwnedClasses(root = document) {
+	const registry = getRegistry(root);
+	if (!registry) return [];
+	const owned = [];
+	for (const [className, info] of registry.rules) if (info.sheetIndex >= 0) owned.push(className);
+	return sortTastyClasses(owned);
+}
 function prettifyCSS(css) {
 	if (!css || !css.trim()) return "";
 	const out = [];
@@ -1230,6 +1307,18 @@ function buildChunkBreakdown(root = document) {
 		totalClasses
 	};
 }
+/**
+* Every prefix `registry.globalRules` is keyed by. Anything missing here is a
+* rule the summary would hold but never count, which is how the totals stopped
+* adding up the first time.
+*/
+const GLOBAL_RULE_PREFIXES = {
+	global: "global:",
+	property: "property:",
+	fontFace: "fontface:",
+	counterStyle: "counterstyle:",
+	function: "function:"
+};
 function getGlobalTypeCSS(type, root = document) {
 	const registry = getRegistry(root);
 	if (!registry) return {
@@ -1239,6 +1328,15 @@ function getGlobalTypeCSS(type, root = document) {
 	};
 	const chunks = [];
 	let rc = 0;
+	if (type === "raw") {
+		const css = injector.instance.getRawCSSText({ root });
+		const sheetManager = injector.instance._sheetManager;
+		return {
+			css: prettifyCSS(css),
+			ruleCount: sheetManager?.getRawRuleCount(root) ?? 0,
+			size: css.length
+		};
+	}
 	if (type === "keyframes") for (const [, entry] of registry.keyframesCache) {
 		const info = entry.info;
 		const sheetInfo = registry.sheets[info.sheetIndex];
@@ -1256,7 +1354,7 @@ function getGlobalTypeCSS(type, root = document) {
 		}
 	}
 	else {
-		const prefix = type === "global" ? "global:" : type === "raw" ? "raw:" : "property:";
+		const prefix = GLOBAL_RULE_PREFIXES[type];
 		for (const [key, ri] of registry.globalRules) {
 			if (!key.startsWith(prefix)) continue;
 			const sheetInfo = registry.sheets[ri.sheetIndex];
@@ -1346,7 +1444,7 @@ const tastyDebug = {
 				if (!raw) console.warn("[Tasty] source CSS not available. Falling back to live CSSOM.");
 				css = injector.instance.getCSSTextForClasses(target, { root });
 			}
-		} else if (typeof target === "string") if (target === "all") css = injector.instance.getCSSText({ root });
+		} else if (typeof target === "string") if (target === "all") css = getAllCSS(root);
 		else if (target === "global") {
 			css = getGlobalTypeCSS("global", root).css;
 			return css;
@@ -1422,34 +1520,56 @@ const tastyDebug = {
 		const { root = document, raw = false } = opts || {};
 		const activeClasses = findDomTastyClasses(root);
 		const unusedClasses = getUnusedClasses(root);
-		const totalStyledClasses = [...activeClasses, ...unusedClasses];
+		const ownedClasses = getOwnedClasses(root);
+		const totalStyledClasses = sortTastyClasses(new Set([...activeClasses, ...ownedClasses]));
+		const unusedSet = new Set(unusedClasses);
+		const activeSet = new Set(activeClasses);
+		const hotClasses = ownedClasses.filter((className) => !activeSet.has(className) && !unusedSet.has(className));
+		const hotCSS = injector.instance.getCSSTextForClasses(hotClasses, { root });
 		const activeCSS = injector.instance.getCSSTextForClasses(activeClasses, { root });
 		const unusedCSS = injector.instance.getCSSTextForClasses(unusedClasses, { root });
-		const allCSS = injector.instance.getCSSText({ root });
+		const allCSS = getAllCSS(root);
 		const activeRuleCount = countRules(activeCSS);
 		const unusedRuleCount = countRules(unusedCSS);
 		const globalData = getGlobalTypeCSS("global", root);
 		const rawData = getGlobalTypeCSS("raw", root);
 		const kfData = getGlobalTypeCSS("keyframes", root);
 		const propData = getGlobalTypeCSS("property", root);
-		const totalRuleCount = activeRuleCount + unusedRuleCount + globalData.ruleCount + rawData.ruleCount + kfData.ruleCount + propData.ruleCount;
+		const atRuleData = [
+			"fontFace",
+			"counterStyle",
+			"function"
+		].reduce((all, type) => {
+			const data = getGlobalTypeCSS(type, root);
+			return {
+				css: data.css ? `${all.css}\n${data.css}`.trim() : all.css,
+				ruleCount: all.ruleCount + data.ruleCount,
+				size: all.size + data.size
+			};
+		}, {
+			css: "",
+			ruleCount: 0,
+			size: 0
+		});
+		const totalRuleCount = activeRuleCount + unusedRuleCount + countRules(hotCSS) + globalData.ruleCount + atRuleData.ruleCount + rawData.ruleCount + kfData.ruleCount + propData.ruleCount;
 		const metrics = injector.instance.getMetrics({ root });
 		const defs = getDefs(root);
 		const chunkBreakdown = buildChunkBreakdown(root);
 		const summary = {
 			activeClasses,
 			unusedClasses,
+			hotClasses,
 			totalStyledClasses,
 			activeCSSSize: activeCSS.length,
 			unusedCSSSize: unusedCSS.length,
-			globalCSSSize: globalData.size,
+			globalCSSSize: globalData.size + atRuleData.size,
 			rawCSSSize: rawData.size,
 			keyframesCSSSize: kfData.size,
 			propertyCSSSize: propData.size,
 			totalCSSSize: allCSS.length,
 			activeRuleCount,
 			unusedRuleCount,
-			globalRuleCount: globalData.ruleCount,
+			globalRuleCount: globalData.ruleCount + atRuleData.ruleCount,
 			rawRuleCount: rawData.ruleCount,
 			keyframesRuleCount: kfData.ruleCount,
 			propertyRuleCount: propData.ruleCount,
@@ -1463,7 +1583,8 @@ const tastyDebug = {
 			console.group("Tasty Summary");
 			console.log(`Active:   ${activeClasses.length} classes, ${activeRuleCount} rules, ${fmtSize(activeCSS.length)}`);
 			console.log(`Unused:   ${unusedClasses.length} classes, ${unusedRuleCount} rules, ${fmtSize(unusedCSS.length)}`);
-			console.log(`Global:   ${globalData.ruleCount} rules, ${fmtSize(globalData.size)}`);
+			if (hotClasses.length) console.log(`Held:     ${hotClasses.length} classes, ${countRules(hotCSS)} rules, ${fmtSize(hotCSS.length)} (not rendered, not yet collectable)`);
+			console.log(`Global:   ${globalData.ruleCount + atRuleData.ruleCount} rules, ${fmtSize(globalData.size + atRuleData.size)}`);
 			if (rawData.ruleCount) console.log(`Raw:      ${rawData.ruleCount} rules, ${fmtSize(rawData.size)}`);
 			if (kfData.ruleCount) console.log(`Keyframes: ${kfData.ruleCount} rules, ${fmtSize(kfData.size)}`);
 			if (propData.ruleCount) console.log(`@property: ${propData.ruleCount} rules, ${fmtSize(propData.size)}`);
@@ -1510,7 +1631,7 @@ const tastyDebug = {
 			classes: {
 				active,
 				unused,
-				all: [...active, ...unused]
+				all: sortTastyClasses(new Set([...active, ...getOwnedClasses(root)]))
 			},
 			metrics
 		};
@@ -1560,6 +1681,6 @@ function getPageCSS(root = document) {
 }
 if (typeof window !== "undefined" && isDevEnv()) tastyDebug.install();
 //#endregion
-export { property as A, getRawCSSText as C, injector as D, injectRawCSS as E, ChunkSheetRegistry as M, chunkSheetRegistry as N, isPropertyDefined as O, resolveFunctionColor as P, getCSSTextForNode as S, injectGlobal as T, destroy as _, color as a, gc as b, hasKeys as c, collectAutoInferredPropertiesRSC as d, getStyleTarget as f, createInjector as g, counterStyle as h, _modAttrs as i, touch as j, keyframes as k, formatKeyframesCSS as l, cleanup as m, processTokens as n, filterBaseProps as o, pushRSCCSS as p, dotize as r, computeStyles as s, tastyDebug as t, collectAutoInferredProperties as u, fontFace as v, inject as w, getCSSText as x, func as y };
+export { keyframes as A, getRawCSSText as C, injectRawCSS as D, injectGlobal as E, chunkSheetRegistry as F, resolveFunctionColor as I, property as M, touch as N, injector as O, ChunkSheetRegistry as P, getCSSTextForNode as S, inject as T, destroy as _, color as a, gc as b, hasKeys as c, collectAutoInferredPropertiesRSC as d, getStyleTarget as f, createInjector as g, counterStyle as h, _modAttrs as i, ownKeyframes as j, isPropertyDefined as k, formatKeyframesCSS as l, cleanup as m, processTokens as n, filterBaseProps as o, pushRSCCSS as p, dotize as r, computeStyles as s, tastyDebug as t, collectAutoInferredProperties as u, fontFace as v, holdKeyframes as w, getCSSText as x, func as y };
 
-//# sourceMappingURL=core-wxP3GHQu.js.map
+//# sourceMappingURL=core-Bq7w2kti.js.map