webpack 5.111.1 → 5.112.1

package/lib/css/CssParser.js

@@ -6,16 +6,16 @@
 "use strict";
 
 const path = require("path");
-const { CSS_MODULE_TYPE_AUTO } = require("../ModuleTypeConstants");
-const Parser = require("../Parser");
-const ConstDependency = require("../dependencies/ConstDependency");
-const CssIcssExportDependency = require("../dependencies/CssIcssExportDependency");
-const CssIcssImportDependency = require("../dependencies/CssIcssImportDependency");
-const CssIcssSymbolDependency = require("../dependencies/CssIcssSymbolDependency");
-const CssImportDependency = require("../dependencies/CssImportDependency");
-const CssUrlDependency = require("../dependencies/CssUrlDependency");
-const StaticExportsDependency = require("../dependencies/StaticExportsDependency");
+const ConstDependency = require("../dependencies/core/ConstDependency");
+const StaticExportsDependency = require("../dependencies/core/StaticExportsDependency");
+const CssIcssExportDependency = require("../dependencies/css/CssIcssExportDependency");
+const CssIcssImportDependency = require("../dependencies/css/CssIcssImportDependency");
+const CssIcssSymbolDependency = require("../dependencies/css/CssIcssSymbolDependency");
+const CssImportDependency = require("../dependencies/css/CssImportDependency");
+const CssUrlDependency = require("../dependencies/css/CssUrlDependency");
 const WebpackError = require("../errors/WebpackError");
+const { CSS_MODULE_TYPE_AUTO } = require("../module/ModuleTypeConstants");
+const Parser = require("../module/Parser");
 const ResourceHintPlugin = require("../prefetch/ResourceHintPlugin");
 const LocConverter = require("../util/LocConverter");
 const { parseResource } = require("../util/identifier");
@@ -24,23 +24,30 @@ const {
 	parseCommentOptionsInRange
 } = require("../util/magicComment");
 const memoize = require("../util/memoize");
-const topologicalSort = require("../util/topologicalSort");
-const { CSS_MODULES_KEYWORDS, CSS_MODULES_KEYWORD_OPTIONS } = require("./data");
+const {
+	CSS_MODULES_KEYWORD_OPTIONS,
+	getCssModulesKeywords
+} = require("./data");
+const { SourceProcessor } = require("./syntax");
 const {
 	A,
+	Field,
+	Flag,
 	NodeType,
-	SourceProcessor,
+	Part,
+	asciiCaseInsensitiveMatch,
 	buildSkipSet,
-	equalsLowerCase,
+	isAsciiWhitespace,
 	isDashedIdentifier,
-	isWhitespace,
+	isSimpleIdentifier,
 	normalizeUrl,
+	rangeAsciiCaseInsensitiveMatch,
 	rangeEquals,
-	rangeEqualsLowerCase,
 	skipEscape,
 	toLowerCaseIfNeeded,
 	unescapeIdentifier
-} = require("./syntax");
+} = require("./syntax-parser");
+const topologicalSort = require("./topologicalSort");
 
 const getUnsupportedFeatureWarning = memoize(() =>
 	require("../errors/UnsupportedFeatureWarning")
@@ -56,15 +63,8 @@ const getCommentCompilationWarning = memoize(() =>
 
 // `SourceProcessor` drives the parse and hands already-built AST nodes to the visitors; positions are read from those nodes' ranges rather than re-scanning the source.
 
-/** @import { BuildInfo, BuildMeta } from "../Module" */
-/**
- * @import CssModule, {
- * 	CssModuleBuildInfo,
- * 	CssModuleBuildMeta,
- * 	Inheritance
- * } from "./CssModule"
- */
-/** @import { ParserState, PreparsedAst } from "../Parser" */
+/** @import CssModule, { BuiltCssModule, Inheritance } from "./CssModule" */
+/** @import { ParserState, PreparsedAst } from "../module/Parser" */
 /**
  * @import {
  * 	AtRule,
@@ -77,13 +77,14 @@ const getCommentCompilationWarning = memoize(() =>
  * 	Token,
  * 	UrlToken,
  * 	VisitorMap
- * } from "./syntax"
+ * } from "./syntax-parser"
  */
 /**
  * @import {
  * 	CssAutoOrModuleParserOptions
  * } from "../../declarations/WebpackOptions"
  */
+/** @import { MagicCommentOptions } from "../util/magicComment" */
 
 /** @typedef {[number, number]} Range */
 /** @typedef {{ line: number, column: number }} Position */
@@ -96,8 +97,14 @@ const getCommentCompilationWarning = memoize(() =>
  * out — no `<media-in-parens>` is unconditionally true on every engine).
  * @typedef {{ kind: "condition" | "type", text: string } | { kind: "boolean", value: boolean } | { kind: "unsupported" }} CustomMediaValue
  */
-/** @typedef {CustomMediaValue | { kind: "alias", name: string } | { kind: "or", parts: ({ text: string } | { alias: string })[] }} CustomMediaDefinition */
-/** @typedef {{ name: string, start: number, end: number, invalid: boolean, leading: boolean }} CustomMediaUse */
+/** @typedef {{ node: MediaNode, uses: CustomMediaUse[] }} CustomMediaQuery */
+/** @typedef {CustomMediaValue | { kind: "alias", name: string } | { kind: "or", parts: ({ text: string } | { alias: string } | { query: CustomMediaQuery })[] } | ({ kind: "query" } & CustomMediaQuery)} CustomMediaDefinition */
+/**
+ * One `(--name)` a `@media` prelude or a `@custom-media` value asks for. `slot`
+ * is what the condition written there joins: nothing, an `and`, or `not` / `or`.
+ * @typedef {{ name: string, start: number, end: number, invalid: boolean, leading: boolean, slot: MediaSlot }} CustomMediaUse
+ */
+/** @typedef {"alone" | "and" | "or"} MediaSlot */
 /**
  * A `@media` prelude captured as its boolean shape, so a `true` / `false`
  * definition found later can be folded into it. Node ids are recycled per
@@ -125,6 +132,75 @@ const CC_LEFT_CURLY = "{".charCodeAt(0);
 const CC_LOWER_V = "v".charCodeAt(0);
 const CC_UPPER_V = "V".charCodeAt(0);
 const CC_REVERSE_SOLIDUS = "\\".charCodeAt(0);
+const CC_LEFT_PARENTHESIS = "(".charCodeAt(0);
+const CC_RIGHT_PARENTHESIS = ")".charCodeAt(0);
+const CC_QUOTATION_MARK = '"'.charCodeAt(0);
+const CC_APOSTROPHE = "'".charCodeAt(0);
+
+// A media condition's top-level keyword: an ASCII word outside every `(…)`.
+const MEDIA_WORD_RE = /[a-z]+/gi;
+
+/**
+ * A media condition as it can stand in a slot: in parentheses of its own where
+ * the slot joins it to others by an operator it does not share, else as written.
+ * @param {string} text the condition
+ * @param {MediaSlot} slot what the slot joins it to
+ * @returns {string} the condition to write there
+ */
+const mediaConditionFor = (text, slot) => {
+	if (slot === "alone") return text;
+	let depth = 0;
+	let outside = "";
+	let groups = 0;
+	for (let i = 0; i < text.length; i++) {
+		const code = text.charCodeAt(i);
+		if (code === CC_LEFT_PARENTHESIS) {
+			if (depth++ === 0) groups++;
+		} else if (code === CC_RIGHT_PARENTHESIS) {
+			depth--;
+		} else if (depth === 0) {
+			outside += text[i];
+		}
+	}
+	const words = (outside.match(MEDIA_WORD_RE) || []).map((word) =>
+		word.toLowerCase()
+	);
+	if (groups === 1 && words.length === 0) return text;
+	// An `and` chain takes more `and` terms as they are, and nothing else.
+	if (slot === "and" && words.every((word) => word === "and")) return text;
+	return `(${text})`;
+};
+
+/**
+ * Each `:--name` a selector list asks for, outside strings and escapes and not
+ * after a second `:`, as the offsets of the colon and the name's end.
+ * @param {string} list the selector list
+ * @returns {{ name: string, start: number, end: number }[]} the names, in order
+ */
+const customSelectorNames = (list) => {
+	/** @type {{ name: string, start: number, end: number }[]} */
+	const found = [];
+	for (let i = 0; i < list.length; i++) {
+		const code = list.charCodeAt(i);
+		if (code === CC_REVERSE_SOLIDUS) {
+			i++;
+		} else if (code === CC_QUOTATION_MARK || code === CC_APOSTROPHE) {
+			for (i++; i < list.length && list.charCodeAt(i) !== code; i++) {
+				if (list.charCodeAt(i) === CC_REVERSE_SOLIDUS) i++;
+			}
+		} else if (
+			code === CC_COLON &&
+			(i === 0 || list.charCodeAt(i - 1) !== CC_COLON) &&
+			list.startsWith("--", i + 1)
+		) {
+			let end = i + 3;
+			while (end < list.length && /[\w\u0080-\uFFFF-]/.test(list[end])) end++;
+			found.push({ name: list.slice(i + 1, end), start: i, end });
+			i = end - 1;
+		}
+	}
+	return found;
+};
 
 // A parsed CSS comment. `loc` is computed on demand — only magic-comment error
 // warnings read it, so comment-heavy CSS skips the per-comment line/col work.
@@ -208,10 +284,6 @@ const VALUE_AS_ALIAS = /\s+as\s+/;
 // `@value name value`: end of the name run (first non-space followed by space).
 const VALUE_NAME_BOUNDARY = /\S\s/;
 const ONLY_WHITESPACE = /^\s+$/;
-// A `@value` whose whole value is one `.class` / `#id`, the only shape whose
-// localizable ident is knowable without re-parsing the substitution.
-const SIMPLE_CLASS_OR_ID_VALUE =
-	/^([.#])(-?(?:[A-Za-z_]|[\u0080-\uFFFF])(?:[\w-]|[\u0080-\uFFFF])*)$/;
 // Relative request prefix (`./` or `../`) — `isSelfReferenceRequest` per `from`.
 const RELATIVE_REQUEST = /^\.{1,2}\//;
 
@@ -272,10 +344,14 @@ const knownPropertyForRange = (index, input, start, end) => {
 	const hit = index.get(h);
 	if (hit === undefined) return undefined;
 	if (typeof hit === "string") {
-		return rangeEqualsLowerCase(input, start, end, hit) ? hit : undefined;
+		return rangeAsciiCaseInsensitiveMatch(input, start, end, hit)
+			? hit
+			: undefined;
 	}
 	for (let i = 0; i < hit.length; i++) {
-		if (rangeEqualsLowerCase(input, start, end, hit[i])) return hit[i];
+		if (rangeAsciiCaseInsensitiveMatch(input, start, end, hit[i])) {
+			return hit[i];
+		}
 	}
 	return undefined;
 };
@@ -292,14 +368,14 @@ const counterFunctionNameIndex = (input, start, end, escapedName) => {
 	// The `target-counter(url, name, style?)` cross-reference forms (Generated Content for Paged Media) name the counter second; print engines read them.
 	if (escapedName !== undefined) {
 		if (
-			equalsLowerCase(escapedName, "counter") ||
-			equalsLowerCase(escapedName, "counters")
+			asciiCaseInsensitiveMatch(escapedName, "counter") ||
+			asciiCaseInsensitiveMatch(escapedName, "counters")
 		) {
 			return 0;
 		}
 		if (
-			equalsLowerCase(escapedName, "target-counter") ||
-			equalsLowerCase(escapedName, "target-counters")
+			asciiCaseInsensitiveMatch(escapedName, "target-counter") ||
+			asciiCaseInsensitiveMatch(escapedName, "target-counters")
 		) {
 			return 1;
 		}
@@ -307,13 +383,24 @@ const counterFunctionNameIndex = (input, start, end, escapedName) => {
 	}
 	switch (end - start) {
 		case 7:
-			return rangeEqualsLowerCase(input, start, end, "counter") ? 0 : -1;
+			return rangeAsciiCaseInsensitiveMatch(input, start, end, "counter")
+				? 0
+				: -1;
 		case 8:
-			return rangeEqualsLowerCase(input, start, end, "counters") ? 0 : -1;
+			return rangeAsciiCaseInsensitiveMatch(input, start, end, "counters")
+				? 0
+				: -1;
 		case 14:
-			return rangeEqualsLowerCase(input, start, end, "target-counter") ? 1 : -1;
+			return rangeAsciiCaseInsensitiveMatch(input, start, end, "target-counter")
+				? 1
+				: -1;
 		case 15:
-			return rangeEqualsLowerCase(input, start, end, "target-counters")
+			return rangeAsciiCaseInsensitiveMatch(
+				input,
+				start,
+				end,
+				"target-counters"
+			)
 				? 1
 				: -1;
 		default:
@@ -341,7 +428,7 @@ const buildKnownProperties = (options = {}) => {
 			knownProperties.set(
 				property,
 				/** @type {Map<string, number>} */
-				(CSS_MODULES_KEYWORDS.get(property))
+				(getCssModulesKeywords().get(property))
 			);
 		}
 	}
@@ -472,13 +559,13 @@ const gridAreaNames = (input, start, end) => {
 	const names = [];
 	let i = start;
 	while (i < end) {
-		while (i < end && isWhitespace(input.charCodeAt(i))) i++;
+		while (i < end && isAsciiWhitespace(input.charCodeAt(i))) i++;
 		if (i >= end) break;
 		const nameStart = i;
 		let nullCell = true;
 		while (i < end) {
 			const cc = input.charCodeAt(i);
-			if (isWhitespace(cc)) break;
+			if (isAsciiWhitespace(cc)) break;
 			if (cc === CC_REVERSE_SOLIDUS) {
 				i = Math.min(skipEscape(input, i), end);
 				nullCell = false;
@@ -524,32 +611,42 @@ const isPureBodyAtRule = (name) =>
 	name === "@container" ||
 	name === "@scope";
 
+/**
+ * A rule's or function's name as written, escapes kept.
+ * @param {AstNode} n at-rule, declaration or function
+ * @returns {string} the raw name
+ */
+const rawNameOf = (n) =>
+	A.source(A.startOf(Part.name, n), A.endOf(Part.name, n));
+
+/**
+ * @param {AstNode} n an ident, string or hash
+ * @returns {string} its value, escapes resolved
+ */
+const stringValue = (n) => /** @type {string} */ (A.value(n));
+
 /**
  * Scan a rule body once: does it hold a direct declaration counted against the enclosing rule (a declaration, or one in a transparent conditional-group at-rule like `@media`/`@supports`/…) and does it hold a nested block (qualified rule or any block-bearing at-rule)?
- * @param {Declaration[] | null} declarations rule-body declarations
- * @param {Rule[] | null} childRules rule-body child rules
+ * @param {AstNode} rule rule with a block
  * @returns {{ hasDirectDecl: boolean, hasNestedBlock: boolean }} scan result
  */
-const scanRuleBody = (declarations, childRules) => {
-	let hasDirectDecl = Boolean(declarations && declarations.length > 0);
+const scanRuleBody = (rule) => {
+	let hasDirectDecl = A.fieldCount(Field.declarations, rule) > 0;
 	let hasNestedBlock = false;
-	if (childRules) {
-		for (const child of childRules) {
-			const t = A.type(child);
-			if (t === NodeType.QualifiedRule) {
-				hasNestedBlock = true;
-			} else if (t === NodeType.AtRule) {
-				const atDecls = A.declarations(child);
-				const atChildRules = A.childRules(child);
-				if (!atDecls && !atChildRules) continue;
-				hasNestedBlock = true;
-				if (
-					!hasDirectDecl &&
-					!isPureBodyAtRule(`@${toLowerCaseIfNeeded(A.name(child))}`) &&
-					scanRuleBody(atDecls, atChildRules).hasDirectDecl
-				) {
-					hasDirectDecl = true;
-				}
+	for (let i = 0, count = A.fieldCount(Field.rules, rule); i < count; i++) {
+		const child = A.field(i, Field.rules, rule);
+		const t = A.type(child);
+		if (t === NodeType.QualifiedRule) {
+			hasNestedBlock = true;
+		} else if (t === NodeType.AtRule) {
+			if (A.startOf(Part.block, child) === -1) continue;
+			hasNestedBlock = true;
+			if (
+				!hasDirectDecl &&
+				!isPureBodyAtRule(`@${toLowerCaseIfNeeded(rawNameOf(child))}`) &&
+				scanRuleBody(child).hasDirectDecl
+			) {
+				hasDirectDecl = true;
 			}
 		}
 	}
@@ -564,12 +661,14 @@ const scanRuleBody = (declarations, childRules) => {
 const parseValueAtRuleParams = (str) => {
 	if (VALUE_IMPORT_FORM.test(str)) {
 		str = str.replace(CSS_COMMENT, " ").trim().replace(/;$/, "");
-		const fromIdx = str.lastIndexOf("from");
-		const path = str
-			.slice(fromIdx + 5)
-			.trim()
-			.replace(/['"]/g, "");
-		let content = str.slice(0, fromIdx).trim();
+		// Split on the first `from` keyword delimited by CSS whitespace (only
+		// ` \t\n\f\r`, not JS `\s`, which also matches U+00A0 valid in a name),
+		// so a path or name containing the substring (`./from-colors.css`) isn't it.
+		const fromMatch = /^([\s\S]+?)[ \t\n\f\r]+from[ \t\n\f\r]+([\s\S]+)$/i.exec(
+			str
+		);
+		const path = (fromMatch ? fromMatch[2] : "").trim().replace(/['"]/g, "");
+		let content = (fromMatch ? fromMatch[1] : str).trim();
 
 		if (content.startsWith("(") && content.endsWith(")")) {
 			content = content.slice(1, -1);
@@ -666,7 +765,7 @@ const parseImportPrelude = (prelude) => {
 			}
 			if (
 				t === NodeType.Function &&
-				equalsLowerCase(A.unescapedName(cv), "url")
+				asciiCaseInsensitiveMatch(A.name(cv), "url")
 			) {
 				urlNode = cv;
 				continue;
@@ -681,13 +780,13 @@ const parseImportPrelude = (prelude) => {
 
 		if (!layerNode && !supportsNode) {
 			if (t === NodeType.Ident) {
-				if (equalsLowerCase(A.unescaped(cv), "layer")) {
+				if (asciiCaseInsensitiveMatch(stringValue(cv), "layer")) {
 					layerNode = cv;
 					continue;
 				}
 			} else if (
 				t === NodeType.Function &&
-				equalsLowerCase(A.unescapedName(cv), "layer")
+				asciiCaseInsensitiveMatch(A.name(cv), "layer")
 			) {
 				layerNode = cv;
 				continue;
@@ -697,7 +796,7 @@ const parseImportPrelude = (prelude) => {
 		if (
 			!supportsNode &&
 			t === NodeType.Function &&
-			equalsLowerCase(A.unescapedName(cv), "supports")
+			asciiCaseInsensitiveMatch(A.name(cv), "supports")
 		) {
 			supportsNode = /** @type {FunctionNode} */ (cv);
 			continue;
@@ -723,8 +822,8 @@ const parseIcssImportRequest = (second, rule, source) => {
 	if (A.type(second) === NodeType.Function) {
 		args = A.children(second);
 	} else {
-		for (const p of A.prelude(rule)) {
-			if (A.type(p) === NodeType.SimpleBlock && A.blockToken(p) === "(") {
+		for (const p of A.children(rule)) {
+			if (A.type(p) === NodeType.SimpleBlock && A.value(p) === "(") {
 				args = A.children(p);
 				break;
 			}
@@ -736,7 +835,7 @@ const parseIcssImportRequest = (second, rule, source) => {
 	if (!innerStrToken || A.type(innerStrToken) !== NodeType.String) {
 		const errorPos =
 			A.type(second) === NodeType.Function
-				? A.nameEnd(second) + 1
+				? A.endOf(Part.name, second) + 1
 				: A.end(second);
 		return { errorPos };
 	}
@@ -745,6 +844,9 @@ const parseIcssImportRequest = (second, rule, source) => {
 	};
 };
 
+/**
+ * @extends {Parser<BuiltCssModule>}
+ */
 class CssParser extends Parser {
 	/**
 	 * Creates an instance of CssParser.
@@ -830,7 +932,7 @@ class CssParser extends Parser {
 	 * themselves. Same-kind redeclarations are silent.
 	 * @param {ParserState} state parser state
 	 * @param {Map<string, { kind: string, line: number, column: number, entries: number[] }[]>} declaredExports collected declarations grouped by (name, kind)
-	 * @param {import("../dependencies/CssIcssExportDependency").CssExportEntry[]} cssExportEntries all export entries — losers are demoted in place
+	 * @param {import("../dependencies/css/CssIcssExportDependency").CssExportEntry[]} cssExportEntries all export entries — losers are demoted in place
 	 * @returns {void}
 	 */
 	_resolveAmbiguousExports(state, declaredExports, cssExportEntries) {
@@ -932,8 +1034,8 @@ class CssParser extends Parser {
 		 * `CssUrlDependency`. Magic comments win over the project-wide default.
 		 * @param {CssUrlDependency} dep dep
 		 * @param {string} request asset request
-		 * @param {Record<string, EXPECTED_ANY> | null | undefined} options parsed comment options
-		 * @param {import("../Dependency").DependencyLocation} loc location for warnings
+		 * @param {MagicCommentOptions | null | undefined} options parsed comment options
+		 * @param {import("../graph/Dependency").DependencyLocation} loc location for warnings
 		 * @returns {void}
 		 */
 		const applyResourceHintDefaults = (dep, request, options, loc) => {
@@ -960,7 +1062,7 @@ class CssParser extends Parser {
 			);
 		};
 
-		const module = state.module;
+		const module = /** @type {CssModule & BuiltCssModule} */ (state.module);
 
 		// Every CSS Modules export declaration is tracked here so `_resolveAmbiguousExports` can arbitrate cross-kind collisions in one pass at end-of-parse: a class silently wins over CSS-scoped kinds (`@keyframes`, `@counter-style`, `@container`, custom property, grid identifier) — matching css-loader / lightning css / postcss-modules — while other pairs (`class` ↔ `id`, `class` ↔ `:export`, `class` ↔ `@value`, …) surface as a warning so the user can resolve them.
 		/** @typedef {{ kind: string, line: number, column: number, entries: number[] }} DeclarationOfKind */
@@ -1015,7 +1117,7 @@ class CssParser extends Parser {
 		// All `:export`-style exports are collected into a single
 		// `CssIcssExportDependency` per module (emitted at parse end) instead of one
 		// `Dependency` per export — far fewer retained objects on CSS-heavy builds.
-		/** @type {import("../dependencies/CssIcssExportDependency").CssExportEntry[]} */
+		/** @type {import("../dependencies/css/CssIcssExportDependency").CssExportEntry[]} */
 		const cssExportEntries = [];
 		/**
 		 * @param {number} sl start line
@@ -1023,11 +1125,11 @@ class CssParser extends Parser {
 		 * @param {number} el end line
 		 * @param {number} ec end column
 		 * @param {string} name export name
-		 * @param {import("../dependencies/CssIcssExportDependency").Value} value value or [localName, importName, request?]
+		 * @param {import("../dependencies/css/CssIcssExportDependency").Value} value value or [localName, importName, request?]
 		 * @param {Range=} range source range to replace, when present
 		 * @param {boolean=} interpolate whether the value needs interpolation
-		 * @param {import("../dependencies/CssIcssExportDependency").ExportMode=} exportMode export mode
-		 * @param {import("../dependencies/CssIcssExportDependency").ExportType=} exportType export type
+		 * @param {import("../dependencies/css/CssIcssExportDependency").ExportMode=} exportMode export mode
+		 * @param {import("../dependencies/css/CssIcssExportDependency").ExportType=} exportType export type
 		 * @returns {void}
 		 */
 		const addCssExport = (
@@ -1120,11 +1222,9 @@ class CssParser extends Parser {
 		});
 		const knownPropertyIndex = getKnownPropertyIndex(knownProperties);
 
-		/** @type {CssModuleBuildMeta} */
-		(module.buildMeta).isCssModule = isModules;
-		if (/** @type {CssModule} */ (module).exportType === "style") {
-			/** @type {CssModuleBuildMeta} */
-			(module.buildMeta).needIdInConcatenation = true;
+		module.buildMeta.isCssModule = isModules;
+		if (module.exportType === "style") {
+			module.buildMeta.needIdInConcatenation = true;
 		}
 
 		const locConverter = new LocConverter(source);
@@ -1165,10 +1265,10 @@ class CssParser extends Parser {
 		 * @param {Range} range byte range to scan for magic comments
 		 * @param {number} warnStart start offset of the loc for an invalid-`webpackIgnore` warning (computed lazily)
 		 * @param {number} warnEnd end offset of that loc
-		 * @returns {{ ignored: boolean, options: Record<string, EXPECTED_ANY> | null }} parsed options and `webpackIgnore` flag
+		 * @returns {{ ignored: boolean, options: MagicCommentOptions | null }} parsed options and `webpackIgnore` flag
 		 */
 		const magicCommentsIn = (range, warnStart, warnEnd) => {
-			/** @type {{ options: Record<string, EXPECTED_ANY> | null, errors: (Error & { comment: Comment })[] | null }} */
+			/** @type {{ options: MagicCommentOptions | null, errors: (Error & { comment: Comment })[] | null }} */
 			const { options, errors } = parseCommentOptionsInRange(
 				/** @type {(Comment & { range: [number, number], value: string })[]} */ (
 					comments
@@ -1229,13 +1329,15 @@ class CssParser extends Parser {
 		let customMediaQueries;
 		/** @type {Map<string, string> | undefined} */
 		let customSelectorDefs;
+		/** @type {Map<string, string | null> | undefined} */
+		let customSelectorValues;
 		/** @type {{ name: string, start: number, end: number }[] | undefined} */
 		let customSelectorUses;
 
 		/**
 		 * Unescape a CSS identifier from a source byte range — for value spans not
 		 * backed by a single token (string contents, `--` dashed-ident bodies,
-		 * composed names). Token-backed names use `A.unescaped(node)` instead.
+		 * composed names). Token-backed names use `stringValue(node)` instead.
 		 * @param {number} start start offset
 		 * @param {number} end end offset
 		 * @returns {string} the unescaped identifier
@@ -1326,7 +1428,7 @@ class CssParser extends Parser {
 			},
 			/**
 			 * Rule entry: report an impure leaf-ish rule (prelude purity is known, body already parsed), push the inherited-context frame, reset per-rule selector flags.
-			 * @param {{ isRulePrelude: boolean, treatAsLeaf: boolean, ownSkip: boolean, declarations: Declaration[] | null, childRules: Rule[] | null, preludeStart: number, preludeEnd: number }} opts entry options
+			 * @param {{ isRulePrelude: boolean, treatAsLeaf: boolean, ownSkip: boolean, rule: AstNode, preludeStart: number, preludeEnd: number }} opts entry options
 			 */
 			enterBlock(opts) {
 				if (!this.enabled) return;
@@ -1334,8 +1436,7 @@ class CssParser extends Parser {
 					isRulePrelude,
 					treatAsLeaf,
 					ownSkip,
-					declarations,
-					childRules,
+					rule,
 					preludeStart,
 					preludeEnd
 				} = opts;
@@ -1348,13 +1449,10 @@ class CssParser extends Parser {
 					isRulePrelude &&
 					this.ruleImpure;
 				if (reportable) {
-					const hasBody = Boolean(declarations || childRules);
+					const hasBody = A.startOf(Part.block, rule) !== -1;
 					let leaf = treatAsLeaf || !hasBody;
 					if (!leaf && hasBody) {
-						const { hasDirectDecl, hasNestedBlock } = scanRuleBody(
-							declarations,
-							childRules
-						);
+						const { hasDirectDecl, hasNestedBlock } = scanRuleBody(rule);
 						leaf = hasDirectDecl || !hasNestedBlock;
 					}
 					if (leaf) this.report(preludeStart, preludeEnd);
@@ -1426,7 +1524,7 @@ class CssParser extends Parser {
 
 		/**
 		 * Comment visitor (`NodeType.Comment`): push every comment (in source order) onto the local `comments`, read back by `advanceCommentCursor` (pure-mode flags) and `parseCommentOptionsInRange` (magic comments).
-		 * @param {import("./syntax").CssPath} path walk path at the comment node
+		 * @param {import("./syntax-parser").CssPath} path walk path at the comment node
 		 */
 		const commentVisitor = (path) => {
 			const node = path.node;
@@ -1556,22 +1654,26 @@ class CssParser extends Parser {
 			};
 
 			// Body `{ name: value; … }` is parsed eagerly (§5.4.4) — emit a dep per declaration.
-			const ruleDecls = A.declarations(rule);
-			if (!ruleDecls || A.blockStart(rule) === -1) return A.end(second);
-			for (const decl of ruleDecls) {
-				const vals = A.children(decl);
-				if (vals.length === 0) continue;
-				const rawStart = A.start(vals[0]);
-				const rawEnd = A.end(vals[vals.length - 1]);
+			if (A.startOf(Part.block, rule) === -1) return A.end(second);
+			for (
+				let i = 0, count = A.fieldCount(Field.declarations, rule);
+				i < count;
+				i++
+			) {
+				const decl = A.field(i, Field.declarations, rule);
+				const valueCount = A.childCount(decl);
+				if (valueCount === 0) continue;
+				const rawStart = A.start(A.child(0, decl));
+				const rawEnd = A.end(A.child(valueCount - 1, decl));
 				createDep(
-					source.slice(A.nameStart(decl), A.nameEnd(decl)),
+					source.slice(A.startOf(Part.name, decl), A.endOf(Part.name, decl)),
 					source.slice(rawStart, rawEnd),
-					A.nameEnd(decl),
+					A.endOf(Part.name, decl),
 					rawEnd
 				);
 			}
 
-			return skipWhiteLine(source, A.blockEnd(rule));
+			return skipWhiteLine(source, A.endOf(Part.block, rule));
 		};
 
 		/**
@@ -1611,9 +1713,13 @@ class CssParser extends Parser {
 			if (!def || def.importName || typeof def.value !== "string") {
 				return undefined;
 			}
-			const match = SIMPLE_CLASS_OR_ID_VALUE.exec(def.value.trim());
-			return match
-				? [/** @type {"." | "#"} */ (match[1]), match[2]]
+			// Only one `.class` / `#id` has a localizable ident knowable without
+			// re-parsing the substitution.
+			const value = def.value.trim();
+			const prefix = value.charAt(0);
+			return (prefix === "." || prefix === "#") &&
+				isSimpleIdentifier(value.slice(1))
+				? [prefix, value.slice(1)]
 				: undefined;
 		};
 
@@ -1632,6 +1738,100 @@ class CssParser extends Parser {
 			return isDashedIdentifier(value) ? value.slice(2) : undefined;
 		};
 
+		/**
+		 * Add the entry for an ident naming an imported `@value`, which `CssIcssExportDependency` scopes and names once the import resolves.
+		 * @param {string} identifier `@value` name as written
+		 * @param {number} start ident start offset
+		 * @param {number} end ident end offset
+		 * @param {import("../dependencies/css/CssIcssExportDependency").ExportMode} exportMode one of the `RESOLVED_*` modes
+		 * @param {import("../dependencies/css/CssIcssExportDependency").Value=} value the reference, when it carries more than `getReexport` gives
+		 */
+		const addResolvedExport = (
+			identifier,
+			start,
+			end,
+			exportMode,
+			value = getReexport(identifier)
+		) => {
+			const { line: sl, column: sc } = locConverter.get(start);
+			const { line: el, column: ec } = locConverter.get(end);
+			addCssExport(
+				sl,
+				sc,
+				el,
+				ec,
+				identifier,
+				value,
+				[start, end],
+				true,
+				exportMode
+			);
+		};
+
+		/**
+		 * Add the export entry for an ident a declaration site (an at-rule prelude, `local()`) localizes. A `@value` is resolved first: a local one exports under the ident it names, an imported one is left for `CssIcssExportDependency` to name once the import resolves.
+		 * @param {string} identifier ident as written in the source
+		 * @param {number} start ident start offset
+		 * @param {number} end ident end offset
+		 * @param {string | undefined} kind export kind for conflict tracking, undefined for a usage
+		 * @param {import("../dependencies/css/CssIcssExportDependency").ExportType} exportType export type
+		 */
+		const addLocalizedExport = (identifier, start, end, kind, exportType) => {
+			const def =
+				icssDefinitions.size === 0
+					? undefined
+					: icssDefinitions.get(identifier);
+			if (def !== undefined && def.importName) {
+				addResolvedExport(
+					identifier,
+					start,
+					end,
+					CssIcssExportDependency.EXPORT_MODE.RESOLVED_NAME
+				);
+				return;
+			}
+			const { line: sl, column: sc } = locConverter.get(start);
+			const { line: el, column: ec } = locConverter.get(end);
+			let name = identifier;
+			let exportMode = CssIcssExportDependency.EXPORT_MODE.ONCE;
+			if (def !== undefined) {
+				const value = typeof def.value === "string" ? def.value.trim() : "";
+				if (isSimpleIdentifier(value)) {
+					name = value;
+				} else {
+					exportMode = CssIcssExportDependency.EXPORT_MODE.NONE;
+					this._emitWarning(
+						state,
+						CssIcssExportDependency.notSimpleIdentifierMessage(
+							identifier,
+							value
+						),
+						locConverter,
+						start,
+						end
+					);
+				}
+			}
+			if (
+				kind !== undefined &&
+				exportMode === CssIcssExportDependency.EXPORT_MODE.ONCE
+			) {
+				recordDeclaration(name, kind, sl, sc);
+			}
+			addCssExport(
+				sl,
+				sc,
+				el,
+				ec,
+				name,
+				getReexport(identifier),
+				[start, end],
+				true,
+				exportMode,
+				exportType
+			);
+		};
+
 		/**
 		 * Process a `local(...)` / `global(...)` pseudo-function: strip the call (and a leading legacy `:`) via a presentational dep, then emit `local()`'s inner top-level idents as ICSS exports.
 		 * @param {FunctionNode} fn parsed local/global function node
@@ -1642,7 +1842,7 @@ class CssParser extends Parser {
 			// Replace `local(` / `global(` (and a leading `:` for the `:local(`/`:global(` selector form) with empty.
 			const fnStart = A.start(fn);
 			const isColon = input.charCodeAt(fnStart - 1) === CC_COLON;
-			const openEnd = A.nameEnd(fn) + 1;
+			const openEnd = A.endOf(Part.name, fn) + 1;
 			module.addPresentationalDependency(
 				new ConstDependency("", [isColon ? fnStart - 1 : fnStart, openEnd])
 			);
@@ -1650,19 +1850,23 @@ class CssParser extends Parser {
 			if (type === 1) {
 				for (const cv of A.children(fn)) {
 					if (A.type(cv) !== NodeType.Ident) continue;
-					let identifier = A.unescaped(cv);
+					let identifier = stringValue(cv);
+					if (!isDashedIdentifier(identifier)) {
+						addLocalizedExport(
+							identifier,
+							A.start(cv),
+							A.end(cv),
+							declarationKind,
+							CssIcssExportDependency.EXPORT_TYPE.NORMAL
+						);
+						continue;
+					}
 					// Cursor reads instead of `A.loc` — no location objects allocated.
 					const { line: sl, column: sc } = locConverter.get(A.start(cv));
 					const { line: el, column: ec } = locConverter.get(A.end(cv));
-					const isDashedIdent = isDashedIdentifier(identifier);
-					if (isDashedIdent) identifier = identifier.slice(2);
+					identifier = identifier.slice(2);
 					if (declarationKind !== undefined) {
-						recordDeclaration(
-							identifier,
-							isDashedIdent ? "custom property" : declarationKind,
-							sl,
-							sc
-						);
+						recordDeclaration(identifier, "custom property", sl, sc);
 					}
 					addCssExport(
 						sl,
@@ -1674,9 +1878,7 @@ class CssParser extends Parser {
 						[A.start(cv), A.end(cv)],
 						true,
 						CssIcssExportDependency.EXPORT_MODE.ONCE,
-						isDashedIdent
-							? CssIcssExportDependency.EXPORT_TYPE.CUSTOM_VARIABLE
-							: CssIcssExportDependency.EXPORT_TYPE.NORMAL
+						CssIcssExportDependency.EXPORT_TYPE.CUSTOM_VARIABLE
 					);
 				}
 			}
@@ -1696,13 +1898,13 @@ class CssParser extends Parser {
 		 */
 		const processLocalAtRule = (atRule, options, kind) => {
 			let found = false;
-			for (const cv of A.prelude(atRule)) {
+			for (const cv of A.children(atRule)) {
 				const cvType = A.type(cv);
 				if (cvType === NodeType.Whitespace) continue;
 
 				if (cvType === NodeType.String) {
 					if (!found && options.string) {
-						const value = A.unescaped(cv);
+						const value = stringValue(cv);
 						const { line: sl, column: sc } = locConverter.get(A.start(cv));
 						const { line: el, column: ec } = locConverter.get(A.end(cv));
 						recordDeclaration(value, kind, sl, sc);
@@ -1725,26 +1927,18 @@ class CssParser extends Parser {
 
 				if (cvType === NodeType.Ident) {
 					if (!found && options.identifier) {
-						const identifier = A.unescaped(cv);
+						const identifier = stringValue(cv);
 						if (
 							options.identifier instanceof RegExp &&
 							options.identifier.test(identifier)
 						) {
 							continue;
 						}
-						const { line: sl, column: sc } = locConverter.get(A.start(cv));
-						const { line: el, column: ec } = locConverter.get(A.end(cv));
-						recordDeclaration(identifier, kind, sl, sc);
-						addCssExport(
-							sl,
-							sc,
-							el,
-							ec,
+						addLocalizedExport(
 							identifier,
-							getReexport(identifier),
-							[A.start(cv), A.end(cv)],
-							true,
-							CssIcssExportDependency.EXPORT_MODE.ONCE,
+							A.start(cv),
+							A.end(cv),
+							kind,
 							CssIcssExportDependency.EXPORT_TYPE.NORMAL
 						);
 						found = true;
@@ -1755,10 +1949,10 @@ class CssParser extends Parser {
 
 				if (cvType === NodeType.Function) {
 					const fn = /** @type {FunctionNode} */ (cv);
-					const fname = A.unescapedName(fn);
-					const type = equalsLowerCase(fname, "local")
+					const fname = A.name(fn);
+					const type = asciiCaseInsensitiveMatch(fname, "local")
 						? 1
-						: equalsLowerCase(fname, "global")
+						: asciiCaseInsensitiveMatch(fname, "global")
 							? 2
 							: undefined;
 					if (!found && type) {
@@ -1770,7 +1964,8 @@ class CssParser extends Parser {
 					if (
 						this.options.dashedIdents &&
 						isLocalMode() &&
-						(equalsLowerCase(fname, "var") || equalsLowerCase(fname, "style"))
+						(asciiCaseInsensitiveMatch(fname, "var") ||
+							asciiCaseInsensitiveMatch(fname, "style"))
 					) {
 						processDashedIdentInVarFunction(fn);
 					}
@@ -1914,7 +2109,7 @@ class CssParser extends Parser {
 			if (!rangeIsDashedIdentifier(input, identStart, identEnd)) {
 				// `var(v)` where `@value v: --foo` names the same property `var(--foo)`
 				// does, so it is scoped here rather than substituted verbatim.
-				const dashedName = localizableDashedValue(A.value(identNode));
+				const dashedName = localizableDashedValue(A.source(identNode));
 				if (dashedName !== undefined) {
 					handledDashedValueIdents.add(identStart);
 					emitNamedDashedIdentExport(dashedName, identStart, identEnd);
@@ -1930,7 +2125,12 @@ class CssParser extends Parser {
 			if (
 				j >= fv.length ||
 				A.type(fv[j]) !== NodeType.Ident ||
-				!rangeEqualsLowerCase(input, A.start(fv[j]), A.end(fv[j]), "from")
+				!rangeAsciiCaseInsensitiveMatch(
+					input,
+					A.start(fv[j]),
+					A.end(fv[j]),
+					"from"
+				)
 			) {
 				emitDashedIdentExport(identStart, identEnd);
 				return;
@@ -2065,7 +2265,7 @@ class CssParser extends Parser {
 			if (isLocal) {
 				while (
 					trailStart > 0 &&
-					isWhitespace(source.charCodeAt(trailStart - 1))
+					isAsciiWhitespace(source.charCodeAt(trailStart - 1))
 				) {
 					trailStart--;
 				}
@@ -2091,8 +2291,8 @@ class CssParser extends Parser {
 			}
 			const attrNameNode = attrParts[ai];
 			if (!attrNameNode || A.type(attrNameNode) !== NodeType.Ident) return;
-			const attrName = A.unescaped(attrNameNode);
-			if (!equalsLowerCase(attrName, "class")) return;
+			const attrName = stringValue(attrNameNode);
+			if (!asciiCaseInsensitiveMatch(attrName, "class")) return;
 			ai++;
 			while (
 				ai < attrParts.length &&
@@ -2103,11 +2303,11 @@ class CssParser extends Parser {
 			// `=` or `~=` (two `Delim` tokens for the latter).
 			const op1 = attrParts[ai];
 			if (!op1 || A.type(op1) !== NodeType.Delim) return;
-			const op1v = A.value(op1);
+			const op1v = A.source(op1);
 			if (op1v === "~") {
 				ai++;
 				const op2 = attrParts[ai];
-				if (!op2 || A.type(op2) !== NodeType.Delim || A.value(op2) !== "=") {
+				if (!op2 || A.type(op2) !== NodeType.Delim || A.source(op2) !== "=") {
 					return;
 				}
 			} else if (op1v !== "=") {
@@ -2161,7 +2361,7 @@ class CssParser extends Parser {
 			if (!this.options.customIdents) return;
 			for (const cv of cvs) {
 				if (A.type(cv) !== NodeType.Ident) continue;
-				const name = A.unescaped(cv);
+				const name = stringValue(cv);
 				if (isDashedIdentifier(name)) continue;
 				const start = A.start(cv);
 				const end = A.end(cv);
@@ -2189,11 +2389,11 @@ class CssParser extends Parser {
 		 * @returns {void}
 		 */
 		const emitCounterIdent = (node, reservedFrom) => {
-			const name = A.unescaped(node);
+			const name = stringValue(node);
 			if (isDashedIdentifier(name)) return;
 			const reserved =
 				/** @type {Map<string, number>} */
-				(CSS_MODULES_KEYWORDS.get(reservedFrom));
+				(getCssModulesKeywords().get(reservedFrom));
 			if (reserved.has(toLowerCaseIfNeeded(name))) return;
 			const start = A.start(node);
 			const end = A.end(node);
@@ -2284,9 +2484,9 @@ class CssParser extends Parser {
 						if (!next) break;
 						const nextType = A.type(next);
 						if (nextType === NodeType.Ident) {
-							const raw = A.value(next);
-							const isLocal = equalsLowerCase(raw, "local");
-							if (isLocal || equalsLowerCase(raw, "global")) {
+							const raw = A.source(next);
+							const isLocal = asciiCaseInsensitiveMatch(raw, "local");
+							if (isLocal || asciiCaseInsensitiveMatch(raw, "global")) {
 								const id = isLocal ? "local" : "global";
 								// Bare `:local` / `:global`: switch the segment (and top-level persistent) mode and strip the marker.
 								const afterIsWhitespace = stripBareMarker(
@@ -2314,9 +2514,9 @@ class CssParser extends Parser {
 							}
 						} else if (nextType === NodeType.Function) {
 							const fn = /** @type {FunctionNode} */ (next);
-							const rawName = A.unescapedName(fn);
-							const isLocal = equalsLowerCase(rawName, "local");
-							if (isLocal || equalsLowerCase(rawName, "global")) {
+							const rawName = A.name(fn);
+							const isLocal = asciiCaseInsensitiveMatch(rawName, "local");
+							if (isLocal || asciiCaseInsensitiveMatch(rawName, "global")) {
 								// `:local(…)` / `:global(…)`: scope mode to the args and strip the `:name(` … `)` wrapper.
 								stripFunctionMarker(v, fn, isLocal);
 								walkSelectorList(
@@ -2332,12 +2532,12 @@ class CssParser extends Parser {
 					}
 					case NodeType.Function: {
 						// `::view-transition-group(name .class…)` etc.: scope the part name + classes as custom idents (the `v` char guard skips the slice for the common `:is`/`:not`/… functions).
-						const fnNameStart = A.nameStart(v);
+						const fnNameStart = A.startOf(Part.name, v);
 						if (
 							segmentMode === "local" &&
 							(input.charCodeAt(fnNameStart) === CC_LOWER_V ||
 								input.charCodeAt(fnNameStart) === CC_UPPER_V) &&
-							VIEW_TRANSITION_PART_PSEUDO.test(A.unescapedName(v))
+							VIEW_TRANSITION_PART_PSEUDO.test(A.name(v))
 						) {
 							walkViewTransitionPart(A.children(v));
 							break;
@@ -2347,12 +2547,12 @@ class CssParser extends Parser {
 						break;
 					}
 					case NodeType.Hash: {
-						if (A.typeFlag(v) !== "id" || segmentMode !== "local") {
+						if (!A.flag(Flag.id, v) || segmentMode !== "local") {
 							break;
 						}
 						// ID selectors emit the ICSS export but aren't a `composes:` anchor.
 						const idValueStart = A.start(v) + 1;
-						const idName = A.unescaped(v);
+						const idName = stringValue(v);
 						const { line: idSl, column: idSc } = locConverter.get(A.start(v));
 						const { line: idEl, column: idEc } = locConverter.get(A.end(v));
 						recordDeclaration(idName, "id", idSl, idSc);
@@ -2372,7 +2572,7 @@ class CssParser extends Parser {
 					}
 					case NodeType.SimpleBlock: {
 						const block = /** @type {SimpleBlock} */ (v);
-						const bt = A.blockToken(block);
+						const bt = A.value(block);
 						if (bt === "[") {
 							// Attribute selectors `[class="foo"]` localize only in local mode.
 							if (segmentMode === "local") handleAttributeSelector(block);
@@ -2383,7 +2583,7 @@ class CssParser extends Parser {
 						break;
 					}
 					case NodeType.Delim: {
-						const delim = A.value(v);
+						const delim = A.source(v);
 						if (delim === "&") {
 							// Pure-mode: a nesting `&` inherits a pure ancestor's purity.
 							if (topLevel && pure.ancestorHadLocal()) pure.markLocal();
@@ -2394,7 +2594,7 @@ class CssParser extends Parser {
 						if (!next || A.type(next) !== NodeType.Ident) break;
 						if (segmentMode === "local") {
 							// `.<ident>` in local mode is a class selector (dep covers the ident bytes only).
-							const name = A.unescaped(next);
+							const name = stringValue(next);
 							// Cursor reads instead of `A.loc` — this is the hottest export site.
 							const { line: sl, column: sc } = locConverter.get(A.start(next));
 							const { line: el, column: ec } = locConverter.get(A.end(next));
@@ -2415,7 +2615,7 @@ class CssParser extends Parser {
 							pure.markLocal();
 						} else if (icssDefinitions.size !== 0) {
 							// `.<ident>` in global mode: not localized, but the ident may be `@value`-defined and need ICSS rewrite.
-							const ident = A.value(next);
+							const ident = A.source(next);
 							if (!isDashedIdentifier(ident) && icssDefinitions.has(ident)) {
 								emitICSSSymbol(ident, A.start(next), A.end(next));
 							}
@@ -2427,7 +2627,7 @@ class CssParser extends Parser {
 					case NodeType.Ident: {
 						// A bare `@value`-defined ident stands in for a selector; only worth the slice when definitions exist.
 						if (icssDefinitions.size === 0) break;
-						const ident = A.value(v);
+						const ident = A.source(v);
 						if (isDashedIdentifier(ident) || !icssDefinitions.has(ident)) {
 							break;
 						}
@@ -2440,6 +2640,19 @@ class CssParser extends Parser {
 								? localizableSelectorValue(ident)
 								: undefined;
 						if (localizable === undefined) {
+							if (
+								segmentMode === "local" &&
+								/** @type {IcssDefinition} */ (icssDefinitions.get(ident))
+									.importName
+							) {
+								addResolvedExport(
+									ident,
+									identStart,
+									identEnd,
+									CssIcssExportDependency.EXPORT_MODE.RESOLVED_SELECTOR
+								);
+								break;
+							}
 							emitICSSSymbol(ident, identStart, identEnd);
 							break;
 						}
@@ -2564,7 +2777,7 @@ class CssParser extends Parser {
 		 * @returns {void}
 		 */
 		const finishTopLevelRule = (node, blockBearing) => {
-			if (!blockBearing || A.declarations(node) || A.childRules(node)) {
+			if (!blockBearing || A.startOf(Part.block, node) !== -1) {
 				allowImport = false;
 			}
 			pure.markSeenTopLevelRule();
@@ -2758,7 +2971,7 @@ class CssParser extends Parser {
 						}
 						if (
 							A.type(cv) === NodeType.Ident &&
-							equalsLowerCase(A.value(cv), "global")
+							asciiCaseInsensitiveMatch(A.source(cv), "global")
 						) {
 							fromSource = { kind: "global" };
 							phase = "done";
@@ -2775,9 +2988,9 @@ class CssParser extends Parser {
 					}
 
 					if (A.type(cv) === NodeType.Ident) {
-						const identValue = A.value(cv);
+						const identValue = A.source(cv);
 						if (
-							equalsLowerCase(identValue, "from") &&
+							asciiCaseInsensitiveMatch(identValue, "from") &&
 							classNames.length > 0 &&
 							nextNonWhitespace(group, i + 1) < group.length
 						) {
@@ -2794,7 +3007,7 @@ class CssParser extends Parser {
 
 					if (A.type(cv) === NodeType.Function) {
 						const fn = /** @type {FunctionNode} */ (cv);
-						const isGlobal = equalsLowerCase(A.unescapedName(fn), "global");
+						const isGlobal = asciiCaseInsensitiveMatch(A.name(fn), "global");
 						for (const inner of A.children(fn)) {
 							if (A.type(inner) === NodeType.Ident) {
 								classNames.push({
@@ -2841,10 +3054,10 @@ class CssParser extends Parser {
 			let resumeAt = A.end(decl);
 			if (source.charCodeAt(A.end(decl)) === CC_SEMICOLON) {
 				resumeAt = A.end(decl) + 1;
-				while (isWhitespace(source.charCodeAt(resumeAt))) resumeAt++;
+				while (isAsciiWhitespace(source.charCodeAt(resumeAt))) resumeAt++;
 			}
 			module.addPresentationalDependency(
-				new ConstDependency("", [A.nameStart(decl), resumeAt])
+				new ConstDependency("", [A.startOf(Part.name, decl), resumeAt])
 			);
 		};
 
@@ -2854,26 +3067,36 @@ class CssParser extends Parser {
 		 * @param {string | undefined} escapedName the unescaped function name when it carries an escape, undefined for the raw byte-range path
 		 */
 		const emitUrlFunction = (fn, escapedName) => {
-			const fnNameStart = A.nameStart(fn);
-			const fnNameEnd = A.nameEnd(fn);
+			const fnNameStart = A.startOf(Part.name, fn);
+			const fnNameEnd = A.endOf(Part.name, fn);
 			let isUrlOrSrc;
 			let isImageSet = false;
 			if (escapedName !== undefined) {
 				isUrlOrSrc =
-					equalsLowerCase(escapedName, "url") ||
-					equalsLowerCase(escapedName, "src");
+					asciiCaseInsensitiveMatch(escapedName, "url") ||
+					asciiCaseInsensitiveMatch(escapedName, "src");
 				if (!isUrlOrSrc) isImageSet = IMAGE_SET_FUNCTION.test(escapedName);
 			} else {
 				const nameLength = fnNameEnd - fnNameStart;
 				isUrlOrSrc =
 					nameLength === 3 &&
-					(rangeEqualsLowerCase(input, fnNameStart, fnNameEnd, "url") ||
-						rangeEqualsLowerCase(input, fnNameStart, fnNameEnd, "src"));
+					(rangeAsciiCaseInsensitiveMatch(
+						input,
+						fnNameStart,
+						fnNameEnd,
+						"url"
+					) ||
+						rangeAsciiCaseInsensitiveMatch(
+							input,
+							fnNameStart,
+							fnNameEnd,
+							"src"
+						));
 				if (!isUrlOrSrc) {
 					// Suffix probe first, so only a vendor-prefixed `…-image-set` pays the slice + regex.
 					isImageSet =
 						nameLength >= 9 &&
-						rangeEqualsLowerCase(
+						rangeAsciiCaseInsensitiveMatch(
 							input,
 							fnNameEnd - 9,
 							fnNameEnd,
@@ -2973,18 +3196,18 @@ class CssParser extends Parser {
 					"Any '@import' rules must precede all other rules",
 					locConverter,
 					A.start(at),
-					A.nameEnd(at)
+					A.endOf(Part.name, at)
 				);
 				return;
 			}
 			const importStart = A.start(at);
-			const importNameEnd = A.nameEnd(at);
+			const importNameEnd = A.endOf(Part.name, at);
 			// We only accept `;`-terminated @import; block / EOF / `}` ends are silent bails.
 			if (source.charCodeAt(A.end(at)) !== CC_SEMICOLON) return;
 
 			// Walk the prelude in spec order (URL → layer? → supports? → media query); anything else joins the media query.
 			const { urlNode, layerNode, supportsNode } = parseImportPrelude(
-				A.prelude(at)
+				A.children(at)
 			);
 
 			const semi = A.end(at) + 1; // position past `;`
@@ -3006,7 +3229,7 @@ class CssParser extends Parser {
 			let url;
 			if (A.type(urlNode) === NodeType.Ident) {
 				// URL given as identifier — resolve via CSS Modules `@value`.
-				const identName = A.value(urlNode);
+				const identName = A.source(urlNode);
 				const def = icssDefinitions.get(identName);
 				if (!def) {
 					this._emitWarning(
@@ -3045,7 +3268,7 @@ class CssParser extends Parser {
 			} else if (A.type(urlNode) === NodeType.Url) {
 				const ut = /** @type {UrlToken} */ (urlNode);
 				url = normalizeUrl(
-					input.slice(A.contentStart(ut), A.contentEnd(ut)),
+					input.slice(A.startOf(Part.value, ut), A.endOf(Part.value, ut)),
 					false
 				);
 			} else if (A.type(urlNode) === NodeType.String) {
@@ -3100,7 +3323,7 @@ class CssParser extends Parser {
 				if (A.type(layerNode) === NodeType.Function) {
 					// `layer(<ident>)` — extract content between `(` and `)`.
 					const fn = /** @type {FunctionNode} */ (layerNode);
-					layer = input.slice(A.nameEnd(fn) + 1, A.end(fn) - 1).trim();
+					layer = input.slice(A.endOf(Part.name, fn) + 1, A.end(fn) - 1).trim();
 				} else {
 					// Bare `layer` ident — anonymous layer.
 					layer = "";
@@ -3111,18 +3334,18 @@ class CssParser extends Parser {
 			let supports;
 			if (supportsNode) {
 				supports = input
-					.slice(A.nameEnd(supportsNode) + 1, A.end(supportsNode) - 1)
+					.slice(A.endOf(Part.name, supportsNode) + 1, A.end(supportsNode) - 1)
 					.trim();
 			}
 
 			// Media query = whatever sits between the last url/layer/supports part and the closing `;`, trimmed. Start at the next non-whitespace prelude node (skips the gap, comments included).
 			const lastPrefixPart = supportsNode || layerNode || urlNode;
 			const afterIdx =
-				/** @type {AstNode[]} */ (A.prelude(at)).indexOf(lastPrefixPart) + 1;
-			const nextIdx = nextNonWhitespace(A.prelude(at), afterIdx);
+				/** @type {AstNode[]} */ (A.children(at)).indexOf(lastPrefixPart) + 1;
+			const nextIdx = nextNonWhitespace(A.children(at), afterIdx);
 			const mediaStart =
-				nextIdx < A.prelude(at).length
-					? A.start(A.prelude(at)[nextIdx])
+				nextIdx < A.children(at).length
+					? A.start(A.children(at)[nextIdx])
 					: A.end(at);
 			/** @type {undefined | string} */
 			let media;
@@ -3170,7 +3393,7 @@ class CssParser extends Parser {
 		 */
 		const handleValueAtRule = (at) => {
 			const start = A.start(at);
-			const nameEnd = A.nameEnd(at);
+			const nameEnd = A.endOf(Part.name, at);
 			const semi = A.end(at);
 			const atRuleEnd =
 				source.charCodeAt(semi) === CC_SEMICOLON ? semi + 1 : semi;
@@ -3296,7 +3519,7 @@ class CssParser extends Parser {
 					return ident;
 				}
 				if (A.type(k) !== NodeType.Ident) return undefined;
-				const v = A.value(k);
+				const v = A.source(k);
 				if (!isDashedIdentifier(v)) return undefined;
 				ident = v;
 			}
@@ -3318,13 +3541,13 @@ class CssParser extends Parser {
 				new ConstDependency("", [start, ruleEnd])
 			);
 
-			const prelude = A.prelude(at);
+			const prelude = A.children(at);
 			let i = 0;
 			while (i < prelude.length && A.type(prelude[i]) === NodeType.Whitespace) {
 				i++;
 			}
 			if (i >= prelude.length || A.type(prelude[i]) !== NodeType.Ident) return;
-			const name = A.value(prelude[i]);
+			const name = A.source(prelude[i]);
 			if (!isDashedIdentifier(name)) return;
 			i++;
 
@@ -3371,10 +3594,17 @@ class CssParser extends Parser {
 						return { kind: "alias", name: nested };
 					}
 				}
-				// A reference anywhere else in the value has no resolution step of its
-				// own — only a `@media` prelude's uses are scanned — so writing this
-				// value out would emit the reference unresolved.
-				if (hasCustomMediaRef(prelude, vs, ve)) return CUSTOM_MEDIA_UNSUPPORTED;
+				// A reference anywhere else is captured as a `@media` prelude is, and
+				// folded once every name it reads is known.
+				if (hasCustomMediaRef(prelude, vs, ve)) {
+					/** @type {CustomMediaUse[]} */
+					const uses = [];
+					const node = captureMediaQuery(prelude, vs, ve, uses);
+					for (const use of uses) {
+						if (use.invalid) return CUSTOM_MEDIA_UNSUPPORTED;
+					}
+					return { kind: "query", node, uses };
+				}
 				if (A.type(first) === NodeType.SimpleBlock) {
 					return { kind: "condition", text: valueText };
 				}
@@ -3382,14 +3612,14 @@ class CssParser extends Parser {
 				const s = A.start(first);
 				const e = A.end(first);
 				if (ve - vs === 1) {
-					if (rangeEqualsLowerCase(input, s, e, "true")) {
+					if (rangeAsciiCaseInsensitiveMatch(input, s, e, "true")) {
 						return CUSTOM_MEDIA_TRUE;
 					}
-					if (rangeEqualsLowerCase(input, s, e, "false")) {
+					if (rangeAsciiCaseInsensitiveMatch(input, s, e, "false")) {
 						return CUSTOM_MEDIA_FALSE;
 					}
 				}
-				if (rangeEqualsLowerCase(input, s, e, "not")) {
+				if (rangeAsciiCaseInsensitiveMatch(input, s, e, "not")) {
 					// `not (…)` is a media condition (wrap so it stays a media-in-parens);
 					// `not <type>` is a media type.
 					let j = vs + 1;
@@ -3405,7 +3635,7 @@ class CssParser extends Parser {
 
 			// Comma list → `(seg1 or seg2 …)`; supported only when every segment is a
 			// media-in-parens (or a name standing for one).
-			/** @type {({ text: string } | { alias: string })[]} */
+			/** @type {({ text: string } | { alias: string } | { query: CustomMediaQuery })[]} */
 			const parts = [];
 			let ok = true;
 			/** @type {AstNode[]} */
@@ -3431,15 +3661,26 @@ class CssParser extends Parser {
 					else parts.push({ alias: nested });
 					return;
 				}
+				// Any other condition is one group in the `or`; a media type is none.
 				if (
-					A.type(f) === NodeType.Ident &&
-					rangeEqualsLowerCase(input, A.start(f), A.end(f), "not") &&
-					!hasCustomMediaRef(seg, a, b)
+					A.type(f) !== NodeType.SimpleBlock &&
+					!(
+						A.type(f) === NodeType.Ident &&
+						rangeAsciiCaseInsensitiveMatch(input, A.start(f), A.end(f), "not")
+					)
 				) {
+					ok = false;
+					return;
+				}
+				if (!hasCustomMediaRef(seg, a, b)) {
 					parts.push({ text: `(${text})` });
 					return;
 				}
-				ok = false;
+				/** @type {CustomMediaUse[]} */
+				const uses = [];
+				const node = captureMediaCondition(seg, a, b, uses, true);
+				if (uses.some((use) => use.invalid)) ok = false;
+				else parts.push({ query: { node, uses } });
 			};
 			for (let k = vs; k < ve; k++) {
 				if (A.type(prelude[k]) === NodeType.Comma) {
@@ -3480,15 +3721,26 @@ class CssParser extends Parser {
 				let ok = true;
 				let anyTrue = false;
 				for (const part of def.parts) {
-					if (!("alias" in part)) {
+					if ("text" in part) {
 						texts.push(part.text);
 						continue;
 					}
-					const inner = resolveCustomMediaValue(part.alias, resolving);
+					const inner =
+						"alias" in part
+							? resolveCustomMediaValue(part.alias, resolving)
+							: resolveCustomMediaQuery(
+									part.query.node,
+									part.query.uses,
+									resolving
+								);
 					// A media query list is an `or`, so a constant segment drops out of it.
-					if (inner.kind === "boolean") anyTrue = anyTrue || inner.value;
-					else if (inner.kind === "condition") texts.push(inner.text);
-					else ok = false;
+					if (inner.kind === "boolean") {
+						anyTrue = anyTrue || inner.value;
+					} else if (inner.kind === "condition") {
+						texts.push(mediaConditionFor(inner.text, "or"));
+					} else {
+						ok = false;
+					}
 				}
 				value = !ok
 					? CUSTOM_MEDIA_UNSUPPORTED
@@ -3501,6 +3753,8 @@ class CssParser extends Parser {
 									text:
 										texts.length === 1 ? texts[0] : `(${texts.join(" or ")})`
 								};
+			} else if (def.kind === "query") {
+				value = resolveCustomMediaQuery(def.node, def.uses, resolving);
 			} else {
 				value = def;
 			}
@@ -3509,6 +3763,35 @@ class CssParser extends Parser {
 			return value;
 		};
 
+		/**
+		 * What a `@custom-media` value reading other names resolves to: the value
+		 * folded once each name resolves, or unsupported where one does not.
+		 * @param {MediaNode} node the captured value
+		 * @param {CustomMediaUse[]} uses the names it reads
+		 * @param {Set<string>} resolving names currently being resolved
+		 * @returns {CustomMediaValue} what it resolves to
+		 */
+		const resolveCustomMediaQuery = (node, uses, resolving) => {
+			for (const use of uses) {
+				const inner = resolveCustomMediaValue(use.name, resolving);
+				if (
+					inner.kind === "unsupported" ||
+					(inner.kind === "type" && !use.leading)
+				) {
+					return CUSTOM_MEDIA_UNSUPPORTED;
+				}
+			}
+			const folded = foldMediaNode(node, resolving);
+			if (typeof folded === "boolean") {
+				return folded ? CUSTOM_MEDIA_TRUE : CUSTOM_MEDIA_FALSE;
+			}
+			// A query led by a media type stands for a type, as one written out does.
+			const condition =
+				folded.charCodeAt(0) === CC_LEFT_PARENTHESIS ||
+				/^not\s*\(/i.test(folded);
+			return { kind: condition ? "condition" : "type", text: folded };
+		};
+
 		/**
 		 * Whether a node is the media keyword `word` (media queries are ASCII
 		 * case-insensitive).
@@ -3518,7 +3801,7 @@ class CssParser extends Parser {
 		 */
 		const isMediaKeyword = (node, word) =>
 			A.type(node) === NodeType.Ident &&
-			rangeEqualsLowerCase(input, A.start(node), A.end(node), word);
+			rangeAsciiCaseInsensitiveMatch(input, A.start(node), A.end(node), word);
 
 		/**
 		 * First significant index in `tokens[from…to)`.
@@ -3569,7 +3852,7 @@ class CssParser extends Parser {
 		const hasCustomMediaRefIn = (node) => {
 			const count = A.childCount(node);
 			for (let k = 0; k < count; k++) {
-				const child = A.childAt(node, k);
+				const child = A.child(k, node);
 				const type = A.type(child);
 				if (type !== NodeType.SimpleBlock && type !== NodeType.Function) {
 					continue;
@@ -3626,9 +3909,10 @@ class CssParser extends Parser {
 		 * @param {number} to one past the last index
 		 * @param {boolean} leading whether the term starts a top-level query
 		 * @param {CustomMediaUse[]} uses the prelude's use list, appended to
+		 * @param {MediaSlot} slot what the term is joined to
 		 * @returns {MediaNode} the captured term
 		 */
-		const captureMediaInParens = (tokens, from, to, leading, uses) => {
+		const captureMediaInParens = (tokens, from, to, leading, uses, slot) => {
 			const a = mediaTrimStart(tokens, from, to);
 			const b = mediaTrimEnd(tokens, a, to);
 			if (a >= b) return { kind: "text", text: "" };
@@ -3644,13 +3928,20 @@ class CssParser extends Parser {
 					start: A.start(block),
 					end: A.end(block),
 					invalid: mediaExtra.hasExtra,
-					leading
+					leading,
+					slot
 				};
 				uses.push(use);
 				return { kind: "ref", text, use };
 			}
 			const children = A.children(block);
-			const inner = captureMediaCondition(children, 0, children.length, uses);
+			const inner = captureMediaCondition(
+				children,
+				0,
+				children.length,
+				uses,
+				true
+			);
 			return inner.kind === "text"
 				? { kind: "text", text }
 				: { kind: "group", operand: inner };
@@ -3663,33 +3954,46 @@ class CssParser extends Parser {
 		 * @param {number} from first index
 		 * @param {number} to one past the last index
 		 * @param {CustomMediaUse[]} uses the prelude's use list, appended to
+		 * @param {boolean} alone whether nothing outside joins the condition
 		 * @returns {MediaNode} the captured condition
 		 */
-		const captureMediaCondition = (tokens, from, to, uses) => {
+		const captureMediaCondition = (tokens, from, to, uses, alone) => {
 			const a = mediaTrimStart(tokens, from, to);
 			const b = mediaTrimEnd(tokens, a, to);
 			if (a >= b) return { kind: "text", text: "" };
 			if (isMediaKeyword(tokens[a], "not")) {
 				return {
 					kind: "not",
-					operand: captureMediaInParens(tokens, a + 1, b, false, uses)
+					operand: captureMediaInParens(tokens, a + 1, b, false, uses, "or")
 				};
 			}
+			let isOr = false;
+			let single = true;
+			for (let i = a; i < b; i++) {
+				if (isMediaKeyword(tokens[i], "or")) isOr = true;
+				if (
+					isMediaKeyword(tokens[i], "and") ||
+					isMediaKeyword(tokens[i], "or")
+				) {
+					single = false;
+				}
+			}
+			/** @type {MediaSlot} */
+			const slot = single && alone ? "alone" : isOr ? "or" : "and";
 			/** @type {MediaNode[]} */
 			const terms = [];
-			let isOr = false;
 			let start = a;
 			for (let i = a; i <= b; i++) {
-				const atEnd = i === b;
 				if (
-					!atEnd &&
+					i !== b &&
 					!isMediaKeyword(tokens[i], "and") &&
 					!isMediaKeyword(tokens[i], "or")
 				) {
 					continue;
 				}
-				if (!atEnd && isMediaKeyword(tokens[i], "or")) isOr = true;
-				terms.push(captureMediaInParens(tokens, start, i, start === a, uses));
+				terms.push(
+					captureMediaInParens(tokens, start, i, start === a, uses, slot)
+				);
 				start = i + 1;
 			}
 			if (terms.length === 1) return terms[0];
@@ -3715,7 +4019,9 @@ class CssParser extends Parser {
 				(!isMediaKeyword(tokens[a], "not") ||
 					rest >= b ||
 					A.type(tokens[rest]) !== NodeType.SimpleBlock);
-			if (!startsWithType) return captureMediaCondition(tokens, a, b, uses);
+			if (!startsWithType) {
+				return captureMediaCondition(tokens, a, b, uses, true);
+			}
 			// `[not | only]? <type> [and <condition-without-or>]?` — the type itself is
 			// never constant, so only the `and` chain after it can fold.
 			let split = b;
@@ -3729,7 +4035,9 @@ class CssParser extends Parser {
 				kind: "typed",
 				text: mediaText(tokens, a, mediaTrimEnd(tokens, a, split)),
 				rest:
-					split === b ? null : captureMediaCondition(tokens, split + 1, b, uses)
+					split === b
+						? null
+						: captureMediaCondition(tokens, split + 1, b, uses, false)
 			};
 		};
 
@@ -3739,7 +4047,7 @@ class CssParser extends Parser {
 		 * @param {AtRule} at the `@media` at-rule
 		 */
 		const collectMediaQuery = (at) => {
-			const prelude = A.prelude(at);
+			const prelude = A.children(at);
 			const start = mediaTrimStart(prelude, 0, prelude.length);
 			const end = mediaTrimEnd(prelude, start, prelude.length);
 			if (start >= end || !hasCustomMediaRef(prelude, start, end)) return;
@@ -3777,7 +4085,9 @@ class CssParser extends Parser {
 					const value = resolveCustomMediaValue(node.use.name, resolving);
 					if (node.use.invalid) return node.text;
 					if (value.kind === "boolean") return value.value;
-					if (value.kind === "condition") return value.text;
+					if (value.kind === "condition") {
+						return mediaConditionFor(value.text, node.use.slot);
+					}
 					if (value.kind === "type" && node.use.leading) return value.text;
 					return node.text;
 				}
@@ -3842,7 +4152,7 @@ class CssParser extends Parser {
 				new ConstDependency("", [start, ruleEnd])
 			);
 
-			const prelude = A.prelude(at);
+			const prelude = A.children(at);
 			let i = 0;
 			while (i < prelude.length && A.type(prelude[i]) === NodeType.Whitespace) {
 				i++;
@@ -3857,7 +4167,7 @@ class CssParser extends Parser {
 			) {
 				return;
 			}
-			const name = A.value(nameNode);
+			const name = A.source(nameNode);
 			if (!isDashedIdentifier(name)) return;
 			const list = input.slice(A.end(nameNode), end).trim();
 			if (list.length === 0) return;
@@ -3878,10 +4188,10 @@ class CssParser extends Parser {
 						next &&
 						A.type(next) === NodeType.Ident &&
 						A.end(t) === A.start(next) &&
-						isDashedIdentifier(A.value(next))
+						isDashedIdentifier(A.source(next))
 					) {
 						(customSelectorUses || (customSelectorUses = [])).push({
-							name: A.value(next),
+							name: A.source(next),
 							start: A.start(t),
 							end: A.end(next)
 						});
@@ -3892,6 +4202,43 @@ class CssParser extends Parser {
 			}
 		};
 
+		/**
+		 * The selector list a `@custom-selector` name stands for, each name it reads
+		 * written as `:is(…)` in turn, memoized; undefined when unknown or on a cycle.
+		 * @param {string} name the dashed ident
+		 * @param {Set<string>} resolving names currently being resolved
+		 * @returns {string | undefined} the list
+		 */
+		const resolveCustomSelector = (name, resolving) => {
+			const cached = customSelectorValues && customSelectorValues.get(name);
+			if (cached !== undefined) return cached === null ? undefined : cached;
+			const list = customSelectorDefs && customSelectorDefs.get(name);
+			if (list === undefined || resolving.has(name)) return undefined;
+			resolving.add(name);
+			/** @type {string | null} */
+			let written = "";
+			let at = 0;
+			for (const found of customSelectorNames(list)) {
+				if (!customSelectorDefs || !customSelectorDefs.has(found.name)) {
+					continue;
+				}
+				const inner = resolveCustomSelector(found.name, resolving);
+				if (inner === undefined) {
+					written = null;
+					break;
+				}
+				written += `${list.slice(at, found.start)}:is(${inner})`;
+				at = found.end;
+			}
+			if (written !== null) written += list.slice(at);
+			resolving.delete(name);
+			(customSelectorValues || (customSelectorValues = new Map())).set(
+				name,
+				written
+			);
+			return written === null ? undefined : written;
+		};
+
 		/**
 		 * Rewrite the collected `@custom-media` / `@custom-selector` uses now that all (possibly later-defined) definitions are known; warns on invalid, unknown, or media-type-in-a-non-leading-position custom-media uses.
 		 */
@@ -3954,7 +4301,12 @@ class CssParser extends Parser {
 							(value.kind === "type" && use.leading)
 						) {
 							module.addPresentationalDependency(
-								new ConstDependency(value.text, [use.start, use.end])
+								new ConstDependency(
+									value.kind === "condition"
+										? mediaConditionFor(value.text, use.slot)
+										: value.text,
+									[use.start, use.end]
+								)
 							);
 						}
 					}
@@ -3962,7 +4314,7 @@ class CssParser extends Parser {
 			}
 			if (customSelectorUses) {
 				for (const use of customSelectorUses) {
-					const list = customSelectorDefs && customSelectorDefs.get(use.name);
+					const list = resolveCustomSelector(use.name, new Set());
 					if (list === undefined) continue;
 					module.addPresentationalDependency(
 						new ConstDependency(`:is(${list})`, [use.start, use.end])
@@ -4040,7 +4392,7 @@ class CssParser extends Parser {
 							parsedKeywords = Object.create(null);
 							break;
 						case NodeType.Delim:
-							afterExclamation = A.value(cv) === "!";
+							afterExclamation = A.source(cv) === "!";
 							break;
 						case NodeType.Ident: {
 							if (isGridTemplate) break;
@@ -4048,7 +4400,7 @@ class CssParser extends Parser {
 								afterExclamation = false;
 								break;
 							}
-							const identifier = A.value(cv);
+							const identifier = A.source(cv);
 							// `view-transition-name: --foo` / `counter-reset: --foo` — a dashed name scopes as a custom property under `dashedIdents`, not as a plain ident export.
 							if (
 								(isViewTransitionProperty || isCounterProperty) &&
@@ -4059,14 +4411,46 @@ class CssParser extends Parser {
 								}
 								break;
 							}
+							const def =
+								isGridProperty || icssDefinitions.size === 0
+									? undefined
+									: icssDefinitions.get(identifier);
+							let resolved = identifier;
+							if (def !== undefined) {
+								if (def.importName) {
+									// The property rides along: its keywords stay unscoped.
+									const reference = /** @type {string[]} */ (
+										getReexport(identifier)
+									);
+									addResolvedExport(
+										identifier,
+										A.start(cv),
+										A.end(cv),
+										CssIcssExportDependency.EXPORT_MODE.RESOLVED_REFERENCE,
+										[reference[0], reference[1], reference[2], declPropertyName]
+									);
+									break;
+								}
+								// `@value` resolves first: what isn't still a name, or is now a
+								// keyword, is substituted as is rather than scoped.
+								resolved =
+									typeof def.value === "string" ? def.value.trim() : "";
+								if (!isSimpleIdentifier(resolved)) {
+									emitICSSSymbol(identifier, A.start(cv), A.end(cv));
+									break;
+								}
+							}
 							// Values are almost always lowercase already — avoid the copy.
-							const keyword = toLowerCaseIfNeeded(identifier);
+							const keyword = toLowerCaseIfNeeded(resolved);
 							parsedKeywords[keyword] =
 								typeof parsedKeywords[keyword] !== "undefined"
 									? parsedKeywords[keyword] + 1
 									: 0;
 							const limit = keywords.get(keyword);
 							if (limit !== undefined && parsedKeywords[keyword] < limit) {
+								if (def !== undefined) {
+									emitICSSSymbol(identifier, A.start(cv), A.end(cv));
+								}
 								break;
 							}
 							emit(A.start(cv), A.end(cv));
@@ -4099,7 +4483,7 @@ class CssParser extends Parser {
 						}
 						case NodeType.SimpleBlock: {
 							const block = /** @type {SimpleBlock} */ (cv);
-							if (A.blockToken(block) === "[") {
+							if (A.value(block) === "[") {
 								// Collect identifiers until the first non-ident token (`<line-names> = '[' <custom-ident>* ']'`).
 								for (const inner of A.children(block)) {
 									if (A.type(inner) === NodeType.Whitespace) continue;
@@ -4116,7 +4500,7 @@ class CssParser extends Parser {
 							if (
 								isGridTemplate ||
 								(isCounterProperty &&
-									equalsLowerCase(A.unescapedName(cv), "reversed"))
+									asciiCaseInsensitiveMatch(A.name(cv), "reversed"))
 							) {
 								walkExports(A.children(cv));
 							}
@@ -4144,7 +4528,7 @@ class CssParser extends Parser {
 		) => {
 			const acceptIdent = isKeyframes || isCounterStyle || isContainer;
 			const acceptString = isKeyframes;
-			for (const cv of A.prelude(at)) {
+			for (const cv of A.children(at)) {
 				const cvType = A.type(cv);
 				if (cvType === NodeType.Whitespace) continue;
 				if (cvType === NodeType.String) {
@@ -4163,7 +4547,7 @@ class CssParser extends Parser {
 					break;
 				}
 				if (cvType === NodeType.Function) {
-					if (equalsLowerCase(A.unescapedName(cv), "local")) {
+					if (asciiCaseInsensitiveMatch(A.name(cv), "local")) {
 						pure.markLocal();
 					}
 					break;
@@ -4187,7 +4571,7 @@ class CssParser extends Parser {
 					// Rollback point: nested walks append to the shared list; the exit
 					// truncates back to this length (no per-rule copy).
 					const savedLocalIdentifierCount = currentRule.localIdentifiers.length;
-					const name = `@${toLowerCaseIfNeeded(A.unescapedName(at))}`;
+					const name = `@${toLowerCaseIfNeeded(A.name(at))}`;
 					// The dispatch below is the only place a prelude is rewritten ahead
 					// of the value visitors, so the marks live exactly as long as it.
 					if (handledPreludeIdents.size !== 0) handledPreludeIdents.clear();
@@ -4199,7 +4583,7 @@ class CssParser extends Parser {
 								"'@namespace' is not supported in bundled CSS",
 								locConverter,
 								A.start(at),
-								A.nameEnd(at)
+								A.endOf(Part.name, at)
 							);
 							break;
 						}
@@ -4210,12 +4594,11 @@ class CssParser extends Parser {
 									source.charCodeAt(atEnd) === CC_SEMICOLON ? atEnd + 1 : atEnd;
 								const dep = new ConstDependency("", [A.start(at), atRuleEnd]);
 								module.addPresentationalDependency(dep);
-								const string = A.prelude(at).find(
+								const string = A.children(at).find(
 									(v) => A.type(v) !== NodeType.Whitespace
 								);
 								if (string && A.type(string) === NodeType.String) {
-									/** @type {CssModuleBuildInfo} */
-									(module.buildInfo).charset = source
+									module.buildInfo.charset = source
 										.slice(A.start(string) + 1, A.end(string) - 1)
 										.toUpperCase();
 								}
@@ -4281,11 +4664,11 @@ class CssParser extends Parser {
 					// `@scope (.x) to (.y)` — walk the prelude as a selector list.
 					if (
 						isModules &&
-						equalsLowerCase(A.unescapedName(at), "scope") &&
-						A.prelude(at).length > 0
+						asciiCaseInsensitiveMatch(A.name(at), "scope") &&
+						A.children(at).length > 0
 					) {
 						walkSelectorList(
-							A.prelude(at),
+							A.children(at),
 							/** @type {"local" | "global"} */ (
 								mode === "local" ? "local" : "global"
 							)
@@ -4302,7 +4685,7 @@ class CssParser extends Parser {
 					dashed.active = false;
 					// `@import` url() is the import target — only walk its prelude for url deps on malformed-import recovery.
 					if (this.options.url && (name !== "@import" || currentUrlRecovery)) {
-						lastTokenEndForComments = A.nameEnd(at);
+						lastTokenEndForComments = A.endOf(Part.name, at);
 					}
 					// Dashed-ident scoping over the prelude (the Ident / Function visitors emit).
 					dashed.active = Boolean(
@@ -4341,19 +4724,16 @@ class CssParser extends Parser {
 
 					// pure.stack push for block-bearing at-rules (pure-off builds skip
 					// the frame object — every consumer inside is a no-op then).
-					const atDecls = A.declarations(at);
-					const atChildRules = A.childRules(at);
-					const atHasBlock = Boolean(atDecls || atChildRules);
-					const atBlockStart = A.blockStart(at);
-					if (pure.enabled && atHasBlock && atBlockStart !== -1) {
+					const atBlockStart = A.startOf(Part.block, at);
+					const atHasBlock = atBlockStart !== -1;
+					if (pure.enabled && atHasBlock) {
 						const isAtRulePrelude = isPureBodyAtRule(name);
 						if (isAtRulePrelude) pure.finalizeSelector();
 						pure.enterBlock({
 							isRulePrelude: isAtRulePrelude,
 							treatAsLeaf: atTreatAsLeaf,
 							ownSkip: atSkipChildren,
-							declarations: atDecls,
-							childRules: atChildRules,
+							rule: at,
 							preludeStart: A.start(at),
 							preludeEnd: atBlockStart
 						});
@@ -4398,7 +4778,7 @@ class CssParser extends Parser {
 					// One prelude materialization per rule, shared by the scans below
 					// (null in plain mode, which never reads the array).
 					const rulePrelude =
-						isModules || mayHaveCustomSelectors ? A.prelude(rule) : null;
+						isModules || mayHaveCustomSelectors ? A.children(rule) : null;
 					// `:--name` custom-selector references (dashed idents never collide with the `:import`/`:export` ICSS preludes below).
 					if (mayHaveCustomSelectors && rulePrelude !== null) {
 						scanCustomSelectorUses(rulePrelude);
@@ -4414,12 +4794,12 @@ class CssParser extends Parser {
 							const secondType = A.type(second);
 							const rawName =
 								secondType === NodeType.Ident
-									? A.value(second)
+									? A.source(second)
 									: secondType === NodeType.Function
-										? A.name(second)
+										? rawNameOf(second)
 										: "";
-							const isImport = equalsLowerCase(rawName, "import");
-							if (isImport || equalsLowerCase(rawName, "export")) {
+							const isImport = asciiCaseInsensitiveMatch(rawName, "import");
+							if (isImport || asciiCaseInsensitiveMatch(rawName, "export")) {
 								if (topLevel) {
 									const startColon = A.start(rulePrelude[firstIdx]);
 									const endAfterBody = processImportOrExport(
@@ -4430,13 +4810,6 @@ class CssParser extends Parser {
 									module.addPresentationalDependency(
 										new ConstDependency("", [startColon, endAfterBody])
 									);
-									if (A.blockStart(rule) !== -1) {
-										A.setBlockEnd(rule, endAfterBody);
-									}
-									A.setEnd(rule, endAfterBody);
-								} else if (A.blockStart(rule) !== -1) {
-									// Nested `:import` / `:export` — leave the body alone.
-									A.setEnd(rule, A.blockEnd(rule));
 								}
 								// Don't recurse into the body — handled inline above.
 								path.skipChildren();
@@ -4478,7 +4851,7 @@ class CssParser extends Parser {
 					dashed.active = false;
 					dashed.emit = false;
 					if (this.options.url && A.childCount(rule) > 0) {
-						lastTokenEndForComments = A.start(A.childAt(rule, 0));
+						lastTokenEndForComments = A.start(A.child(0, rule));
 					}
 					// Dashed-ident scoping for the deprecated `--foo: { … }` custom-property-set syntax (prelude starts with a dashed-ident).
 					if (
@@ -4502,13 +4875,12 @@ class CssParser extends Parser {
 					}
 					// Pure-mode: report an impure prelude (if leaf-ish) and push the inherited-context frame before walking the body.
 					if (!pure.enabled) return;
-					const ruleBlockStart = A.blockStart(rule);
+					const ruleBlockStart = A.startOf(Part.block, rule);
 					pure.enterBlock({
 						isRulePrelude: true,
 						treatAsLeaf: false,
 						ownSkip: false,
-						declarations: A.declarations(rule),
-						childRules: A.childRules(rule),
+						rule,
 						preludeStart: A.start(rule),
 						preludeEnd: ruleBlockStart !== -1 ? ruleBlockStart : A.end(rule)
 					});
@@ -4535,7 +4907,7 @@ class CssParser extends Parser {
 				dashed.active = false;
 				dashed.emit = false;
 				// Position `lastTokenEndForComments` just past the `:` so a magic comment before a url() is found (every mode).
-				let colonPos = A.nameEnd(decl);
+				let colonPos = A.endOf(Part.name, decl);
 				while (
 					colonPos < source.length &&
 					source.charCodeAt(colonPos) !== CC_COLON
@@ -4550,8 +4922,8 @@ class CssParser extends Parser {
 				// Property-name analysis and value exports are CSS-Modules-only; a plain
 				// stylesheet's declarations need no per-decl name slice / known-property lookup.
 				if (!isModules) return;
-				const nameStart = A.nameStart(decl);
-				const nameEnd = A.nameEnd(decl);
+				const nameStart = A.startOf(Part.name, decl);
+				const nameEnd = A.endOf(Part.name, decl);
 				// Range-based name analysis — the common declaration never
 				// slices its name out of the source.
 				/** @type {string | undefined} */
@@ -4569,7 +4941,7 @@ class CssParser extends Parser {
 					} else {
 						// Vendor-prefixed, degenerate short, or an escaped name that is
 						// not dashed after all — rare, string path.
-						declName = A.unescapedName(decl);
+						declName = A.name(decl);
 						declPropertyName = toLowerCaseIfNeeded(
 							declName.replace(VENDOR_PREFIX, "")
 						);
@@ -4591,8 +4963,18 @@ class CssParser extends Parser {
 					currentRule.hasLocalAnchor &&
 					(declPropertyName !== undefined
 						? COMPOSES_PROPERTY.test(declPropertyName)
-						: rangeEqualsLowerCase(source, nameStart, nameEnd, "composes") ||
-							rangeEqualsLowerCase(source, nameStart, nameEnd, "compose-with"));
+						: rangeAsciiCaseInsensitiveMatch(
+								source,
+								nameStart,
+								nameEnd,
+								"composes"
+							) ||
+							rangeAsciiCaseInsensitiveMatch(
+								source,
+								nameStart,
+								nameEnd,
+								"compose-with"
+							));
 				if (currentDeclComposesSkip) emitComposesWithAnchor(decl);
 				const skipForComposes = currentDeclComposesSkip;
 				// `content: counter(name, style)` can name a scoped counter / `@counter-style` from any property, so this isn't driven by the known-property table.
@@ -4633,7 +5015,18 @@ class CssParser extends Parser {
 						!(dashed.active && declIsDashed) &&
 						icssDefinitions.has(declName)
 					) {
-						emitICSSSymbol(declName, nameStart, nameEnd);
+						// `themeColor: blue` names the same custom property that
+						// `var(themeColor)` resolves to, so scope it under the dashed
+						// name the value holds instead of substituting it verbatim.
+						const dashedName =
+							this.options.dashedIdents && effectiveLocalMode
+								? localizableDashedValue(declName)
+								: undefined;
+						if (dashedName !== undefined) {
+							emitNamedDashedIdentExport(dashedName, nameStart, nameEnd);
+						} else {
+							emitICSSSymbol(declName, nameStart, nameEnd);
+						}
 					}
 				}
 			},
@@ -4659,7 +5052,7 @@ class CssParser extends Parser {
 				);
 				if (ignored) return;
 				let value = normalizeUrl(
-					input.slice(A.contentStart(url), A.contentEnd(url)),
+					input.slice(A.startOf(Part.value, url), A.endOf(Part.value, url)),
 					false
 				);
 				// Ignore `url()`, `url('')` and `url("")`, they are valid by spec
@@ -4710,8 +5103,8 @@ class CssParser extends Parser {
 				enter: (path) => {
 					const node = path.node;
 					const fn = /** @type {FunctionNode} */ (node);
-					const fnNameStart = A.nameStart(fn);
-					const fnNameEnd = A.nameEnd(fn);
+					const fnNameStart = A.startOf(Part.name, fn);
+					const fnNameEnd = A.endOf(Part.name, fn);
 					const fnNameLength = fnNameEnd - fnNameStart;
 					// Functions are the densest value nodes, so the name is matched by raw byte range; only a name carrying an escape (rare) pays the unescaped slice.
 					/** @type {string | undefined} */
@@ -4719,18 +5112,19 @@ class CssParser extends Parser {
 					let isLocalFn = false;
 					let isGlobalFn = false;
 					if (rangeHasEscape(input, fnNameStart, fnNameEnd)) {
-						escapedName = A.unescapedName(fn);
-						isLocalFn = equalsLowerCase(escapedName, "local");
-						isGlobalFn = !isLocalFn && equalsLowerCase(escapedName, "global");
+						escapedName = A.name(fn);
+						isLocalFn = asciiCaseInsensitiveMatch(escapedName, "local");
+						isGlobalFn =
+							!isLocalFn && asciiCaseInsensitiveMatch(escapedName, "global");
 					} else if (fnNameLength === 5) {
-						isLocalFn = rangeEqualsLowerCase(
+						isLocalFn = rangeAsciiCaseInsensitiveMatch(
 							input,
 							fnNameStart,
 							fnNameEnd,
 							"local"
 						);
 					} else if (fnNameLength === 6) {
-						isGlobalFn = rangeEqualsLowerCase(
+						isGlobalFn = rangeAsciiCaseInsensitiveMatch(
 							input,
 							fnNameStart,
 							fnNameEnd,
@@ -4748,7 +5142,8 @@ class CssParser extends Parser {
 						icssDefinitions.size !== 0
 					) {
 						// Without an escape the raw name equals the unescaped one — only the `@value`-lookup path needs the string at all.
-						const fname = escapedName === undefined ? A.name(fn) : escapedName;
+						const fname =
+							escapedName === undefined ? rawNameOf(fn) : escapedName;
 						if (
 							!(dashed.active && isDashedIdentifier(fname)) &&
 							icssDefinitions.has(fname)
@@ -4779,21 +5174,21 @@ class CssParser extends Parser {
 						} else if (
 							escapedName === undefined
 								? (fnNameLength === 3 &&
-										rangeEqualsLowerCase(
+										rangeAsciiCaseInsensitiveMatch(
 											input,
 											fnNameStart,
 											fnNameEnd,
 											"var"
 										)) ||
 									(fnNameLength === 5 &&
-										rangeEqualsLowerCase(
+										rangeAsciiCaseInsensitiveMatch(
 											input,
 											fnNameStart,
 											fnNameEnd,
 											"style"
 										))
-								: equalsLowerCase(escapedName, "var") ||
-									equalsLowerCase(escapedName, "style")
+								: asciiCaseInsensitiveMatch(escapedName, "var") ||
+									asciiCaseInsensitiveMatch(escapedName, "style")
 						) {
 							// `var(--foo, …)` / `style(--foo, …)`: emit the first ident; the fallback doesn't self-emit.
 							processDashedIdentInVarFunction(fn);
@@ -4840,15 +5235,15 @@ class CssParser extends Parser {
 						let j = path.index + 1;
 						while (
 							j < count &&
-							A.type(A.childAt(parent, j)) === NodeType.Whitespace
+							A.type(A.child(j, parent)) === NodeType.Whitespace
 						) {
 							j++;
 						}
-						const fromIdent = j < count ? A.childAt(parent, j) : undefined;
+						const fromIdent = j < count ? A.child(j, parent) : undefined;
 						if (
 							fromIdent &&
 							A.type(fromIdent) === NodeType.Ident &&
-							rangeEqualsLowerCase(
+							rangeAsciiCaseInsensitiveMatch(
 								input,
 								A.start(fromIdent),
 								A.end(fromIdent),
@@ -4858,11 +5253,11 @@ class CssParser extends Parser {
 							j++;
 							while (
 								j < count &&
-								A.type(A.childAt(parent, j)) === NodeType.Whitespace
+								A.type(A.child(j, parent)) === NodeType.Whitespace
 							) {
 								j++;
 							}
-							const sourceNode = j < count ? A.childAt(parent, j) : undefined;
+							const sourceNode = j < count ? A.child(j, parent) : undefined;
 							if (
 								sourceNode &&
 								A.type(sourceNode) === NodeType.Ident &&
@@ -4895,7 +5290,7 @@ class CssParser extends Parser {
 				// Already rewritten as a counter / counter-style name — a second dep would overlap the same range.
 				if (dashed.counterArgs) return;
 				// Deferred: only the ICSS probe needs the ident's string value.
-				const identValue = A.value(node);
+				const identValue = A.source(node);
 				if (!icssDefinitions.has(identValue)) return;
 				// Already scoped by the enclosing `var()` handler.
 				if (
@@ -4919,25 +5314,22 @@ class CssParser extends Parser {
 		// `as` selects the top-level production of §5.3: a `style` attribute is a
 		// block's contents, anything else a full stylesheet. `as` and `skip` are
 		// per-parse, so only the per-source `locConverter` reaches `process`.
-		new SourceProcessor()
-			.use(/** @type {VisitorMap} */ (visitors))
-			.process(source, {
-				as: /** @type {"stylesheet" | "block-contents"} */ (this.options.as),
-				// Non-modules parses skip selector preludes, but `@custom-selector` expansion needs them, so keep them when the file may use one.
-				skip: isModules
-					? undefined
-					: mayHaveCustomSelectors
-						? SKIP_NON_MODULES_KEEP_SELECTORS
-						: SKIP_NON_MODULES,
-				locConverter
-			});
+		new SourceProcessor().use(visitors).process(source, {
+			as: /** @type {"stylesheet" | "block-contents"} */ (this.options.as),
+			// Non-modules parses skip selector preludes, but `@custom-selector` expansion needs them, so keep them when the file may use one.
+			skip: isModules
+				? undefined
+				: mayHaveCustomSelectors
+					? SKIP_NON_MODULES_KEEP_SELECTORS
+					: SKIP_NON_MODULES,
+			locConverter
+		});
 
 		if (customMediaQueries || customSelectorUses) {
 			resolveCustomMediaAndSelectors();
 		}
 
-		/** @type {BuildInfo} */
-		(module.buildInfo).strict = true;
+		module.buildInfo.strict = true;
 
 		// Topologically sort the `composes … from` files and tag each file's first import dep with `sourceOrder` for cascade-correct load order (cycles keep their natural position).
 		if (composesFirstFileImport.size > 1) {
@@ -4951,7 +5343,7 @@ class CssParser extends Parser {
 			);
 		}
 
-		const buildMeta = /** @type {BuildMeta} */ (state.module.buildMeta);
+		const buildMeta = module.buildMeta;
 
 		buildMeta.exportsType = this.options.namedExports ? "namespace" : "default";
 		buildMeta.defaultObject = this.options.namedExports